/* GYC public site. Hand-written, no framework. Sections are in page order.
   Rules for motion: every animation/transition sits inside
   @media (prefers-reduced-motion: no-preference); the default rendering is the complete still page.
   Elements that JS animates are only hidden under @media (scripting: enabled). No inline styles (CSP). */

@font-face{font-family:"Bricolage Grotesque";src:url(/fonts/bricolage-grotesque-latin-wght-normal.woff2) format("woff2");font-weight:200 800;font-style:normal;font-display:swap}

:root{
  color-scheme:light;
  --display:"Bricolage Grotesque",ui-rounded,"Avenir Next","Segoe UI",system-ui,sans-serif;
  --body:ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",sans-serif;
  --paper:#f4f0e6;--paper-2:#ebe5d4;--card:#fffdf6;
  --ink:#0e2a2f;--muted:#44595c;--line:#d9d2bf;
  --green:#1b7a55;--green-ink:#0a3d2a;--on-green:#ffffff;--mint:#cdeadb;
  --sun:#ffc94d;--sun-soft:#fde9b0;--coral:#e0492c;--coral-soft:#fbd9d0;
  --shadow:0 1px 0 #fff8 inset,0 24px 60px -24px #0e2a2f44,0 2px 6px #0e2a2f14;
  --gut:20px;--ease:cubic-bezier(.2,.8,.2,1);--ease-io:cubic-bezier(.65,0,.25,1);
  --radius:28px;
}
@media (prefers-color-scheme:dark){
  :root{
    color-scheme:dark;
    --paper:#0b1d21;--paper-2:#11292e;--card:#152f35;
    --ink:#eef5ee;--muted:#a9c1be;--line:#2b474c;
    --green:#7ddba8;--green-ink:#0a2a1e;--on-green:#08261a;--mint:#1f4a3b;
    --sun:#ffd166;--sun-soft:#4a3d17;--coral:#ff8468;--coral-soft:#4a2620;
    --shadow:0 24px 60px -24px #000a,0 2px 6px #0006;
  }
}
@media (min-width:760px){:root{--gut:40px}}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:84px}
body{margin:0;background:var(--paper);color:var(--ink);font:400 1.0625rem/1.55 var(--body);overflow-x:clip;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
img,svg{display:block;max-width:100%}
h1,h2,h3,p,ul,ol{margin:0}
ul,ol{padding:0;list-style:none}
button{font:inherit;color:inherit;cursor:pointer}
a{color:inherit}
:focus-visible{outline:3px solid var(--green);outline-offset:3px;border-radius:6px}
.wrap{width:min(1240px,100% - var(--gut)*2);margin-inline:auto}
.skip{position:absolute;left:12px;top:-60px;z-index:100;padding:10px 16px;border-radius:10px;background:var(--ink);color:var(--paper);font-weight:700;text-decoration:none}
.skip:focus{top:12px}

.mqs,.dstage,.ty-stage,.src-panels,.avl,.rcs,.faq-list,.hero-grid,.av-grid,.pros-grid,.trust-grid,.two,.ty,.steps-grid,.faq-grid,.know,.money,.stay,.believe{grid-template-columns:minmax(0,1fr)}

/* ---------- type ---------- */
.h1,.h2,.cl-h,.sl,h3{overflow-wrap:break-word}
:lang(de) :is(.h1,.h2,.sl,h3){hyphens:auto;-webkit-hyphens:auto}
.h1,.h2,.cl-h{font-family:var(--display);font-weight:800;letter-spacing:-.04em;text-wrap:balance}
.h1{font-size:clamp(3.1rem,1rem + 7.4vw,6.4rem);line-height:.92}
.h2{font-size:clamp(2rem,1rem + 3.5vw,3.9rem);line-height:1.02}
.h2-wide{max-width:22ch}
h3{font-family:var(--display);font-weight:700;letter-spacing:-.02em}
.lead{font-size:clamp(1.15rem,1rem + .7vw,1.5rem);line-height:1.4;max-width:30ch;font-weight:500}
.lead-sm{font-size:clamp(1.05rem,1rem + .3vw,1.22rem);line-height:1.55;color:var(--muted);max-width:54ch;margin-top:18px}
.eyebrow{display:inline-flex;align-items:center;gap:10px;margin-bottom:18px;font:700 .8rem/1 var(--display);letter-spacing:.14em;text-transform:uppercase;color:var(--green)}
.eyebrow::before{content:"";width:26px;height:2px;background:currentColor;border-radius:2px}
.note-sm{margin-top:28px;color:var(--muted);font-size:.95rem}
.stop{color:var(--green)}
.mark{background:linear-gradient(var(--sun),var(--sun)) no-repeat 0 88%/100% .26em;-webkit-box-decoration-break:clone;box-decoration-break:clone;padding-inline:.04em}
:lang(de) .hero-home .h1{font-size:clamp(2.5rem,1rem + 5.6vw,5.4rem)}

/* ---------- header / footer ---------- */
.top{position:relative;z-index:50;border-bottom:1px solid transparent}
.top-in{display:grid;grid-template-columns:1fr auto;grid-template-areas:"brand lang" "nav nav";align-items:center;gap:6px 12px;padding:10px 0 4px}
.brand{display:inline-flex;align-items:center;gap:10px;text-decoration:none;font:800 1.02rem var(--display);letter-spacing:-.03em;white-space:nowrap;min-height:44px}
.top-in .brand{grid-area:brand}
.brand img{width:34px;height:34px;border-radius:10px;transition:transform .4s var(--ease)}
.brand:hover img{transform:rotate(-8deg)}
.nav{grid-area:nav;display:grid;grid-template-columns:repeat(3,auto);justify-content:space-between;border-top:1px solid var(--line)}
.nav a{display:grid;place-items:center;min-height:44px;padding:0 6px;text-decoration:none;font:650 .95rem var(--display);color:var(--muted);position:relative}
.nav a[aria-current=page]{color:var(--ink)}
.nav a[aria-current=page]::after{content:"";position:absolute;left:6px;right:6px;bottom:6px;height:3px;border-radius:3px;background:var(--sun)}
.lang{grid-area:lang;position:relative;justify-self:end}
.lang summary{display:inline-flex;align-items:center;gap:7px;min-height:44px;padding:0 12px 0 13px;border:1px solid var(--line);border-radius:999px;background:var(--card);font:750 .82rem var(--display);letter-spacing:.06em;cursor:pointer;list-style:none;user-select:none;transition:border-color .2s,background-color .2s}
.lang summary::-webkit-details-marker{display:none}
.lang summary:hover,.lang[open] summary{border-color:var(--ink)}
.lang .ic-globe{color:var(--green)}
.lang .ic-chev{transition:transform .3s var(--ease)}
.lang[open] .ic-chev{transform:rotate(180deg)}
.lang-menu{position:absolute;right:0;top:calc(100% + 8px);z-index:60;min-width:210px;padding:6px;border-radius:20px;border:1px solid var(--line);background:var(--card);box-shadow:0 24px 50px -18px #0e2a2f55,0 2px 6px #0e2a2f14}
.lang-menu a{display:flex;align-items:center;justify-content:space-between;gap:18px;min-height:44px;padding:0 14px;border-radius:14px;text-decoration:none;font:650 .98rem var(--display)}
.lang-menu a b{font:750 .72rem var(--display);letter-spacing:.1em;color:var(--muted)}
.lang-menu a:hover{background:var(--paper-2)}
.lang-menu a[aria-current=page]{background:var(--ink);color:var(--paper)}
.lang-menu a[aria-current=page] b{color:var(--sun)}
@media (min-width:860px){
  .top{position:sticky;top:0;background:color-mix(in srgb,var(--paper) 84%,transparent);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}
  .top-in{grid-template-columns:1fr auto 1fr;grid-template-areas:"brand nav lang";padding:10px 0}
  .nav{border:0;gap:6px}.nav a{padding:0 16px;border-radius:999px}
  .nav a:hover{background:var(--paper-2);color:var(--ink)}
  .nav a[aria-current=page]::after{left:16px;right:16px;bottom:7px}
}
.foot{padding:48px 0 calc(40px + env(safe-area-inset-bottom));border-top:1px solid var(--line);background:var(--paper)}
.foot-in{display:grid;gap:22px}
.foot-nav{display:flex;flex-wrap:wrap;gap:6px 22px}.foot-nav a{min-height:44px;display:inline-flex;align-items:center;font-weight:600;text-decoration:none;color:var(--muted)}
.foot-nav a:hover{color:var(--ink)}
.foot-note{color:var(--muted);font-size:.9rem}
@media (min-width:860px){.foot-in{grid-template-columns:auto 1fr;align-items:center}.foot-nav{justify-content:flex-end}.foot-note{grid-column:1/-1}}

/* ---------- buttons, pill ---------- */
.cta-row{display:flex;flex-wrap:wrap;gap:12px;margin-top:30px}
.btn,.btn-ghost{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:54px;padding:0 26px;border-radius:999px;font:700 1rem var(--display);text-decoration:none;border:2px solid var(--ink);transition:transform .3s var(--ease),background-color .25s,color .25s}
.btn{background:var(--ink);color:var(--paper)}
.btn-ghost{background:transparent;color:var(--ink)}
.btn:hover{transform:translateY(-2px)}.btn-ghost:hover{background:var(--ink);color:var(--paper)}
.btn .ic,.btn-ghost .ic{transition:transform .3s var(--ease)}
.btn:hover .ic,.btn-ghost:hover .ic{transform:translate(2px,-2px)}
.btn-alt{background:var(--green);border-color:var(--green);color:var(--on-green)}
.pill{display:inline-flex;align-items:center;gap:10px;margin-bottom:22px;padding:9px 18px 9px 14px;border-radius:999px;background:var(--ink);color:var(--paper);font:700 .98rem/1 var(--display);letter-spacing:.01em}
.pill-dot{width:10px;height:10px;border-radius:50%;background:var(--sun);box-shadow:0 0 0 0 var(--sun)}

/* ---------- hero ---------- */
.hero{padding:clamp(28px,5vw,64px) 0 clamp(48px,7vw,96px);position:relative}
.hero-grid{display:grid;gap:36px;align-items:start}
.eyebrow-hero{display:none}
.h1-l{display:inline-block}
.hero .lead{margin-top:22px}
@media (max-width:480px){.btn,.btn-ghost{padding:0 20px;min-height:52px;font-size:.96rem}}
@media (min-width:1120px){
  .hero-grid{grid-template-columns:minmax(0,1fr) minmax(0,540px);gap:56px;align-items:center}
  .hero{padding-top:clamp(32px,4.5vw,72px)}
  .eyebrow-hero{display:inline-flex}
  .hero-home .pill{margin-bottom:14px}
}
.hero-sub .h1{font-size:clamp(2.6rem,1rem + 5vw,5rem)}
.hero-sub .eyebrow-hero{display:inline-flex}
.hero-about .lead{max-width:40ch}
@media (min-width:1120px){.pg-home .eyebrow-hero{display:none}}

/* ---------- hero demo ---------- */
.demo{width:100%;max-width:560px;justify-self:start;padding:14px;border-radius:var(--radius);border:1px solid var(--line);background:var(--card);box-shadow:var(--shadow);position:relative}
@media (min-width:600px){.demo{padding:18px}}
.demo-top{display:flex;align-items:center;gap:10px;margin-bottom:12px}
.demo-brand{display:inline-flex;align-items:center;gap:8px;font:800 1rem var(--display);letter-spacing:-.02em}
.demo-brand img{width:24px;height:24px;border-radius:7px}
.demo-tag{margin-left:auto;padding:5px 10px;border-radius:999px;background:var(--sun-soft);font:700 .72rem var(--display);letter-spacing:.1em;text-transform:uppercase;color:var(--ink)}
.demo-pause{display:none;place-items:center;width:40px;height:40px;border-radius:50%;border:1px solid var(--line);background:transparent}
.demo-pause .p-off{display:none}.demo-pause[aria-pressed=true] .p-on{display:none}.demo-pause[aria-pressed=true] .p-off{display:block}
@media (scripting:enabled) and (prefers-reduced-motion:no-preference){.demo-pause{display:grid}}
.dq{display:flex;gap:10px;align-items:flex-start;min-height:4.1rem;padding:14px 16px;border-radius:16px;background:var(--paper);border:1px solid var(--line)}
.dq .ic{flex:none;margin-top:2px;color:var(--green)}
.dq-text{font:600 1.12rem/1.3 var(--display);letter-spacing:-.01em}
.dchips{display:flex;gap:6px;margin:12px -14px 0;padding:2px 14px;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch;scroll-snap-type:x proximity}
.dchips::-webkit-scrollbar{display:none}
@media (min-width:600px){.dchips{margin-inline:-18px;padding-inline:18px}}
.dchip{flex:none;scroll-snap-align:start;min-height:42px;padding:0 15px;border-radius:999px;border:1px solid var(--line);background:transparent;font:650 .88rem var(--display);white-space:nowrap;transition:background-color .2s,color .2s,border-color .2s}
.dchip:hover{border-color:var(--ink)}
.dchip[aria-selected=true]{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.dstage{position:relative;display:grid;margin-top:14px}
.scn{grid-area:1/1;position:relative;visibility:hidden;opacity:0}
.scn.is-on{visibility:visible;opacity:1}
.tags{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:10px}
.tags li{display:inline-flex;align-items:center;min-height:28px;padding:0 11px;border-radius:999px;background:var(--paper-2);font:650 .8rem var(--display)}
.tags li:first-child{background:var(--mint);color:var(--green-ink)}
.sum{margin-bottom:10px;font-size:.84rem;color:var(--muted);font-weight:500}
.rcs{display:grid;gap:8px}
.rc{display:grid;grid-template-columns:auto minmax(0,1fr) auto;grid-template-areas:"m main kind" "slots slots slots";gap:8px 10px;align-items:center;padding:11px 12px;border:1px solid var(--line);border-radius:16px;background:var(--card);transition:border-color .3s,opacity .3s}
.rc .mono{grid-area:m}.rc-main{grid-area:main;display:grid;min-width:0}.kind{grid-area:kind}.slots{grid-area:slots}
.rc-main strong{font:700 .98rem var(--display);letter-spacing:-.01em}
.rc-main span{font-size:.82rem;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mono{display:inline-grid;place-items:center;width:36px;height:36px;border-radius:50%;background:var(--mint);color:var(--green-ink);font:800 .95rem var(--display)}
.mono.big{width:56px;height:56px;font-size:1.4rem}
.kind{justify-self:end;padding:4px 9px;border-radius:999px;font:700 .7rem/1.2 var(--display);letter-spacing:.02em;background:var(--mint);color:var(--green-ink);white-space:nowrap}
.k-window .kind{background:var(--sun-soft);color:var(--ink)}
.k-ampm .kind{background:#d9e4fb;color:#1c2f63}
.k-visit .kind{background:var(--mint)}
.k-quote .kind{background:var(--paper-2);color:var(--ink)}
.k-asap .kind{background:var(--coral-soft);color:var(--coral)}
@media (prefers-color-scheme:dark){.k-ampm .kind{background:#22315f;color:#d9e4fb}}
.slots{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.day{margin-right:2px;font-size:.78rem;font-weight:700;color:var(--muted)}
.slot{min-height:40px;padding:0 13px;border-radius:11px;border:1.5px solid var(--green);background:transparent;color:var(--green);font:700 .9rem var(--display);font-variant-numeric:tabular-nums;transition:background-color .2s,color .2s,transform .2s var(--ease)}
.slot:hover{background:var(--mint);color:var(--green-ink)}
.slot.picked{background:var(--green);color:var(--on-green);border-color:var(--green)}
.k-asap .slot{border-color:var(--coral);color:var(--coral)}.k-asap .slot:hover{background:var(--coral-soft);color:var(--coral)}
.k-quote .slot{border-style:dashed;border-color:var(--ink);color:var(--ink)}
.ok{position:absolute;inset:-4px;display:grid;align-content:center;justify-items:center;gap:6px;padding:16px;text-align:center;border-radius:18px;background:var(--card);visibility:hidden;opacity:0}
.scn.t4 .ok{visibility:visible;opacity:1}
.ok-ic{display:grid;place-items:center;width:56px;height:56px;border-radius:50%;background:var(--green);color:var(--on-green)}
.ic-check .draw{stroke-dasharray:24;stroke-dashoffset:0}
.ok strong{font:800 1.5rem/1.1 var(--display);letter-spacing:-.03em}
.ok-line{font:650 1rem var(--display)}
.ok p{max-width:30ch;font-size:.92rem;color:var(--muted)}
.ok small{font:700 .7rem var(--display);letter-spacing:.12em;text-transform:uppercase;color:var(--green)}
.again{min-height:42px;margin-top:4px;padding:0 18px;border-radius:999px;border:1.5px solid var(--ink);background:transparent;font:700 .9rem var(--display)}
.again:hover{background:var(--ink);color:var(--paper)}
.demo-note{margin-top:12px;font-size:.78rem;color:var(--muted)}
.scn.t3 .rc:not(.has-pick){opacity:.45}
.rc.has-pick{border-color:var(--green)}

/* typed caret */
.dq-text.typing::after{content:"";display:inline-block;width:2px;height:1.05em;margin-left:2px;vertical-align:-.16em;background:var(--green)}

/* ---------- story: the old way collapses ---------- */
.story{position:relative;height:auto;--p:1}
.story-pin{position:relative;overflow:clip;padding:72px 0 88px;display:grid;gap:36px;justify-items:center;background:var(--paper-2);border-block:1px solid var(--line)}
.story-lines{display:grid;gap:8px;text-align:center;padding-inline:var(--gut)}
.sl{font-family:var(--display);font-weight:800;letter-spacing:-.04em;line-height:1;text-wrap:balance}
.sl-a{font-size:clamp(1.9rem,1rem + 3.6vw,3.8rem)}
.sl-b{font-size:clamp(1.9rem,1rem + 3.6vw,3.8rem);color:var(--green)}
.chaos{display:flex;flex-wrap:wrap;gap:12px;justify-content:center;padding-inline:var(--gut);max-width:920px}
.note{--r:0;display:flex;flex-direction:column;gap:4px;padding:12px 14px;border-radius:14px;background:var(--card);border:1px solid var(--line);box-shadow:0 10px 26px -14px #0e2a2f66;font-size:.88rem;line-height:1.25;width:min(230px,44vw);transform:rotate(calc(var(--r)*1deg))}
.note b{font:700 .95rem var(--display)}
.note small{color:var(--muted);font-size:.78rem}
.note .ic{color:var(--muted)}
.n-search{flex-direction:row;flex-wrap:wrap;align-items:center;gap:8px;border-radius:999px;padding:11px 16px}
.n-search span{font-weight:600;flex:1 1 auto}.n-search small{flex-basis:100%;padding-left:28px;margin-top:-4px}
.n-call{background:#20282b;color:#fff;border-color:#20282b}.n-call small{color:#ffb4a6}
.n-call .rec{width:10px;height:10px;border-radius:50%;background:#ff5a45}
.n-vm .wave{display:flex;gap:3px;align-items:center;height:22px}
.n-vm .wave i{width:4px;border-radius:2px;background:var(--ink);opacity:.55;height:40%}
.n-vm .wave i:nth-child(2n){height:80%}.n-vm .wave i:nth-child(3n){height:55%}.n-vm .wave i:nth-child(5){height:100%}
.n-sticky{background:#ffe27a;border-color:#e9c84a;color:#3a2f00;border-radius:4px}
.n-sticky b{font-size:1.5rem}.n-sticky small{color:#6a5a10}
.n-form i{display:block;height:8px;border-radius:4px;background:var(--paper-2)}
.n-form i+i{width:70%}
.n-form .send{margin-top:4px;padding:5px 10px;border-radius:8px;background:var(--ink);color:var(--paper);font-weight:650;font-size:.78rem;align-self:flex-start}
.n-chat{background:#d8f7c7;border-color:#b7e5a0;color:#13331a;border-radius:16px 16px 4px 16px;font-weight:550}
.n-chat.n-in{background:var(--card);color:var(--ink);border-radius:16px 16px 16px 4px}
.n-mail{flex-direction:row;gap:10px;align-items:center}
.n-mail div{display:grid}
.clean{display:grid;gap:14px;justify-items:center;padding-inline:var(--gut);width:100%}
.cc{width:min(420px,100%);padding:18px;border-radius:24px;background:var(--card);border:1px solid var(--line);box-shadow:var(--shadow)}
.cc-said{font:700 1.3rem/1.2 var(--display);letter-spacing:-.02em;margin-bottom:14px}
.cc-res{display:flex;align-items:center;gap:12px;padding:12px;border-radius:16px;background:var(--paper)}
.cc-res div{display:grid;flex:1;min-width:0}.cc-res strong{font:700 1rem var(--display)}.cc-res div span{color:var(--muted);font-size:.88rem}
.cc-ok{display:inline-flex;align-items:center;gap:6px;padding:7px 12px 7px 9px;border-radius:999px;background:var(--green);color:var(--on-green);font:700 .85rem var(--display)}
.cc-ok .ic{width:16px;height:16px}
.cc-strap{font:800 clamp(1.4rem,1rem + 1.4vw,2rem) var(--display);letter-spacing:-.03em}

/* pinned, scroll-driven version (JS sets --p from 0 to 1) */
@media (scripting:enabled) and (prefers-reduced-motion:no-preference){
  .story{height:340vh;height:340svh;--p:0}
  .story-pin{position:sticky;top:0;height:100vh;height:100svh;padding:0;display:block;
    --c:clamp(0,(var(--p) - .48)*3.8,1);--k:clamp(0,(var(--p) - .7)*6,1);--tx:50;--ty:54}
  .story-lines{position:absolute;inset:clamp(84px,14svh,140px) 0 auto;display:block;padding-inline:var(--gut)}
  .sl{position:absolute;inset:0 var(--gut) auto;margin-inline:auto;max-width:18ch}
  .sl-a{opacity:clamp(0,1 - (var(--p) - .5)*12,1)}
  .sl-b{top:clamp(0px,12svh,110px);opacity:clamp(0,(var(--p) - .6)*10,1);transform:translateY(calc((1 - clamp(0,(var(--p) - .62)*10,1))*18px))}
  .chaos{position:absolute;inset:0;display:block;max-width:none;padding:0}
  .note{--a:clamp(0,(var(--p) - var(--d))*14,1);position:absolute;left:calc(var(--lx)*1%);top:calc(var(--ly)*1%);width:min(236px,44vw);
    opacity:calc(var(--a)*(1 - var(--c)));will-change:transform,opacity;
    transform:translate(-50%,-50%) translate(calc((var(--tx) - var(--lx))*1vw*var(--c)),calc((var(--ty) - var(--ly))*1vh*var(--c))) rotate(calc(var(--r)*1deg*(1 - var(--c)))) scale(calc((.82 + .18*var(--a))*(1 - .5*var(--c))))}
  .n1{--lx:16;--ly:42;--r:-4;--d:-.04}.n2{--lx:84;--ly:47;--r:5;--d:.01}.n3{--lx:31;--ly:79;--r:-3;--d:.07}.n4{--lx:68;--ly:82;--r:6;--d:.13}
  .n5{--lx:10;--ly:68;--r:3;--d:.19}.n6{--lx:90;--ly:66;--r:-5;--d:.25}.n7{--lx:50;--ly:90;--r:2;--d:.31}.n8{--lx:85;--ly:26;--r:-2;--d:.37}
  .clean{position:absolute;left:0;right:0;top:calc(var(--ty)*1%);transform:translateY(-50%);width:auto;opacity:var(--k)}
  .cc{transform:translateY(calc((1 - var(--k))*28px)) scale(calc(.9 + .1*var(--k)))}
  .cc-strap{opacity:clamp(0,(var(--p) - .86)*10,1)}
  @media (max-width:760px){
    .story{height:320vh;height:320svh}
    .story-lines{inset:clamp(72px,11svh,110px) 0 auto}
    .note{width:min(176px,46vw);font-size:.8rem;padding:10px 12px}
    .n-sticky b{font-size:1.2rem}
    .n1{--lx:30;--ly:33}.n2{--lx:72;--ly:40}.n3{--lx:27;--ly:48}.n4{--lx:75;--ly:56}.n5{--lx:28;--ly:65}.n6{--lx:72;--ly:73}.n7{--lx:32;--ly:82}.n8{--lx:70;--ly:90}
    .story-pin{--ty:54}
  }
}

/* ---------- sections ---------- */
.sec{padding:clamp(72px,10vw,136px) 0}
.sec-head{max-width:760px;margin-bottom:clamp(32px,5vw,56px)}
.two{display:grid;gap:28px}
@media (min-width:900px){.two{grid-template-columns:1fr 1fr;gap:64px;align-items:center}.two-rev{grid-template-columns:1fr 1fr}}

/* availability */
.av-grid{display:grid;gap:36px;align-items:center}
@media (min-width:980px){.av-grid{grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:72px}}
.av{padding:16px;border-radius:var(--radius);border:1px solid var(--line);background:var(--card);box-shadow:var(--shadow)}
@media (min-width:600px){.av{padding:22px}}
.seg{position:relative;display:inline-grid;grid-template-columns:1fr 1fr;padding:4px;border-radius:999px;background:var(--paper-2);isolation:isolate}
.seg button{position:relative;z-index:1;min-height:44px;min-width:128px;padding:0 18px;border:0;background:transparent;border-radius:999px;font:700 .95rem var(--display);color:var(--muted);transition:color .3s}
.seg button[aria-pressed=true]{color:var(--paper)}
.seg-thumb{position:absolute;z-index:0;top:4px;bottom:4px;left:4px;width:calc(50% - 4px);border-radius:999px;background:var(--ink)}
.av[data-mode=gyc] .seg-thumb{transform:translateX(100%)}
@media (scripting:none){.seg{display:none}}
.axis{display:flex;justify-content:space-between;margin:14px 0 4px;padding-left:calc(36px + 12px);font:700 .7rem var(--display);letter-spacing:.08em;color:var(--muted)}
.avl{display:grid;gap:4px}
.avr{display:grid;grid-template-columns:auto minmax(0,1fr) auto;grid-template-areas:"m main state" "tl tl tl";gap:10px 12px;align-items:center;padding:12px 0;border-top:1px solid var(--line)}
.avr .mono{grid-area:m}.avr-main{grid-area:main;display:grid;min-width:0}.avr-state{grid-area:state;display:grid}.tl{grid-area:tl}
.avr-main strong{font:700 1rem var(--display)}.avr-main span{font-size:.84rem;color:var(--muted)}
.st{grid-area:1/1;justify-self:end;display:inline-flex;align-items:center;gap:8px;white-space:nowrap}
.st-gyc b{padding:7px 12px;border-radius:999px;background:var(--green);color:var(--on-green);font:700 .86rem var(--display)}
.callchip{display:inline-flex;align-items:center;gap:6px;min-height:34px;padding:0 12px;border-radius:999px;border:1.5px solid var(--line);font:650 .82rem var(--display);color:var(--muted)}
.st-dir em{font-style:normal;font-size:.78rem;color:var(--muted);display:none}
@media (min-width:600px){.st-dir em{display:inline}}
.tl{position:relative;height:10px;margin-left:calc(36px + 12px);border-radius:6px;background:repeating-linear-gradient(90deg,var(--paper-2) 0 calc(100%/24 - 2px),transparent calc(100%/24 - 2px) calc(100%/24))}
.tl .b{position:absolute;top:0;bottom:0;border-radius:6px;background:var(--green);transform-origin:left center}
.av[data-mode=dir] .st-gyc,.av[data-mode=dir] .tl .b,.av[data-mode=dir] .axis{opacity:0}
.av[data-mode=gyc] .st-dir{opacity:0;visibility:hidden}
.av[data-mode=dir] .st-gyc{visibility:hidden}
.av[data-mode=dir] .tl .b{transform:scaleX(0)}
.av-cap{margin-top:12px;font-size:.78rem;color:var(--muted)}
@media (scripting:none){.st-dir{display:none}}

/* ways to book */
.sec-types{background:var(--paper)}
.ty{display:grid;gap:18px}
@media (min-width:900px){.ty{grid-template-columns:300px minmax(0,1fr);gap:40px;align-items:start}}
.ty-tabs{display:flex;gap:6px;margin-inline:calc(var(--gut)*-1);padding:2px var(--gut);overflow-x:auto;scrollbar-width:none;scroll-snap-type:x proximity}
.ty-tabs::-webkit-scrollbar{display:none}
.ty-tab{flex:none;scroll-snap-align:start;display:inline-flex;align-items:center;gap:10px;min-height:48px;padding:0 18px 0 14px;border-radius:999px;border:1.5px solid var(--line);background:transparent;font:700 .98rem var(--display);white-space:nowrap;transition:background-color .25s,color .25s,border-color .25s}
.ty-n{font-size:.72rem;letter-spacing:.08em;color:var(--green)}
.ty-tab:hover{border-color:var(--ink)}
.ty-tab[aria-selected=true]{background:var(--ink);border-color:var(--ink);color:var(--paper)}
.ty-tab[aria-selected=true] .ty-n{color:var(--sun)}
@media (min-width:900px){
  .ty-tabs{flex-direction:column;margin:0;padding:0;overflow:visible}
  .ty-tab{border-radius:18px;min-height:62px;font-size:1.15rem;justify-content:flex-start}
}
.ty-stage{display:grid}
.ty-panel{grid-area:1/1;visibility:hidden;opacity:0;display:grid;gap:22px;align-content:start}
.ty-panel.is-on{visibility:visible;opacity:1}
.ty-viz{position:relative;min-height:clamp(260px,42vw,340px);padding:22px 0;display:grid;place-items:center;border-radius:var(--radius);background:var(--paper-2);overflow:hidden}
.ty-copy h3{font-size:clamp(1.6rem,1rem + 1.6vw,2.3rem);line-height:1.05}
.ty-line{margin-top:10px;font-size:1.2rem;font-weight:550}
.ty-eg{margin-top:12px;color:var(--muted)}.ty-eg span{font-weight:700;color:var(--green)}
.vz{display:grid;justify-items:center;gap:12px;width:100%;padding:0 16px}
.vz-h{font:700 .9rem var(--display);letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.vz-label{font:700 1.05rem var(--display)}
.vz-fixed ul{display:grid;gap:7px;width:min(220px,100%)}
.vz-fixed li{display:flex;align-items:center;min-height:40px;padding:0 16px;border-radius:12px;border:1.5px solid var(--line);background:var(--card);font:650 1rem var(--display);font-variant-numeric:tabular-nums}
.vz-fixed li.x{opacity:.5;text-decoration:line-through;background:repeating-linear-gradient(135deg,transparent 0 6px,var(--line) 6px 7px)}
.vz-fixed li.sel{background:var(--green);border-color:var(--green);color:var(--on-green)}
.vz-tag{display:inline-flex;align-items:center;gap:6px;padding:7px 14px 7px 10px;border-radius:999px;background:var(--ink);color:var(--paper);font:700 .88rem var(--display)}
.vz-tag .ic{width:16px;height:16px;color:var(--sun)}
.vz-track{position:relative;width:280px;max-width:100%;height:96px}
.vz-ticks{position:absolute;inset:auto 0 0;display:flex;justify-content:space-between;font:700 .75rem var(--display);color:var(--muted);border-top:2px solid var(--line);padding-top:6px}
.vz-band{position:absolute;left:93px;width:94px;top:8px;height:46px;border-radius:10px;background:repeating-linear-gradient(135deg,var(--sun) 0 7px,var(--sun-soft) 7px 14px);border:2px solid var(--sun)}
.vz-van{position:absolute;left:0;top:23px;width:18px;height:18px;border-radius:50%;background:var(--ink);box-shadow:0 0 0 5px color-mix(in srgb,var(--ink) 18%,transparent);translate:118px 0}
.vz-ampm .vz-halves{display:flex;gap:12px}
.half{display:grid;justify-items:center;gap:8px;width:132px;padding:22px 10px;border-radius:22px;border:2px solid var(--line);background:var(--card);font:700 1rem var(--display)}
.half.am{background:var(--sun);border-color:var(--sun);color:#0e2a2f}
.vz-visit,.vz-quote{grid-auto-flow:row;gap:0;justify-items:center}
.vstep,.q-req,.q-ans{display:grid;gap:4px;width:min(250px,100%);padding:14px 16px;border-radius:18px;background:var(--card);border:2px solid var(--green)}
.vstep b,.q-req b,.q-ans b{font:800 1.05rem var(--display)}
.vstep span{font-size:.88rem;color:var(--muted)}
.vstep.a{position:relative}.vstep.a .ic{position:absolute;right:12px;top:12px;color:var(--green)}
.vstep.b{border-style:dashed;border-color:var(--muted)}
.vlink{display:block;width:0;height:26px;border-left:3px dashed var(--muted);transform-origin:top}
.q-req i,.q-ans i{display:block;height:8px;border-radius:4px;background:var(--paper-2)}.q-req i+i,.q-ans i+i{width:65%}
.q-req .photo{display:block;width:100%;height:46px;border-radius:10px;background:linear-gradient(135deg,var(--paper-2),var(--line))}
.q-req{border-color:var(--muted);border-style:solid}
.q-ans .btn{justify-self:start;display:inline-flex;margin-top:4px;padding:6px 14px;border-radius:999px;background:var(--green);color:var(--on-green);font:700 .85rem var(--display)}
.vz-asap{position:relative;height:100%;align-content:center}
.ring{position:absolute;left:50%;top:44%;width:110px;height:110px;margin:-55px 0 0 -55px;border-radius:50%;border:2px solid var(--coral);opacity:.35}
.r2{width:170px;height:170px;margin:-85px 0 0 -85px;opacity:.22}.r3{width:230px;height:230px;margin:-115px 0 0 -115px;opacity:.12}
.core{position:relative;display:grid;place-items:center;width:92px;height:92px;border-radius:50%;background:var(--coral);color:#fff;font:800 1.2rem var(--display)}
.vz-asap .vz-label{position:relative;margin-top:30px}

/* breadth */
.sec-breadth{padding-bottom:clamp(56px,8vw,110px);overflow:clip;background:var(--paper-2)}
.mqs{display:grid;gap:clamp(12px,2vw,26px);margin-top:clamp(28px,4vw,52px)}
.mq{overflow:clip}
.mq-tag{margin:0;padding-left:max(var(--gut),calc((100% - 1240px)/2));font:700 .78rem var(--display);letter-spacing:.14em;text-transform:uppercase;color:var(--green)}
.mq-track{display:flex;width:max-content;padding-left:max(var(--gut),calc((100vw - 1240px)/2))}
.mq-set{display:flex;align-items:center;gap:clamp(18px,3vw,44px);padding-right:clamp(18px,3vw,44px)}
.mq-w{font:800 clamp(2.8rem,1rem + 8vw,8rem)/1.05 var(--display);letter-spacing:-.045em;white-space:nowrap}
.mq-w:nth-of-type(2n){color:transparent;-webkit-text-stroke:2px var(--ink)}
.mq-sep{flex:none;width:clamp(10px,1.4vw,18px);height:clamp(10px,1.4vw,18px);border-radius:50%;background:var(--green)}
.mq-dup{display:none}
@media (scripting:enabled) and (prefers-reduced-motion:no-preference){
  .mq-dup{display:flex}
  .mq-track{will-change:transform}
  .mq[data-dir="-1"] .mq-track{transform:translate3d(calc(var(--sx,.5)*-22vw),0,0)}
  .mq[data-dir="1"] .mq-track{transform:translate3d(calc((var(--sx,.5) - 1)*22vw),0,0)}
}
@media (scripting:none),(prefers-reduced-motion:reduce){.mq-track{width:auto;flex-wrap:wrap}.mq-set{flex-wrap:wrap}}

/* professionals */
.sec-pros{--paper:#0b1d21;--paper-2:#12292f;--card:#163138;--ink:#f1f6ef;--muted:#a9c2bf;--line:#2c4b51;--green:#7ddba8;--green-ink:#08261a;--on-green:#08261a;--mint:#1f4a3b;--shadow:0 24px 60px -24px #000a;background:var(--paper);color:var(--ink)}
@media (prefers-color-scheme:dark){.sec-pros{--paper:#0f2b2d;--paper-2:#153639;--card:#1a4044}}
.pros-grid{display:grid;gap:44px;align-items:start}
@media (min-width:980px){.pros-grid{grid-template-columns:minmax(0,1fr) minmax(0,540px);gap:72px}}
.sec-pros .eyebrow{color:var(--sun)}
.pts{display:grid;gap:22px;margin:34px 0}
.pts li{padding-left:22px;border-left:3px solid var(--sun)}
.pts h3{font-size:1.25rem}.pts p{margin-top:4px;color:var(--muted);max-width:46ch}
.sec-pros .btn-ghost{border-color:var(--ink)}
.src{padding:14px;border-radius:var(--radius);border:1px solid var(--line);background:var(--card);box-shadow:var(--shadow);width:100%;max-width:560px;justify-self:start;color:var(--ink);--paper:#0b1d21;--paper-2:#12292f;--card:#163138;--ink:#f1f6ef;--muted:#a9c2bf;--line:#2c4b51;--green:#7ddba8;--green-ink:#08261a;--on-green:#08261a;--mint:#1f4a3b}
.hero-pros .src{--paper:#0b1d21;--paper-2:#12292f;--card:#163138;background:var(--card)}
@media (min-width:600px){.src{padding:20px}}
.src-tabs{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;margin:0 -14px;padding:2px 14px}
.src-tabs::-webkit-scrollbar{display:none}
@media (min-width:600px){.src-tabs{margin-inline:-20px;padding-inline:20px}}
.src-tab{flex:none;min-height:44px;padding:0 16px;border-radius:999px;border:1.5px solid var(--line);background:transparent;font:700 .92rem var(--display);white-space:nowrap;transition:background-color .25s,color .25s,border-color .25s}
.src-tab:hover{border-color:var(--ink)}
.src-tab[aria-selected=true]{background:var(--sun);border-color:var(--sun);color:#0e2a2f}
.lbl{margin:18px 0 8px;font:700 .72rem var(--display);letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.src-panels{display:grid}
.src-panel{grid-area:1/1;visibility:hidden;opacity:0;display:grid;gap:14px;align-content:start}
.src-panel.is-on{visibility:visible;opacity:1}
.src-text{min-height:4.6em;color:var(--ink);font-size:1rem}
.src-in{min-height:0}
.paper{position:relative;padding:14px 16px 14px 56px;border-radius:14px;background:#fbf3d3;color:#2c2a1e;font:1.15rem/2rem "Bradley Hand","Segoe Print","Noteworthy","Chalkboard SE",ui-rounded,cursive;background-image:repeating-linear-gradient(transparent 0 calc(2rem - 1px),#9fb6d9 calc(2rem - 1px) 2rem);background-position:0 14px;transform:rotate(-1deg);box-shadow:0 14px 30px -16px #000c}
.paper::before{content:"";position:absolute;left:40px;top:0;bottom:0;width:2px;background:#e6827a}
.paper li{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;height:2rem}
.paper li.free{color:#0a5a3a;font-weight:700}
.paper li.free::after{content:" ✓";color:#0a8a54}
.cal{padding:12px;border-radius:14px;background:#fbfaf4;color:#0e2a2f}
.cal-h{display:grid;grid-template-columns:repeat(5,1fr);gap:4px;margin-bottom:6px;font:700 .72rem var(--display);letter-spacing:.08em;text-transform:uppercase;color:#52666a;text-align:center}
.cal-grid{display:grid;grid-template-columns:repeat(5,1fr);grid-auto-rows:20px;gap:4px;min-height:160px;background:repeating-linear-gradient(transparent 0 23px,#e6e2d2 23px 24px)}
.ev{display:block;border-radius:6px;background:#9ab8e6}.ev.alt{background:#f0c36a}
.gc1{grid-column:1}.gc2{grid-column:2}.gc3{grid-column:3}.gc4{grid-column:4}.gc5{grid-column:5}
.gr1{grid-row-start:1}.gr2{grid-row-start:2}.gr3{grid-row-start:3}.gr5{grid-row-start:5}.gr6{grid-row-start:6}
.gs2{grid-row-end:span 2}.gs3{grid-row-end:span 3}
.fresh{display:grid;gap:8px}
.fresh li{display:flex;align-items:center;justify-content:space-between;padding:6px 14px;border-radius:14px;background:var(--paper-2);border:1px solid var(--line)}
.fresh b{font:700 1rem var(--display)}
.chip{display:inline-flex;align-items:center;gap:6px;min-height:32px;padding:0 12px;border-radius:999px;background:var(--mint);color:var(--ink);font:650 .85rem var(--display);font-variant-numeric:tabular-nums}
.chip.off{background:transparent;border:1.5px dashed var(--line);color:var(--muted)}
.src-arrow{display:flex;justify-content:center;height:40px;margin:2px 0}
.src-arrow i{position:relative;display:block;width:3px;height:100%;border-radius:2px;background:var(--sun)}
.src-arrow i::after{content:"";position:absolute;left:50%;bottom:-2px;width:14px;height:14px;margin-left:-8px;border-right:3px solid var(--sun);border-bottom:3px solid var(--sun);transform:rotate(45deg)}
.week{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:6px}
@media (min-width:480px){.week{gap:8px}}
.wk-c{display:grid;gap:6px}
.wk-c b{text-align:center;font:700 .74rem var(--display);letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.pl{display:grid;place-items:center;min-height:38px;border-radius:10px;border:1.5px dashed var(--line);font:650 .76rem var(--display);font-variant-numeric:tabular-nums;color:var(--muted)}
.pl.on{border:1.5px solid var(--green);background:var(--green);color:var(--on-green)}

/* trust */
.trust-grid{display:grid;gap:44px;align-items:center}
@media (min-width:980px){.trust-grid{grid-template-columns:minmax(0,1fr) minmax(0,460px);gap:88px}}
.tr-list{display:grid;gap:22px;margin-top:34px}
.tr-list li{display:grid;grid-template-columns:auto 1fr;gap:16px}
.tick{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:var(--mint);color:var(--green-ink)}
.tick .ic{width:18px;height:18px}
.tr-list h3{font-size:1.2rem}.tr-list p{color:var(--muted);margin-top:2px}
.prof{position:relative;display:grid;gap:20px;padding:26px;border-radius:var(--radius);background:var(--card);border:1px solid var(--line);box-shadow:var(--shadow);transform:rotate(1.6deg)}
.ill-tag{position:absolute;right:16px;top:-13px;padding:6px 12px;border-radius:999px;background:var(--sun);color:#0e2a2f;font:700 .72rem var(--display);letter-spacing:.1em;text-transform:uppercase}
.prof-head{display:flex;gap:14px;align-items:center}.prof-head div{display:grid}.prof-head strong{font:800 1.3rem var(--display)}.prof-head span:not(.mono){color:var(--muted);font-size:.9rem}
.sk{display:grid;gap:8px}
.sk b{display:inline-flex;align-items:center;gap:6px;font:700 .78rem var(--display);letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.sk i{display:block;height:10px;border-radius:5px;background:var(--paper-2)}
.sk i.w60{width:60%}.sk i.w80{width:80%}
.chips{display:flex;gap:6px}.chips span{width:58px;height:34px;border-radius:10px;border:1.5px solid var(--green);background:var(--mint)}

/* closing */
.closing{padding:clamp(80px,12vw,170px) 0;background:var(--sun);color:#0e2a2f;text-align:left;overflow:clip}
.cl-h{font-size:clamp(3.2rem,0.8rem + 11.4vw,11rem);line-height:.88;letter-spacing:-.055em;max-width:12ch}
.connected{position:relative;display:inline-block}
.connected .stop{color:#0e2a2f}
.cl-lead{margin-top:26px;font-size:clamp(1.15rem,1rem + .8vw,1.6rem);font-weight:600;max-width:32ch}
.closing .btn{background:#0e2a2f;border-color:#0e2a2f;color:#f4f0e6}
.closing .btn-alt{background:transparent;color:#0e2a2f}
.closing .btn-alt:hover{background:#0e2a2f;color:#f4f0e6}

/* faq / steps / sub pages */
.faq-grid{display:grid;gap:30px}
@media (min-width:900px){.faq-grid{grid-template-columns:minmax(0,.7fr) minmax(0,1.3fr);gap:64px}}
.faq{border-top:1px solid var(--line)}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{display:flex;justify-content:space-between;align-items:center;gap:16px;min-height:64px;padding:14px 0;cursor:pointer;list-style:none;font:700 1.15rem/1.25 var(--display);letter-spacing:-.01em}
.faq summary::-webkit-details-marker{display:none}
.pm{flex:none;position:relative;width:22px;height:22px}
.pm::before,.pm::after{content:"";position:absolute;left:3px;right:3px;top:10px;height:2px;border-radius:2px;background:var(--green);transition:transform .3s var(--ease)}
.pm::after{transform:rotate(90deg)}
details[open] .pm::after{transform:rotate(0)}
.faq p{padding:0 0 22px;color:var(--muted);max-width:60ch}
.steps-grid{display:grid;gap:36px}
@media (min-width:900px){.steps-grid{grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:72px}.sec-steps .sec-head{position:sticky;top:110px;align-self:start}}
.steps{position:relative;display:grid;gap:34px;padding-left:0;--p:1}
.steps li{display:grid;grid-template-columns:auto 1fr;gap:18px;position:relative;padding-bottom:4px}
.num{display:grid;place-items:center;flex:none;width:52px;height:52px;border-radius:50%;background:var(--ink);color:var(--paper);font:800 1rem var(--display);position:relative;z-index:1}
.steps li:not(:last-child)::before{content:"";position:absolute;left:25px;top:52px;bottom:-34px;width:2px;background:var(--line)}
.steps li:not(:last-child)::after{content:"";position:absolute;left:25px;top:52px;bottom:-34px;width:2px;background:var(--green);transform-origin:top}
.steps h3{font-size:1.45rem;line-height:1.1}.steps p{margin-top:6px;color:var(--muted);max-width:44ch}
.sec-know{background:var(--mint);color:var(--green-ink)}
@media (prefers-color-scheme:dark){.sec-know{color:var(--ink)}}
.know{display:grid;gap:24px}
.know .lead-sm{color:inherit;opacity:.88;margin-top:0}.know .eyebrow{color:inherit}
@media (min-width:900px){.know{grid-template-columns:1fr 1fr;gap:64px;align-items:end}}
.ctl{position:relative;padding:26px 22px 22px;border-radius:var(--radius);background:var(--card);border:1px solid var(--line);box-shadow:var(--shadow)}
.ctl-rows{display:grid;gap:4px}
.ctl-rows li{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:14px 0;border-bottom:1px solid var(--line)}
.ctl-rows div{display:grid}.ctl-rows b{font:700 1.05rem var(--display)}.ctl-rows span{color:var(--muted);font-size:.88rem}
.tog{position:relative;flex:none;width:52px;height:30px;border-radius:999px;background:var(--line)}
.tog::after{content:"";position:absolute;top:3px;left:3px;width:24px;height:24px;border-radius:50%;background:#fff;box-shadow:0 2px 4px #0003}
.tog.on{background:var(--green)}.tog.on::after{transform:translateX(22px)}
.ctl-meta{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px}
.flow{display:grid;gap:0}
.flow li{display:flex;align-items:center;gap:16px;padding:18px 20px;border-radius:20px;background:var(--card);border:1px solid var(--line);position:relative}
.flow li+li{margin-top:22px}
.flow li+li::before{content:"";position:absolute;left:39px;top:-22px;height:22px;border-left:3px dashed var(--green)}
.node{display:grid;place-items:center;width:40px;height:40px;border-radius:50%;background:var(--green);color:var(--on-green);font:800 1rem var(--display)}
.flow b{font:700 1.15rem var(--display)}
.money{display:grid;gap:22px}
@media (min-width:900px){.money{grid-template-columns:1fr 1fr;gap:64px;align-items:start}.money .lead-sm{margin-top:0}}
.sec-money{background:var(--paper-2)}
.stay{display:grid;gap:26px;margin-top:40px}
@media (min-width:800px){.stay{grid-template-columns:repeat(3,1fr);gap:34px}}
.stay li{padding-top:18px;border-top:3px solid var(--ink)}
.stay h3{font-size:1.4rem}.stay p{margin-top:6px;color:var(--muted)}
.sec-believe{background:var(--paper-2)}
.believe{display:grid;gap:30px;margin-top:40px}
@media (min-width:800px){.believe{grid-template-columns:repeat(3,1fr);gap:40px}}
.believe li{display:grid;gap:8px;align-content:start;padding-top:18px;border-top:3px solid var(--green)}
.believe .num{width:44px;height:44px;font-size:.9rem;margin-bottom:8px}
.believe h3{font-size:1.4rem}.believe p{color:var(--muted)}
.nf{display:grid;gap:18px;align-content:center;justify-items:start;min-height:100svh;width:min(640px,100% - 40px);margin:0 auto;padding:40px 0}

/* ---------- motion (only with no reduced-motion preference) ---------- */
@media (prefers-reduced-motion:no-preference){
  @keyframes pulse{0%{box-shadow:0 0 0 0 color-mix(in srgb,var(--sun) 70%,transparent)}70%,100%{box-shadow:0 0 0 12px transparent}}
  @keyframes blink{50%{opacity:0}}
  @keyframes ring{0%{transform:scale(.6);opacity:.5}100%{transform:scale(1.25);opacity:0}}
  @keyframes drive{0%,10%{translate:0 0}55%,100%{translate:118px 0}}
  @keyframes drawline{from{transform:scaleY(0)}to{transform:scaleY(1)}}
  @keyframes drawx{from{transform:scaleX(0)}to{transform:scaleX(1)}}
  @keyframes pop{0%{opacity:0;transform:translateY(8px) scale(.9)}100%{opacity:1;transform:none}}
  @keyframes amA{0%,42%{background:var(--sun);border-color:var(--sun);color:#0e2a2f}50%,100%{background:var(--card);border-color:var(--line);color:var(--ink)}}
  @keyframes pmA{0%,42%{background:var(--card);border-color:var(--line);color:var(--ink)}50%,100%{background:var(--ink);border-color:var(--ink);color:var(--paper)}}
  @keyframes drawck{from{stroke-dashoffset:24}to{stroke-dashoffset:0}}
  @keyframes stamp{0%{transform:scale(.4);opacity:0}60%{transform:scale(1.12);opacity:1}100%{transform:scale(1)}}
  @keyframes swipe{from{transform:rotate(-1.2deg) scaleX(0)}to{transform:rotate(-1.2deg) scaleX(1)}}
  @keyframes rise{from{transform:translateY(22px);opacity:0}to{transform:none;opacity:1}}

  .pill-dot{animation:pulse 2.2s ease-out infinite}
  @keyframes menuin{from{opacity:0;transform:translateY(-6px) scale(.97)}to{opacity:1;transform:none}}
  .lang[open] .lang-menu{animation:menuin .28s var(--ease) both;transform-origin:top right}
  .lang-menu li{animation:rise2 .35s var(--ease) both}.lang-menu li:nth-child(2){animation-delay:.03s}.lang-menu li:nth-child(3){animation-delay:.06s}.lang-menu li:nth-child(4){animation-delay:.09s}.lang-menu li:nth-child(5){animation-delay:.12s}.lang-menu li:nth-child(6){animation-delay:.15s}
  @keyframes hl{from{background-size:0 .26em}to{background-size:100% .26em}}
  .mark{animation:hl .9s .5s var(--ease-io) both}
  .hero-copy>*{animation:rise .8s var(--ease) both}
  .hero-copy>:nth-child(2){animation-delay:.06s}.hero-copy>:nth-child(3){animation-delay:.12s}.hero-copy>:nth-child(4){animation-delay:.2s}.hero-copy>:nth-child(5){animation-delay:.28s}
  .demo{animation:rise .9s .15s var(--ease) both}
  .dq-text.typing::after{animation:blink 1s steps(1) infinite}

  .scn{transition:opacity .35s ease,visibility .35s}
  .ty-panel,.src-panel{transition:opacity .4s ease,visibility .4s}
  .ok{transition:opacity .35s,visibility .35s,transform .5s var(--ease);transform:scale(.97)}
  .scn.t4 .ok{transform:none}
  .scn.t4 .ok-ic{animation:stamp .55s var(--ease) both}
  .scn.t4 .ok .draw{stroke-dasharray:24;animation:drawck .5s .25s var(--ease-io) both}
  .tags li,.sum,.rc,.slot{transition:opacity .4s var(--ease),transform .5s var(--ease),background-color .2s,color .2s,border-color .3s}
  .seg-thumb{transition:transform .5s var(--ease)}
  .st,.tl .b,.axis{transition:opacity .35s ease,transform .7s var(--ease),visibility .35s}
  .tl .b{transition-delay:.25s}
  .pm::before,.pm::after{transition:transform .35s var(--ease)}
  .tog,.tog::after{transition:background-color .4s,transform .5s var(--ease)}

  .ty-panel.is-on .vz-fixed li.sel{animation:selA 3.4s 0s both infinite}
  @keyframes selA{0%,22%{background:var(--card);border-color:var(--line);color:var(--ink)}30%,100%{background:var(--green);border-color:var(--green);color:var(--on-green)}}
  .ty-panel.is-on .vz-fixed .vz-tag{animation:pop .5s .9s var(--ease) both}
  .ty-panel.is-on .vz-van{animation:drive 3.2s var(--ease-io) infinite alternate}
  .ty-panel.is-on .half.am{animation:amA 4.2s infinite}.ty-panel.is-on .half.pm{animation:pmA 4.2s infinite}
  .ty-panel.is-on .vstep.b{animation:pop .6s .7s var(--ease) both}.ty-panel.is-on .vz-visit .vlink,.ty-panel.is-on .vz-quote .vlink{animation:drawline .5s .3s var(--ease-io) both}
  .ty-panel.is-on .vz-visit .vstep.a{animation:pop .5s var(--ease) both}
  .ty-panel.is-on .q-req{animation:pop .5s var(--ease) both}.ty-panel.is-on .q-ans{animation:pop .6s .7s var(--ease) both}
  .ty-panel.is-on .ring{animation:ring 2.4s ease-out infinite}.ty-panel.is-on .r2{animation-delay:.6s}.ty-panel.is-on .r3{animation-delay:1.2s}

  .src-out.wave .pl{animation:pop .5s var(--ease) both}
  .src-out.wave .wk-c:nth-child(2) .pl{animation-delay:.06s}.src-out.wave .wk-c:nth-child(3) .pl{animation-delay:.12s}.src-out.wave .wk-c:nth-child(4) .pl{animation-delay:.18s}.src-out.wave .wk-c:nth-child(5) .pl{animation-delay:.24s}
  .src-arrow i{animation:drawline .9s var(--ease-io) infinite alternate;transform-origin:top;height:100%}

  .steps li:not(:last-child)::after{transform:scaleY(var(--fill,1))}

  /* scroll reveal (JS adds .in) */
  @media (scripting:enabled){
    .rv{opacity:0;transform:translateY(32px);transition:opacity .9s var(--ease),transform 1s var(--ease)}
    .rv.in{opacity:1;transform:none}
    .rv.prof{transform:translateY(32px) rotate(6deg)}.rv.prof.in{transform:rotate(1.6deg)}
    .pts li,.tr-list li,.stay li,.believe li{transition:opacity .7s var(--ease),transform .8s var(--ease)}
    .rv:not(.in) .pts li,.rv:not(.in) .tr-list li{opacity:0;transform:translateX(-14px)}
    .rv.in .pts li:nth-child(2),.rv.in .tr-list li:nth-child(2){transition-delay:.1s}.rv.in .pts li:nth-child(3),.rv.in .tr-list li:nth-child(3){transition-delay:.2s}.rv.in .pts li:nth-child(4),.rv.in .tr-list li:nth-child(4){transition-delay:.3s}
    .ctl:not(.in) .tog.on{background:var(--line)}.ctl:not(.in) .tog.on::after{transform:none}
    .ctl .tog.on{transition-delay:.5s}.ctl .tog.on::after{transition-delay:.5s}
    .ctl-rows li:nth-child(2) .tog{transition-delay:.8s}.ctl-rows li:nth-child(2) .tog::after{transition-delay:.8s}
    /* hero demo entrance states */
    .tags li,.sum{opacity:0;transform:translateY(8px) scale(.96)}
    .scn.t1 .tags li,.scn.t1 .sum{opacity:1;transform:none}
    .scn.t1 .tags li:nth-child(2){transition-delay:.08s}.scn.t1 .tags li:nth-child(3){transition-delay:.16s}.scn.t1 .sum{transition-delay:.2s}
    .rc{opacity:0;transform:translateY(16px)}
    .scn.t2 .rc{opacity:1;transform:none}
    .scn.t2 .rc:nth-child(2){transition-delay:.14s}.scn.t2 .rc:nth-child(3){transition-delay:.28s}
    .scn.t3 .rc:not(.has-pick){opacity:.4}
    .scn:not(.t2) .slot{transform:scale(.85)}
    .scn.t2 .slot{transform:none}
    .demo .scn.t2 .slot:active{transform:scale(.96)}
    .steps li{opacity:.35;transition:opacity .5s}.steps li.in{opacity:1}
    .steps{--fill:var(--p)}
  }
  .story-pin .note,.story-pin .clean{transition:none}
}

/* ---------- hero diary grid (desktop) ---------- */
.hero-home{isolation:isolate;overflow:clip}
.hgrid{display:none}
@media (min-width:1120px){
  .demo,.src{justify-self:end}
  .hgrid{display:block;position:absolute;z-index:-1;left:calc(50% + 40px);top:10px;width:980px;
    -webkit-mask-image:radial-gradient(ellipse 58% 62% at 42% 52%,#000 45%,transparent 100%);mask-image:radial-gradient(ellipse 58% 62% at 42% 52%,#000 45%,transparent 100%)}
  .hgrid-h{display:grid;grid-template-columns:repeat(7,1fr);gap:10px;margin-bottom:10px;font:700 .72rem var(--display);letter-spacing:.12em;text-transform:uppercase;color:var(--muted);text-align:center}
  .hgrid-c{display:grid;grid-template-columns:repeat(7,1fr);gap:10px}
  .hgrid-c i{position:relative;height:64px;border-radius:12px;border:1px dashed var(--line)}
  .hgrid-c i.on{border-style:solid;border-color:color-mix(in srgb,var(--green) 40%,transparent);background:color-mix(in srgb,var(--mint) 70%,transparent)}
  .hgrid-c i.on::after{content:"";position:absolute;inset:-1px;border-radius:12px;background:var(--green);opacity:0}
}
/* closing ticker */
.ticker{overflow:clip;margin:calc(clamp(80px,12vw,170px)*-1) 0 clamp(64px,9vw,120px);padding:16px 0;background:#0e2a2f;color:#f4f0e6;transform:rotate(-1.2deg) scale(1.02)}
.tk-track{display:flex;width:max-content}
.tk-set{display:flex;align-items:center;gap:28px;padding-right:28px;font:800 clamp(1.1rem,1rem + 1vw,1.7rem) var(--display);letter-spacing:-.01em;white-space:nowrap}
.tk-set i{width:12px;height:12px;border-radius:50%;background:#ffc94d}
.tk-set:nth-child(2){display:none}
.cl-l{display:inline-block}
.top{transition:border-color .3s,box-shadow .3s}
.top.scrolled{border-bottom-color:var(--line)}
.demo{transform:perspective(1400px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg));transform-style:preserve-3d}

@media (prefers-reduced-motion:no-preference){
  @keyframes lineup{0%{translate:0 .55em;clip-path:inset(0 -5% 100% -5%);opacity:0}100%{translate:0 0;clip-path:inset(-20% -5% -40% -5%);opacity:1}}
  @keyframes slotlit{0%,62%,100%{opacity:0}8%,40%{opacity:1}}
  @keyframes tick{to{transform:translateX(-50%)}}
  @keyframes dotpop{0%{transform:scale(1)}40%{transform:scale(1.6)}100%{transform:scale(1)}}
  .pg-home .hero-copy>.h1{animation:none}
  .hero .h1-l{animation:lineup 1s var(--ease) both}
  .hero .h1-l:nth-of-type(1){animation-delay:.08s}.hero .h1-l:nth-of-type(2){animation-delay:.22s}
  .hero-copy>*{animation-name:rise2}
  @keyframes rise2{from{translate:0 22px;opacity:0}to{translate:0 0;opacity:1}}
  .demo{animation-name:rise2}
  .hgrid-c i.on::after{animation:slotlit 7.2s ease-in-out infinite}
  .hgrid-c .d1::after{animation-delay:.6s}.hgrid-c .d2::after{animation-delay:1.2s}.hgrid-c .d3::after{animation-delay:1.8s}.hgrid-c .d4::after{animation-delay:2.4s}.hgrid-c .d5::after{animation-delay:3s}.hgrid-c .d6::after{animation-delay:3.6s}.hgrid-c .d7::after{animation-delay:4.2s}.hgrid-c .d8::after{animation-delay:4.8s}.hgrid-c .d9::after{animation-delay:5.4s}.hgrid-c .d10::after{animation-delay:6s}.hgrid-c .d11::after{animation-delay:6.6s}
  .tk-set:nth-child(2){display:flex}
  .tk-track{animation:tick 38s linear infinite}
  @media (scripting:enabled){
    .rv .h2,.rv h3.h2{transition:clip-path 1.1s var(--ease),translate 1.1s var(--ease),opacity .8s}
    .rv:not(.in) .h2{clip-path:inset(0 -5% 100% -5%);translate:0 .5em;opacity:0}
    .rv.in .h2{clip-path:inset(-20% -5% -40% -5%)}
    .closing:not(.in) .cl-l{opacity:0}
    .closing.in .cl-l{animation:lineup 1.1s var(--ease) both}
    .closing.in .cl-l:nth-of-type(2){animation-delay:.16s}
    .closing.in .connected .stop{display:inline-block;animation:dotpop .7s 1.1s var(--ease) both}
    .closing.rv{transform:none;opacity:1}
  }
}

/* ---------- static / reduced-motion fallbacks: the complete still page ---------- */
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
}
@media (scripting:none){
  .dchips,.demo-pause{display:none}
}
.scn .ok[hidden]{display:none}

/* generated: timeline utilities */
.l0{left:0.000%}.w0{width:0.000%}.l1{left:4.167%}.w1{width:4.167%}.l2{left:8.333%}.w2{width:8.333%}.l3{left:12.500%}.w3{width:12.500%}.l4{left:16.667%}.w4{width:16.667%}.l5{left:20.833%}.w5{width:20.833%}.l6{left:25.000%}.w6{width:25.000%}.l7{left:29.167%}.w7{width:29.167%}.l8{left:33.333%}.w8{width:33.333%}.l9{left:37.500%}.w9{width:37.500%}.l10{left:41.667%}.w10{width:41.667%}.l11{left:45.833%}.w11{width:45.833%}.l12{left:50.000%}.w12{width:50.000%}.l13{left:54.167%}.w13{width:54.167%}.l14{left:58.333%}.w14{width:58.333%}.l15{left:62.500%}.w15{width:62.500%}.l16{left:66.667%}.w16{width:66.667%}.l17{left:70.833%}.w17{width:70.833%}.l18{left:75.000%}.w18{width:75.000%}.l19{left:79.167%}.w19{width:79.167%}.l20{left:83.333%}.w20{width:83.333%}.l21{left:87.500%}.w21{width:87.500%}.l22{left:91.667%}.w22{width:91.667%}.l23{left:95.833%}.w23{width:95.833%}.l24{left:100.000%}.w24{width:100.000%}