:root{
  --bg:#FBFBF9; --bg2:#F1F2EE; --line:#E2E6DF; --ink:#14201C; --ink2:#4B5852; --mute:#5E6B64;
  --teal:#175C63; --teal2:#0F3F44; --cyan:#69D3DE;
  --serif:"Zilla Slab",Georgia,"Times New Roman",serif;
  --sans:"Public Sans","Segoe UI",system-ui,-apple-system,sans-serif;
  --p:0; /* scroll progress 0..1 written by JS */
  color-scheme:light;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--sans);font-size:17px;line-height:1.5;-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:var(--teal);text-decoration:none}
a:hover{color:var(--teal2)}
h1,h2,h3{font-family:var(--serif);font-weight:600;letter-spacing:-.01em;line-height:1.05;margin:0;text-wrap:balance}
p{margin:0;text-wrap:pretty}
.wrap{width:min(1180px,calc(100% - 40px));margin:0 auto}
.eyebrow{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--teal);font-weight:600}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:16px 26px;border-radius:999px;background:var(--teal);color:var(--bg);font-weight:600;font-size:16px;border:0;cursor:pointer;transition:background .2s,transform .2s}
.btn:hover{background:var(--teal2);color:var(--bg);transform:translateY(-1px)}
.btn.ghost{background:transparent;color:var(--ink);box-shadow:inset 0 0 0 1.5px var(--line)}
.btn.ghost:hover{background:var(--bg2);transform:none}
:focus-visible{outline:3px solid var(--teal);outline-offset:3px}
.run .panel :focus-visible,.btn:focus-visible{outline-color:var(--cyan)}
.btn:focus-visible{outline-color:var(--ink)}

/* ---------- nav ---------- */
.nav{position:sticky;top:0;z-index:50;background:rgba(251,251,249,.85);backdrop-filter:saturate(1.4) blur(12px);-webkit-backdrop-filter:saturate(1.4) blur(12px);border-bottom:1px solid var(--line)}
.nav .wrap{display:flex;align-items:center;justify-content:space-between;height:66px}
.nav img{height:30px;width:auto;display:block}
.nav ul{display:flex;gap:30px;list-style:none;margin:0;padding:0;font-size:15px;font-weight:500}
.nav ul a{color:var(--ink2)}
.nav ul a:hover{color:var(--ink)}
.nav .btn{padding:11px 18px;font-size:14.5px}
@media (max-width:820px){.nav ul{display:none}}

/* ---------- hero ---------- */
.hero{padding:64px 0 0;text-align:center}
.hero h1{font-size:clamp(40px,5.4vw,74px);max-width:17ch;margin:14px auto 0}
.hero .lead{font-size:clamp(17px,1.5vw,21px);color:var(--ink2);max-width:52ch;margin:20px auto 0}
.hero .cta{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin-top:30px}
.hero .fine{font-size:13.5px;color:var(--mute);margin-top:12px}

/* the stage: a phone with passes fanned behind it; --p spreads the fan on scroll */
.stage{position:relative;height:clamp(520px,58vw,720px);margin-top:28px;overflow:hidden;perspective:1400px}
.stage .glow{position:absolute;inset:8% 10% 0;border-radius:40px;background:radial-gradient(ellipse at 50% 30%,rgba(105,211,222,.32),rgba(105,211,222,0) 60%);pointer-events:none}
.fan{position:absolute;left:50%;top:52%;width:0;height:0}
.fan .pass{position:absolute;left:0;top:0;width:var(--w,300px);margin-left:calc(var(--w,300px) * -.5);margin-top:calc(var(--h,380px) * -.5);
  --m:1;--s:calc((.45 + .55 * var(--p)) * var(--m));
  transform:translate3d(calc(var(--x) * var(--s)),calc(var(--y) * var(--s)),calc(-120px + 60px * var(--p))) rotate(calc(var(--r) * var(--s)));
  transition:transform .15s linear;will-change:transform}
.fan .pass.hidden-sm{display:block}
.stage .phone{position:absolute;left:50%;top:52%;transform:translate(-50%,-50%) translateY(calc(var(--p) * -24px));z-index:10;transition:transform .15s linear}
@media (max-width:720px){
  .stage{height:560px}
  .fan .pass{--w:210px;--m:.62}
  .fan .pass.hidden-sm{display:none}
  .stage .phone{transform:translate(-50%,-50%) scale(.82) translateY(calc(var(--p) * -24px))}
}

/* ---------- phone frame ---------- */
.phone{width:300px;height:610px;border-radius:44px;background:#0B0F0E;padding:12px;box-shadow:0 2px 4px rgba(20,32,28,.3),0 40px 80px rgba(20,32,28,.28),inset 0 0 0 2px #2A302E}
.phone .screen{position:relative;width:100%;height:100%;border-radius:34px;overflow:hidden;background:#F5F5F3}
.phone .notch{position:absolute;left:50%;top:10px;transform:translateX(-50%);width:96px;height:28px;border-radius:999px;background:#0B0F0E;z-index:5}
.phone .clock{position:absolute;left:24px;top:16px;font-size:13px;font-weight:600;z-index:4}
.phone .status{position:absolute;right:24px;top:17px;font-size:11px;font-weight:600;z-index:4;letter-spacing:.02em}
.wallet{position:absolute;inset:0;padding:64px 14px 0}
.wallet .title{font-family:var(--sans);font-weight:700;font-size:24px;letter-spacing:-.02em;margin:0 0 14px 4px}
.wallet .stack{position:relative;height:100%}
.wallet .stack .pass{position:absolute;left:0;right:0;--w:100%}
.wallet .stack .pass:nth-child(1){top:0}
.wallet .stack .pass:nth-child(2){top:58px}
.wallet .stack .pass:nth-child(3){top:116px}
.wallet .stack .pass:nth-child(4){top:174px}

/* ---------- pass component (Apple-style layout, our own design) ---------- */
.pass{--pb:#1A0F0A;--pi:#F2ECE2;--pa:#C8A882;--pstrip:linear-gradient(90deg,#1A0F0A 0%,#1A0F0A 34%,#3A2418 100%);
  width:var(--w,300px);border-radius:16px;background:var(--pb);color:var(--pi);overflow:hidden;
  box-shadow:0 1px 2px rgba(20,32,28,.25),0 24px 48px rgba(20,32,28,.22);font-family:var(--sans);font-size:13px;line-height:1.25}
.pass .top{display:flex;align-items:center;justify-content:space-between;padding:13px 15px 0;gap:8px}
.pass .brand{display:flex;align-items:center;gap:8px;min-width:0}
.pass .mark{width:26px;height:26px;border-radius:7px;background:var(--pa);color:var(--pb);display:grid;place-items:center;font-weight:800;font-size:11px;flex:none;letter-spacing:.02em}
.pass .name{font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pass .hf{text-align:right;flex:none}
.pass .lbl{font-size:9.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--pa);font-weight:600}
.pass .val{font-size:12.5px;margin-top:1px}
.pass .strip{position:relative;height:104px;margin-top:11px;background:var(--pstrip)}
.pass .strip .big{position:absolute;left:15px;top:14px}
.pass .strip .num{font-size:44px;font-weight:800;line-height:1;letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.pass .strip .num small{font-size:20px;opacity:.6;font-weight:700}
.pass .strip .art{position:absolute;right:0;top:0;bottom:0;width:58%}
.pass .fields{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:13px 15px 14px}
.pass .code{margin:0 15px 15px;background:#fff;border-radius:8px;padding:8px;display:flex;justify-content:center}
.pass .code svg{width:74px;height:74px;display:block;fill:#111}
.pass.tall .code svg{width:96px;height:96px}
/* stamp dots */
.dots{display:flex;gap:5px;flex-wrap:wrap;max-width:118px}
.dots i{width:12px;height:12px;border-radius:50%;background:rgba(255,255,255,.18);border:1.5px solid var(--pa);display:block}
.dots i.on{background:var(--pa)}
/* Google-style variant: hero band + title row */
.pass.g{border-radius:14px}
.pass.g .gtop{display:flex;align-items:center;gap:10px;padding:14px 16px 0}
.pass.g .gtop .mark{width:32px;height:32px;border-radius:50%;font-size:12px}
.pass.g .gtop .name{font-size:14px}
.pass.g .gtitle{padding:12px 16px 0;font-size:20px;font-weight:600;line-height:1.15}
.pass.g .gsub{padding:2px 16px 0;font-size:12.5px;opacity:.85}
.pass.g .gband{height:96px;margin-top:12px;background:var(--pstrip)}

/* ---------- proof strip ---------- */
.proof{margin-top:56px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:var(--bg)}
.proof .wrap{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;padding:28px 0}
.proof b{font-family:var(--serif);font-weight:600;font-size:30px;display:block;line-height:1.1}
.proof span{font-size:14px;color:var(--mute);display:block;margin-top:4px}
@media (max-width:720px){.proof .wrap{grid-template-columns:1fr 1fr;gap:18px 12px}.proof b{font-size:26px}}

/* ---------- gallery marquee ---------- */
.gallery{padding:96px 0 0}
.gallery .head{max-width:60ch}
.gallery h2{font-size:clamp(32px,4vw,52px)}
.gallery .head p{font-size:18px;color:var(--ink2);margin-top:16px;max-width:52ch}
.marquee{margin-top:40px;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.marquee .track{display:flex;gap:26px;width:max-content;padding:20px 0;animation:slide var(--dur,52s) linear infinite}
.marquee.rev .track{animation-direction:reverse}
.marquee:hover .track{animation-play-state:paused}
.marquee .pass{flex:none;--w:250px}
.marquee .pass.g{--w:270px}
@keyframes slide{to{transform:translateX(-50%)}}
.gallery .note{font-size:13.5px;color:var(--mute);margin-top:16px}

/* ---------- scrollytelling ---------- */
.story{padding:110px 0 40px}
.story .shead{max-width:60ch;margin-bottom:40px}.story .shead h2{font-size:clamp(32px,4vw,52px)}.story .intro{font-size:18px;color:var(--ink2);margin-top:14px;max-width:46ch}
.story .wrap.grid{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:start}
.story .sticky{position:sticky;top:96px;display:flex;justify-content:center}
.story .sticky .phone{--sc:1;transform:scale(var(--sc));transform-origin:top center}
.st{min-height:62vh;display:flex;flex-direction:column;justify-content:center;gap:10px;padding:40px 0;border-top:1px solid var(--line);opacity:.35;transition:opacity .4s}
.st:first-of-type{border-top:0}
.st.on{opacity:1}
.st .k{font-family:var(--serif);font-size:22px;color:var(--teal);font-weight:700}
.st h3{font-size:30px}
.st p{font-size:17px;color:var(--ink2);max-width:40ch}
@media (max-width:900px){
  .story .wrap.grid{display:block}
  .story .sticky{top:66px;z-index:5;height:330px;align-items:flex-start;pointer-events:none;background:var(--bg);border-bottom:1px solid var(--line);overflow:hidden;margin:0 -20px;width:calc(100% + 40px)}
  .story .sticky .phone{--sc:.66;margin-top:10px}
  .st{min-height:0;padding:34px 0;opacity:1;background:var(--bg);position:relative}
  .st.on h3{color:var(--teal)}
}
/* screens inside the story phone */
.scr{position:absolute;inset:0;opacity:0;transition:opacity .5s;pointer-events:none}
.scr.on{opacity:1}
.join{padding:70px 22px 0;background:#FBFBF9;color:var(--ink)}
.join .m{width:52px;height:52px;border-radius:14px;background:#1A0F0A;color:#C8A882;display:grid;place-items:center;font-weight:800;font-size:18px}
.join .mh{font-family:var(--serif);font-size:26px;margin:18px 0 6px;line-height:1.1;font-weight:600}
.join p{font-size:14px;color:var(--ink2)}
.join .field{margin-top:22px;border:1.5px solid var(--line);border-radius:12px;padding:12px 14px;font-size:15px;background:#fff}
.join .field span{display:block;font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--mute)}
.join .add{margin-top:14px;background:#000;color:#fff;border-radius:12px;padding:13px;text-align:center;font-weight:600;font-size:14.5px;display:flex;gap:8px;align-items:center;justify-content:center}
.join .add.g{background:#fff;color:#111;border:1.5px solid #ddd;margin-top:8px}
.join .fine{font-size:11.5px;color:var(--mute);margin-top:14px;line-height:1.4}
.walletone{padding:64px 14px 0;background:#F5F5F3}
.walletone .pass{--w:100%}
.toast{position:absolute;left:14px;right:14px;bottom:26px;padding:12px 14px;border-radius:16px;background:rgba(255,255,255,.92);box-shadow:0 10px 30px rgba(20,32,28,.16);display:flex;gap:10px;align-items:center;color:var(--ink);transform:translateY(20px);opacity:0;transition:transform .5s,opacity .5s}
.scr.on .toast{transform:none;opacity:1;transition-delay:.35s}
.toast .m{width:34px;height:34px;border-radius:9px;background:#1A0F0A;color:#C8A882;display:grid;place-items:center;font-weight:800;font-size:11px;flex:none}
.toast small{display:block;font-size:10.5px;color:var(--mute);letter-spacing:.02em}
.toast div{font-size:13px;line-height:1.3}
.lock{background:linear-gradient(180deg,#1E2A3A 0%,#0F1A2A 100%);color:#fff;padding:54px 16px 0;text-align:center;height:100%}
.lock .time{font-family:var(--sans);font-size:66px;font-weight:600;letter-spacing:-.03em;line-height:1}
.lock .date{font-size:14px;opacity:.8;margin-top:4px}
.lock .n{margin-top:38px;text-align:left;background:rgba(255,255,255,.14);backdrop-filter:blur(10px);border-radius:18px;padding:12px 14px;display:flex;gap:10px;align-items:center;transform:translateY(-16px);opacity:0;transition:transform .55s,opacity .55s}
.scr.on .lock .n{transform:none;opacity:1;transition-delay:.3s}
.lock .n:nth-of-type(2){transition-delay:.6s}
.lock .n .m{width:36px;height:36px;border-radius:9px;background:#1A0F0A;color:#C8A882;display:grid;place-items:center;font-weight:800;font-size:11px;flex:none}
.lock .n small{display:block;font-size:10.5px;opacity:.75}
.lock .n div{font-size:13px;line-height:1.3}
.staffui{padding:60px 18px 0;background:#FBFBF9;color:var(--ink)}
.staffui .bar{display:flex;justify-content:space-between;font-size:12px;color:var(--mute)}
.staffui .mh{font-family:var(--serif);font-size:24px;margin:14px 0 2px;font-weight:600}
.staffui .who{font-size:14px;color:var(--ink2)}
.staffui .big{font-family:var(--serif);font-size:64px;font-weight:600;line-height:1;margin-top:18px;font-variant-numeric:tabular-nums}
.staffui .big small{font-size:26px;color:var(--mute)}
.staffui .btn{width:100%;margin-top:22px;padding:15px;font-size:16px}
.staffui .btn.ghost{margin-top:8px}
.staffui .today{margin-top:22px;font-size:13px;color:var(--mute);border-top:1px solid var(--line);padding-top:12px}
.stamp-pop{position:absolute;right:22px;top:160px;transform:translate(0,0) scale(.6);width:84px;height:84px;border-radius:50%;background:var(--teal);color:#fff;display:grid;place-items:center;font-size:38px;font-weight:700;box-shadow:0 12px 30px rgba(23,92,99,.35);opacity:0;transition:transform .5s cubic-bezier(.2,1.4,.4,1),opacity .3s}
.scr.on .stamp-pop{opacity:1;transform:translate(0,0) scale(1);transition-delay:.5s}

/* ---------- run for you ---------- */
.run{padding:96px 0 0}
.run .panel{background:var(--ink);color:var(--bg);border-radius:28px;padding:56px;display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center;overflow:hidden}
.run .panel h2{font-size:clamp(30px,3.6vw,46px)}
.run .panel h2,.run .panel p{color:var(--bg)}
.run .panel .eyebrow{color:var(--cyan)}
.run .panel p{font-size:17px;opacity:.85;margin-top:16px;max-width:44ch}
.run ul{list-style:none;padding:0;margin:26px 0 0;display:grid;gap:12px;font-size:16px}
.run li{display:flex;gap:12px;align-items:flex-start}
.run li:before{content:"";width:18px;height:18px;border-radius:50%;background:var(--cyan);flex:none;margin-top:3px;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M9 16.2 4.8 12l-1.4 1.4L9 19 21 7l-1.4-1.4z'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M9 16.2 4.8 12l-1.4 1.4L9 19 21 7l-1.4-1.4z'/%3E%3C/svg%3E") center/contain no-repeat}
.dash{background:var(--bg);color:var(--ink);border-radius:18px;padding:22px;box-shadow:0 30px 60px rgba(0,0,0,.35)}
.dash .t{display:flex;justify-content:space-between;align-items:baseline;font-size:13px;color:var(--mute)}
.dash .t b{font-family:var(--serif);font-size:20px;color:var(--ink);font-weight:600}
.dash .grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:16px}
.dash .cell{background:var(--bg2);border-radius:12px;padding:12px}
.dash .cell b{font-family:var(--serif);font-size:28px;font-weight:600;display:block;line-height:1;font-variant-numeric:tabular-nums}
.dash .cell span{font-size:12px;color:var(--mute)}
.dash .bars{display:flex;align-items:flex-end;gap:6px;height:70px;margin-top:18px;padding-bottom:4px;border-bottom:1px solid var(--line)}
.dash .bars i{flex:1;background:var(--teal);border-radius:4px 4px 0 0;opacity:.85;transform-origin:bottom;animation:grow 1s cubic-bezier(.2,.8,.2,1) both}
.dash .bars i:nth-child(odd){opacity:.55}
.dash .days{display:flex;justify-content:space-between;font-size:11px;color:var(--mute);margin-top:6px}
.dash .camp{margin-top:16px;font-size:13px;display:flex;gap:10px;align-items:center}
.dash .camp .pill{background:var(--teal);color:#fff;font-size:11px;padding:3px 9px;border-radius:999px;font-weight:600}
.dash .ex{font-size:11px;color:var(--mute);margin-top:12px}
@keyframes grow{from{transform:scaleY(0)}}
@media (max-width:900px){.run .panel{grid-template-columns:1fr;padding:34px 24px;border-radius:22px}}

/* ---------- pricing ---------- */
.price{padding:96px 0 0;text-align:center}
.price h2{font-size:clamp(32px,4vw,52px)}
.price .sub{font-size:18px;color:var(--ink2);margin-top:14px}
.price .row{display:grid;grid-template-columns:1fr 1fr 1fr;gap:20px;margin-top:40px;text-align:left}
.price .box{border:1px solid var(--line);border-radius:22px;padding:28px}
.price .box.main{background:var(--bg2);border-color:transparent}
.price .box .n{font-family:var(--serif);font-size:44px;font-weight:600;line-height:1}
.price .box .n small{font-size:16px;color:var(--mute);font-family:var(--sans);font-weight:500}
.price .box .w{font-size:13px;letter-spacing:.12em;text-transform:uppercase;color:var(--teal);font-weight:600;margin-top:12px}
.price .box p{font-size:15px;color:var(--ink2);margin-top:10px}
.price .fine{font-size:13.5px;color:var(--mute);margin-top:18px}
@media (max-width:900px){.price .row{grid-template-columns:1fr}}

/* ---------- final cta ---------- */
.final{margin:96px 0 0;padding:72px 0;background:var(--bg2);text-align:center}
.final h2{font-size:clamp(32px,4.4vw,56px);max-width:18ch;margin:0 auto}
.final p{font-size:18px;color:var(--ink2);margin:16px auto 0;max-width:46ch}
.final .btn{margin-top:28px}
footer{padding:36px 0 48px;font-size:13.5px;color:var(--mute)}
footer .wrap{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap}
footer a{color:var(--ink2);margin-right:18px}

/* reveal on scroll (from a visible resting state) */
.rv{transform:translateY(16px);transition:transform .7s cubic-bezier(.2,.8,.2,1)}
.rv.in{transform:none;opacity:1}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .fan .pass,.stage .phone,.rv,.st,.scr,.toast,.lock .n,.stamp-pop{transition:none!important}
  .rv{opacity:1;transform:none}
  .marquee .track{animation:none;flex-wrap:wrap;width:auto;padding:20px}
  .dash .bars i{animation:none}
}

/* ---------- index: who / founder / faq ---------- */
.who{padding:96px 0 0}
.who h2{font-size:clamp(32px,4vw,52px)}
.who .sub,.price .sub{font-size:18px;color:var(--ink2);margin-top:14px;max-width:52ch}
.who .cards3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin-top:36px}
.who .vc{display:flex;flex-direction:column;border:1px solid var(--line);border-radius:22px;padding:22px;color:var(--ink);transition:border-color .2s,transform .2s}
.who .vc:hover{border-color:var(--teal);transform:translateY(-3px)}
.who .vc .pv{display:flex;justify-content:center;padding:18px 0 22px;background:var(--bg2);border-radius:16px;overflow:hidden}
.who .vc .pv .pass{--w:220px;transform:rotate(-3deg)}
.who .vc h3{font-family:var(--serif);font-size:24px;margin-top:20px}
.who .vc p{font-size:15px;color:var(--ink2);margin-top:8px;flex:1}
.who .vc .go{color:var(--teal);font-weight:600;font-size:15px;margin-top:16px}
@media (max-width:900px){.who .cards3{grid-template-columns:1fr}}
.price .fine a{font-weight:600}
.founder{padding:96px 0 0}
.founder .fgrid{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:48px;align-items:start}
.founder h2{font-size:clamp(30px,3.6vw,46px);margin-top:8px}
.founder p{color:var(--ink2);margin-top:16px;max-width:58ch}
.founder p.fine{font-size:15px;font-weight:600}
@media (max-width:820px){.founder .fgrid{grid-template-columns:1fr}}
.faqs{padding:96px 0 0}
.faqs h2{font-size:clamp(30px,3.6vw,46px);margin-top:8px;max-width:22ch}
.faqs .faqwrap{max-width:820px;margin-top:26px}
.hero.inner,.hero.inner.plain{text-align:left}
.hero.inner h1{margin:14px 0 0}
.hero.inner .cta{justify-content:flex-start}
.gallery .real{margin-top:34px}
.gallery .real picture,.gallery .real img{display:block;width:100%;height:auto;border-radius:18px;box-shadow:0 24px 60px rgba(20,32,28,.14)}
.gallery .real .note a{color:var(--teal);font-weight:600;text-decoration:none;border-bottom:1px solid currentColor}

/* ================= class-based replacements for inline styles ================= */
.qrsym{position:absolute;width:0;height:0;overflow:hidden}
.pass.p-hc{--pb:#1A0F0A;--pi:#F2ECE2;--pa:#C8A882;--pstrip:linear-gradient(90deg,#1A0F0A 0%,#1A0F0A 34%,#3A2418 100%)}
.pass.p-mf{--pb:#2B1A2B;--pi:#F7EDF2;--pa:#E7B2C7;--pstrip:linear-gradient(90deg,#2B1A2B 0%,#2B1A2B 34%,#5A3157 100%)}
.pass.p-np{--pb:#A3261E;--pi:#FBEFDD;--pa:#F6D9A8;--pstrip:linear-gradient(90deg,#A3261E 0%,#A3261E 34%,#7A1712 100%)}
.pass.p-tf{--pb:#0E2A3A;--pi:#EAF6F5;--pa:#C6F05A;--pstrip:linear-gradient(90deg,#0E2A3A 0%,#0E2A3A 34%,#164A5E 100%)}
.pass.p-sb{--pb:#F2B441;--pi:#3A2400;--pa:#3A2400;--pstrip:linear-gradient(90deg,#F2B441 0%,#F2B441 34%,#E7973A 100%)}
.pass.p-hb{--pb:#263238;--pi:#F1F3F2;--pa:#D08A5B;--pstrip:linear-gradient(90deg,#263238 0%,#263238 34%,#3C4A52 100%)}
.pass.p-ln{--pb:#F4EFE6;--pi:#1E1A16;--pa:#C0392B;--pstrip:linear-gradient(90deg,#F4EFE6 0%,#F4EFE6 34%,#E8DCC4 100%)}
.pass.p-gp{--pb:#E9F1E6;--pi:#1F3324;--pa:#2E7D4F;--pstrip:linear-gradient(90deg,#E9F1E6 0%,#E9F1E6 34%,#CFE3CB 100%)}
.pass .art{position:absolute;right:0;top:0;height:100%;width:60%}
.pass .art.a55{opacity:.55}.pass .art.a5{opacity:.5}.pass .art.a6{opacity:.6}.pass .art.a35{opacity:.35}.pass .art.a7{opacity:.7}
.pass.g .gband{position:relative}
.pass.w240{--w:240px}.pass.w250{--w:250px}.pass.w270{--w:270px}
.fan .f1{--x:-560px;--y:-40px;--r:-16deg}
.fan .f2{--x:-360px;--y:20px;--r:-9deg}
.fan .f3{--x:360px;--y:20px;--r:9deg}
.fan .f4{--x:560px;--y:-40px;--r:16deg}
.fan .f5{--x:-200px;--y:-150px;--r:-4deg}
.fan .f6{--x:220px;--y:-140px;--r:5deg}
.dash .bars .b1{height:38%}.dash .bars .b2{height:52%}.dash .bars .b3{height:46%}.dash .bars .b4{height:70%}.dash .bars .b5{height:88%}.dash .bars .b6{height:100%}.dash .bars .b7{height:64%}
.marquee.m1{--dur:56s}.marquee.m2{--dur:64s}
.skip{position:absolute;left:-999px;top:8px;background:var(--teal);color:#fff;padding:8px 12px;border-radius:8px;z-index:100}
.skip:focus{left:8px}
.nav img.on-dark{display:none}
.nav .menu{display:none;background:none;border:0;padding:6px;cursor:pointer}
.nav .menu svg{display:block;stroke:var(--ink)}
@media (max-width:820px){
  .nav .menu{display:block}
  .nav ul{display:none;position:absolute;left:0;right:0;top:66px;background:var(--bg);border-bottom:1px solid var(--line);flex-direction:column;gap:0;padding:8px 20px 14px}
  .nav ul li a{display:block;padding:12px 0;font-size:17px}
  .nav.open ul{display:flex}
  .nav .btn{display:none}
}

/* ================= inner pages: the shared vocabulary ================= */
main.shell{width:min(1180px,calc(100% - 40px));margin:0 auto}
main.shell > section{padding:72px 0 0}
main.shell > section:last-of-type{padding-bottom:0}
main.shell h2{font-size:clamp(30px,3.6vw,46px);max-width:24ch}
main.shell h3{font-family:var(--sans);font-size:19px;font-weight:600;letter-spacing:0;line-height:1.3}
main.shell p{max-width:66ch}
main.shell p.sublede{font-size:18px;color:var(--ink2);margin-top:14px;max-width:56ch}
main.shell h1 em{font-style:normal;color:var(--teal)}
.hero.inner{padding:64px 0 0;display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:56px;align-items:center}
.hero.inner h1{font-size:clamp(38px,4.8vw,66px);max-width:16ch}
.hero.inner .h1sub{font-family:var(--serif);font-size:clamp(20px,2vw,26px);color:var(--teal);margin-top:16px;line-height:1.25;max-width:30ch}
.hero.inner .lede{font-size:18px;color:var(--ink2);margin-top:18px;max-width:56ch}
.hero.inner .cta{display:flex;flex-wrap:wrap;gap:14px;align-items:center;margin-top:28px}
.hero.inner .cta .aside{font-size:13.5px;color:var(--mute);max-width:26ch}
.hero.inner .visual{display:flex;justify-content:center;align-items:center;position:relative;min-height:420px}
.hero.inner .visual .glow{position:absolute;inset:0;border-radius:32px;background:radial-gradient(ellipse at 50% 40%,rgba(105,211,222,.3),rgba(105,211,222,0) 60%)}
.hero.inner .visual .pass{position:relative;--w:300px;transform:rotate(-3deg)}
.hero.inner .visual .pass.second{position:absolute;--w:250px;transform:rotate(7deg) translate(150px,120px);z-index:-1;opacity:.9}
.hero.inner .visual .toast{position:absolute;left:0;right:0;bottom:8px;transform:none;opacity:1;margin:0 auto;max-width:330px}
@media (max-width:900px){
  .hero.inner{grid-template-columns:1fr;gap:28px}
  .hero.inner .visual{min-height:380px}
  .hero.inner .visual .pass.second{display:none}
}
.hero.inner.plain{grid-template-columns:1fr}
.hero.inner.plain .lede{max-width:60ch}

.steps{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px;margin-top:34px}
.steps.three{grid-template-columns:repeat(3,minmax(0,1fr))}
.step{border:1px solid var(--line);border-radius:20px;padding:26px 26px 28px;opacity:1;min-height:0;display:block}
.step .n{display:block;font-size:11.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--teal);font-weight:600;margin-bottom:12px}
.step h3{margin-bottom:8px}
.step p{font-size:15.5px;color:var(--ink2)}
@media (max-width:820px){.steps,.steps.three{grid-template-columns:1fr}}

.recipe{margin-top:30px;border:1px solid var(--line);border-radius:22px;padding:8px 30px}
.recipe dl{margin:0}
.recipe dt{font-family:var(--serif);font-size:20px;font-weight:600;padding-top:22px}
.recipe dd{margin:6px 0 22px;color:var(--ink2);font-size:16px;max-width:66ch;border-bottom:1px solid var(--line);padding-bottom:22px}
.recipe dd:last-child{border-bottom:0}
.recipe strong{color:var(--ink)}

.about{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,.7fr);gap:40px;margin-top:30px;align-items:start}
.about p + p{margin-top:16px}
.facts{background:var(--bg2);border-radius:20px;padding:6px 24px}
.facts dl{margin:0}
.facts dl > div{display:flex;justify-content:space-between;gap:16px;padding:14px 0;border-bottom:1px solid var(--line);font-size:15px}
.facts dl > div:last-child{border-bottom:0}
.facts dt{color:var(--mute)}
.facts dd{margin:0;text-align:right;font-weight:600}
@media (max-width:820px){.about{grid-template-columns:1fr}}

details{border-top:1px solid var(--line);padding:4px 0}
details:last-of-type{border-bottom:1px solid var(--line)}
summary{cursor:pointer;font-family:var(--serif);font-size:20px;font-weight:600;padding:18px 40px 18px 0;position:relative;list-style:none}
summary::-webkit-details-marker{display:none}
summary:after{content:"+";position:absolute;right:4px;top:14px;font-size:26px;color:var(--teal);font-family:var(--sans);font-weight:400;transition:transform .2s}
details[open] summary:after{transform:rotate(45deg)}
details p{color:var(--ink2);padding-bottom:20px;max-width:66ch}
#faq h2 + details, section h2 + details{margin-top:26px}
section h2 + .sublede + details{margin-top:26px}

.tablewrap{overflow-x:auto;margin-top:30px;border:1px solid var(--line);border-radius:18px}
table.cmp{border-collapse:collapse;width:100%;min-width:640px;font-size:15px}
table.cmp th,table.cmp td{padding:14px 18px;text-align:left;border-bottom:1px solid var(--line);vertical-align:top}
table.cmp thead th{background:var(--bg2);font-size:13px;letter-spacing:.06em;text-transform:uppercase;color:var(--ink2);font-weight:600}
table.cmp tbody th{font-weight:500;color:var(--ink)}
table.cmp tr:last-child td,table.cmp tr:last-child th{border-bottom:0}
table.cmp td.yes{color:var(--teal);font-weight:700}
table.cmp td.no{color:var(--mute)}

.crosslinks{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:28px}
.crosslinks > a:after{content:"→";color:var(--teal)}
.crosslinks > a,.vcard{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:20px 22px;border:1px solid var(--line);border-radius:16px;color:var(--ink);font-weight:600;transition:border-color .2s,transform .2s}
.crosslinks > a:hover,.vcard:hover{border-color:var(--teal);transform:translateY(-2px);color:var(--ink)}
.vcard .go{color:var(--teal)}
@media (max-width:820px){.crosslinks{grid-template-columns:1fr}}

section.u-closer .closer{margin:0;padding:0;background:none;border-radius:0}
section.u-closer,.closer{margin-top:80px;background:var(--bg2);border-radius:28px;padding:56px 40px;text-align:center}
.closer h2,section.u-closer h2{margin:0 auto;max-width:20ch}
.closer p,section.u-closer p{margin:14px auto 0;color:var(--ink2);font-size:18px;max-width:46ch}
.closer .cta,section.u-closer .cta{margin-top:26px;display:flex;justify-content:center;gap:14px;flex-wrap:wrap;align-items:center}
.closer .aside,section.u-closer .aside{font-size:13.5px;color:var(--mute)}
.closer > .btn,section.u-closer > .btn,section.u-closer .closer > .btn{margin-top:26px}
@media (max-width:820px){section.u-closer,.closer{padding:40px 22px;border-radius:22px}}

.u-mt18{margin-top:18px}.u-mt26{margin-top:26px}.u-fs13{font-size:13.5px;color:var(--mute)}.u-right{text-align:right}.u-jc{text-align:center}
.u-pb0{padding-bottom:0}
.note,.aside{color:var(--mute);font-size:13.5px}
.checklist{list-style:none;padding:0;margin:20px 0 0;display:grid;gap:10px;font-size:15.5px;color:var(--ink2)}
.checklist li{padding-left:26px;position:relative}
.checklist li:before{content:"✓";position:absolute;left:0;color:var(--teal);font-weight:700}
.hint{color:var(--mute);font-weight:400}
main.shell ul:not([class]){padding-left:20px;color:var(--ink2)}
main.shell ul:not([class]) li{margin:8px 0;max-width:62ch}
main.shell ol{padding-left:22px;color:var(--ink2)}
main.shell ol li{margin:8px 0;max-width:62ch}
main.shell blockquote{margin:24px 0;padding:18px 24px;border-left:3px solid var(--teal);background:var(--bg2);border-radius:0 14px 14px 0;font-family:var(--serif);font-size:19px}
main.shell p + p{margin-top:14px}
main.shell section > p:not([class]){color:var(--ink2);margin-top:14px}
main.shell section > h3{margin-top:28px;font-family:var(--serif);font-size:24px}
main.shell section > h3 + p{margin-top:8px}
main.shell hr{border:0;border-top:1px solid var(--line);margin:40px 0}
main.shell .grid2{display:grid;grid-template-columns:1fr 1fr;gap:28px;margin-top:28px}
@media (max-width:820px){main.shell .grid2{grid-template-columns:1fr}}
main.shell .verticals{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin-top:30px}
main.shell .verticals > *{border:1px solid var(--line);border-radius:18px;padding:22px}
@media (max-width:820px){main.shell .verticals{grid-template-columns:1fr}}
.tile{border:1px solid var(--line);border-radius:18px;padding:22px}
.tiles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:28px}
@media (max-width:820px){.tiles{grid-template-columns:1fr}}
.toc{margin-top:22px;font-size:15px;display:flex;flex-wrap:wrap;gap:8px 18px}
.toc a{color:var(--ink2)}

/* ================= pricing ================= */
.plans{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin-top:40px}
.plan{border:1px solid var(--line);border-radius:22px;padding:30px;display:flex;flex-direction:column}
.plan.main{background:var(--bg2);border-color:transparent}
.plan .tag{font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--teal);font-weight:600}
.plan .amount{font-family:var(--serif);font-size:48px;font-weight:600;line-height:1;margin-top:10px}
.plan .amount small{font-family:var(--sans);font-size:15px;color:var(--mute);font-weight:500}
.plan h3{margin-top:8px}
.plan .blurb{font-size:15px;color:var(--ink2);margin-top:8px}
.plan .checklist{margin-top:18px;flex:1}
.plan .checklist li{font-size:14.5px}
.plan .plan-note{font-size:13px;color:var(--mute);margin-top:16px}
.plan .btn{margin-top:20px;width:100%}
@media (max-width:900px){.plans{grid-template-columns:1fr}}
.mlc{margin-top:34px;border:1px solid var(--line);border-radius:22px;padding:30px;display:grid;grid-template-columns:1fr 1fr;gap:30px;align-items:center}
.stepper{display:inline-flex;align-items:center;border:1.5px solid var(--line);border-radius:999px;overflow:hidden;margin-top:10px}
.stepper button{width:44px;height:44px;border:0;background:var(--bg2);font-size:22px;cursor:pointer;color:var(--ink)}
.stepper button:disabled{opacity:.4;cursor:default}
.stepper input{width:64px;height:44px;border:0;text-align:center;font-size:18px;font-weight:600;font-family:var(--sans);background:#fff;color:var(--ink);-moz-appearance:textfield}
.stepper input::-webkit-inner-spin-button{-webkit-appearance:none}
.mlc-lines{display:grid;gap:10px;font-size:15px}
.mlc-lines > div{display:flex;justify-content:space-between;gap:16px;border-bottom:1px solid var(--line);padding-bottom:10px}
.mlc-lines .hero-num{font-family:var(--serif);font-size:30px;font-weight:600}
.mlc-out{margin-top:6px}
@media (max-width:820px){.mlc{grid-template-columns:1fr;padding:24px}}

/* ================= contact ================= */
.contact-grid{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:40px;margin-top:40px;align-items:start}
.formcard{border:1px solid var(--line);border-radius:22px;padding:30px}
.formcard .field-row{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.field{display:flex;flex-direction:column;gap:6px;margin-top:16px}
.field label{font-size:14px;font-weight:600}
.field .req{color:var(--teal)}
.field input,.field select,.field textarea{font:inherit;font-size:16px;padding:12px 14px;border:1.5px solid var(--line);border-radius:12px;background:#fff;color:var(--ink);width:100%}
.field textarea{min-height:120px;resize:vertical}
.field input:focus,.field select:focus,.field textarea:focus{outline:3px solid var(--teal);outline-offset:1px;border-color:var(--teal)}
.hp{position:absolute;left:-9999px}
fieldset.fieldset{border:0;padding:0;margin:0}
.btn.block{width:100%;margin-top:22px}
.formfoot{font-size:13px;color:var(--mute);margin-top:14px}
.selected-plan{background:var(--bg2);border-radius:12px;padding:12px 16px;font-size:14.5px;margin-top:18px}
.selected-plan .clear{float:right;font-size:13px}
.sidecard{border:1px solid var(--line);border-radius:22px;padding:26px}
.sidecard + .sidecard{margin-top:18px}
.sidecard h3{margin-bottom:10px}
.sidecard dl{margin:0}
.sidecard dt{font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--mute);margin-top:14px}
.sidecard dd{margin:2px 0 0;font-size:15.5px}
.sidecard ol{padding-left:20px;margin:0;color:var(--ink2);font-size:15.5px}
.sidecard ol li{margin:8px 0}
@media (max-width:900px){.contact-grid{grid-template-columns:1fr}.formcard .field-row{grid-template-columns:1fr}.formcard{padding:22px}}

/* ================= about / small pages ================= */
.prose{max-width:66ch;margin-top:8px}
.prose h2{font-size:28px;margin-top:40px}
.prose p{color:var(--ink2);margin-top:14px;font-size:17px}
.lost{padding:96px 0;text-align:center}
.lost .k{font-family:var(--serif);font-size:80px;color:var(--teal);line-height:1}
.lost h1{font-size:clamp(32px,4vw,48px);margin:16px auto 0;max-width:18ch}
.lost p{color:var(--ink2);margin:14px auto 0;max-width:46ch}
.lost .cta{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin-top:26px}

/* footer, full */
footer.site{border-top:1px solid var(--line);margin-top:96px;padding:40px 0 48px;font-size:14px;color:var(--mute)}
footer.site .wrap{display:grid;grid-template-columns:1.3fr 1fr 1fr .8fr;gap:28px}
footer.site .fnav{display:grid;gap:8px}
footer.site .fnav a,footer.site .contactl a{color:var(--ink2)}
footer.site .fnav a:hover{color:var(--teal)}
footer.site .fnav b{color:var(--ink);font-size:12px;letter-spacing:.12em;text-transform:uppercase}
footer.site .brandl img{height:26px;width:auto}
footer.site .brandl p{margin-top:12px;max-width:34ch;line-height:1.5}
footer.site .legal{grid-column:1/-1;border-top:1px solid var(--line);padding-top:18px;font-size:13px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px}
@media (max-width:820px){footer.site .wrap{grid-template-columns:1fr 1fr}footer.site .brandl{grid-column:1/-1}}
.vsteps{display:grid;gap:0;margin-top:30px;border-top:1px solid var(--line)}
.vstep{display:grid;grid-template-columns:160px 1fr;grid-template-rows:auto auto;column-gap:20px;padding:24px 0;border-bottom:1px solid var(--line)}
.vstep .n{grid-row:1/3;font-size:11.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--teal);font-weight:600;padding-top:5px}
.vstep h3{grid-column:2;grid-row:1;margin:0}
.vstep p{grid-column:2;grid-row:2;color:var(--ink2);font-size:15.5px;margin-top:6px}
@media (max-width:640px){.vstep{grid-template-columns:1fr;grid-template-rows:auto auto auto}.vstep .n{grid-row:1}.vstep h3{grid-column:1;grid-row:2;margin-top:6px}.vstep p{grid-column:1;grid-row:3}}

/* v15: headings that must be h2 for document order but keep their smaller look */
main.shell .h3{font-family:var(--sans);font-size:19px;font-weight:600;letter-spacing:0;line-height:1.3;margin:0}
.sidecard .h3{margin-bottom:10px}.plan .h3{margin-top:8px}
/* v15: legal pages */
.prose h3{font-size:20px;margin-top:26px}.prose ul,.prose ol{color:var(--ink2);margin-top:12px;padding-left:22px;font-size:17px}.prose li{margin-top:6px}
.prose table{border-collapse:collapse;margin-top:16px;font-size:15px;width:100%}.prose th,.prose td{text-align:left;padding:8px 10px;border-bottom:1px solid var(--line);vertical-align:top}.prose th{color:var(--ink)}
.prose .updated{font-size:13.5px;color:var(--mute);margin-top:6px}
.fnav a.legal-link{font-size:13px}
.consent{font-size:13.5px;color:var(--ink2);margin-top:14px;line-height:1.5}
.prose img{max-width:100%;height:auto;display:block;border:1px solid var(--line);border-radius:8px;margin-top:14px}.prose picture{display:block}