/* TCScales v4 theme. Shared by every v4 page; page-specific pieces are labeled by section. */
/* ── v4 homepage (2026-09-26). White ground, ink + logo blue only. ── */
:root{
  --blue:#1E3A8A; --ink:#0E1116; --body:#3B404C; --mute:#6B7280; --hair:rgba(14,17,22,.12);
  --paper:#FFFFFF; --soft:#F6F6F4;
  --serif:"Source Serif 4", Georgia, "Times New Roman", serif;
  --sans:"Inter", "Helvetica Neue", Arial, sans-serif;
  --mono:"JetBrains Mono", ui-monospace, Consolas, monospace;
  --gut:clamp(1.25rem, 4vw, 3.5rem);
}
html, html.dark { background:var(--paper); }
body{ background:var(--paper); color:var(--body); font-family:var(--sans); font-size:17px; line-height:1.6; }
.v4 h1,.v4 h2,.v4 h3{ font-family:var(--serif); color:var(--ink); font-weight:500; letter-spacing:-.015em; text-wrap:balance; }
.v4 p{ color:var(--body); }
.v4 .wrap{ max-width:1320px; margin:0 auto; padding-inline:var(--gut); }
.v4 section{ padding-block:clamp(72px,10vw,140px); }
.lbl{ font:500 .72rem/1.3 var(--mono); letter-spacing:.14em; text-transform:uppercase; color:var(--mute); }
.hair{ border-top:1px solid var(--hair); }

/* placeholder tag for stock video */
.ph{ position:absolute; top:12px; left:12px; z-index:3; font:500 .66rem/1 var(--mono); letter-spacing:.12em; text-transform:uppercase; color:#fff; background:rgba(14,17,22,.62); padding:.45rem .6rem; border-radius:4px; pointer-events:none; }

/* audit form: the only filled button on the page */
.audit{ display:flex; gap:.5rem; max-width:560px; margin-top:2rem; }
.audit input{ flex:1; min-width:0; height:56px; padding:0 1.1rem; font:500 1rem var(--sans); color:var(--ink); background:#fff; border:1.5px solid rgba(14,17,22,.22); border-radius:10px; }
.audit input:focus{ outline:none; border-color:var(--blue); box-shadow:0 0 0 3px rgba(30,58,138,.14); }
.audit button{ height:56px; padding:0 1.4rem; font:600 1rem var(--sans); color:#fff; background:var(--blue); border:0; border-radius:10px; cursor:pointer; white-space:nowrap; transition:transform .15s, background .15s; }
.audit button:hover{ background:#162D6E; transform:translateY(-1px); }
.audit button:focus-visible, .audit input:focus-visible{ outline:2px solid var(--blue); outline-offset:2px; }
.audit-note{ margin-top:.8rem; font-size:.9rem; color:var(--mute); }
@media (max-width:560px){ .audit{ flex-direction:column; } .audit input{ flex:none; width:100%; } .audit button{ width:100%; } }

/* secondary action: outline only */
.line-btn{ display:inline-flex; align-items:center; gap:.6rem; height:48px; padding:0 1.2rem; font:600 .95rem var(--sans); color:var(--ink); border:1.5px solid var(--ink); border-radius:999px; background:transparent; cursor:pointer; text-decoration:none; transition:background .15s,color .15s; }
.line-btn:hover{ background:var(--ink); color:#fff; }
.line-btn svg{ width:14px; height:14px; }

/* nav: one offer */
.nav .btn-primary{ background:var(--blue); border-color:var(--blue); }

/* ── HERO ── */
.hero{ padding-top:clamp(48px,7vw,96px)!important; padding-bottom:clamp(40px,5vw,64px)!important; }
.hero__me{ display:inline-flex; align-items:center; gap:.75rem; }
.hero__me img{ width:40px; height:40px; border-radius:50%; object-fit:cover; object-position:50% 20%; }
.hero__me b{ display:block; font:600 .95rem/1.2 var(--sans); color:var(--ink); }
.hero__me .lbl{ display:block; margin-top:.15rem; }
.hero__corners{ display:flex; justify-content:space-between; gap:1rem; flex-wrap:wrap; margin-bottom:clamp(2rem,5vw,4rem); }
.hero h1{ font-size:clamp(2.9rem, 7.4vw, 7.6rem); line-height:.98; letter-spacing:-.035em; color:var(--blue); max-width:none; }
.hero h1 .l1, .hero h1 .l2{ white-space:nowrap; }
@media (max-width:760px){ .hero h1 .l1, .hero h1 .l2{ white-space:normal; } }
.hero h1 .l1{ display:block; font-weight:400; }
.hero h1 .l2{ display:block; font-weight:700; }
.hero__row{ display:grid; grid-template-columns:minmax(0,1.1fr) minmax(0,1fr); gap:clamp(1.5rem,5vw,5rem); align-items:end; margin-top:clamp(1.8rem,4vw,3rem); }
.hero__sub{ font-size:clamp(1.05rem,1.4vw,1.25rem); line-height:1.6; max-width:46ch; }
@media (max-width:900px){ .hero__row{ grid-template-columns:1fr; } }

/* ── GROWING VIDEO ── */
.grow{ padding:0!important; height:460vh; position:relative; }
.grow__pin{ position:sticky; top:0; height:100vh; height:100svh; display:flex; align-items:center; justify-content:center; overflow:hidden; }
.grow__frame{ position:absolute; inset:0; clip-path:inset(10% 56px 10% 56px round 22px); background:#0b0d12; }
.grow__frame video{ width:100%; height:100%; object-fit:cover; display:block; }
.grow__frame::after{ content:""; position:absolute; inset:0; background:linear-gradient(180deg, rgba(8,10,14,.58) 0%, rgba(8,10,14,.8) 100%); }
.grow__text{ position:relative; z-index:2; max-width:1100px; padding-inline:calc(var(--gut) + 2rem); }
.grow__text p{ font:500 clamp(1.7rem,4.2vw,3.8rem)/1.12 var(--serif); letter-spacing:-.02em; color:#fff; text-wrap:balance; text-shadow:0 2px 24px rgba(0,0,0,.35); }
.grow__text .gl{ display:block; transform-origin:left center; }
.grow__text .gl--pay{ font-weight:700; font-size:1.18em; letter-spacing:-.03em; }
.grow__text .gl:nth-child(3){ margin-top:.35em; }
@media (max-width:760px){ .grow{ height:400vh; } .grow__frame{ clip-path:inset(14% 12px 14% 12px round 16px); } }

/* ── PROOF: one enormous number, one sentence; pinned swap when motion is on ── */
.proof{ padding-top:clamp(72px,9vw,130px)!important; padding-bottom:clamp(56px,7vw,100px)!important; }
.proof__top{ display:flex; justify-content:space-between; align-items:baseline; gap:1rem; flex-wrap:wrap; padding-bottom:1.1rem; border-bottom:1px solid var(--ink); }
.proof__link{ font:600 .92rem var(--sans); color:var(--blue); text-decoration:none; }
.proof__stage{ margin-top:clamp(.6rem,2vw,1.6rem); }
.proof__layer{ display:grid; grid-template-columns:auto minmax(0,1fr); align-items:end; column-gap:clamp(1.2rem,3vw,3rem); }
.proof__layer + .proof__layer{ margin-top:clamp(2rem,5vw,4rem); }
.proof__big{ font:600 clamp(9rem,43vw,44rem)/.76 var(--serif); letter-spacing:-.07em; color:var(--blue); margin-left:-.06em; overflow:hidden; padding:.06em 0 .14em; white-space:nowrap; }
.proof__big--b{ font-size:clamp(7rem,30vw,30rem); letter-spacing:-.06em; padding:.16em 0 .26em; }
.proof__big .dg{ display:inline-block; will-change:transform; }
.proof__line{ font:400 clamp(1.5rem,3.1vw,2.9rem)/1.15 var(--serif); letter-spacing:-.015em; color:var(--ink)!important; max-width:13ch; justify-self:end; padding-bottom:clamp(.6rem,1.6vw,1.6rem); text-wrap:balance; }
.proof__layer--b .proof__line{ max-width:14ch; }
.proof__line b{ font-weight:700; }
.proof__note{ margin-top:clamp(1.6rem,3vw,2.4rem); padding-top:1rem; border-top:1px solid var(--hair); font-size:.95rem; color:var(--mute)!important; max-width:60ch; }
/* motion on: pin the stage and stack both layers in one spot */
.motion-on .proof{ height:290vh; padding:0!important; }
.motion-on .proof__pin{ position:sticky; top:0; height:100vh; height:100svh; display:flex; align-items:center; overflow:hidden; }
.motion-on .proof__pin > .wrap{ width:100%; }
.motion-on .proof__stage{ display:grid; }
.motion-on .proof__layer{ grid-area:1/1; }
.motion-on .proof__layer + .proof__layer{ margin-top:0; }
@media (max-width:760px){
  .proof__layer{ grid-template-columns:1fr; }
  .proof__big{ font-size:clamp(8rem,46vw,14rem); }
  .proof__big--b{ font-size:clamp(6rem,34vw,11rem); }
  .proof__line{ max-width:20ch; padding-bottom:0; margin-top:.4rem; justify-self:start; }
  .motion-on .proof{ height:240vh; }
}

/* ── HOW IT BOOKS: pinned; a phone built in code plays the minute after the click (an example, no client) ── */
.how{ background:#fff; }
.how__grid{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:2rem clamp(3rem,7vw,7rem); align-items:center; }
.how h2{ font-size:clamp(2.2rem,4.6vw,4rem); line-height:1; letter-spacing:-.03em; margin-top:1rem; max-width:13ch; }
.how__intro{ margin-top:1.1rem; max-width:40ch; font-size:1.05rem; }
.how__steps{ list-style:none; margin:clamp(1.6rem,4vh,2.6rem) 0 0; padding:0; max-width:520px; }
.how__steps li{ display:grid; grid-template-columns:6.5rem 1fr; align-items:baseline; gap:1rem; padding:.9rem 0; border-top:1px solid var(--hair); transition:opacity .3s; }
.how__steps li:last-child{ border-bottom:1px solid var(--hair); }
.how__steps b{ font:500 .76rem/1 var(--mono); letter-spacing:.08em; color:var(--mute); font-variant-numeric:tabular-nums; }
.how__steps span{ font:500 clamp(1.2rem,1.7vw,1.5rem)/1.2 var(--serif); color:var(--ink); }
.how__device{ position:relative; justify-self:center; }
.how__tag{ position:absolute; top:-1.7rem; left:.4rem; font:500 .66rem/1 var(--mono); letter-spacing:.14em; text-transform:uppercase; color:var(--mute); }
.phone{ width:min(330px, 26vw, calc((100vh - 140px) * .4737)); width:min(330px, 26vw, calc((100svh - 140px) * .4737)); min-width:230px; aspect-ratio:9/19; border-radius:44px; background:var(--ink); padding:9px; box-shadow:0 40px 70px -30px rgba(14,17,22,.45); }
.phone__screen{ position:relative; height:100%; border-radius:36px; overflow:hidden; background:#fff; font-family:var(--sans); }
.phone__status{ position:absolute; z-index:5; top:0; left:0; right:0; height:34px; display:flex; align-items:center; justify-content:space-between; padding:0 22px; font:600 12px/1 var(--sans); color:var(--ink); background:#fff; }
.phone__notch{ position:absolute; left:50%; top:8px; width:78px; height:20px; margin-left:-39px; border-radius:20px; background:var(--ink); }
.phone__sig{ width:18px; height:9px; border-radius:2px; border:1.5px solid var(--ink); }
.scr{ position:absolute; z-index:1; inset:34px 0 0; background:#fff; overflow:hidden; }
.feed{ padding-bottom:60px; }
.fd-top{ display:flex; align-items:center; justify-content:space-between; padding:6px 14px 8px; }
.fd-top b{ font:700 17px/1 var(--sans); color:var(--ink); letter-spacing:-.01em; }
.fd-top div{ display:flex; gap:14px; }
.ic{ width:21px; height:21px; fill:none; stroke:var(--ink); stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; display:block; }
.stories{ display:flex; gap:11px; padding:4px 12px 10px; border-bottom:1px solid var(--hair); overflow:hidden; }
.story{ flex-shrink:0; width:54px; text-align:center; }
.story img, .story .me{ display:block; width:50px; height:50px; margin:0 auto; border-radius:50%; object-fit:cover; border:2px solid #fff; box-shadow:0 0 0 2px var(--blue); }
.story .me{ background:#E7EAF2; box-shadow:0 0 0 1px rgba(14,17,22,.12); }
.story span{ display:block; margin-top:4px; font:400 9.5px/1.1 var(--sans); color:var(--ink); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.post{ padding-bottom:10px; }
.post__hd{ display:flex; align-items:center; gap:8px; padding:8px 12px; }
.post__hd img, .post__hd .yb{ width:28px; height:28px; border-radius:50%; object-fit:cover; flex-shrink:0; }
.post__hd .yb{ display:flex; align-items:center; justify-content:center; background:var(--blue); color:#fff; font:700 10px/1 var(--sans); letter-spacing:.02em; }
.post__who{ flex:1; min-width:0; }
.post__who b{ display:block; font:600 12px/1.2 var(--sans); color:var(--ink); }
.post__who span{ display:block; font:400 10px/1.2 var(--sans); color:var(--ink); }
.post__more{ font:700 14px/1 var(--sans); color:var(--ink); letter-spacing:1px; }
.post__img{ display:block; width:100%; aspect-ratio:1/1; object-fit:cover; background:#EEF1F7; }
.post__act{ display:flex; align-items:center; gap:13px; padding:9px 12px 5px; }
.post__act .sv{ margin-left:auto; }
.post__likes{ padding:0 12px; font:600 11.5px/1.3 var(--sans); color:var(--ink); }
.post__cap{ padding:2px 12px 0; font:400 11.5px/1.35 var(--sans); color:var(--ink); }
.post__cap b{ font-weight:600; }
.ad__media{ position:relative; aspect-ratio:4/5; overflow:hidden; }
.ad__media img{ width:100%; height:100%; object-fit:cover; display:block; }
.ad__media::before{ content:""; position:absolute; inset:0; background:linear-gradient(180deg, rgba(8,12,30,.72) 0%, rgba(8,12,30,.25) 38%, rgba(8,12,30,0) 60%); }
.ad__copy{ position:absolute; left:14px; right:14px; top:14px; }
.ad__copy b{ display:block; font:500 25px/1.02 var(--serif); letter-spacing:-.02em; color:#fff; max-width:8.5ch; }
.ad__copy span{ display:block; margin-top:8px; font:500 11px/1.3 var(--sans); color:rgba(255,255,255,.9); }
.ad__cta{ position:relative; display:flex; justify-content:space-between; align-items:center; padding:10px 12px; background:var(--blue); color:#fff; font:600 12px/1 var(--sans); }
.ad__cta svg{ width:14px; height:14px; stroke:#fff; stroke-width:2.2; fill:none; }
.tap{ position:absolute; left:50%; top:50%; width:70px; height:70px; margin:-35px 0 0 -35px; border-radius:50%; background:rgba(255,255,255,.45); opacity:0; }
.tabbar{ position:absolute; left:0; right:0; bottom:0; z-index:4; display:flex; justify-content:space-around; align-items:center; height:50px; padding-bottom:6px; background:#fff; border-top:1px solid var(--hair); }
.tabbar .me{ width:22px; height:22px; border-radius:50%; background:#E7EAF2; border:1.5px solid var(--ink); }
.scr--lp{ padding:24px 18px; }
.lp__brand{ font:500 10px/1 var(--mono); letter-spacing:.14em; text-transform:uppercase; color:var(--mute); }
.lp__h{ margin:12px 0 20px; font:500 24px/1.05 var(--serif); letter-spacing:-.02em; color:var(--ink); }
.lp__f{ display:block; border:1px solid rgba(14,17,22,.16); border-radius:10px; padding:8px 12px; margin-bottom:10px; }
.lp__f span{ display:block; font:400 10px/1.3 var(--sans); color:var(--mute); }
.lp__f .type{ display:inline-block; font:500 14px/1.4 var(--sans); color:var(--ink); }
.lp__btn{ margin-top:6px; background:var(--blue); color:#fff; font:600 14px/1 var(--sans); text-align:center; padding:13px; border-radius:10px; }
.sms__hd{ display:flex; flex-direction:column; align-items:center; gap:5px; padding:8px 0 10px; border-bottom:1px solid var(--hair); }
.sms__hd .av{ width:34px; height:34px; border-radius:50%; background:var(--blue); }
.sms__hd b{ font:600 11px/1 var(--sans); color:var(--ink); }
.sms__time{ margin:12px 0 4px; text-align:center; font:400 10px/1 var(--sans); color:var(--mute); }
.bub{ max-width:78%; margin:8px 12px 0; padding:9px 12px; border-radius:18px; font:400 13px/1.35 var(--sans); }
.bub--in{ background:#EEF0F4; color:var(--ink); border-bottom-left-radius:6px; }
.bub--out{ margin-left:auto; background:var(--blue); color:#fff; border-bottom-right-radius:6px; width:max-content; }
.sms__typing{ position:absolute; left:12px; top:96px; display:flex; gap:4px; padding:12px 14px; border-radius:18px; background:#EEF0F4; opacity:0; }
.sms__typing span{ width:6px; height:6px; border-radius:50%; background:#9AA1AE; }
.booked{ position:absolute; left:12px; right:12px; bottom:16px; display:flex; align-items:center; gap:10px; padding:12px 14px; border-radius:16px; background:#fff; border:1px solid var(--hair); box-shadow:0 14px 30px -14px rgba(14,17,22,.3); }
.booked svg{ width:30px; height:30px; flex-shrink:0; }
.booked b{ display:block; font:500 17px/1.1 var(--serif); color:var(--ink); }
.booked span{ display:block; margin-top:3px; font:400 11px/1.2 var(--sans); color:var(--mute); }
/* on logo blue for contrast */
.how{ background:var(--blue)!important; }
.how .lbl, .how .how__tag{ color:rgba(255,255,255,.62); }
.how h2{ color:#fff!important; }
.how .how__intro{ color:rgba(255,255,255,.8); }
.how .how__steps li{ border-color:rgba(255,255,255,.2); }
.how .how__steps b{ color:rgba(255,255,255,.7); }
.how .how__steps span{ color:#fff; }
.how .phone{ box-shadow:0 40px 80px -30px rgba(3,8,30,.7); }
.motion-on .how .how__steps li{ opacity:.4; }
.motion-on .how .how__steps li.is-on{ opacity:1; }
.motion-on .how{ height:380vh; height:380svh; padding:0!important; }
.motion-on .how__pin{ position:sticky; top:0; height:100vh; height:100svh; display:flex; align-items:center; padding-top:56px; box-sizing:border-box; overflow:hidden; }
.motion-on .how__pin > .wrap{ width:100%; }
.motion-on .how__steps li{ opacity:.26; }
.motion-on .how__steps li.is-on{ opacity:1; }
@media (max-width:760px){
  .how__grid{ grid-template-columns:1fr; }
  .how__device{ margin-top:2.4rem; }
  .phone{ width:min(270px, 72vw); }
  .motion-on .how__pin{ align-items:flex-start; padding:72px 0 24px; }
  .motion-on .how__grid{ display:flex; flex-direction:column; height:100%; gap:0; }
  .motion-on .how__copy{ flex:0 0 auto; }
  .motion-on .how h2{ font-size:1.9rem; }
  .motion-on .how__intro{ display:none; }
  .motion-on .how__steps{ margin-top:.8rem; }
  .motion-on .how__steps li{ display:none; border:0; padding:.2rem 0; }
  .motion-on .how__steps li.is-on{ display:grid; }
  .motion-on .how__device{ margin:auto 0; padding:1.2rem 0; }
  .motion-on .phone{ width:min(250px, 64vw, calc((100vh - 290px) * .4737)); width:min(250px, 64vw, calc((100svh - 290px) * .4737)); min-width:0; }
}

/* ── SERVICES ── */
.svc{ background:#EEF2FA; }
.svc h2{ font-size:clamp(2.2rem,4.6vw,4rem); line-height:1; margin-top:1rem; }
.svc__list{ margin-top:clamp(2rem,4vw,3.2rem); }
.svc__item{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:1rem 3rem; padding-block:clamp(1.4rem,3vw,2.2rem); border-top:1px solid var(--hair); }
.svc__item h3{ font-size:clamp(1.9rem,3.6vw,3.2rem); line-height:1; font-weight:500; }
.svc__item p{ font-size:1.05rem; max-width:48ch; }
@media (max-width:760px){ .svc__item{ grid-template-columns:1fr; } }

/* ── GUARANTEE: Cross the Bar. Pinned; scrolling runs Day 1 to Day 60 while the line climbs over the client's own bar ── */
.xb{ background:#fff; }
.xb__top{ display:grid; grid-template-columns:minmax(0,1.1fr) minmax(0,1fr); gap:1rem 4rem; align-items:end; }
.xb__top h2{ font-size:clamp(2.1rem,4vw,3.8rem); line-height:1; letter-spacing:-.03em; margin-top:.9rem; max-width:15ch; }
.xb__intro{ font-size:1.05rem; max-width:46ch; }
.xb__main{ display:grid; grid-template-columns:minmax(0,4fr) minmax(0,8fr); gap:2rem 4rem; margin-top:clamp(1.6rem,4vh,3rem); }
.xb__count{ font:500 clamp(3.4rem,7.4vw,7.6rem)/.9 var(--serif); letter-spacing:-.045em; color:var(--blue); font-variant-numeric:tabular-nums; white-space:nowrap; }
.xb__steps{ list-style:none; margin:clamp(.8rem,2.4vh,1.8rem) 0 0; padding:0; }
.xb__steps li{ padding:.65rem 0; border-top:1px solid var(--hair); transition:opacity .35s, transform .35s cubic-bezier(.2,.7,.2,1); transform-origin:left center; }
.xb__steps li b, .xb__steps li span{ transition:color .35s, font-size .35s; }
.xb__steps b{ display:block; font:500 .7rem/1.3 var(--mono); letter-spacing:.14em; text-transform:uppercase; color:var(--mute); }
.xb__steps span{ display:block; margin-top:.25rem; font-size:.95rem; line-height:1.4; color:var(--ink); }
.xb__steps .xb__win{ font:500 1.3rem/1.2 var(--serif); color:var(--blue); }
.xb__chart{ position:relative; min-height:360px; }
.xb__svg{ position:absolute; inset:0; width:100%; height:100%; overflow:visible; }
.xb__bar{ stroke:var(--ink); stroke-opacity:.4; stroke-width:1.5; stroke-dasharray:6 6; transition:stroke .35s, stroke-opacity .35s, stroke-width .35s; }
.xb.is-crossed .xb__bar{ stroke:var(--blue); stroke-opacity:1; stroke-width:4; stroke-dasharray:none; }
.xb__area{ fill:rgba(30,58,138,.07); stroke:none; }
.xb__line{ fill:none; stroke:var(--blue); stroke-width:3; stroke-linejoin:round; stroke-linecap:round; }
.xb__lose{ fill:none; stroke:var(--blue); stroke-width:1.5; stroke-dasharray:3 5; opacity:0; }
.xb__dot{ fill:var(--blue); }
.xb__pulse{ fill:none; stroke:var(--blue); stroke-width:2; opacity:0; }
.xb__svg text{ font:500 11px var(--mono); letter-spacing:.12em; text-transform:uppercase; fill:var(--mute); }
.xb__svg .xb__barlbl{ fill:var(--ink); }
.xb__svg .xb__call{ font-size:12px; font-weight:600; fill:var(--blue); }
.xb.is-crossed .xb__barlbl{ fill:var(--blue); }
.motion-on .xb{ height:340vh; padding:0!important; }
.motion-on .xb__pin{ position:sticky; top:0; height:100vh; height:100svh; padding:clamp(84px,12vh,118px) 0 clamp(26px,5vh,54px); box-sizing:border-box; overflow:hidden; }
.motion-on .xb__pin > .wrap{ height:100%; display:flex; flex-direction:column; }
.motion-on .xb__main{ flex:1; min-height:0; }
.motion-on .xb__chart{ min-height:0; }
.motion-on .xb__steps li{ opacity:.42; }
.motion-on .xb__steps li.is-on{ opacity:1; transform:translateX(14px); }
.motion-on .xb__steps li.is-on b{ color:var(--blue); font-weight:600; }
.motion-on .xb__steps li.is-on span{ font-size:1.14rem; font-weight:500; }
.motion-on .xb__steps li.is-on .xb__win{ font-size:1.6rem; }
@media (max-width:760px){
  .xb__top{ grid-template-columns:1fr; }
  .xb__main{ grid-template-columns:1fr; }
  .xb__side{ display:contents; }
  .xb__count{ order:1; }
  .xb__chart{ order:2; min-height:260px; }
  .xb__steps{ order:3; }
  .motion-on .xb__pin{ padding-top:80px; }
  .motion-on .xb__top h2{ font-size:1.9rem; }
  .motion-on .xb__intro{ font-size:.92rem; }
  .motion-on .xb__main{ grid-template-rows:auto minmax(0,1fr) auto; gap:.8rem; margin-top:1rem; }
  .motion-on .xb__count{ font-size:3.2rem; }
  .motion-on .xb__steps{ margin:0; }
  .motion-on .xb__steps li{ display:none; border:0; padding:0; }
  .motion-on .xb__steps li.is-on{ display:block; }
}

/* ── PHONES: comfortable tap targets ── */
@media (max-width:760px){
  .nav .btn-primary{ min-height:44px; display:inline-flex; align-items:center; }
  .nav-hamburger{ min-width:44px; min-height:44px; align-items:center; }
  .proof__link, .rv-link{ display:inline-block; padding:.75rem 0; }
  .footer-col ul{ gap:0; }
  .footer-col a, .footer-bottom a, .footer-legal a{ display:inline-block; padding:.7rem 0; }
  .chap__link{ padding:.75rem 0; margin-top:.8rem; }
  /* wide receipts (Ads Manager tables): readable size, swipe sideways inside the frame */
  .bf--wide .bf__view{ overflow-x:auto; -webkit-overflow-scrolling:touch; }
  .bf--wide .bf__view img{ width:260%; max-width:none; }
  .bf--wide + figcaption::before{ content:"Swipe to see the full report"; display:block; margin-bottom:.4rem; color:#fff; letter-spacing:.08em; }
  /* use the full phone width: desktop character caps made these wrap into skinny columns */
  .proof__line, .proof__layer--b .proof__line{ max-width:none; }
  .how h2, .xb__top h2{ max-width:none; }
}

/* ── TESTIMONIALS ── */
.says h2{ font-size:clamp(2.2rem,4.6vw,4rem); line-height:1; margin-top:1rem; }
.says__grid{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(2rem,5vw,5rem); margin-top:clamp(2rem,4vw,3.2rem); }
.q{ padding-top:1.6rem; border-top:1px solid var(--ink); }
.q blockquote{ margin:0; font:400 clamp(1.25rem,2vw,1.6rem)/1.45 var(--serif); color:var(--ink); }
.q__who{ display:flex; align-items:center; gap:.9rem; margin-top:1.6rem; }
.q__av{ width:46px; height:46px; border-radius:50%; background:var(--ink); color:#fff; display:flex; align-items:center; justify-content:center; font:600 1rem var(--sans); flex-shrink:0; }
.q__n{ font-weight:700; color:var(--ink); }
.q__r{ font-size:.9rem; color:var(--mute); }
@media (max-width:860px){ .says__grid{ grid-template-columns:1fr; } }

/* ── FOUNDER ── */
.fnd__grid{ display:grid; grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr); gap:clamp(2rem,6vw,6rem); align-items:center; }
.fnd__img{ position:relative; border-radius:18px; overflow:hidden; aspect-ratio:4/5; background:#e9eaee; }
.fnd__img img{ width:100%; height:100%; object-fit:cover; object-position:top center; display:block; }
.fnd h2{ font-size:clamp(2.2rem,4.4vw,3.8rem); line-height:1.02; margin-top:1rem; }
.fnd p{ margin-top:1.2rem; font-size:1.08rem; max-width:48ch; }
.fnd__ctas{ display:flex; flex-wrap:wrap; gap:.8rem; margin-top:1.8rem; }
.fnd__ctas .line-btn svg{ width:16px; height:16px; }
@media (max-width:860px){ .fnd__grid{ grid-template-columns:1fr; } .fnd__img{ max-width:420px; } }

/* ── FAQ ── */
.faq h2{ font-size:clamp(2.2rem,4.6vw,4rem); line-height:1; margin-top:1rem; }
.faq__list{ margin-top:clamp(2rem,4vw,3rem); max-width:900px; }
.faq__list details{ border-top:1px solid var(--hair); }
.faq__list details:last-child{ border-bottom:1px solid var(--hair); }
.faq__list summary{ list-style:none; cursor:pointer; display:flex; justify-content:space-between; gap:1rem; padding:1.4rem 0; font:500 1.25rem/1.3 var(--serif); color:var(--ink); }
.faq__list summary::-webkit-details-marker{ display:none; }
.faq__list summary::after{ content:"+"; font:400 1.6rem/1 var(--sans); color:var(--blue); transition:transform .25s; }
.faq__list details[open] summary::after{ transform:rotate(45deg); }
.faq__list details p{ padding:0 0 1.5rem; max-width:64ch; }

/* ── CLOSE ── */
.close{ border-top:1px solid var(--hair); }
.close h2{ font-size:clamp(2.8rem,7vw,6.6rem); line-height:.98; letter-spacing:-.035em; color:var(--blue); max-width:14ch; }
.close p.lead{ margin-top:1.4rem; font-size:1.15rem; max-width:52ch; }

/* dialog video */
.vdlg{ position:fixed; inset:0; margin:auto; height:fit-content; max-height:92vh; border:0; padding:0; background:#000; width:min(1100px,94vw); border-radius:14px; overflow:hidden; }
.vdlg::backdrop{ background:rgba(6,8,12,.86); }
.vdlg video{ width:100%; display:block; max-height:84vh; }
.vdlg button{ position:absolute; top:10px; right:10px; z-index:2; width:40px; height:40px; border-radius:50%; border:0; background:rgba(255,255,255,.9); font:600 1.2rem var(--sans); cursor:pointer; }

/* ── ABSTRACT COLOR FIELDS (blue family only, drift on transform) ── */
.field{ position:absolute; inset:0; overflow:hidden; pointer-events:none; z-index:0; }
.blob{ position:absolute; border-radius:50%; filter:blur(70px); will-change:transform; }
.grain{ position:absolute; inset:0; pointer-events:none; z-index:1; opacity:.07; mix-blend-mode:multiply;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"); }
.on-dark .grain{ mix-blend-mode:screen; opacity:.08; }
@keyframes drift1{ from{ transform:translate(0,0) scale(1); } to{ transform:translate(-9%,7%) scale(1.12); } }
@keyframes drift2{ from{ transform:translate(0,0) scale(1.05); } to{ transform:translate(8%,-6%) scale(.92); } }
@keyframes drift3{ from{ transform:translate(0,0); } to{ transform:translate(-6%,-8%); } }
.b1{ animation:drift1 19s ease-in-out infinite alternate; } .b2{ animation:drift2 23s ease-in-out infinite alternate; } .b3{ animation:drift3 17s ease-in-out infinite alternate; }
@media (prefers-reduced-motion:reduce){ .blob{ animation:none; } }

.hero{ position:relative; overflow:hidden; }
.hero .wrap{ position:relative; z-index:2; }

/* ── CLIENT MARQUEE (trust, big) ── */
.marq{ padding-block:clamp(36px,5vw,56px)!important; border-top:1px solid var(--hair); border-bottom:1px solid var(--hair); overflow:hidden; }
.marq__lbl{ text-align:center; margin-bottom:clamp(1.4rem,3vw,2.2rem); }
.marq__track{ display:flex; align-items:center; gap:clamp(3.5rem,7vw,7rem); width:max-content; animation:marq 38s linear infinite; }
.marq:hover .marq__track{ animation-play-state:paused; }
@keyframes marq{ to{ transform:translateX(-50%); } }
.marq__track img{ height:clamp(52px,6vw,84px); width:auto; filter:brightness(0); opacity:.86; flex-shrink:0; }
.marq__track .wm{ font:600 clamp(2.3rem,4.2vw,3.6rem)/1 Georgia, serif; color:#000; opacity:.86; white-space:nowrap; flex-shrink:0; }
.marq__track .wm sup{ font-size:.6em; }
@media (prefers-reduced-motion:reduce){ .marq__track{ animation:none; flex-wrap:wrap; width:auto; justify-content:center; } }

/* ── SERVICES ON LOGO BLUE ── */
.svc.on-blue{ position:relative; overflow:hidden; background:#1E3A8A; }
.svc.on-blue .wrap{ position:relative; z-index:2; }
.svc.on-blue .lbl{ color:rgba(255,255,255,.62); }
.svc.on-blue h2, .svc.on-blue h3{ color:#fff; }
.svc.on-blue p{ color:rgba(255,255,255,.8); }
.svc.on-blue .svc__item{ border-top-color:rgba(255,255,255,.22); }
.svc.on-blue .svc__item:last-child{ border-bottom:1px solid rgba(255,255,255,.22); }

/* ── CLOSE ON DEEP NAVY ── */
.close.on-dark{ position:relative; overflow:hidden; background:#0A1230; border-top:0; }
.close.on-dark .wrap{ position:relative; z-index:2; }
.close.on-dark .lbl{ color:rgba(255,255,255,.6); }
.close.on-dark h2{ color:#fff; }
.close.on-dark p.lead, .close.on-dark .audit-note{ color:rgba(255,255,255,.76); }
.close.on-dark .audit input{ border-color:rgba(255,255,255,.3); }
.close.on-dark .audit button{ background:#fff; color:#0A1230; }
.close.on-dark .audit button:hover{ background:#DCE4FB; }

/* ── REVIEWS: real faces, editorial ── */
.says{ background:#F3F5FB; }
.faq{ background:#EEF2FA; }
.rv-row{ display:grid; grid-template-columns:minmax(0,1fr); max-width:980px; gap:clamp(1.6rem,5vw,5rem); align-items:center; padding-block:clamp(2.2rem,5vw,4rem); border-top:1px solid var(--hair); margin:0; }
.rv-row:first-child{ border-top:0; }
.rv-row.flip{ grid-template-columns:minmax(0,1fr); margin-left:auto; }
.rv-row.flip .rv-photo{ order:2; }
.rv-photo{ aspect-ratio:4/5; border-radius:16px; overflow:hidden; background:#dfe3ee; }
.rv-photo img{ width:100%; height:100%; object-fit:cover; object-position:center 20%; display:block; }
.rv-q{ margin:0; font:400 clamp(1.45rem,2.6vw,2.3rem)/1.32 var(--serif); letter-spacing:-.01em; color:var(--ink); }
.rv-q b{ font-weight:700; }
.rv-who{ display:flex; align-items:center; gap:1.1rem; flex-wrap:wrap; margin-top:1.6rem; }
.rv-n{ font-weight:700; color:var(--ink); }
.rv-r{ font-size:.92rem; color:var(--mute); }
.rv-logo{ height:46px; width:auto; filter:brightness(0); opacity:.7; margin-left:auto; }
.rv-wm{ font:600 1.3rem/1 Georgia, serif; color:#000; opacity:.7; margin-left:auto; }
.rv-wm sup{ font-size:.6em; }
.rv-link{ display:inline-block; margin-top:1.1rem; font:600 .92rem var(--sans); color:var(--blue); text-decoration:none; }
@media (max-width:760px){
  .rv-row, .rv-row.flip{ grid-template-columns:1fr; }
  .rv-row.flip .rv-photo{ order:0; }
  .rv-photo{ max-width:260px; }
  .rv-logo, .rv-wm{ margin-left:0; }
}

/* footer text on navy */
.v4 .footer p, .v4 .footer-bottom p{ color:rgba(255,255,255,.62); }

/* hero line mask for load reveal */
.mask{ display:block; overflow:hidden; padding-bottom:.06em; }

@media (prefers-reduced-motion:reduce){ .row, .faq__list summary::after{ transition:none; } }

/* ── SHARED v4 PIECES (used by inner pages) ── */
.pg-hero{ position:relative; overflow:hidden; padding-top:clamp(56px,8vw,110px)!important; padding-bottom:clamp(40px,6vw,80px)!important; }
.pg-hero .wrap{ position:relative; z-index:2; }
.pg-hero h1{ margin-top:1.2rem; font-size:clamp(2.7rem,6.6vw,6.6rem); line-height:.98; letter-spacing:-.035em; color:var(--blue); }
.pg-hero h1 .l1{ display:block; font-weight:400; }
.pg-hero h1 .l2{ display:block; font-weight:700; }
.pg-hero p.lead{ margin-top:clamp(1.2rem,2.4vw,2rem); max-width:52ch; font-size:clamp(1.05rem,1.4vw,1.25rem); }
.sec-tint{ background:#EEF2FA; }
.sec-blue{ background:var(--blue); }
.sec-blue .lbl{ color:rgba(255,255,255,.62); }
.sec-blue h2, .sec-blue h3{ color:#fff!important; }
.sec-blue p{ color:rgba(255,255,255,.8); }
.chap{ display:grid; grid-template-columns:minmax(0,5fr) minmax(0,7fr); gap:clamp(2rem,5vw,5rem); align-items:center; }
.chap--flip > :first-child{ order:2; }
.chap h2{ margin-top:1rem; font-size:clamp(2.2rem,4.4vw,3.9rem); line-height:1; letter-spacing:-.03em; }
.chap h2 b{ font-weight:700; }
.chap p{ margin-top:1.1rem; font-size:1.06rem; max-width:44ch; }
.chap__link{ display:inline-block; margin-top:1.4rem; font:600 .95rem var(--sans); color:var(--blue); text-decoration:none; }
.sec-blue .chap__link{ color:#fff; }
.tags{ display:flex; flex-wrap:wrap; gap:.4rem 1.1rem; margin-top:1.3rem; font:500 .7rem/1 var(--mono); letter-spacing:.12em; text-transform:uppercase; color:var(--mute); }
/* browser frame */
.bf{ border-radius:14px; overflow:hidden; background:#fff; box-shadow:0 1px 0 rgba(14,17,22,.06), 0 40px 80px -40px rgba(14,17,22,.45); border:1px solid rgba(14,17,22,.1); will-change:transform; }
.bf__bar{ display:flex; align-items:center; gap:.45rem; height:38px; padding:0 14px; background:#F3F4F7; border-bottom:1px solid rgba(14,17,22,.08); }
.bf__bar i{ width:10px; height:10px; border-radius:50%; background:#D5D8DF; }
.bf__url{ margin-left:.8rem; flex:1; max-width:340px; height:22px; border-radius:6px; background:#fff; font:500 11px/22px var(--sans); color:var(--mute); padding:0 10px; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; }
.bf__view{ position:relative; height:clamp(320px,62vh,620px); overflow:hidden; }
.bf__view img{ display:block; width:100%; height:auto; }
.bf--auto .bf__view{ height:auto; }
/* big figures (no boxes): huge serif numbers split by hairlines */
.figs{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); margin-top:clamp(2rem,4vw,3.4rem); border-top:1px solid rgba(255,255,255,.22); }
.figs > div{ padding:1.4rem 1.4rem 0 0; }
.figs > div + div{ padding-left:1.4rem; border-left:1px solid rgba(255,255,255,.22); }
.figs b{ display:block; font:500 clamp(2.6rem,5.4vw,5.2rem)/1 var(--serif); letter-spacing:-.04em; color:#fff; font-variant-numeric:tabular-nums; }
.figs span{ display:block; margin-top:.6rem; font:500 .72rem/1.3 var(--mono); letter-spacing:.14em; text-transform:uppercase; color:rgba(255,255,255,.62); }
.receipt{ margin-top:clamp(2.4rem,5vw,4rem); }
.receipt figcaption{ margin-top:.9rem; font:500 .72rem/1.4 var(--mono); letter-spacing:.12em; text-transform:uppercase; color:rgba(255,255,255,.62); }
.pair{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(1.6rem,4vw,3.6rem); margin-top:clamp(2.4rem,5vw,4rem); }
.pair h3{ margin-top:1.4rem; font-size:clamp(1.4rem,2.2vw,1.9rem); line-height:1.15; }
.pair p{ margin-top:.6rem; font-size:1rem; max-width:44ch; }
.lpstat{ display:flex; gap:clamp(1.2rem,3vw,2.2rem); margin-top:1.4rem; padding-top:1.1rem; border-top:1px solid var(--hair); max-width:44ch; }
.lpstat b{ display:block; font:500 clamp(2.2rem,4vw,3.2rem)/1 var(--serif); letter-spacing:-.03em; color:var(--blue); font-variant-numeric:tabular-nums; }
.lpstat div + div b{ color:var(--mute); }
.lpstat span{ display:block; margin-top:.5rem; font:500 .7rem/1.35 var(--mono); letter-spacing:.12em; text-transform:uppercase; color:var(--mute); }
.lpstat__src{ margin-top:.6rem !important; font-size:.8rem !important; color:var(--mute); }
.rules{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:1.6rem; margin-top:clamp(2.6rem,5vw,4rem); }
.rules div{ padding-top:1rem; border-top:1px solid var(--ink); }
.rules b{ display:block; font:500 1.2rem/1.2 var(--serif); color:var(--ink); }
.rules p{ margin-top:.5rem; font-size:.95rem; }
@media (max-width:900px){
  .chap, .pair{ grid-template-columns:1fr; }
  .chap--flip > :first-child{ order:0; }
  .figs{ grid-template-columns:1fr 1fr; }
  .figs > div:nth-child(3){ padding-left:0; border-left:0; }
  .figs > div:nth-child(n+3){ border-top:1px solid rgba(255,255,255,.22); margin-top:1.4rem; }
  .rules{ grid-template-columns:1fr 1fr; }
}
@media (max-width:520px){ .rules{ grid-template-columns:1fr; } .bf__view{ height:56vh; } }

/* ── INNER PAGES: booking embed, reach-out form, compact rows ── */
.pair .svc__item{ grid-template-columns:1fr; gap:.3rem; padding-block:1rem; }
.pair .svc__item h3{ font-size:1.25rem; line-height:1.2; }
.pair .svc__item p{ font-size:.98rem; }
.pair > div > h3{ margin-top:0; }
.sec-blue .figs + .chap__link{ margin-top:2rem; }
.book{ border-radius:16px; overflow:hidden; background:#fff; border:1px solid var(--hair); box-shadow:0 30px 70px -40px rgba(14,17,22,.4); }
.book iframe{ display:block; width:100%; min-height:720px; border:0; }
.reach{ margin-top:1.4rem; max-width:640px; }
.reach summary{ cursor:pointer; list-style:none; font:600 1rem var(--sans); color:var(--blue); padding:.8rem 0; }
.reach summary::-webkit-details-marker{ display:none; }
.c-form{ margin-top:.6rem; display:grid; gap:.9rem; }
.c-row{ display:grid; grid-template-columns:1fr 1fr; gap:.9rem; }
.c-field label{ display:block; font:500 .72rem/1.3 var(--mono); letter-spacing:.12em; text-transform:uppercase; color:var(--mute); margin-bottom:.4rem; }
.c-field input, .c-field textarea{ width:100%; box-sizing:border-box; font:500 1rem var(--sans); color:var(--ink); background:#fff; border:1.5px solid rgba(14,17,22,.2); border-radius:10px; padding:.85rem 1rem; }
.c-field textarea{ min-height:110px; resize:vertical; }
.c-field input:focus, .c-field textarea:focus{ outline:none; border-color:var(--blue); box-shadow:0 0 0 3px rgba(30,58,138,.14); }
.c-btn{ height:54px; font:600 1rem var(--sans); color:#fff; background:var(--blue); border:0; border-radius:10px; cursor:pointer; }
.c-note{ font-size:.9rem; color:var(--mute); }
#contact-success h3{ font-size:1.5rem; }
@media (max-width:760px){ .c-row{ grid-template-columns:1fr; } .book iframe{ min-height:820px; } }

/* ── LEGAL / LONG TEXT ── */
.prose{ max-width:720px; }
.prose h2{ margin-top:2.4rem; font-size:clamp(1.4rem,2.2vw,1.8rem); line-height:1.2; }
.prose h3{ margin-top:1.4rem; font-size:1.15rem; }
.prose p, .prose li{ font-size:1.02rem; line-height:1.7; }
.prose p{ margin-top:.8rem; }
.prose ul{ margin:.8rem 0 0 1.2rem; padding:0; }
.prose li{ margin-top:.3rem; }
.prose a{ color:var(--blue); }

/* ── ABOUT: my story ── */
.mystory p{ font-size:1.12rem; line-height:1.65; max-width:56ch; }
.mystory p + p{ margin-top:1.1rem; }
.sec-blue .mystory p{ color:rgba(255,255,255,.88); }
.chap .mystory{ align-self:start; }
#story .chap > div:first-child{ align-self:start; }
@media (min-width:901px){ #story .chap > div:first-child{ position:sticky; top:110px; } }
.story-photo{ position:relative; margin:1.8rem 0 .4rem; max-width:560px; }
.story-photo img{ display:block; width:100%; aspect-ratio:4/3; object-fit:cover; border-radius:14px; }
.story-photo__ph{ display:none; }
.story-photo.is-empty img{ display:none; }
.story-photo.is-empty .story-photo__ph{ display:flex; align-items:center; justify-content:center; aspect-ratio:4/3; border-radius:14px; border:1.5px dashed rgba(255,255,255,.4); background:rgba(255,255,255,.06); font:500 .72rem/1 var(--mono); letter-spacing:.14em; text-transform:uppercase; color:rgba(255,255,255,.7); }
.story-photo figcaption{ margin-top:.6rem; font:500 .72rem/1.4 var(--mono); letter-spacing:.12em; text-transform:uppercase; color:rgba(255,255,255,.62); }
