/* Nelva · built by Vitals Agency for Jet Virtual Consults, LLC · https://www.vitals.agency */
/* Nelva · hirenelva.com
   Brand: rev3 foundation (brand-discovery/jvc-dba-product/in-progress/rev3/foundation/palette.md).
   Deep Teal owns the page as committed fields; Care Aqua is action; Warm Coral is rationed warmth
   (CTAs, the announcement bar, the waiver); Signal red appears only inside depicted product UI.
   Coral buttons carry Ink Night text (5.67:1); attention pills carry Deep Teal on blush (9.79:1).
   Type: Manrope (display, weights 600 to 800) + Source Sans 3 (body), self-hosted woff2.
   Icons: the brochure's own set, generated into icons.svg from 06-infographic-set/_assets/build.py. */

@font-face{font-family:Manrope;font-weight:600;font-display:swap;src:url(fonts/Manrope-600.woff2) format('woff2')}
@font-face{font-family:Manrope;font-weight:700;font-display:swap;src:url(fonts/Manrope-700.woff2) format('woff2')}
@font-face{font-family:Manrope;font-weight:800;font-display:swap;src:url(fonts/Manrope-800.woff2) format('woff2')}
@font-face{font-family:'Source Sans 3';font-weight:400;font-display:swap;src:url(fonts/SourceSans3-400.woff2) format('woff2')}
@font-face{font-family:'Source Sans 3';font-weight:600;font-display:swap;src:url(fonts/SourceSans3-600.woff2) format('woff2')}
@font-face{font-family:'Source Sans 3';font-weight:700;font-display:swap;src:url(fonts/SourceSans3-700.woff2) format('woff2')}

:root{
  --teal:#123F43; --ink:#0C2B2E; --aqua:#2AB7B3; --aquad:#127672; --mint:#DDF4EC; --cream:#F7F5F0;
  --coral:#F47C6B; --corald:#C2483A; --meta:#51686B; --mist:#E9EFED; --signal:#B3261E;
  --blush:#FCE8E4; --chip:#1B4E52; --line:#2A5A5E; --muted:#9FC7C2;
  --wrap:1200px; --r:18px; --ease:cubic-bezier(.2,.8,.2,1);
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;scroll-padding-top:84px}
body{font-family:'Source Sans 3',system-ui,sans-serif;color:var(--teal);background:var(--cream);font-size:18px;line-height:1.55;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img,svg,video{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
ol,ul{list-style:none}
.skip{position:absolute;left:-9999px}
.skip:focus{left:12px;top:12px;background:#fff;padding:10px 14px;border-radius:8px;z-index:99}
:focus-visible{outline:3px solid var(--aqua);outline-offset:3px;border-radius:8px}
[hidden]{display:none!important}
.ic{width:1.15em;height:1.15em;flex:none}

.wrap{width:100%;max-width:var(--wrap);margin:0 auto;padding:0 28px}
/* grid children may shrink below their content (tables, nowrap pills) instead of widening the page */
.hero__grid>*,.gap__grid>*,.jobs__grid>*,.how__grid>*,.train__grid>*,.day__grid>*,.demo__grid>*,.plans>*,.faq__grid>*,.sechd--split>*,.reel__hd>*,.proof__grid>*,.line__card>*{min-width:0}
.section{padding:120px 0}
.center{text-align:center}

/* ───────── type ───────── */
.kicker{font-family:Manrope,sans-serif;font-weight:800;font-size:.74rem;letter-spacing:.2em;text-transform:uppercase;color:var(--aquad)}
.kicker--rev{color:var(--aqua)}
.h2{font-family:Manrope,sans-serif;font-weight:800;font-size:clamp(2rem,3.6vw,3rem);line-height:1.04;letter-spacing:-.03em;margin:.3em 0 0}
.h2--rev{color:#fff}
.h2--xl{font-size:clamp(2.4rem,5vw,4.3rem)}
h3{font-family:Manrope,sans-serif;font-weight:800;letter-spacing:-.015em;line-height:1.15}
.lede{font-size:1.2rem;color:var(--meta);max-width:40ch;margin-top:18px}
.lede--wide{max-width:64ch}
.lede--rev{color:var(--mint)}
.fine{font-size:.9rem;color:var(--meta);line-height:1.5}
.fine--rev{color:var(--muted)}
.fine b{color:var(--teal)}
.sechd{max-width:1000px;margin-bottom:56px}
.sechd--split{max-width:none;display:grid;grid-template-columns:1fr auto;gap:48px;align-items:end}
.sechd--split .h2{font-size:clamp(2rem,3.2vw,2.7rem)}

/* ───────── buttons ───────── */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;font-family:Manrope,sans-serif;font-weight:800;font-size:1rem;padding:14px 24px;border-radius:999px;border:2px solid transparent;cursor:pointer;white-space:nowrap;transition:transform .18s var(--ease),box-shadow .18s var(--ease),background .18s,border-color .18s}
.btn:hover{transform:translateY(-2px)}
.btn:active{transform:translateY(0)}
.btn--lg{padding:17px 30px;font-size:1.06rem}
.btn--full{width:100%}
.btn--coral{background:var(--coral);color:var(--ink);box-shadow:0 14px 34px -10px rgba(244,124,107,.65)}
.btn--coral:hover{background:#F68E7F;box-shadow:0 18px 40px -10px rgba(244,124,107,.75)}
.btn--solid{background:var(--teal);color:#fff}
.btn--line{border-color:var(--teal);color:var(--teal);background:transparent}
.btn--line:hover{background:var(--teal);color:#fff}
.btn--rev{border-color:rgba(255,255,255,.35);color:#fff}
.btn--rev:hover{border-color:#fff;background:rgba(255,255,255,.06)}
.btn[disabled]{opacity:.6;cursor:progress;transform:none}
.textlink{display:inline-flex;align-items:center;gap:8px;font-family:Manrope,sans-serif;font-weight:800;color:var(--aquad);margin-top:14px}
.textlink:hover .ic{transform:translateX(3px)}
.textlink .ic{transition:transform .2s}

/* ───────── badges (the brochure's icon roundel) ───────── */
.bdg{position:relative;display:inline-flex;align-items:center;justify-content:center;flex:none;width:56px;height:56px;border-radius:50%;background:#fff;border:2.5px solid var(--aqua);color:var(--teal)}
.bdg .ic{width:46%;height:46%}
.bdg__n{position:absolute;top:-6px;left:-6px;width:22px;height:22px;border-radius:50%;background:var(--teal);color:#fff;font-family:Manrope,sans-serif;font-weight:800;font-size:.72rem;display:flex;align-items:center;justify-content:center}
.bdg--rev{background:transparent;color:#fff;border-color:var(--aqua)}
.bdg--ring{box-shadow:0 0 0 8px var(--mint)}

/* ───────── reveal ───────── */
.js .rv{opacity:0;transform:translateY(26px);transition:opacity .9s var(--ease),transform .9s var(--ease)}
.js .rv.in{opacity:1;transform:none}

/* ───────── announcement + nav ───────── */
.bar { font-family: Manrope, sans-serif; }

.nav{position:sticky;top:var(--barh,0px);z-index:50;background:rgba(247,245,240,.9);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom:1px solid transparent;transition:border-color .3s,box-shadow .3s}
.nav.is-scrolled{border-color:var(--mist);box-shadow:0 10px 30px -18px rgba(12,43,46,.3)}
.nav__in{display:flex;align-items:center;gap:32px;height:72px}
.nav__brand{flex:none;color:var(--teal)}
/* Nelva capitals lockup: 424.4 x 100, so it is wider and shorter than the old lowercase mark.
   Sized by width; the height follows the artwork ratio exactly. */
.lockup{width:142px;height:33.5px;color:var(--teal)}
.lockup--rev{color:#fff;width:170px;height:40px}
.nav__links{display:flex;gap:28px;margin-left:auto;font-family:Manrope,sans-serif;font-weight:700;font-size:.95rem}
.nav__links a{position:relative;padding:6px 0}
.nav__links a::after{content:'';position:absolute;left:0;right:100%;bottom:0;height:2px;background:var(--aqua);transition:right .25s var(--ease)}
.nav__links a:hover::after{right:0}
.nav__cta{display:flex;gap:10px}
.nav__cta .btn{padding:10px 18px;font-size:.92rem}
.nav__menu{display:none;width:44px;height:44px;border-radius:12px;position:relative;margin-left:auto}
.nav__menu i{position:absolute;left:12px;right:12px;height:2px;background:var(--teal);border-radius:2px;transition:transform .25s}
.nav__menu i:first-child{top:17px}.nav__menu i:last-child{top:25px}
.nav__menu[aria-expanded=true] i:first-child{transform:translateY(4px) rotate(45deg)}
.nav__menu[aria-expanded=true] i:last-child{transform:translateY(-4px) rotate(-45deg)}

/* ───────── phone (brochure proportions: h = 2.05w) ───────── */
.phone{--pw:300px;position:relative;width:var(--pw);aspect-ratio:1/2.05;background:var(--ink);border-radius:calc(var(--pw)*.155);padding:calc(var(--pw)*.03);box-shadow:inset 0 0 0 1.5px var(--line),0 50px 90px -30px rgba(4,20,22,.6);font-size:calc(var(--pw)*.046)}
.phone__key{position:absolute;width:3px;background:var(--ink);border-radius:2px}
.phone__key--pwr{right:-3px;top:24%;height:11%}
.phone__key--vol{left:-3px;top:19%;height:8%;box-shadow:0 calc(var(--pw)*.1) 0 var(--ink)}
.phone__screen{position:relative;height:100%;background:var(--cream);border-radius:calc(var(--pw)*.13);overflow:hidden;display:flex;flex-direction:column}
.sb{display:flex;justify-content:space-between;align-items:center;padding:.9em 1.5em .45em;background:var(--teal);color:#fff;font-family:Manrope,sans-serif;font-weight:700;font-size:.72em;position:relative}
.sb--dark{background:transparent}
.island{position:absolute;left:50%;top:.55em;transform:translateX(-50%);width:32%;height:1.6em;border-radius:1em;background:#000}
.sb__r{display:flex;gap:2px;align-items:flex-end}
.sb__r i{width:2.5px;background:#fff;border-radius:1px}
.sb__r i:nth-child(1){height:4px}.sb__r i:nth-child(2){height:6px}.sb__r i:nth-child(3){height:8px}
.sb__r b{width:15px;height:7.5px;border:1px solid #fff;border-radius:2px;margin-left:4px}
.homebar{position:absolute;left:50%;bottom:.5em;transform:translateX(-50%);width:36%;height:.3em;border-radius:1em;background:rgba(18,63,67,.3)}
.homebar--rev{background:rgba(255,255,255,.45)}
.ah{display:flex;align-items:center;gap:.7em;background:var(--teal);color:#fff;padding:.25em 1.1em .85em}
.ah__av{width:2.3em;height:2.3em;border-radius:50%;background:#fff;padding:.32em;flex:none;color:var(--teal)}
.ah__av svg{width:100%;height:100%}
.ah b{display:block;font-family:Manrope,sans-serif;font-size:.98em}
.ah em{display:block;font-style:normal;font-size:.72em;color:var(--mint)}
.thread{flex:1;position:relative;padding:1em .85em}
.thread--static{display:flex;flex-direction:column;gap:.6em}
.thread .sc{display:flex;flex-direction:column;gap:.6em;padding:1em .85em}
.thread__t{text-align:center;font-size:.66em;color:#8A9A9C;font-weight:600}
.thread__flag{align-self:flex-start;display:inline-flex;align-items:center;gap:.4em;font-family:Manrope,sans-serif;font-weight:800;font-size:.66em;color:var(--teal);background:var(--blush);padding:.45em .8em;border-radius:99px}
.thread__flag .ic{color:var(--corald)}
.thread__in{margin:0 .8em 2em;border:1px solid var(--mist);background:#fff;border-radius:1.2em;padding:.5em .9em;font-size:.66em;color:#9AA6A5;display:flex;justify-content:space-between;align-items:center}
.thread__in i{width:1.5em;height:1.5em;border-radius:50%;background:var(--aqua)}
.bb{max-width:86%;font-size:.84em;line-height:1.36;padding:.65em .9em;border-radius:1.05em}
.bb--m{background:#fff;color:var(--teal);align-self:flex-start;border-bottom-left-radius:.28em;box-shadow:0 1px 3px rgba(18,63,67,.12)}
.bb--p{background:var(--teal);color:#fff;align-self:flex-end;border-bottom-right-radius:.28em}
.typing{align-self:flex-start;display:flex;gap:.25em;background:#fff;border-radius:1em;padding:.7em .85em;box-shadow:0 1px 3px rgba(18,63,67,.12)}
.typing i{width:.42em;height:.42em;border-radius:50%;background:#9AA6A5;animation:blink 1.1s infinite}
.typing i:nth-child(2){animation-delay:.18s}.typing i:nth-child(3){animation-delay:.36s}
.sc.on .typing{animation:pop .4s var(--ease) forwards,hideT .3s 2.05s forwards;animation-delay:calc(var(--d,0)*1s),2.05s}
@keyframes blink{0%,80%,100%{opacity:.3}40%{opacity:1}}
@keyframes hideT{to{opacity:0;height:0;padding:0;margin:-.3em 0}}

/* ───────── scenes (motion preview inside every video slot) ───────── */
.scene{position:relative}
.sc{position:absolute;inset:0;opacity:0;visibility:hidden;transition:opacity .7s var(--ease),visibility 0s linear .7s}
.sc.on{opacity:1;visibility:visible;transition:opacity .7s var(--ease)}
.pop{opacity:0;transform:translateY(12px)}
.sc.on .pop,.jp.on .pop,.in .pop{animation:pop .6s var(--ease) forwards;animation-delay:calc(var(--d,0)*1s)}
@keyframes pop{to{opacity:1;transform:none}}

/* ═══════════════ 1 · hero ═══════════════ */
.hero{position:relative;background:var(--teal);color:#fff;overflow:hidden;padding:84px 0 0}
/* The mark is never cropped: it sits wholly inside its panel with margin (Mo, 2026-10-19).
   The bold move comes from scale and the colour field, not from running it off an edge. */
.hero__bleed{position:absolute;right:2vw;top:2vw;width:30vw;max-width:430px;aspect-ratio:1;color:#fff;opacity:.06;pointer-events:none}
.hero__grid{position:relative;display:grid;grid-template-columns:1.08fr .92fr;gap:40px;align-items:center}
.hero h1{font-family:Manrope,sans-serif;font-weight:800;font-size:clamp(4.2rem,10.5vw,9.4rem);line-height:.86;letter-spacing:-.055em;margin:18px 0 26px}
.hero__lede{font-size:1.3rem;line-height:1.45;color:var(--mint);max-width:30ch}
.hero__jobs{display:flex;flex-wrap:wrap;gap:8px;margin:28px 0 34px;max-width:560px}
.hero__jobs span{display:inline-flex;align-items:center;gap:8px;background:var(--chip);border:1px solid var(--line);border-radius:999px;padding:8px 14px 8px 10px;font-family:Manrope,sans-serif;font-weight:700;font-size:.9rem}
.hero__jobs .ic{color:var(--aqua)}
.hero__act{display:flex;flex-wrap:wrap;gap:12px}
.hero__fine{margin-top:18px;font-size:.92rem;color:var(--muted)}

.hero__stage{position:relative;height:680px}
.phone--hero{--pw:318px;position:absolute;left:50%;top:10px;transform:translateX(-42%) rotate(4deg);animation:float 7s ease-in-out infinite}
@keyframes float{0%,100%{transform:translateX(-42%) rotate(4deg) translateY(0)}50%{transform:translateX(-42%) rotate(3deg) translateY(-12px)}}
.float{position:absolute;background:#fff;color:var(--teal);border-radius:18px;box-shadow:0 30px 60px -20px rgba(4,20,22,.55);z-index:3}
.float--dash{left:-6px;top:128px;padding:14px 16px;width:250px;animation:float2 8s ease-in-out infinite}
@keyframes float2{0%,100%{transform:translateY(0)}50%{transform:translateY(10px)}}
.float__k{display:flex;align-items:center;gap:7px;font-family:Manrope,sans-serif;font-weight:800;font-size:.78rem}
.float__k i{width:8px;height:8px;border-radius:50%;background:var(--aqua)}
.float__n{display:flex;gap:6px;margin-top:10px}
.float__n span{flex:1;background:var(--cream);border-radius:10px;padding:8px 4px;text-align:center;font-size:.64rem;color:var(--meta);line-height:1.15}
.float__n b{display:block;font-family:Manrope,sans-serif;font-weight:800;font-size:1.5rem;color:var(--teal);line-height:1.05}
.float__n .hot{background:var(--blush)}
.float--call{right:-8px;bottom:118px;display:flex;align-items:center;gap:12px;padding:12px 18px 12px 12px;animation:callIn 9s var(--ease) infinite}
@keyframes callIn{0%,8%{opacity:0;transform:translateY(20px) scale(.96)}14%,86%{opacity:1;transform:none}94%,100%{opacity:0;transform:translateY(-8px)}}
.float--call b{display:block;font-family:Manrope,sans-serif;font-size:.95rem}
.float--call em{display:block;font-style:normal;font-size:.76rem;color:var(--meta)}
.float__av{position:relative;width:44px;height:44px;border-radius:50%;background:var(--teal);padding:8px;color:#fff;flex:none}
.float__av svg{width:100%;height:100%;position:relative;z-index:1}
.float__av i{position:absolute;inset:0;border-radius:50%;border:2px solid var(--aqua);animation:ringOut 1.8s ease-out infinite}
.float__av i+i{animation-delay:.9s}
@keyframes ringOut{from{transform:scale(1);opacity:.9}to{transform:scale(1.7);opacity:0}}

.proofbar{position:relative;display:grid;grid-template-columns:repeat(3,auto) 1fr;gap:10px 56px;align-items:end;border-top:1px solid var(--line);margin-top:10px;padding:30px 0 40px}
.proofbar b{display:block;font-family:Manrope,sans-serif;font-weight:800;font-size:clamp(2rem,3.4vw,2.8rem);letter-spacing:-.03em;line-height:1}
.proofbar div>span{font-size:.9rem;color:var(--mint)}
.proofbar p{font-size:.82rem;color:var(--muted);justify-self:end;max-width:26ch;text-align:right}

/* ═══════════════ 1b · lead & referral management ═══════════════
   Added 2026-10-24 with the restructure that leads the page on Marketing Nelva and Referral Nelva
   (Mo, on Bryan's 2026-10-23 request). Deliberately built from the tokens the rest of the page
   already uses — cream field, mint card, teal rules — so it reads as the same site rather than a
   bolted-on band. No new palette values. */
.grow{background:var(--cream);padding:110px 0 100px}
.grow__grid{display:grid;grid-template-columns:1fr 1fr;gap:28px;align-items:start}
.grow__card{background:#fff;border:1px solid var(--mist);border-radius:26px;padding:36px}
.grow__card:nth-child(2){background:var(--mint);border-color:transparent}
.grow__ic{width:52px;height:52px;border-radius:15px;background:var(--teal);color:#fff;display:flex;align-items:center;justify-content:center;margin-bottom:20px}
.grow__ic .ic{width:26px;height:26px}
.grow__h{font-family:Manrope,sans-serif;font-weight:800;font-size:1.85rem;letter-spacing:-.03em;line-height:1.05;color:var(--teal)}
.grow__sub{font-family:Manrope,sans-serif;font-weight:700;color:var(--aquad);margin:4px 0 14px}
.grow__card>p{color:var(--meta)}
.grow__list{display:flex;flex-direction:column;gap:12px;margin-top:22px;padding-top:22px;border-top:1px solid var(--mist)}
.grow__card:nth-child(2) .grow__list{border-top-color:rgba(18,63,67,.14)}
.grow__list li{display:flex;gap:11px;align-items:flex-start;font-size:.96rem;line-height:1.45}
.grow__list .ic{width:19px;height:19px;flex:0 0 19px;margin-top:.18em;color:var(--aquad)}
.grow__avail{max-width:74ch;margin:34px auto 0;text-align:center;color:var(--meta)}
.grow__cta{margin-top:30px}

/* ═══════════════ 2 · the gap ═══════════════ */
.gap{padding:130px 0 110px}
.gap__grid{display:grid;grid-template-columns:1.1fr .9fr;gap:80px;align-items:center}
.gap__time{display:flex;align-items:flex-start;gap:.08em;font-family:Manrope,sans-serif;font-weight:800;font-size:clamp(6rem,15vw,12.5rem);line-height:.82;letter-spacing:-.06em;color:var(--teal);margin:26px 0 22px}
.gap__time .ic{width:.26em;height:.26em;color:var(--coral);margin:.05em .12em 0 0}
.gap__time small{font-size:.28em;letter-spacing:-.02em;margin:.12em 0 0 .12em;color:var(--aquad)}
.gap__big .h2{font-size:clamp(1.6rem,2.7vw,2.25rem);max-width:24ch}
.gap__list{display:flex;flex-direction:column;gap:30px}
.gap__list li{display:flex;gap:18px;align-items:flex-start}
.gap__list h3{font-size:1.2rem}
.gap__list p{color:var(--meta);margin-top:4px}
.gap__next a{display:inline-flex;align-items:center;gap:8px;font-family:Manrope,sans-serif;font-weight:800;color:var(--aquad);margin-left:74px}

/* ═══════════════ 3 · reel ═══════════════ */
.reel{background:var(--ink);color:#fff;padding:110px 0 100px;position:relative}
.reel__hd{display:grid;grid-template-columns:1fr auto;gap:40px;align-items:end;margin-bottom:40px}
.reel__note{max-width:34ch;color:var(--muted);font-size:1rem}
.vslot{position:relative;border-radius:26px;overflow:hidden}
.vslot--reel{background:var(--teal);box-shadow:0 0 0 1px var(--line),0 60px 120px -40px rgba(0,0,0,.6)}
.reel__screen{aspect-ratio:16/9;width:100%}
.vslot__play{position:absolute;right:22px;bottom:22px;z-index:5;display:inline-flex;align-items:center;gap:10px;background:var(--coral);color:var(--ink);font-family:Manrope,sans-serif;font-weight:800;padding:12px 20px 12px 14px;border-radius:999px;box-shadow:0 14px 34px -10px rgba(244,124,107,.7);transition:transform .2s var(--ease)}
.vslot__play:hover{transform:scale(1.04)}
.vslot__play .ic{width:26px;height:26px;background:var(--ink);color:var(--coral);border-radius:50%;padding:6px}
.rs{position:absolute;inset:0;display:grid;grid-template-columns:.95fr 1.05fr;gap:4%;align-items:center;padding:5% 6%}
.rs__k{display:flex;align-items:center;gap:12px;font-family:Manrope,sans-serif;font-weight:800;font-size:clamp(.66rem,1.05vw,.9rem);letter-spacing:.14em;text-transform:uppercase;color:var(--aqua)}
.rs__k .bdg{width:clamp(34px,4vw,50px);height:clamp(34px,4vw,50px)}
.rs__h{font-size:clamp(1.4rem,3.3vw,3rem);line-height:1.02;letter-spacing:-.035em;margin:.45em 0 .35em;color:#fff}
.rs__p{color:var(--mint);font-size:clamp(.8rem,1.35vw,1.15rem);max-width:30ch}
.rs__vis{display:flex;flex-direction:column;justify-content:center}
.rs__vis--chat{gap:12px;font-size:clamp(11px,1.5vw,18px)}
.rs__vis--chat .bb{max-width:90%}
.rlist{display:flex;flex-direction:column;gap:clamp(6px,1vw,12px)}
.rrow{display:grid;grid-template-columns:auto 1fr auto;gap:4px 14px;align-items:center;background:var(--chip);border:1px solid var(--line);border-radius:14px;padding:clamp(8px,1.1vw,14px) clamp(10px,1.4vw,18px);font-size:clamp(.66rem,1.1vw,.95rem)}
.rrow b{font-family:Manrope,sans-serif}
.rrow span{color:var(--muted)}
.rrow em,.jb__sees em,.dt__r em,.chips em{font-style:normal;font-family:Manrope,sans-serif;font-weight:800;font-size:.82em;padding:4px 11px;border-radius:99px;white-space:nowrap;max-width:100%}
em.ok{background:var(--mint);color:var(--teal)}
em.att{background:var(--blush);color:var(--teal);box-shadow:inset 3px 0 0 var(--coral)}
.rrow--lt{background:#fff;border-color:var(--mist);color:var(--teal)}
.rrow--lt span{color:var(--meta)}
.handoff{align-self:flex-start;display:inline-flex;align-items:center;gap:8px;font-family:Manrope,sans-serif;font-weight:800;font-size:.8em;color:var(--ink);background:var(--coral);padding:8px 14px;border-radius:99px}
.checks{display:flex;flex-direction:column;gap:clamp(6px,1vw,12px)}
.checks p{display:flex;align-items:center;gap:12px;background:var(--chip);border:1px solid var(--line);border-radius:14px;padding:clamp(8px,1.1vw,14px) 16px;font-family:Manrope,sans-serif;font-weight:700;font-size:clamp(.7rem,1.15vw,1rem)}
.checks .ic{color:var(--aqua);width:1.4em;height:1.4em}
.checks span{margin-left:auto;font-size:.8em;color:var(--mint);font-weight:800}
.checks__sign{background:var(--aqua)!important;color:var(--ink);border-color:var(--aqua)!important}
.checks__sign .ic,.checks__sign span{color:var(--ink)!important}
.steps3{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(8px,1.2vw,16px)}
.steps3 div{display:flex;flex-direction:column;align-items:flex-start;gap:10px;background:var(--chip);border:1px solid var(--line);border-radius:16px;padding:clamp(10px,1.6vw,20px);font-size:clamp(.7rem,1.1vw,1rem)}
.steps3 .bdg{width:clamp(30px,3.6vw,46px);height:clamp(30px,3.6vw,46px)}
.steps3 b{font-family:Manrope,sans-serif}
.steps3 em{font-style:normal;font-family:Manrope,sans-serif;font-weight:800;font-size:.8em;color:var(--ink);background:var(--aqua);padding:2px 10px;border-radius:99px}
.sc--night{background:var(--ink)}
.wave{display:flex;flex-direction:column;align-items:center;text-align:center;gap:10px;font-size:clamp(.72rem,1.2vw,1.05rem)}
.wave__av{width:clamp(56px,7vw,96px);height:clamp(56px,7vw,96px);border-radius:50%;background:#fff;padding:14%;color:var(--teal);box-shadow:0 0 0 10px rgba(42,183,179,.18),0 0 0 22px rgba(42,183,179,.08)}
.wave__av svg{width:100%;height:100%}
.wave__bars{display:flex;align-items:center;gap:5px;height:48px;margin:10px 0 6px}
.wave__bars i{width:5px;border-radius:4px;background:var(--aqua);height:20%;animation:wave 1.1s ease-in-out infinite}
.wave__bars i:nth-child(3n){animation-delay:.2s}.wave__bars i:nth-child(3n+1){animation-delay:.45s}.wave__bars i:nth-child(4n){animation-delay:.7s}
@keyframes wave{0%,100%{height:18%}50%{height:100%}}
.wave b{font-family:Manrope,sans-serif;font-size:1.15em}
.wave em{font-style:normal;color:var(--muted)}
.sc--end{background:var(--teal);display:flex;align-items:center;justify-content:center}
.endcard{text-align:center;padding:0 8%}
.endcard__lock{width:clamp(170px,26vw,340px);height:auto;aspect-ratio:424.4/100;color:#fff;margin:0 auto 4%}
.endcard h3{font-size:clamp(1.6rem,4.3vw,3.9rem);letter-spacing:-.04em;color:#fff}
.endcard p{color:var(--mint);font-size:clamp(.85rem,1.5vw,1.25rem);margin-top:.5em}
.chaps{display:grid;grid-template-columns:repeat(6,1fr);gap:10px;margin-top:22px}
.chaps button{text-align:left;font-family:Manrope,sans-serif;font-weight:800;font-size:.84rem;color:var(--muted);padding-top:12px;position:relative;transition:color .2s}
.chaps button i{position:absolute;left:0;right:0;top:0;height:3px;border-radius:3px;background:var(--line);overflow:hidden}
.chaps button i::after{content:'';position:absolute;inset:0;background:var(--aqua);transform:scaleX(0);transform-origin:left}
.chaps button.on{color:#fff}
.chaps button.on i::after{animation:fill var(--dur,5.6s) linear forwards}
.chaps button.done i::after{transform:scaleX(1)}
.chaps.paused button.on i::after{animation:none;transform:scaleX(1)}
@keyframes fill{to{transform:scaleX(1)}}

/* ═══════════════ 4 · jobs ═══════════════ */
.jobs__grid{display:grid;grid-template-columns:.92fr 1.08fr;gap:64px;align-items:start}
.jobs__list{display:flex;flex-direction:column;gap:12px}
.jb{background:#fff;border:1px solid var(--mist);border-radius:var(--r);transition:box-shadow .3s,border-color .3s}
.jb.on{border-color:transparent;box-shadow:0 30px 60px -30px rgba(12,43,46,.35),inset 0 0 0 2px var(--aqua)}
.jb__btn{width:100%;display:flex;align-items:center;gap:18px;padding:18px 20px;text-align:left}
.jb__t{flex:1}
.jb__t b{display:block;font-family:Manrope,sans-serif;font-weight:800;font-size:1.18rem;letter-spacing:-.01em}
.jb__t small{display:block;font-size:.9rem;color:var(--meta)}
.jb__chev{color:var(--aquad);transition:transform .3s var(--ease)}
.jb.on .jb__chev{transform:rotate(90deg)}
.jb__more{display:grid;grid-template-rows:0fr;transition:grid-template-rows .45s var(--ease)}
.jb.on .jb__more{grid-template-rows:1fr}
.jb__inner{overflow:hidden;min-height:0}
.jb__inner>p:first-child{padding:0 24px 0 94px;color:var(--meta)}
.jb__inner>:last-child{margin-bottom:0}
.jb__inner>.watch:not([hidden]){padding-bottom:clamp(18px,1.6vw,26px)}
.jb__sees{display:block;padding:16px 24px clamp(20px,1.8vw,26px) 94px;font-family:Manrope,sans-serif;font-weight:800;font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:var(--aquad)}
.jb__seesL{display:block;margin-bottom:10px}
.jb__seesC{display:flex;flex-wrap:wrap;gap:9px 10px}
.jb__sees em{letter-spacing:0;text-transform:none;font-size:.78rem}
.watch{display:inline-flex;align-items:center;gap:8px;margin:14px 0 0 94px;font-family:Manrope,sans-serif;font-weight:800;font-size:.9rem;color:var(--aquad)}
.watch .ic{width:24px;height:24px;background:var(--coral);color:var(--ink);border-radius:50%;padding:6px}
.watch--rev{margin:12px 0 0;color:#fff}

.jobs__stage{position:sticky;top:110px;height:640px;background:var(--mint);border-radius:28px;overflow:hidden}
.jobs__stage::before{content:'';position:absolute;inset:auto -20% -40% auto;width:70%;aspect-ratio:1;border-radius:50%;background:radial-gradient(closest-side,rgba(42,183,179,.18),transparent)}
.jp{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;opacity:0;visibility:hidden;transition:opacity .5s var(--ease),visibility 0s .5s}
.jp.on{opacity:1;visibility:visible;transition:opacity .5s var(--ease)}
.phone--stage{--pw:270px;transform:rotate(-3deg)}
.tag{position:absolute;left:8%;bottom:14%;display:flex;align-items:center;gap:12px;background:#fff;border-radius:16px;padding:12px 18px 12px 12px;box-shadow:0 24px 50px -20px rgba(12,43,46,.45);font-size:.84rem;color:var(--meta)}
.tag b{display:block;font-family:Manrope,sans-serif;font-size:1rem;color:var(--teal)}
.tag .ic{width:40px;height:40px;border-radius:50%;padding:9px}
.tag--att .ic{background:var(--blush);color:var(--corald);box-shadow:inset 0 0 0 2px var(--coral)}
.tag--ok .ic{background:var(--mint);color:var(--aquad);box-shadow:inset 0 0 0 2px var(--aqua)}
.adm{width:86%;background:#fff;border-radius:22px;box-shadow:0 40px 80px -30px rgba(12,43,46,.45);overflow:hidden}
.adm__hd{display:flex;align-items:center;gap:8px;background:var(--teal);color:#fff;padding:14px 18px}
.adm__hd svg{width:24px;height:24px;background:#fff;border-radius:50%;padding:3px;color:var(--teal)}
.adm__hd b{font-family:Manrope,sans-serif}
.adm__hd em{font-style:normal;font-size:.8rem;color:var(--mint)}
.adm__chat{display:flex;flex-direction:column;gap:10px;padding:18px;font-size:15px;border-bottom:1px solid var(--mist)}
.bb--me{align-self:flex-end;background:var(--teal);color:#fff;border-bottom-right-radius:.28em}
.bb--mint{align-self:flex-start;background:var(--mint);color:var(--teal);border-bottom-left-radius:.28em}
.adm__list{padding:14px 18px 20px;display:flex;flex-direction:column;gap:8px}
.adm__lh{font-family:Manrope,sans-serif;font-weight:800;font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:var(--aquad)}
.onb{flex:1;display:flex;flex-direction:column;align-items:center;padding:2.2em 1.4em 0;text-align:center}
.onb__mark{width:3.6em;height:3.6em;color:var(--teal)}
.onb__h{font-family:Manrope,sans-serif;font-weight:800;font-size:1.25em;margin-top:.8em}
.onb__s{color:var(--meta);font-size:.8em}
.onb__steps{width:100%;display:flex;flex-direction:column;gap:.6em;margin-top:1.6em}
.onb__steps p{display:flex;align-items:center;gap:.7em;background:#fff;border-radius:1em;padding:.85em 1em;font-family:Manrope,sans-serif;font-weight:700;font-size:.86em;box-shadow:0 1px 3px rgba(18,63,67,.1)}
.onb__steps .ic{color:var(--aqua);width:1.4em;height:1.4em}
.onb__bar{width:100%;height:.45em;border-radius:1em;background:var(--mist);margin-top:1.4em;overflow:hidden}
.onb__bar i{display:block;height:100%;width:0;background:var(--aqua);border-radius:1em}
.jp.on .onb__bar i{animation:grow 2s .4s var(--ease) forwards}
@keyframes grow{to{width:100%}}

/* ═══════════════ 5 · how ═══════════════ */
.how{background:#fff}
.ways{display:flex;gap:12px}
.way{position:relative;width:170px;background:var(--cream);border:1px solid var(--mist);border-radius:var(--r);padding:26px 14px 18px;display:flex;flex-direction:column;align-items:center;text-align:center;gap:6px}
.way b{font-family:Manrope,sans-serif;font-size:1.05rem;margin-top:6px}
.way>span:last-child{font-size:.86rem;color:var(--meta);line-height:1.3}
.way--hot{background:var(--mint);border-color:#C7E8DC}
.way__tag{position:absolute;top:-11px;left:50%;transform:translateX(-50%);background:var(--coral);color:var(--ink);white-space:nowrap;font-family:Manrope,sans-serif;font-weight:800;font-size:.62rem;letter-spacing:.1em;text-transform:uppercase;padding:4px 10px;border-radius:99px}
.how__grid{display:grid;grid-template-columns:1.25fr .75fr;gap:56px;align-items:center}

.lap{container-type:inline-size}
.lap__lid{background:var(--ink);border-radius:2.4cqw 2.4cqw .6cqw .6cqw;padding:1.6cqw 1.6cqw 1.9cqw;box-shadow:inset 0 0 0 1.5px var(--line)}
.lap__scr{aspect-ratio:16/10;background:var(--cream);border-radius:.5cqw;overflow:hidden;display:flex;font-size:1.28cqw;position:relative}
.lap__base{height:2.3cqw;margin:0 -3.5cqw;background:linear-gradient(#D5DCDA,#AEB9B7);border-radius:0 0 2.2cqw 2.2cqw;position:relative;box-shadow:0 40px 60px -30px rgba(12,43,46,.45)}
.lap__base::before{content:'';position:absolute;left:50%;top:0;transform:translateX(-50%);width:13cqw;height:.8cqw;background:#9DA9A7;border-radius:0 0 .6cqw .6cqw}
.ds{width:17%;flex:none;background:var(--teal);color:#fff;padding:1.6em .7em;display:flex;flex-direction:column;gap:.25em}
.ds__logo{display:flex;align-items:center;gap:.4em;font-family:Manrope,sans-serif;font-weight:800;font-size:1.45em;margin:0 0 .8em .3em}
.ds__logo svg{width:1.1em;height:1.1em;color:#fff}
.ds__i{display:flex;align-items:center;gap:.5em;padding:.45em .55em;border-radius:.4em;color:#DCE9E7;font-size:.95em}
.ds__i .ic{width:1.2em;height:1.2em}
.ds__i.on{background:var(--aqua);color:#fff;font-weight:700}
.dm{flex:1;position:relative;padding:1.6em 1.6em 0;min-width:0}
.dm__h{font-family:Manrope,sans-serif;font-weight:800;font-size:2.3em;line-height:1}
.dm__s{font-size:.95em;color:var(--meta);margin:.2em 0 1em}
.dm__cards{display:grid;grid-template-columns:1fr 1.18fr .82fr;gap:.6em}
.dc{background:#fff;border-radius:.6em;padding:.6em;box-shadow:0 1px 3px rgba(18,63,67,.1)}
.dc__t{display:flex;align-items:center;gap:.4em;font-family:Manrope,sans-serif;font-weight:800;font-size:.8em;line-height:1.15;min-height:2.3em}
.dc__t i{width:.55em;height:.55em;border-radius:50%;background:var(--aqua);flex:none}
.dc__t i.off{background:#C9D2D1}
.dc__s{display:flex;gap:.3em;margin-top:.35em}
.dc__s p{flex:1;background:var(--cream);border-radius:.4em;text-align:center;padding:.4em .1em;font-size:.62em;color:var(--meta);line-height:1.15}
.dc__s b{display:block;font-family:Manrope,sans-serif;font-weight:800;font-size:2.6em;color:var(--teal);line-height:1.05}
.dc__s .hot{background:var(--blush)}
.dc__s .hot b{color:var(--corald)}
.dt{margin-top:.8em;background:#fff;border-radius:.6em;padding:.6em .8em;box-shadow:0 1px 3px rgba(18,63,67,.1)}
.dt__h{font-family:Manrope,sans-serif;font-weight:800;font-size:.92em;margin-bottom:.3em}
.dt__r{display:grid;grid-template-columns:.8fr 1.6fr .7fr 1fr;gap:.4em;padding:.45em .3em;font-size:.8em;align-items:center;border-top:1px solid var(--mist);white-space:nowrap}
.dt__r span{overflow:hidden;text-overflow:ellipsis}
.dt__r--h{font-family:Manrope,sans-serif;font-weight:800;font-size:.6em;letter-spacing:.08em;text-transform:uppercase;color:var(--meta);background:var(--cream);border-top:0;border-radius:.3em}
.dt__r em{justify-self:start;font-size:.9em;padding:.1em .7em}
.dw{position:absolute;right:1.4em;bottom:4.4em;width:40%;background:#fff;border-radius:.8em;overflow:hidden;box-shadow:0 1.2em 2.6em -.6em rgba(12,43,46,.35)}
.dw__h{display:flex;align-items:center;gap:.4em;background:var(--teal);color:#fff;padding:.6em .8em}
.dw__h svg{width:1.4em;height:1.4em;background:#fff;border-radius:50%;padding:.18em;color:var(--teal)}
.dw__h b{font-family:Manrope,sans-serif;font-size:1.05em}
.dw__h em{font-style:normal;font-size:.8em;color:var(--mint)}
.dw__b{padding:.7em .8em .8em;display:flex;flex-direction:column;gap:.5em}
.dw__u{align-self:flex-end;background:var(--teal);color:#fff;border-radius:.7em .7em .2em .7em;padding:.45em .75em;font-size:1em}
.dw__m{align-self:flex-start;background:var(--mint);border-radius:.7em .7em .7em .2em;padding:.5em .75em;font-size:1em;max-width:92%}
.dk{position:absolute;left:1.2em;right:1.2em;bottom:1em;background:#fff;border-radius:.8em;padding:.45em;box-shadow:0 2px 8px rgba(18,63,67,.14)}
.dk__in{display:flex;align-items:center;gap:.5em;background:var(--cream);border-radius:99px;padding:.3em .3em .3em .9em;color:var(--meta);font-size:.9em}
.dk__in .ic{width:1.2em;height:1.2em}
.dk__in span{flex:1}
.dk__in b{width:2.2em;height:2.2em;border-radius:50%;background:var(--teal);color:#fff;display:flex;align-items:center;justify-content:center}
.dk__in b .ic{width:55%;height:55%}

.flow{display:grid;grid-template-columns:140px 70px 1fr;align-items:stretch;row-gap:22px}
.flow__src{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:2px}
.flow__src .bdg{margin-bottom:14px}
.flow__src b{font-family:Manrope,sans-serif;font-size:1rem}
.flow__src>span:last-child{font-size:.82rem;color:var(--meta)}
.flow__br{width:100%;height:100%;overflow:visible}
.flow__br path{fill:none;stroke-width:3;stroke-linecap:round;vector-effect:non-scaling-stroke;stroke-dasharray:220;stroke-dashoffset:220}
.flow__ok{stroke:var(--aqua)}.flow__att{stroke:var(--coral)}
.flow.in .flow__br path{transition:stroke-dashoffset 1.4s var(--ease) .3s;stroke-dashoffset:0}
.flow__outs{display:flex;flex-direction:column;justify-content:center;gap:14px}
.flow__o{display:flex;align-items:flex-start;gap:12px;border-radius:16px;padding:16px}
.flow__o--ok{background:var(--mint)}
.flow__o--att{background:var(--blush)}
.flow__o b{display:block;font-family:Manrope,sans-serif;line-height:1.25}
.flow__o span{font-size:.84rem;color:var(--meta)}
.flow__ic{width:42px;height:42px;flex:none;border-radius:50%;background:#fff;display:flex;align-items:center;justify-content:center;margin-top:1px}
.flow__ic .ic{width:58%;height:58%}
.flow__o--ok .flow__ic{color:var(--aquad);box-shadow:0 0 0 2px var(--aqua)}
.flow__o--att .flow__ic{color:var(--corald);box-shadow:0 0 0 2px var(--coral)}
.chips{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.chips em{background:#fff;color:var(--teal);font-size:.74rem;white-space:normal;max-width:100%;line-height:1.3}
.flow__note{grid-column:1/-1}
.flow>*,.flow__o>div{min-width:0}

/* ═══════════════ 6 · train ═══════════════ */
.train{background:var(--mint)}
.train__grid{display:grid;grid-template-columns:1fr 1fr;gap:72px;align-items:center}
.train .lede{color:var(--meta)}
.train__list{display:flex;flex-direction:column;gap:18px;margin-top:34px}
.train__list li{display:flex;gap:16px;align-items:center}
.train__list .bdg{width:50px;height:50px}
.train__list b{display:block;font-family:Manrope,sans-serif;font-size:1.08rem}
.train__list span:not(.bdg){color:var(--meta);font-size:.98rem}
.vslot--train{background:var(--teal);box-shadow:0 50px 90px -40px rgba(12,43,46,.6)}
.train__screen{aspect-ratio:4/3.3}
.note{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;padding:10%}
.note__k{display:flex;align-items:center;gap:10px;font-family:Manrope,sans-serif;font-weight:800;font-size:.78rem;letter-spacing:.16em;text-transform:uppercase;color:var(--aqua)}
.note__k .ic{width:22px;height:22px}
.note__t{font-family:Manrope,sans-serif;font-weight:800;font-size:clamp(1.4rem,2.6vw,2.2rem);line-height:1.12;letter-spacing:-.025em;color:#fff;background:var(--chip);border:1px solid var(--line);border-radius:20px;padding:26px 28px;margin:18px 0}
.note__ok{display:inline-flex;align-self:flex-start;align-items:center;gap:8px;font-family:Manrope,sans-serif;font-weight:800;font-size:.92rem;color:var(--ink);background:var(--aqua);padding:8px 16px;border-radius:99px}

/* ═══════════════ 7 · day ═══════════════ */
.day__grid{display:grid;grid-template-columns:1.1fr .9fr;gap:64px;align-items:start}
.day__list{position:relative;display:flex;flex-direction:column;gap:4px}
.day__list::before,.day__list::after{content:'';position:absolute;left:131px;top:30px;bottom:30px;width:2px}
.day__list::before{background:repeating-linear-gradient(var(--aqua) 0 6px,transparent 6px 12px);opacity:.45}
.day__list::after{background:var(--aqua);bottom:auto;height:var(--p,0%);max-height:calc(100% - 60px);transition:height .15s linear}
.dy{position:relative;display:grid;grid-template-columns:86px 56px 1fr;gap:16px;align-items:start;padding:14px 0;z-index:1}
.dy time{font-family:Manrope,sans-serif;font-weight:800;font-size:.95rem;color:var(--aquad);text-align:right;padding-top:15px}
.dy .bdg{background:var(--cream);box-shadow:0 0 0 6px var(--cream)}
.dy b{display:block;font-family:Manrope,sans-serif;font-weight:800;font-size:1.12rem;padding-top:6px}
.dy p{color:var(--meta);margin-top:2px}
.dy--night{background:var(--teal);border-radius:22px;margin:10px -18px 0;padding:22px 18px}
.dy--night time{color:var(--aqua)}
.dy--night b{color:#fff}
.dy--night p{color:var(--mint)}
.dy--night .bdg{background:var(--teal);box-shadow:none;color:#fff}
.day__side{position:sticky;top:110px;display:flex;flex-direction:column;align-items:center}
.phone--call{--pw:300px}
.call{background:linear-gradient(180deg,#0E3337 0%,var(--ink) 60%);color:#fff;align-items:center;text-align:center}
.call__k{font-family:Manrope,sans-serif;font-weight:800;font-size:.6em;letter-spacing:.18em;text-transform:uppercase;color:var(--aqua);margin-top:1.4em}
.call__av{position:relative;width:5.2em;height:5.2em;border-radius:50%;background:#fff;padding:.9em;color:var(--teal);margin-top:1.3em}
.call__av svg{position:relative;z-index:1;width:100%;height:100%}
.call__av i{position:absolute;inset:0;border-radius:50%;border:2px solid var(--aqua);animation:ringOut 2.2s ease-out infinite}
.call__av i+i{animation-delay:1.1s}
.call__n{font-family:Manrope,sans-serif;font-weight:800;font-size:1.3em;margin-top:.7em}
.call__s{font-size:.72em;color:var(--muted)}
.call__timer{font-family:Manrope,sans-serif;font-weight:700;font-size:.78em;color:var(--mint);margin-top:.3em;font-variant-numeric:tabular-nums}
.call__cc{flex:1;width:100%;display:flex;flex-direction:column;gap:.55em;padding:1.1em 1em 0;text-align:left;overflow:hidden}
.cc{font-size:.76em;line-height:1.35;padding:.6em .8em;border-radius:.9em;background:rgba(255,255,255,.07);border:1px solid var(--line)}
.cc b{display:block;font-family:Manrope,sans-serif;font-size:.8em;letter-spacing:.08em;text-transform:uppercase;color:var(--aqua);margin-bottom:.15em}
.cc--p b{color:var(--muted)}
.call__ctl{display:grid;grid-template-columns:repeat(4,1fr);gap:.6em;width:100%;padding:1em 1.2em 2.3em}
.call__ctl span{aspect-ratio:1;border-radius:50%;background:rgba(255,255,255,.1);display:flex;align-items:center;justify-content:center}
.call__ctl .ic{width:45%;height:45%}
.call__ctl .end{background:var(--signal)}
.day__cap{text-align:center;margin-top:22px;max-width:30ch}

/* ═══════════════ 8 · phone line ═══════════════ */
.line{padding-top:0}
.line__card{background:#fff;border:1px solid var(--mist);border-radius:28px;padding:44px;display:grid;grid-template-columns:.8fr 2.2fr;gap:40px;align-items:center}
.line__row{display:grid;grid-template-columns:repeat(5,1fr);gap:22px}
.line__row div{display:flex;flex-direction:column;gap:4px}
.line__row .bdg{width:50px;height:50px;margin-bottom:10px}
.line__row b{font-family:Manrope,sans-serif;font-size:1rem;line-height:1.2}
.line__row span:not(.bdg){font-size:.88rem;color:var(--meta);line-height:1.35}

/* ═══════════════ 9 · proof ═══════════════ */
.proof{background:#fff}
.proof__grid{display:grid;grid-template-columns:repeat(12,1fr);gap:16px}
.pf{background:var(--mint);border-radius:22px;padding:30px;display:flex;flex-direction:column;justify-content:flex-end;gap:6px;grid-column:span 3;min-height:220px}
.pf b{font-family:Manrope,sans-serif;font-weight:800;font-size:clamp(2.6rem,4.4vw,3.8rem);letter-spacing:-.04em;line-height:1;white-space:nowrap}
.pf>span{color:var(--meta)}
.pf--wide{grid-column:span 6}
.pf--big{grid-column:span 6;background:var(--teal);color:#fff}
.pf--big b{font-size:clamp(3.6rem,7vw,6.2rem)}
.pf--big>span{color:var(--mint);font-size:1.1rem}
.cost{grid-column:span 6;justify-content:center;background:var(--cream);border-radius:22px;padding:30px;display:flex;flex-direction:column;gap:14px}
.cb__l{display:flex;justify-content:space-between;align-items:baseline;gap:10px;flex-wrap:wrap}
.cb__l b{font-family:Manrope,sans-serif;font-size:1.05rem}
.cb__l span{font-size:.88rem;color:var(--meta)}
.cb__t{height:14px;border-radius:99px;background:#fff;margin-top:6px;overflow:hidden}
.cb__t i{display:block;height:100%;width:0;background:#AEB9B7;border-radius:99px;transition:width 1.6s var(--ease) .2s}
.cb--m .cb__t i{background:var(--aqua)}
.cost.in .cb__t i{width:var(--w)}
.proof__attr{grid-column:1/-1;margin:-4px 0 6px}
.cost__q{font-family:Manrope,sans-serif;font-weight:800;font-size:clamp(1.3rem,2.2vw,1.7rem);line-height:1.25;letter-spacing:-.01em}
.never{grid-column:span 6;background:var(--cream);border-radius:22px;padding:30px}
.never__row{display:flex;flex-wrap:wrap;gap:8px;margin:16px 0 14px}
.never__row span{display:inline-flex;align-items:center;gap:7px;background:#fff;border:1px solid var(--mist);border-radius:99px;padding:8px 14px;font-family:Manrope,sans-serif;font-weight:700;font-size:.92rem}
.never__row .ic{color:var(--corald)}

/* ═══════════════ 10 · demo ═══════════════ */
.demo{background:var(--teal);color:#fff;padding:120px 0;position:relative;overflow:hidden}
.demo__grid{display:grid;grid-template-columns:minmax(0,1.15fr) 460px;gap:56px;align-items:start}
.demo__phone{margin-top:36px}
.ring{display:inline-flex;align-items:center;gap:16px;background:var(--ink);border:1px solid var(--line);border-radius:22px;padding:14px 22px 14px 14px;transition:background .3s,border-color .3s}
.ring__av{position:relative;width:54px;height:54px;border-radius:50%;background:#fff;padding:10px;color:var(--teal);flex:none}
.ring__av svg{position:relative;z-index:1;width:100%;height:100%}
.ring__av i{position:absolute;inset:0;border-radius:50%;border:2px solid var(--aqua);opacity:0}
.ring b{display:block;font-family:Manrope,sans-serif;font-size:1.1rem}
.ring em{display:block;font-style:normal;font-size:.9rem;color:var(--muted)}
.ring.is-ringing{border-color:var(--aqua);animation:shake 1.2s ease-in-out infinite}
.ring.is-ringing .ring__av i{animation:ringOut 1.6s ease-out infinite}
.ring.is-ringing .ring__av i:nth-child(3){animation-delay:.5s}.ring.is-ringing .ring__av i:nth-child(4){animation-delay:1s}
@keyframes shake{0%,100%{transform:rotate(0)}10%{transform:rotate(-1.5deg)}20%{transform:rotate(1.5deg)}30%{transform:rotate(-1deg)}40%{transform:rotate(1deg)}50%{transform:rotate(0)}}
.demo .h2--xl{font-size:clamp(2.2rem,4.2vw,3.6rem)}
.demoform{background:#fff;color:var(--teal);border-radius:26px;padding:34px;display:flex;flex-direction:column;gap:14px;box-shadow:0 60px 100px -40px rgba(0,0,0,.55)}
.demoform__k{display:flex;align-items:center;gap:8px;font-family:Manrope,sans-serif;font-weight:800;font-size:.76rem;letter-spacing:.14em;text-transform:uppercase;color:var(--aquad)}
.demoform label{display:flex;flex-direction:column;gap:6px;font-family:Manrope,sans-serif;font-weight:700;font-size:.9rem}
.demoform input:not([type=checkbox]){font:inherit;font-family:'Source Sans 3',sans-serif;font-weight:400;font-size:1.05rem;padding:14px 16px;border:1.5px solid var(--mist);border-radius:14px;background:var(--cream);color:var(--teal);transition:border-color .2s,background .2s}
.demoform input:focus{outline:none;border-color:var(--aqua);background:#fff}
.demoform input[aria-invalid=true]{border-color:var(--corald)}
.check{flex-direction:row!important;align-items:flex-start;gap:10px!important;font-family:'Source Sans 3',sans-serif!important;font-weight:400!important;font-size:.84rem!important;color:var(--meta)}
.check input{width:20px;height:20px;margin-top:2px;accent-color:var(--aquad);flex:none}
.formnote{font-size:.92rem;min-height:1.3em}
.formnote[data-state=ok]{color:var(--aquad);font-weight:700}
.formnote[data-state=err]{color:var(--corald);font-weight:700}
.demoform__aaoms{font-size:.86rem;color:var(--meta);border-top:1px solid var(--mist);padding-top:14px}
.demoform__aaoms a{color:var(--aquad);font-weight:700;text-decoration:underline}

/* ═══════════════ 11 · pricing ═══════════════ */
.plans{display:grid;grid-template-columns:1.15fr .85fr;gap:20px;align-items:stretch}
.plans__side{display:flex;flex-direction:column;gap:20px}
.plan{background:#fff;border:1px solid var(--mist);border-radius:26px;padding:34px}
.plan h3{font-size:1.25rem}
.plan__price{display:flex;align-items:baseline;gap:4px;margin:10px 0 6px}
.plan__price b{font-family:Manrope,sans-serif;font-weight:800;font-size:4.6rem;letter-spacing:-.05em;line-height:1}
.plan__price span{font-family:Manrope,sans-serif;font-weight:700;font-size:1rem;line-height:1.18;color:var(--mint)}
.plan__price--dark b{font-size:3.4rem}
.plan__price--dark span{color:var(--meta)}
.plan__sub{color:var(--meta);margin-bottom:18px}
.plan--best{background:var(--teal);color:#fff;border-color:transparent;display:flex;flex-direction:column;justify-content:space-between;gap:6px;position:relative;overflow:hidden;box-shadow:0 50px 90px -40px rgba(12,43,46,.6)}
.plan--best .plan__sub{color:var(--mint)}
.plan__tag{display:inline-block;background:var(--aqua);color:var(--ink);font-family:Manrope,sans-serif;font-weight:800;font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;padding:5px 12px;border-radius:99px;margin-bottom:14px}
.plan__jobs{display:grid;grid-template-columns:1fr 1fr;gap:12px 20px;border-top:1px solid var(--line);padding:24px 0}
.plan__jobs li{display:flex;align-items:center;gap:10px;font-size:.98rem}
.plan__jobs .ic{color:var(--aqua);width:22px;height:22px}
.plan--best .btn{margin-top:22px}
.plan__note{text-align:center;font-size:.9rem;color:var(--mint);margin-top:12px}
.plan.is-picked{box-shadow:0 0 0 4px var(--coral),0 50px 90px -40px rgba(12,43,46,.6)}
.offer{background:var(--cream);border:1px solid var(--mist);border-radius:26px;padding:30px;flex:1}
.offer__bar{display:flex;align-items:center;gap:10px;background:var(--coral);color:var(--ink);font-family:Manrope,sans-serif;font-weight:800;padding:13px 16px;border-radius:14px;font-size:1rem}
.offer__steps{display:flex;flex-direction:column;gap:10px;margin:20px 0 18px}
.offer__steps li{display:flex;align-items:center;gap:12px;font-size:.98rem}
.offer__steps i{flex:none;width:26px;height:26px;border-radius:50%;background:var(--aqua);color:var(--ink);font-style:normal;font-family:Manrope,sans-serif;font-weight:800;font-size:.8rem;display:flex;align-items:center;justify-content:center}
.nofric{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:12px}
.nofric span{font-family:Manrope,sans-serif;font-weight:700;font-size:.8rem;color:var(--aquad);border:1px solid #C7E8DC;background:#F1FAF6;border-radius:99px;padding:5px 12px}
.pricing__legal{margin-top:26px;max-width:86ch;margin-left:auto;margin-right:auto}
/* The unlimited claim and the 4,000-minute threshold are one block on purpose. Never split them. */
.unl{background:rgba(255,255,255,.07);border:1px solid var(--line);border-radius:16px;padding:16px 18px;margin:4px 0 6px}
.unl__h{display:flex;align-items:center;gap:10px;font-family:Manrope,sans-serif;font-weight:800;font-size:1.02rem;color:#fff}
.unl__h .ic{color:var(--aqua)}
.unl__p{font-size:.92rem;color:var(--mint);margin-top:6px}
.prov{border-top:1px solid var(--line);padding-top:20px}
.prov__l{display:block;font-family:Manrope,sans-serif;font-weight:800;font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--aqua)}
.prov__row{display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin-top:12px}
.prov__in{display:flex;align-items:center;gap:4px;background:rgba(255,255,255,.08);border:1px solid var(--line);border-radius:999px;padding:4px}
.prov__b{width:38px;height:38px;border-radius:50%;background:rgba(255,255,255,.1);color:#fff;font-family:Manrope,sans-serif;font-weight:800;font-size:1.2rem;line-height:1;display:flex;align-items:center;justify-content:center}
.prov__b:hover{background:var(--aqua);color:var(--ink)}
.prov__in input{width:56px;font:inherit;font-family:Manrope,sans-serif;font-weight:800;font-size:1.25rem;text-align:center;background:transparent;border:0;color:#fff;-moz-appearance:textfield;appearance:textfield}
.prov__in input::-webkit-outer-spin-button,.prov__in input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.prov__out{font-size:.95rem;color:var(--mint)}
.prov__out b{display:block;font-family:Manrope,sans-serif;font-weight:800;font-size:1.9rem;letter-spacing:-.03em;color:#fff;line-height:1.05}
.prov__out em{display:block;font-style:normal;font-size:.86rem;color:var(--muted)}
.plan__out{font-family:Manrope,sans-serif;font-weight:700;font-size:.98rem;color:var(--meta);background:var(--cream);border-radius:12px;padding:10px 14px;margin:0 0 18px}
.plan__out b{color:var(--teal);font-weight:800}
.dep{background:#fff;border:1px solid var(--mist);border-radius:18px;padding:18px;margin-top:20px}
.dep__h{font-family:Manrope,sans-serif;font-weight:800;font-size:1.05rem}
.dep__p{font-size:.94rem;color:var(--meta);margin:6px 0 14px}
.dep__p b{color:var(--teal)}
.plan__sub b{color:inherit;font-family:Manrope,sans-serif}
.offer__price{font-family:Manrope,sans-serif;font-weight:700;font-size:1.05rem;margin-top:16px}
.offer__price b{font-weight:800;font-size:2.6rem;letter-spacing:-.04em;margin-right:4px}
.offer__sub{color:var(--meta);font-size:.95rem;margin-top:4px}
.offer__sub b{color:var(--teal)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.offer.is-picked{box-shadow:0 0 0 4px var(--coral)}
.check a{color:var(--aquad);font-weight:700;text-decoration:underline}

/* ═══════════════ 12 · faq ═══════════════ */
.faq{background:#fff}
.faq__grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:72px;align-items:start}
.faq__grid .btn{margin-top:28px}
.faq__list{display:flex;flex-direction:column}
.faq details{border-bottom:1px solid var(--mist)}
.faq summary{list-style:none;display:flex;justify-content:space-between;align-items:center;gap:20px;padding:22px 0;font-family:Manrope,sans-serif;font-weight:800;font-size:1.12rem;cursor:pointer}
.faq summary::-webkit-details-marker{display:none}
.faq summary .ic{color:var(--aquad);transition:transform .3s var(--ease)}
.faq details[open] summary .ic{transform:rotate(90deg)}
.faq details p{color:var(--meta);padding:0 40px 24px 0;max-width:62ch}

/* ═══════════════ 13 · final + footer ═══════════════ */
.final{position:relative;background:var(--teal);color:#fff;padding:140px 0;overflow:hidden}
.final__bleed{position:absolute;left:3vw;bottom:3vw;width:26vw;max-width:360px;aspect-ratio:1;color:#fff;opacity:.06}
.final__in{position:relative}
.final h2 span{color:var(--aqua)}
.final .hero__act{margin-top:40px}
.foot{background:var(--ink);color:#fff;padding:72px 0 30px}
.foot__grid{display:grid;grid-template-columns:1fr auto;gap:48px}
.foot__tag{font-family:Manrope,sans-serif;font-weight:800;font-size:1.15rem;margin:22px 0 8px}
.foot .fine{max-width:44ch}
.foot__links{display:grid;grid-template-columns:repeat(2,auto);gap:12px 40px;font-family:Manrope,sans-serif;font-weight:700;font-size:.95rem;align-content:start}
.foot__links a:hover{color:var(--aqua)}
.foot__legal{margin-top:56px;padding-top:22px;border-top:1px solid var(--line);font-size:.85rem;color:var(--muted)}
.foot__legal a{text-decoration:underline}

.sticky{position:fixed;left:12px;right:12px;bottom:calc(12px + env(safe-area-inset-bottom));z-index:60;display:none;gap:8px;padding:8px;background:rgba(12,43,46,.94);backdrop-filter:blur(12px);border-radius:999px;box-shadow:0 20px 40px -10px rgba(0,0,0,.5);transform:translateY(140%);transition:transform .4s var(--ease)}
.sticky.show{transform:none}
.sticky .btn{flex:1;padding:13px 14px;font-size:.95rem}
.sticky .btn--solid{background:#fff;color:var(--teal)}

/* welcome.html, terms.html and privacy.html reuse this vocabulary; these were the pieces missing */
.btn--outline{border-color:var(--teal);color:var(--teal);background:transparent}
.btn--outline:hover{background:var(--teal);color:#fff}
.btn--outline.btn--rev{border-color:rgba(255,255,255,.4);color:#fff}
.btn--outline.btn--rev:hover{border-color:#fff;background:rgba(255,255,255,.06);color:#fff}
.lede--dark{color:var(--teal)}
.hero__actions{display:flex;flex-wrap:wrap;gap:12px;margin:30px 0 0}
.hero__ticks{display:flex;flex-direction:column;gap:10px;margin-top:26px;color:var(--mint)}
.hero__ticks li{position:relative;padding-left:28px}
.hero__ticks li::before{content:'';position:absolute;left:2px;top:.5em;width:12px;height:7px;border-left:2.5px solid var(--aqua);border-bottom:2.5px solid var(--aqua);transform:rotate(-45deg)}

.player{border:0;padding:0;background:transparent;width:min(1100px,94vw);margin:auto;overflow:visible}
.player::backdrop{background:rgba(8,26,28,.88);backdrop-filter:blur(6px)}
.player video{width:100%;border-radius:18px;background:#000;aspect-ratio:16/9}
.player__end{position:absolute;inset:0;border-radius:18px;background:rgba(12,43,46,.94);display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:14px;padding:24px;color:#fff}
.player__end[hidden]{display:none}
.player__end h3{font-family:Manrope,sans-serif;font-weight:800;font-size:clamp(20px,3.4vw,38px);line-height:1.12;max-width:18ch;margin:0}
.player__end-act{display:flex;flex-wrap:wrap;gap:12px;justify-content:center;margin-top:6px}
.player__replay{color:var(--muted);text-decoration:underline;font-size:15px;margin-top:4px}
@media (max-width:560px){.player__end{position:static;margin-top:12px}.player__end .btn--lg{padding:12px 18px}}
.player__x{position:absolute;right:-6px;top:-54px;width:44px;height:44px;border-radius:50%;background:#fff;color:var(--teal);display:flex;align-items:center;justify-content:center}

/* ═══════════════ responsive ═══════════════ */
@media (max-width:1120px){
  .nav__links{gap:20px}
  .hero__grid{grid-template-columns:1fr 1fr}
  .line__card{grid-template-columns:1fr}
  .how__grid{grid-template-columns:1fr}
  .flow{max-width:620px}
  .sechd--split{grid-template-columns:1fr}
}
@media (max-width:960px){
  body{font-size:17px}
  .section{padding:88px 0}
  .nav__links,.nav__cta{display:none}
  .nav__menu{display:block}
  .nav.open .nav__links{display:flex;position:absolute;top:72px;left:0;right:0;flex-direction:column;gap:0;background:var(--cream);border-bottom:1px solid var(--mist);padding:8px 28px 18px;margin:0}
  .nav.open .nav__links a{padding:14px 0;border-bottom:1px solid var(--mist);font-size:1.05rem}
  .hero{padding-top:56px}
  .hero__grid{grid-template-columns:1fr}
  .hero__stage{height:560px;margin-top:10px}
  .phone--hero{--pw:270px}
  .float--dash{left:0;top:70px;width:220px}
  .float--call{right:0;bottom:70px}
  .proofbar{grid-template-columns:repeat(3,1fr);gap:18px}
  .proofbar p{grid-column:1/-1;justify-self:start;text-align:left;max-width:none}
  .gap__grid,.jobs__grid,.train__grid,.day__grid,.demo__grid,.plans,.faq__grid{grid-template-columns:minmax(0,1fr);gap:48px}
  .reel__hd{grid-template-columns:1fr;gap:14px}
  .chaps{grid-template-columns:repeat(3,1fr);row-gap:16px}
  .jobs__stage{position:relative;top:0;height:560px;order:-1}
  .day__side{position:relative;top:0}
  .line__row{grid-template-columns:repeat(2,1fr)}
  .proof__grid{grid-template-columns:1fr 1fr}
  .pf,.pf--big,.cost,.never{grid-column:span 2}
  .pf{grid-column:span 1;min-height:170px}
  .sticky{display:flex}
  .foot__grid{grid-template-columns:1fr}
}
@media (max-width:860px){
  .grow__grid{grid-template-columns:1fr}
}
@media (max-width:640px){
  .wrap{padding:0 20px}
  .grow{padding:70px 0 64px}
  .grow__card{padding:26px}
  .grow__h{font-size:1.55rem}
  .bar__in{flex-direction:column;gap:2px;text-align:center;font-size:.76rem}
  .hero h1{font-size:clamp(4rem,21vw,6rem)}
  .hero__lede{font-size:1.15rem}
  .hero__jobs span{font-size:.8rem}
  .hero__act .btn{width:100%}
  .hero__stage{height:500px}
  .phone--hero{--pw:236px}
  .float--dash{width:190px;top:40px}
  .float__n b{font-size:1.2rem}
  .float--call{bottom:40px;padding:10px 14px 10px 10px}
  .float--call em{display:none}
  .proofbar{grid-template-columns:1.3fr 1fr 1fr;gap:14px}
  .proofbar b{font-size:1.5rem;white-space:nowrap}
  .gap__next a{margin-left:0}
  .rs{grid-template-columns:1fr;padding:6% 7%;align-content:center;gap:10px}
  .rs__vis{display:none}
  .sc--night .rs__vis,.sc:first-child .rs__vis{display:flex}
  .sc:first-child .rrow:nth-child(n+3){display:none}
  .reel__screen{aspect-ratio:4/5}
  .rs__h{font-size:1.8rem}
  .rs__p{font-size:.95rem}
  .rrow{font-size:.78rem}
  .endcard h3{font-size:2.2rem}
  .chaps{grid-template-columns:repeat(2,1fr)}
  .jobs__stage{height:470px}
  .phone--stage{--pw:220px}
  .tag{left:5%;bottom:6%;font-size:.76rem}
  .adm{width:92%}
  .jb__inner>p:first-child,.jb__sees{padding-left:20px}
  .watch{margin-left:20px}
  .ways{flex-wrap:wrap}
  .way{flex:1 1 30%;width:auto;padding:24px 8px 14px}
  .flow{grid-template-columns:88px 30px minmax(0,1fr)}
  .flow__src .bdg{width:46px;height:46px;margin-bottom:10px}
  .flow__src b{font-size:.9rem}
  .flow__o{padding:12px;gap:10px}
  .flow__ic{width:34px;height:34px}
  .train__screen{aspect-ratio:1}
  .day__list::before,.day__list::after{left:83px}
  .dy{grid-template-columns:54px 46px 1fr;gap:12px}
  .dy .bdg{width:46px;height:46px}
  .dy time{font-size:.8rem}
  .dy--night{margin:10px -12px 0;padding:18px 12px}
  .phone--call{--pw:260px}
  .line__card{padding:28px 22px}
  .line__row{grid-template-columns:1fr}
  .line__row div{display:grid;grid-template-columns:50px 1fr;column-gap:14px}
  .line__row .bdg{grid-row:span 2;margin:0}
  .proof__grid{grid-template-columns:1fr}
  .pf,.pf--big,.cost,.never{grid-column:auto}
  .demoform{padding:24px}
  .plan{padding:26px}
  .plan__jobs{grid-template-columns:1fr}
  .plan__price b{font-size:3.4rem}
  .prov__row{gap:12px}
  .pricing .h2{font-size:clamp(1.9rem,8.6vw,2.4rem)}
  .final{padding:100px 0}
  .final .btn{width:100%}
  .foot__links{grid-template-columns:1fr}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
  .pop{opacity:1;transform:none}
  .js .rv{opacity:1;transform:none}
}

/* ── Booth 1532 code, on the offer card ─────────────────────────────────────
   The waiver is earned at the booth, so the code sits with the offer. It is typed on a phone, in a
   hall, by someone holding a brochure: the field is thumb-sized, the Apply button cannot shrink,
   and once a code lands the whole block collapses into a single confirmed line (Mo, 2026-09-26).
   Apply is deliberately NOT coral. Coral means "the one action on this screen", which here is
   "Start month to month". */
.code { margin: 20px 0 6px; padding: 16px; border-radius: 16px; background: rgba(18,63,67,.05); border: 1px solid rgba(18,63,67,.1); }
.code__l { display: block; font-family: Manrope, sans-serif; font-weight: 800; font-size: .95rem; margin-bottom: 10px; }
.code__row { display: flex; gap: 10px; align-items: stretch; }
.code__row input {
  flex: 1 1 auto; min-width: 0; font: inherit; font-size: 17px; font-weight: 700; letter-spacing: .12em;
  padding: 0 16px; height: 56px; border: 2px solid rgba(18,63,67,.2); border-radius: 14px;
  background: #fff; color: var(--ink); text-transform: uppercase;
}
.code__row input::placeholder { font-weight: 400; letter-spacing: .04em; color: rgba(18,63,67,.38); }
.code__row input:focus-visible { outline: none; border-color: var(--aquad); box-shadow: 0 0 0 4px rgba(42,183,179,.18); }
.code__go {
  flex: 0 0 auto; height: 56px; padding: 0 26px; border: 0; border-radius: 14px; cursor: pointer;
  background: var(--teal); color: #fff; font-family: Manrope, sans-serif; font-weight: 800; font-size: 1rem;
}
.code__go:hover { background: var(--aquad); }
.code__go:focus-visible { outline: 3px solid var(--aquad); outline-offset: 2px; }
.code__note { font-size: .84rem; line-height: 1.45; margin: 10px 0 0; color: var(--meta); }
.code__note[data-state="err"] { color: var(--corald); font-weight: 600; }
.code__ok { display: flex; align-items: flex-start; gap: 10px; }
.code__ok[hidden] { display: none; }
.code__ok .ic { flex: 0 0 auto; width: 22px; height: 22px; color: var(--aquad); margin-top: 2px; }
.code__ok p { margin: 0; flex: 1 1 auto; }
.code__ok b { display: block; font-family: Manrope, sans-serif; }
.code__ok span { display: block; font-size: .88rem; color: var(--meta); }
.code__change { flex: 0 0 auto; border: 0; background: none; padding: 4px 2px; cursor: pointer;
  font: inherit; font-size: .85rem; font-weight: 700; color: var(--aquad); text-decoration: underline; }
@media (max-width: 420px) {
  .code__row { flex-wrap: wrap; }
  .code__row input, .code__go { width: 100%; }
}

/* ── One action colour ──────────────────────────────────────────────────────
   Coral is the single primary action in view and nothing else (Mo, 2026-09-26). The event tag on
   the offer card reads as a label, and the outline button works on the dark nav as well as cream. */
.offer__bar--tag { background: var(--mint); color: var(--teal); }
.btn--onink { border-color: rgba(255,255,255,.5); color: #fff; }
.btn--onink:hover { background: #fff; color: var(--teal); border-color: #fff; }

/* ── Reservation sheet ──────────────────────────────────────────────────────
   Every money button opens either Stripe or this. Nothing is ever a dead end. */
.rsv { position: fixed; inset: 0; z-index: 60; background: rgba(9,32,35,.55); backdrop-filter: blur(3px);
  display: flex; align-items: flex-end; justify-content: center; padding: 0; }
.rsv[hidden] { display: none; }
.rsv__panel { position: relative; width: 100%; max-width: 480px; max-height: 92vh; overflow-y: auto;
  background: var(--cream); color: var(--ink); border-radius: 22px 22px 0 0;
  padding: 26px 22px calc(26px + env(safe-area-inset-bottom)); box-shadow: 0 -18px 50px rgba(9,32,35,.3); }
.rsv__x { position: absolute; top: 12px; right: 14px; width: 38px; height: 38px; border: 0; border-radius: 50%;
  background: rgba(18,63,67,.07); color: var(--ink); font-size: 24px; line-height: 1; cursor: pointer; }
.rsv__panel h3 { margin: 4px 0 6px; font-size: clamp(21px, 4.4vw, 26px); line-height: 1.2; }
.rsv__sub { margin: 0 0 16px; font-size: 15px; color: rgba(18,63,67,.75); }
.rsv .field { display: block; margin-bottom: 12px; }
.rsv .field span { display: block; font-size: 13px; font-weight: 700; margin-bottom: 6px; }
.rsv .field input { width: 100%; font: inherit; font-size: 16px; padding: 12px 13px; border-radius: 12px;
  border: 1.5px solid rgba(18,63,67,.22); background: #fff; color: var(--ink); }
.rsv .field input:focus-visible { outline: 2px solid var(--aqua); outline-offset: 1px; border-color: transparent; }
.rsv .btn { margin-top: 6px; }
.rsv .formnote { min-height: 20px; margin: 10px 0 2px; font-size: 14px; }
.rsv .formnote[data-state="ok"] { color: #0F7A63; font-weight: 600; }
.rsv .formnote[data-state="err"] { color: #B3261E; }
.rsv .fine { font-size: 12.5px; line-height: 1.5; }
@media (min-width: 640px) {
  .rsv { align-items: center; padding: 24px; }
  .rsv__panel { border-radius: 22px; padding: 30px 28px; }
}
.how{overflow-x:clip}

/* ── The practice calculator, under the plan cards ──────────────────────────
   Quiet by design: it answers "what is this for a practice my size", and it must never look like a
   projection of results. The presets drive the provider stepper, so there is one provider count. */
.calc { margin: 34px auto 0; max-width: 760px; background: #fff; border: 1px solid var(--mist);
  border-radius: 22px; padding: 26px 24px; }
.calc__h { font-family: Manrope, sans-serif; font-weight: 800; letter-spacing: -.03em;
  font-size: clamp(20px, 3.4vw, 26px); margin: 4px 0 18px; }
.calc__presets { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.calc__presets button { font: inherit; text-align: left; cursor: pointer; background: var(--cream);
  border: 1.5px solid rgba(18,63,67,.16); border-radius: 14px; padding: 12px 14px; color: var(--teal); }
.calc__presets button b { display: block; font-family: Manrope, sans-serif; font-weight: 800; font-size: 1rem; }
.calc__presets button span { display: block; font-size: .84rem; color: var(--meta); }
.calc__presets button[aria-pressed="true"] { border-color: transparent; background: var(--mint);
  box-shadow: inset 0 0 0 2px var(--aquad); }
.calc__out { margin: 20px 0 0; display: grid; gap: 1px; background: var(--mist); border-radius: 14px; overflow: hidden; }
.calc__out > div { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 6px 16px;
  background: #fff; padding: 13px 15px; }
.calc__out dt { color: var(--meta); font-size: .94rem; }
.calc__out dd { margin: 0; font-family: Manrope, sans-serif; font-weight: 800; letter-spacing: -.02em; }
.calc__usage { margin-top: 18px; padding-top: 16px; border-top: 1px solid var(--mist); }
.calc__usep { margin: 0 0 8px; }
.calc__bar { height: 8px; border-radius: 99px; background: var(--mint); overflow: hidden; }
.calc__bar i { display: block; height: 100%; background: var(--aquad); }
.calc__fine { margin-top: 16px; }
@media (max-width: 560px) { .calc { padding: 22px 18px; } .calc__presets { grid-template-columns: 1fr; } }

/* ── The practice set-up form, the step after checkout ──────────────────────
   Same field treatment as the reservation sheet, on a page of its own rather than in an overlay. */
.setup { align-self: start; }
.setup__card { background: var(--cream); color: var(--ink); border-radius: 22px; padding: 26px 22px;
  box-shadow: 0 30px 70px -30px rgba(9,32,35,.5); }
.setup__h { font-family: Manrope, sans-serif; font-weight: 800; letter-spacing: -.03em; line-height: 1.12;
  font-size: clamp(22px, 4.4vw, 28px); margin: 4px 0 18px; }
.setup .field { display: block; margin-bottom: 12px; }
.setup .field span { display: block; font-size: 13px; font-weight: 700; margin-bottom: 6px; }
.setup .field input { width: 100%; font: inherit; font-size: 16px; padding: 12px 13px; border-radius: 12px;
  border: 1.5px solid rgba(18,63,67,.22); background: #fff; color: var(--ink); }
.setup .field input:focus-visible { outline: 2px solid var(--aqua); outline-offset: 1px; border-color: transparent; }
.setup__two { display: grid; grid-template-columns: 1fr 1fr; gap: 0 12px; }
.setup__opt { margin: 18px 0 10px; padding-top: 16px; border-top: 1px solid rgba(18,63,67,.14);
  font-size: 13.5px; color: var(--meta); }
.setup .btn { margin-top: 8px; }
.setup .formnote { min-height: 20px; margin: 10px 0 2px; font-size: 14px; }
.setup .fine { font-size: 12.5px; line-height: 1.5; margin-top: 6px; }
@media (max-width: 520px) { .setup__two { grid-template-columns: 1fr; } .setup__card { padding: 22px 18px; } }

/* This page is a form, not the landing hero: the display scale belongs to the latter. */
.hero--setup { padding-top: 56px; }
.hero--setup h1 { font-size: clamp(2.6rem, 6vw, 4.4rem); line-height: .96; letter-spacing: -.04em; margin: 14px 0 20px; }
.hero--setup .hero__grid { align-items: start; }
.hero--setup .lede { max-width: 42ch; }

/* Agency credit in the footer: present, legible, never louder than the client's own legal line. */
.foot__by { margin-top: 6px; font-size: .82rem; color: var(--muted); }
.foot__by a { color: var(--mint); text-decoration: none; border-bottom: 1px solid rgba(255,255,255,.28); }
.foot__by a:hover { border-bottom-color: currentColor; }

/* The same credit on the light pages (privacy, terms, welcome), where mint on cream would not read. */
.credit { margin-top: 18px; font-size: .86rem; color: var(--meta); }
.credit a { color: var(--aquad); text-decoration: underline; text-underline-offset: 2px; }
.credit__wrap { padding-bottom: 40px; }



/* ── Booking, in place of the old call-back form ────────────────────────────
   The Sublogic widget sizes itself through form_embed.js; the card around it keeps the section
   looking like the rest of the page while the iframe loads (Mo, 2026-09-27). */
.booking { background: #fff; border-radius: 22px; padding: 10px 10px 4px; box-shadow: 0 30px 70px -30px rgba(9,32,35,.5); }
.booking iframe { display: block; border-radius: 16px; min-height: 760px; }
.booking__aaoms { margin: 4px 6px 10px; font-size: .84rem; line-height: 1.5; color: var(--meta); }
.booking__aaoms b { color: var(--teal); }
.demo__pts { list-style: none; margin: 18px 0 0; padding: 0; display: grid; gap: 9px; }
.demo__pts li { display: flex; align-items: flex-start; gap: 9px; color: var(--mint); font-size: .96rem; line-height: 1.45; }
.demo__pts .ic { flex: 0 0 auto; width: 19px; height: 19px; color: var(--aqua); margin-top: 2px; }
@media (max-width: 720px) {
  .booking { padding: 6px 6px 2px; border-radius: 18px; }
  .booking iframe { min-height: 820px; }
}


/* ── The announcement bar ───────────────────────────────────────────────────
   Two zones, not three: the message (headline and its footnote together, so they stay a unit) and a
   single button. The earlier version let the footnote escape to full width while the buttons floated
   right, which is what made the negative space read as an accident. Everything is centred by a grid
   that collapses to one column, so it balances at any width instead of at one (Mo, 2026-09-29). */
.bar {
  background: var(--coral); color: var(--ink);
  position: sticky; top: 0; z-index: 60;
  transition: padding .25s ease;
}
.bar[hidden] { display: none; }
.bar__in {
  display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center;
  gap: 14px 32px; padding-top: 14px; padding-bottom: 14px;
}
.bar__msg { min-width: 0; }
.bar__t { margin: 0; font-size: 1rem; line-height: 1.4; color: var(--ink); max-width: 62ch; }
.bar__t b { font-weight: 800; }
.bar__n { margin: 5px 0 0; font-size: .82rem; line-height: 1.45; color: #7A2F25; max-width: 62ch; }
.bar__n[hidden] { display: none; }
.bar__go {
  display: inline-flex; align-items: center; justify-content: center; height: 46px; padding: 0 26px;
  border-radius: 12px; background: var(--ink); color: #fff; text-decoration: none; white-space: nowrap;
  font-family: Manrope, sans-serif; font-weight: 800; font-size: .96rem;
}
.bar__go:hover { background: #061e20; }
.bar__go[hidden] { display: none; }

@media (max-width: 900px) {
  .bar__in { grid-template-columns: 1fr; justify-items: center; text-align: center; gap: 12px; padding-top: 13px; padding-bottom: 13px; }
  .bar__t, .bar__n { max-width: 46ch; }
  .bar__go { width: 100%; max-width: 360px; }
}
@media (max-width: 420px) {
  .bar__t { font-size: .94rem; }
  .bar__n { font-size: .78rem; }
}

/* ── The second door ────────────────────────────────────────────────────────
   Booking is the public path; this is the attendee path, placed where they actually decide rather
   than in the bar three thousand pixels up. It opens and closes on the same flag (Mo, 2026-09-29). */
.demo__now { margin-top: 26px; padding: 22px 24px; border-radius: 18px; background: rgba(255,255,255,.055); border: 1px solid var(--line); }
.demo__now[hidden] { display: none; }
.demo__now-k { margin: 0 0 4px; font-family: Manrope, sans-serif; font-weight: 800; font-size: .74rem; letter-spacing: .12em; text-transform: uppercase; color: var(--aqua); }
.demo__now-t { margin: 0 0 8px; font-family: Manrope, sans-serif; font-weight: 800; font-size: 1.5rem; line-height: 1.15; color: #fff; }
.demo__now-b { margin: 0 0 16px; font-size: .95rem; line-height: 1.55; color: var(--muted); max-width: 46ch; }
.demo__now-go {
  display: inline-flex; align-items: center; gap: 9px; height: 48px; padding: 0 24px; border-radius: 12px;
  background: var(--coral); color: var(--ink); text-decoration: none;
  font-family: Manrope, sans-serif; font-weight: 800; font-size: .98rem;
}
.demo__now-go:hover { background: #ff8e7d; }
.demo__now-go .ic { width: 17px; height: 17px; }
@media (max-width: 980px) {
  .demo__grid { grid-template-columns: 1fr; gap: 34px; }
  .demo__now { margin-top: 20px; }
}


/* ── The loop beside the form ───────────────────────────────────────────────
   Mint was correct by the palette and wrong on the page: against the dark card it read as a label
   rather than the thing to press. During the show the live demo owns the action colour, so it takes
   coral like every other primary (Mo, 2026-09-29). */
.demo__loop { position: relative; margin: 26px 0 0; border-radius: 18px; overflow: hidden; background: var(--ink); border: 1px solid var(--line); }
.demo__loop-v { display: block; width: 100%; height: auto; }
.demo__loop-btn {
  position: absolute; right: 12px; bottom: 12px; display: inline-flex; align-items: center; gap: 8px;
  height: 40px; padding: 0 16px; border: 0; border-radius: 10px; cursor: pointer;
  background: rgba(12,43,46,.82); color: #fff; backdrop-filter: blur(6px);
  font-family: Manrope, sans-serif; font-weight: 700; font-size: .85rem;
}
.demo__loop-btn:hover { background: var(--ink); }
.demo__loop-btn .ic { width: 15px; height: 15px; }


/* ── The bar, stuck ─────────────────────────────────────────────────────────
   It has to survive scrolling, because an attendee who is three sections down is exactly the person
   who still needs the live demo. Full height while the hero is in view, then it collapses to a
   single line so it costs 56px instead of 97 for the rest of the page. The nav sits directly under
   it, offset by the bar's measured height, so the two never overlap (Mo, 2026-09-29). */
.bar.is-tight { padding: 0; }
.bar.is-tight .bar__in { padding-top: 7px; padding-bottom: 7px; grid-template-columns: minmax(0, 1fr) auto; text-align: left; justify-items: stretch; }
.bar.is-tight .bar__n { display: none; }
.bar.is-tight .bar__t { font-size: .92rem; }
.bar.is-tight .bar__go { height: 38px; padding: 0 18px; font-size: .88rem; }

/* On a phone the bottom sticky bar already carries this action, so the top bar scrolls away rather
   than eating a third of a small screen with a duplicate. */
@media (max-width: 760px) {
  .bar { position: static; }
  .nav { top: 0; }
}

/* ── 2026-10-13, after AAOMS ──
   The headline is the name and the line: "Nelva. The practice liaison system for oral surgery."
   The name keeps the display size; the line sits under it at a readable size. */
.hero h1 .h1__tag{display:block;margin-top:.32em;font-size:clamp(1.35rem,2.6vw,2.1rem);line-height:1.15;letter-spacing:-.02em;font-weight:700;max-width:20ch;color:var(--mint, #DDF4EC)}
.pricing__demo{margin-top:30px}
[data-waiver][hidden],[data-waiver-code][hidden]{display:none!important}