@charset "UTF-8";
:root {
  --navy: #17233d;
  --deep: #111d34;
  --cobalt: #3255e8;
  --coral: #ef6b55;
  --orange: #ffb33b;
  --sky: #e8f3ff;
  --cream: #fff8f0;
  --mint: #b5e9df;
  --ink: #18233a;
  --body-color: #42536d;
  --white: #fff;
  --display: "Plus Jakarta Sans", Arial, sans-serif;
  --body: Inter, Arial, sans-serif;
  --serif: "Instrument Serif", Georgia, serif;
}
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 1rem; }
body { margin: 0; background: var(--cream); color: var(--ink); font-family: var(--body); font-size: 16px; line-height: 1.72; -webkit-font-smoothing: antialiased; }
img { display: block; max-width: 100%; height: auto; }
a { color: inherit; }
a:focus-visible, summary:focus-visible { outline: 3px solid #fff; outline-offset: 3px; box-shadow: 0 0 0 6px #2643bb; }
::selection { background: #ffd5bd; color: var(--ink); }
p, figure, blockquote { margin: 0; }
p + p { margin-top: 1.2em; }
h1, h2, h3, h4 { margin: 0; font-family: var(--display); font-weight: 800; letter-spacing: -.045em; line-height: 1.12; }
ul, ol { margin: 0; padding: 0; }
.wrap { width: min(100% - 8vw, 1290px); margin-inline: auto; }
.section { position: relative; padding: clamp(76px, 9vw, 132px) 0; overflow: hidden; }
.section-kicker { display: flex; justify-content: space-between; gap: 24px; align-items: center; margin-bottom: clamp(46px, 5vw, 72px); color: #53647c; font: 700 .68rem/1.4 var(--display); letter-spacing: .13em; text-transform: uppercase; }
.section-kicker span:first-child::before { content: ''; display: inline-block; width: 8px; height: 8px; margin-right: 11px; border-radius: 50%; background: var(--coral); vertical-align: 1px; }
.overline, .section-index, .detail-label { color: #3652af; font: 700 .7rem/1.4 var(--display); letter-spacing: .12em; text-transform: uppercase; }
.sec-title { font-size: clamp(2.2rem, 3.6vw, 4.2rem); line-height: 1.12; letter-spacing: -.047em; overflow-wrap: anywhere; }
.prose, .lead { color: var(--body-color); }
.prose strong, .lead strong { color: var(--ink); }
.prose p + p { margin-top: 1.35em; }
.skip-link { position: fixed; z-index: 100; top: 10px; left: 10px; padding: 9px 14px; background: white; color: var(--ink); transform: translateY(-160%); }
.skip-link:focus { transform: translateY(0); }
.js-ready .reveal { opacity: 0; transform: translateY(20px); transition: opacity .65s ease, transform .65s cubic-bezier(.2,.7,.2,1); }
.js-ready .reveal.is-visible { opacity: 1; transform: translateY(0); }

/* Brand masthead and calls to action */
.masthead { position: relative; z-index: 5; background: #fff; }
.masthead-inner { min-height: 88px; display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 12px 20px; padding-block: 10px; }
.brand { display: inline-flex; align-items: center; gap: 10px; color: #121a2c; text-decoration: none; flex: 0 0 auto; }
.brand-symbol { width: 42px; height: 42px; display: grid; place-items: center; }
.brand-symbol img { width: 100%; height: 100%; object-fit: contain; }
.brand-word { font: 800 1.1rem/1 var(--display); letter-spacing: -.055em; white-space: nowrap; }
.brand-word em { color: #c34e3d; font: italic 1.25em/1 var(--serif); letter-spacing: -.04em; }
.masthead-right { display: flex; align-items: center; gap: 36px; }
.masthead-label { color: #5b6b82; font: 700 .68rem/1.2 var(--display); letter-spacing: .12em; }
.nav-cta { display: inline-flex; align-items: center; gap: 22px; background: var(--navy); color: #fff; border-radius: 999px; padding: 13px 18px 13px 21px; font: 700 .78rem/1.2 var(--display); text-decoration: none; transition: background .2s, transform .2s; }
.nav-cta:hover { background: var(--cobalt); transform: translateY(-2px); }
.nav-cta span { color: #ffc461; font-size: 1rem; }
.cta { margin: 0; }
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 18px; max-width: 100%; min-height: 59px; padding: 17px 23px; border-radius: 999px; background: var(--orange); color: #17233d; font: 800 .83rem/1.35 var(--display); text-align: center; text-decoration: none; box-shadow: 0 8px 26px rgba(155,95,0,.13); transition: transform .22s, background .22s, box-shadow .22s; }
.btn::after { content: '↗'; font-size: 1.05rem; flex: 0 0 auto; }
.btn:hover { background: #ffca72; transform: translateY(-3px); box-shadow: 0 12px 28px rgba(155,95,0,.18); }
.cta-note { margin-top: 12px; color: #63738a; font-size: .73rem; line-height: 1.5; }

/* The story begins in complexity, with a warm conceptual visual. */
.hero { position: relative; overflow: hidden; background: var(--cream); padding: clamp(42px, 4.5vw, 70px) 0 0; }
.hero-orb { position: absolute; pointer-events: none; border-radius: 50%; }
.hero-orb-one { width: 330px; height: 330px; right: -160px; top: 15px; background: #b5e9df; opacity: .58; }
.hero-orb-two { width: 160px; height: 160px; left: -95px; top: 50%; background: #ffdecf; opacity: .65; }
.hero-grid { position: relative; display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); gap: clamp(38px, 6vw, 92px); align-items: center; }
.hero-copy { position: relative; z-index: 1; }
.eyebrow { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; color: #5d6b80; font: 700 .68rem/1.4 var(--display); letter-spacing: .1em; }
.eyebrow-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--coral); }
.eyebrow-line { width: 28px; height: 1px; background: #a9b4c4; }
.callout { margin-top: 22px; max-width: 640px; color: #4a5a73; font-size: .85rem; font-weight: 700; line-height: 1.65; }
.hero h1 { overflow-wrap: anywhere; margin-top: 18px; font-size: clamp(2.45rem, 3.15vw, 3.55rem); line-height: 1.095; letter-spacing: -.055em; }
.hero h1 em { color: #c34e3d; font: italic 1.07em/.9 var(--serif); letter-spacing: -.035em; }
.hero .subhead { margin-top: 20px; max-width: 640px; color: #4c5d75; font-size: clamp(.98rem, 1.15vw, 1.12rem); line-height: 1.75; }
.hero-action { margin-top: 20px; }
.hero-visual { position: relative; margin: 0; }
.hero-visual::before { content: ''; position: absolute; inset: -18px 3% 12% -14px; border: 1px solid rgba(50,85,232,.25); border-radius: 46% 14% 42% 12% / 40% 14% 42% 12%; transform: rotate(-5deg); }
.hero-visual img { position: relative; width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 43% 8% 38% 10% / 39% 8% 41% 10%; box-shadow: 0 25px 70px rgba(42,49,87,.12); }
.hero-visual-ring { position: absolute; width: 82px; height: 82px; right: -18px; bottom: -20px; border: 15px solid #ffb33b; border-radius: 50%; }
.hero-bottom-copy { position: relative; display: grid; grid-template-columns: 1fr 1fr; gap: clamp(32px, 7vw, 100px); margin-top: clamp(65px, 8vw, 110px); padding: 42px 48px; background: #e8f3ff; border-radius: 24px 24px 0 0; color: #465873; font-size: .94rem; }
.hero-bottom-copy .grabber { margin: 0 0 10px; color: var(--navy); font: 700 1.15rem/1.45 var(--display); letter-spacing: -.02em; }
.hero-bottom-copy .promise-lead { margin-top: 8px; }
.hero-bottom-line { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 12px 20px; padding: 18px max(4vw, calc((100vw - 1290px)/2)); background: var(--navy); color: #d6e0f2; font: 700 .66rem/1.4 var(--display); letter-spacing: .12em; }
.hero-bottom-line span:last-child { color: #ffbe66; }

/* Problem: open editorial rows, real voices, and an authentic working scene. */
.problem { background: #fff; }
.problem-intro { display: grid; grid-template-columns: 1.08fr .72fr; gap: clamp(36px, 8vw, 120px); align-items: end; }
.problem-intro .lead { max-width: 500px; }
.problem-story { display: grid; grid-template-columns: .78fr 1fr; gap: clamp(45px, 8vw, 120px); align-items: center; margin-top: clamp(60px, 7vw, 100px); }
.problem-photo { position: relative; }
.problem-photo::after { content: ''; position: absolute; width: 110px; height: 110px; right: -30px; bottom: -30px; border: 18px solid #aee5dc; border-radius: 50%; }
.problem-photo img { width: 100%; aspect-ratio: 4 / 4.7; object-fit: cover; border-radius: 34% 4% 24% 4% / 24% 4% 20% 4%; }
.problem-rows { padding: 5px 0; }
.problem-row { display: grid; grid-template-columns: 56px 1fr; gap: 18px; padding: 28px 0; border-bottom: 1px solid #dbe2ec; }
.problem-row:first-child { padding-top: 0; }
.problem-row:last-child { border-bottom: 0; }
.row-num { color: var(--coral); font: italic 1.8rem/1 var(--serif); }
.problem-row h3 { font-size: clamp(1.35rem, 1.6vw, 1.8rem); line-height: 1.2; }
.problem-row p { margin-top: 12px; color: var(--body-color); font-size: .95rem; }
.evidence-grid { display: grid; grid-template-columns: .7fr 1.3fr; gap: clamp(40px, 8vw, 120px); margin-top: clamp(90px, 11vw, 150px); }
.evidence-label h3 { margin-top: 18px; font-size: clamp(2.3rem, 3.8vw, 4.2rem); }
.evidence-label p { margin-top: 15px; color: #66758b; }
.voices { list-style: none; }
.owner-voices .voices { display: grid; grid-template-columns: 1fr 1fr; gap: 40px 46px; }
.voices li { color: #34465f; font-size: .92rem; line-height: 1.75; }
.owner-voices .voices li::before { content: ''; display: block; width: 42px; height: 4px; margin-bottom: 17px; border-radius: 3px; background: #f4a18b; }
.voice-attr { display: block; margin-top: 12px; color: #687891; font-size: .75rem; line-height: 1.55; font-weight: 700; }
.problem-outro { max-width: 900px; margin: 90px auto 0; }
.problem-outro .work-line { margin-top: 30px; color: var(--navy); font: 400 clamp(1.55rem, 2.4vw, 2.45rem)/1.2 var(--serif); letter-spacing: -.01em; }

/* The full-width statement carries the same friction from tool to tool. */
.difference { background: var(--cobalt); color: white; }
.difference .wrap { position: relative; z-index: 1; }
.difference .section-kicker { color: #e4ebff; }
.difference .section-kicker span:first-child::before { background: #ffbb82; }
.difference-head { max-width: 950px; }
.display-statement { overflow-wrap: anywhere; font: 800 min(clamp(3.4rem, 6.8vw, 7.3rem), 13.5vw)/.98 var(--display); letter-spacing: -.065em; }
.display-statement span { color: #ffc3a6; font: italic 1.05em/.9 var(--serif); letter-spacing: -.035em; }
.difference-flow { position: absolute; width: 700px; height: 700px; right: -330px; top: -130px; opacity: .65; transform: rotate(-20deg); }
.difference-flow span { position: absolute; inset: 0; border: 2px solid rgba(211,229,255,.32); border-radius: 47% 53% 35% 65%; }
.difference-flow span:nth-child(2) { inset: 45px; border-color: rgba(255,190,145,.55); transform: rotate(35deg); }
.difference-flow span:nth-child(3) { inset: 90px; border-color: rgba(181,233,223,.55); transform: rotate(75deg); }
.difference-copy { display: grid; grid-template-columns: .86fr 1fr; gap: clamp(50px, 9vw, 150px); margin-top: clamp(80px, 9vw, 135px); }
.difference-copy .sec-title { font-size: clamp(1.8rem, 2.6vw, 3rem); }
.difference-copy .prose, .difference-copy .voices li { color: #e7ebff; }
.difference-copy .prose strong { color: white; }
.difference-copy .voices { margin: 24px 0; padding-left: 22px; border-left: 3px solid #ffbd9c; }
.difference-copy .voice-attr { color: #e4ebff; }

/* The methodology is a connected journey rather than a set of panels. */
.method { background: var(--cream); }
.method-top { display: grid; grid-template-columns: 1fr .64fr; align-items: center; gap: clamp(50px, 8vw, 130px); }
.method-heading .sec-title { margin-top: 17px; }
.method-heading .prose { max-width: 660px; margin-top: 25px; }
.method-photo { position: relative; }
.method-photo::before { content: ''; position: absolute; inset: -16px -16px 20px 20px; border-radius: 40% 10% 40% 10%; background: #b5e9df; }
.method-photo img { position: relative; width: 100%; aspect-ratio: 1.22; object-fit: cover; border-radius: 40% 10% 40% 10%; }
.method-rule { display: grid; grid-template-columns: auto 1fr; gap: 22px; align-items: start; max-width: 950px; margin-top: 65px; color: #40506b; }
.rule-indicator { padding: 7px 12px; border-radius: 999px; background: #d4ece8; color: #254f53; font: 800 .65rem/1.3 var(--display); letter-spacing: .08em; white-space: nowrap; }
.method-journey { position: relative; margin-top: 65px; }
.journey-line { position: absolute; top: 6px; left: 0; width: 100%; height: 86px; color: #df9a89; opacity: .6; }
.mechanism { position: relative; display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(35px, 5vw, 75px); list-style: none; counter-reset: process; }
.mechanism li { counter-increment: process; padding-top: 112px; color: #52617a; font-size: .93rem; }
.mechanism li::before { content: '0' counter(process); position: absolute; top: 8px; display: grid; place-items: center; width: 69px; height: 69px; border: 8px solid var(--cream); border-radius: 50%; background: var(--cobalt); color: white; font: italic 1.55rem/1 var(--serif); }
.mechanism li:nth-child(2)::before { background: var(--coral); }
.mechanism li:nth-child(3)::before { background: #8ad8cb; color: var(--navy); }
.mechanism li strong { display: block; margin-bottom: 12px; color: var(--navy); font: 800 clamp(1.22rem, 1.45vw, 1.55rem)/1.22 var(--display); letter-spacing: -.035em; }
.method-cta { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 22px; margin-top: 50px; }
.method-cta .cta-note { margin: 0; }

/* One restrained explanatory diagram, presented on a soft sky field. */
.trace { background: var(--sky); }
.trace-head { display: grid; grid-template-columns: 1fr .78fr; gap: clamp(45px, 8vw, 120px); align-items: end; }
.trace-visual { margin-top: 65px; }
.uncover { display: grid; grid-template-columns: .8fr 1.1fr; gap: clamp(50px, 8vw, 120px); margin-top: clamp(90px, 10vw, 140px); }
.uncover .sec-title { margin-top: 16px; font-size: clamp(1.9rem, 3vw, 3.4rem); }
.letter { list-style: none; }
.letter li { color: #4a5b74; padding: 20px 0; border-bottom: 1px solid rgba(60,80,112,.16); }
.letter li:first-child { padding-top: 0; }
.letter li:last-child { border-bottom: 0; }
.letter li strong { color: var(--ink); }

/* Deliverables: real written document and unboxed editorial content. */
.deliverables { background: white; }
.deliverables-grid { display: grid; grid-template-columns: 1fr .88fr; gap: clamp(60px, 9vw, 140px); align-items: start; }
.deliverables-copy > p { margin-top: 21px; color: var(--body-color); }
.deliverables-copy .letter { margin-top: 40px; }
.deliverables-copy .letter li { padding: 18px 0; font-size: .94rem; }
.deliverables-copy .letter li strong { display: block; margin-bottom: 6px; font-family: var(--display); font-size: 1rem; }
.report-visual { position: relative; }
.deliverable-terms { max-width: 940px; margin: 75px auto 0; padding: 35px 0; border-top: 1px solid #dce5ed; border-bottom: 1px solid #dce5ed; }
.recap { display: grid; grid-template-columns: .78fr 1.2fr; gap: clamp(45px, 8vw, 130px); margin-top: 80px; }
.recap .sec-title { font-size: clamp(1.8rem, 2.8vw, 3.15rem); }
.recap .letter { display: grid; grid-template-columns: 1fr 1fr; gap: 28px 36px; }
.recap .letter li { padding: 0; border: 0; font-size: .9rem; }
.recap .letter li strong { display: block; margin-bottom: 7px; }

/* An optimistic, human-centered view of what happens after the fix. */
.outcome { background: #ffede3; }
.outcome-intro { display: flex; align-items: end; justify-content: space-between; gap: 40px; }
.outcome-intro .sec-title { max-width: 760px; }
.outcome-context { max-width: 330px; color: #716b70; font-size: .82rem; }
.outcome-grid { display: grid; grid-template-columns: 1.15fr .85fr; align-items: center; gap: clamp(45px, 7vw, 110px); margin-top: 65px; }
.outcome-photo img { width: 100%; aspect-ratio: 1.35; object-fit: cover; border-radius: 5% 36% 6% 5% / 5% 34% 6% 5%; }
.outcome-lines p { position: relative; padding: 23px 0 23px 30px; border-bottom: 1px solid #e9c9bb; color: #46536a; }
.outcome-lines p::before { content: ''; position: absolute; top: 34px; left: 0; width: 9px; height: 9px; border-radius: 50%; background: var(--coral); }
.outcome-lines p:first-child { padding-top: 0; }
.outcome-lines p:first-child::before { top: 10px; }
.outcome-lines p:last-child { border-bottom: 0; }
.outcome-lines strong { display: block; margin-bottom: 7px; color: var(--navy); font-family: var(--display); }

/* A real identity, with a confident but personal presence. */
.authority { background: var(--navy); color: #fff; }
.authority .section-kicker { color: #b9c8df; }
.authority .section-kicker span:first-child::before { background: #ffb33b; }
.authority-grid { display: grid; grid-template-columns: .7fr 1fr; gap: clamp(60px, 10vw, 160px); }
.authority-identity { display: flex; flex-direction: column; justify-content: space-between; min-height: 320px; }
.authority-brand { display: flex; align-items: center; gap: 15px; }
.authority-brand .brand-symbol { width: 84px; height: 84px; }
.authority-brand .brand-word { color: white; font-size: 1.65rem; }
.authority-brand .brand-word em { color: #ffb49d; }
.authority-label { color: #a8bad3; font: 700 .7rem/1.6 var(--display); letter-spacing: .14em; }
.authority-content .sec-title { font-size: clamp(2rem, 3.2vw, 3.7rem); }
.authority-content > p:not(.principle) { margin-top: 25px; color: #d2ddec; }
.authority-content strong { color: white; }
.principle { margin-top: 36px; color: #fff; font: 400 clamp(2rem, 3.2vw, 3.5rem)/1 var(--serif); }
.principle span { color: #ffb89f; font-style: italic; }

/* Testimonials are human voices, not dashboard cards. */
.proof { background: #fff8f0; }
.proof-title { max-width: 850px; }
.client-quote { display: grid; grid-template-columns: 90px 1fr; gap: 30px; margin-top: 60px; }
.quote-mark { color: var(--coral); font: 400 9rem/.65 var(--serif); }
.client-quote > div:last-child > p { max-width: 820px; color: #697488; font-size: .92rem; }
.testimonial { margin-top: 30px; }
.testimonial blockquote p { color: var(--navy); font: 400 clamp(1.6rem, 2.55vw, 2.8rem)/1.22 var(--serif); letter-spacing: -.01em; }
.testimonial figcaption { margin-top: 25px; color: #3450a4; font: 700 .8rem/1.5 var(--display); }
.third-party { display: grid; grid-template-columns: .7fr 1.3fr; gap: clamp(45px, 8vw, 120px); margin-top: 90px; padding-top: 55px; border-top: 1px solid #e9ddd3; }
.third-party > div > p { margin-top: 14px; color: #52617a; }
.third-party .voices { display: grid; grid-template-columns: 1fr 1fr; gap: 32px 42px; }

/* Investment and assurance. */
.investment { background: #203fbe; color: white; }
.investment .section-kicker, .investment .overline, .investment .detail-label { color: #d6e1ff; }
.investment .section-kicker span:first-child::before { background: #ffb33b; }
.investment-grid { display: grid; grid-template-columns: 1fr .8fr; gap: clamp(50px, 9vw, 150px); }
.investment .sec-title { margin-top: 18px; font-size: clamp(1.45rem, 2vw, 2.1rem); color: #e4ebff; }
.price-figure { margin: 15px 0 18px; font: 800 min(clamp(4.8rem, 9vw, 9rem), 19vw)/1 var(--display); letter-spacing: -.08em; }
.price-figure span { color: #ffcda8; font: 400 clamp(1.2rem, 2vw, 2rem)/1 var(--serif); letter-spacing: -.02em; }
.price-line { color: white; font-weight: 700; }
.investment-grid > div:first-child > p:last-child { max-width: 570px; margin-top: 15px; color: #e0e9ff; }
.investment-detail ul { list-style: none; margin-top: 24px; }
.investment-detail li { padding: 12px 0; border-bottom: 1px solid rgba(255,255,255,.2); color: #fff; font-size: .92rem; }
.investment-detail li::before { content: '↗'; display: inline-block; width: 27px; color: #ffc08f; }
.credit { margin-top: 30px; padding-left: 18px; border-left: 3px solid #ffbd84; color: #e5edff; font-size: .9rem; }
.credit span { display: block; margin-bottom: 8px; color: #ffd0b3; font: 800 .68rem/1.4 var(--display); letter-spacing: .1em; }
.cost-of-delay { max-width: 920px; margin-top: 95px; padding-top: 45px; border-top: 1px solid rgba(255,255,255,.25); }
.cost-of-delay .sec-title { margin: 0 0 20px; color: white; font-size: clamp(1.65rem, 2.5vw, 2.8rem); }
.cost-of-delay p { color: #e1e9ff; }
.cost-of-delay strong { color: white; }
.guarantee { background: #d8f2ec; }
.guarantee-grid { display: grid; grid-template-columns: .65fr 1fr; gap: clamp(50px, 9vw, 140px); align-items: center; }
.guarantee-symbol { color: var(--cobalt); }
.guarantee-symbol > span { display: block; color: #ef7c62; font: 400 2.2rem/1 var(--serif); }
.guarantee-symbol strong { display: block; font: 800 clamp(7rem, 12vw, 12rem)/.8 var(--display); letter-spacing: -.09em; }
.guarantee-symbol strong span { font: italic .55em/1 var(--serif); letter-spacing: -.03em; }
.guarantee-symbol small { display: block; margin-top: 22px; color: #46656b; font: 800 .67rem/1.5 var(--display); letter-spacing: .1em; }
.guarantee .sec-title { color: #3452bf; font-size: clamp(1.2rem, 1.8vw, 1.65rem); text-transform: none; }
.guarantee-line { margin-top: 22px; color: var(--navy); font: 400 clamp(2rem, 3vw, 3.35rem)/1.16 var(--serif); }
.guarantee-grid > div:last-child > p:last-child { max-width: 720px; margin-top: 25px; color: #405c66; }

/* A reassuring close with a distinct conceptual artwork. */
.final-cta { background: var(--navy); color: white; isolation: isolate; }
.closing-art { position: absolute; z-index: -2; inset: 0 0 0 auto; width: 100%; height: 100%; object-fit: cover; opacity: .52; }
.final-cta::before { content: ''; position: absolute; z-index: -1; inset: 0; background: linear-gradient(90deg, #17233d 0%, rgba(23,35,61,.98) 45%, rgba(23,35,61,.45) 100%); }
.final-cta .section-kicker { color: #c9d7ed; }
.final-cta .section-kicker span:first-child::before { background: #ffb33b; }
.final-grid { display: grid; grid-template-columns: 1fr .65fr; gap: clamp(50px, 8vw, 130px); align-items: end; }
.final-grid .sec-title { max-width: 720px; font-size: clamp(2.8rem, 5vw, 5.8rem); }
.final-grid > div:first-child > p:not(.cta-note) { max-width: 650px; margin-top: 24px; color: #e1e8f3; }
.final-grid .cta { margin-top: 30px; }
.final-grid .cta-note { color: #d0dbea; }
.fit-list { padding-bottom: 3px; }
.fit-list .detail-label { color: #ffd0ad; }
.fit-list > div { display: grid; grid-template-columns: 36px 1fr; gap: 12px; padding: 17px 0; border-bottom: 1px solid rgba(255,255,255,.2); color: #eef4ff; font-size: .88rem; }
.fit-list > div span { color: #ffc188; font: italic 1.3rem/1 var(--serif); }

/* Calm, accessible details and a clean footer. */
.faq-section { background: white; }
.faq-layout { display: grid; grid-template-columns: .65fr 1fr; gap: clamp(55px, 9vw, 145px); }
.faq-layout .sec-title { margin-top: 15px; }
.faq details { border-top: 1px solid #d8e1eb; }
.faq details:last-of-type { border-bottom: 1px solid #d8e1eb; }
.faq summary { position: relative; padding: 23px 38px 23px 0; list-style: none; cursor: pointer; color: var(--navy); font: 700 1rem/1.45 var(--display); }
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: '+'; position: absolute; right: 4px; top: 19px; color: var(--cobalt); font: 400 1.6rem/1 var(--body); }
.faq details[open] summary::after { content: '−'; }
.faq details p { padding: 0 20px 25px 0; color: #52627b; font-size: .95rem; }
.faq .cta { margin-top: 35px; }
.postscript-area { display: grid; grid-template-columns: .65fr 1fr; gap: clamp(55px, 9vw, 145px); margin-top: 90px; padding-top: 55px; border-top: 1px solid #d8e1eb; }
.postscript + .postscript { margin-top: 30px; }
.postscript p { color: #52627b; }
.postscript .ps-lead { color: var(--navy); font-family: var(--display); font-weight: 800; }
.postscript .sig { color: var(--cobalt); font-weight: 700; }
footer { padding: 36px 0; background: #111d34; color: #c5d1e2; }
.footer-inner { display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.footer-brand .brand-word { color: white; }
.footer-brand .brand-word em { color: #ffb59f; }
.footer-inner p { font-size: .78rem; }
.footer-inner > a:last-child { font: 700 .8rem/1.4 var(--display); text-decoration: none; }
.footer-inner > a:last-child:hover { color: #ffb59f; }

@media (max-width: 1050px) {
  .hero-grid { grid-template-columns: 1fr .85fr; gap: 40px; }
  .hero h1 { font-size: clamp(2.45rem, 4.3vw, 3.35rem); }
  .owner-voices .voices { gap: 32px; }
}
@media (max-width: 800px) {
  .wrap { width: min(100% - 42px, 680px); }
  .section { padding: 78px 0; }
  .masthead-inner { min-height: 76px; }
  .masthead-label { display: none; }
  .hero { padding-top: 35px; }
  .hero-grid { display: flex; flex-direction: column; align-items: stretch; gap: 40px; }
  .hero-visual { order: -1; width: min(100%, 580px); align-self: center; }
  .hero-visual img { aspect-ratio: 1.8; border-radius: 31% 6% 29% 8% / 32% 7% 31% 9%; }
  .hero-visual::before { inset: -9px 0 5% -8px; }
  .hero-visual-ring { width: 54px; height: 54px; border-width: 10px; right: -10px; bottom: -14px; }
  .hero h1 { font-size: clamp(2.45rem, 6.8vw, 3.8rem); }
  .hero-bottom-copy { grid-template-columns: 1fr; gap: 23px; margin-top: 55px; padding: 30px; }
  .problem-intro, .problem-story, .difference-copy, .trace-head, .deliverables-grid, .recap, .outcome-grid, .authority-grid, .third-party, .investment-grid, .guarantee-grid, .final-grid, .faq-layout, .postscript-area, .uncover { grid-template-columns: 1fr; gap: 35px; }
  .problem-photo { max-width: 520px; }
  .problem-photo img { aspect-ratio: 1.2; border-radius: 26% 4% 18% 4%; }
  .problem-rows { margin-top: 15px; }
  .evidence-grid { grid-template-columns: 1fr; gap: 35px; margin-top: 75px; }
  .evidence-label h3 br { display: none; }
  .problem-outro { margin-top: 65px; }
  .difference-copy { margin-top: 65px; }
  .method-top { grid-template-columns: 1fr .65fr; gap: 30px; }
  .mechanism { gap: 25px; }
  .mechanism li { font-size: .88rem; }
  .method-rule { margin-top: 50px; }
  .trace-visual { margin-top: 45px; }
  .uncover { margin-top: 70px; }
  .report-visual { width: min(100%, 570px); margin-inline: auto; }
  .outcome-intro { display: block; }
  .outcome-context { margin-top: 20px; }
  .outcome-grid { margin-top: 45px; }
  .authority-identity { min-height: 0; gap: 25px; }
  .third-party { margin-top: 65px; }
  .price-figure { font-size: min(clamp(5rem, 13vw, 8rem), 19vw); }
  .cost-of-delay { margin-top: 65px; }
  .guarantee-grid { grid-template-columns: .5fr 1fr; }
  .closing-art { width: 100%; opacity: .28; }
  .final-cta::before { background: linear-gradient(90deg, rgba(23,35,61,.98), rgba(23,35,61,.72)); }
  .fit-list { max-width: 560px; }
  .postscript-area { margin-top: 65px; }
}
@media (max-width: 540px) {
  body { font-size: 15px; }
  .wrap { width: calc(100% - 36px); }
  .section { padding: 68px 0; }
  .section-kicker { margin-bottom: 38px; }
  .section-kicker span:last-child { display: none; }
  .masthead-inner { min-height: 70px; }
  .brand-symbol { width: 37px; height: 37px; }
  .brand-word { font-size: .98rem; }
  .nav-cta { gap: 8px; padding: 12px 14px; font-size: .73rem; }
  .hero { padding-top: 27px; }
  .hero-grid { gap: 34px; }
  .hero-visual img { aspect-ratio: 1.6; }
  .hero h1 { font-size: clamp(2.34rem, 8.5vw, 3.1rem); }
  .callout { margin-top: 24px; }
  .hero-bottom-copy { width: calc(100% - 36px); padding: 26px 22px; }
  .hero-bottom-line { padding: 17px 18px; font-size: .59rem; }
  .btn { width: 100%; padding: 16px 18px; font-size: .78rem; }
  .problem-story { gap: 45px; }
  .problem-photo img { aspect-ratio: 1.12; }
  .problem-photo::after { width: 70px; height: 70px; border-width: 11px; right: -15px; bottom: -18px; }
  .problem-row { grid-template-columns: 42px 1fr; gap: 12px; }
  .owner-voices .voices, .third-party .voices, .recap .letter { grid-template-columns: 1fr; }
  .owner-voices .voices { gap: 30px; }
  .display-statement { font-size: min(clamp(3.15rem, 11vw, 4.8rem), 12vw); }
  .difference-flow { width: 390px; height: 390px; right: -225px; top: -40px; }
  .method-top { grid-template-columns: 1fr; }
  .method-photo { max-width: 410px; }
  .method-photo img { aspect-ratio: 1.45; }
  .method-rule { grid-template-columns: 1fr; gap: 12px; }
  .rule-indicator { width: fit-content; }
  .journey-line { display: none; }
  .mechanism { grid-template-columns: 1fr; gap: 28px; }
  .mechanism li { position: relative; padding: 0 0 0 69px; min-height: 54px; }
  .mechanism li::before { top: 0; left: 0; width: 52px; height: 52px; border-width: 5px; font-size: 1.25rem; }
  .method-cta { display: block; }
  .method-cta .cta-note { margin-top: 12px; }
  .recap { margin-top: 55px; }
  .deliverable-terms { margin-top: 55px; }
  .outcome-photo img { aspect-ratio: 1.15; }
  .client-quote { grid-template-columns: 40px 1fr; gap: 12px; }
  .quote-mark { font-size: 6rem; }
  .guarantee-grid { grid-template-columns: 1fr; gap: 30px; }
  .guarantee-symbol strong { font-size: 7.5rem; }
  .price-figure { font-size: min(clamp(4.5rem, 18vw, 6.5rem), 19vw); }
  .final-grid .sec-title { font-size: clamp(2.5rem, 9vw, 4rem); }
  .footer-inner { flex-wrap: wrap; }
  .footer-inner p { display: none; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
  .js-ready .reveal { opacity: 1; transform: none; }
}

/* Real founder portrait and clear labeling of illustrative workplace scenes. */
.problem-photo figcaption, .outcome-photo figcaption { margin-top: 12px; color: #506079; font: 500 .68rem/1.4 var(--body); }
.founder-portrait { width: min(100%, 275px); position: relative; margin: 25px 0; }
.founder-portrait::before { content: ''; position: absolute; inset: -12px 4px 9px -12px; border: 2px solid rgba(181,233,223,.5); border-radius: 50%; }
.founder-portrait img { position: relative; width: 100%; aspect-ratio: 1; object-fit: cover; border-radius: 50%; }
@media (max-width: 800px) { .founder-portrait { width: min(56%, 230px); margin: 0; } }

/* A few curved transitions and a restrained, once-only path reveal connect the story. */
.difference { border-radius: 0 clamp(50px, 8vw, 130px) 0 0; }
.outcome { border-radius: clamp(50px, 8vw, 130px) 0 0 0; }
.js-ready .journey-line path { stroke-dasharray: 1500; stroke-dashoffset: 1500; }
.js-ready .method-journey.is-visible .journey-line path { animation: journey-draw 1.7s ease forwards; }
@keyframes journey-draw { to { stroke-dashoffset: 0; } }
@media (prefers-reduced-motion: reduce) { .js-ready .journey-line path { stroke-dashoffset: 0; animation: none; } }


.footer-contact { margin: 0; line-height: 1.55; }
.footer-contact a { color: inherit; text-decoration-color: #ffb59f; text-underline-offset: 3px; }
.footer-inner p.footer-contact { display: block; }
@media (max-width: 800px) {
  .footer-inner p.footer-contact { flex-basis: 100%; }
}