:root{
  --orange:#F2622E;--orange-dark:#C9461A;--peach:#FDE6DB;--tint:#FFF4EE;
  --ink:#22201D;--soft:#4A443F;--muted:#6E6760;--cream:#FAF6F0;--card:#fff;--line:#EAE3D9;
  --night:#1E1A17;--night-line:#3A322C;--night-text:#D9D2C8;
  --green:#23774A;--green-tint:#E3F3E9;--green-ink:#163D28;
  --red:#B3312F;--red-tint:#FBE3E1;--red-ink:#8E2422;
  --amber:#B9770E;--amber-tint:#FCEFD6;--amber-ink:#6B4100;
  --ease:cubic-bezier(.2,.75,.2,1);
  color-scheme:light;
}
*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:80px}
body{background:var(--cream);color:var(--ink);font:17px/1.6 "DM Sans",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:inherit}
img{max-width:100%;display:block}
button{font:inherit;color:inherit}
:focus-visible{outline:3px solid var(--orange);outline-offset:3px;border-radius:8px}
.wrap{max-width:1140px;margin:0 auto;padding:0 24px}
.display{font-family:"Bricolage Grotesque",sans-serif;font-weight:800;letter-spacing:-.035em;line-height:.98}
section h2.display{font-size:clamp(38px,5.4vw,68px);max-width:14em}
.lead{font-size:clamp(18px,1.9vw,21px);color:var(--muted);max-width:32em;margin-top:16px}

/* nav */
.nav{position:sticky;top:0;z-index:30;background:rgba(250,246,240,.86);backdrop-filter:saturate(1.4) blur(14px);-webkit-backdrop-filter:saturate(1.4) blur(14px);border-bottom:1px solid transparent;transition:border-color .2s}
.nav.scrolled{border-color:var(--line)}
.nav .wrap{display:flex;align-items:center;justify-content:space-between;height:66px;gap:16px}
.logo{display:flex;align-items:center;gap:10px;text-decoration:none;font-family:"Bricolage Grotesque",sans-serif;font-weight:800;font-size:24px;letter-spacing:-.03em}
.logo .ic{width:36px;height:36px;border-radius:11px;background:var(--orange);display:grid;place-items:center}
.logo .ic img{width:22px}
.navlinks{display:flex;align-items:center;gap:26px;font-weight:700;font-size:15px}
.navlinks a{text-decoration:none}
.navlinks a:not(.btn):hover{color:var(--orange-dark)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:0;cursor:pointer;font:700 16px/1 "DM Sans",sans-serif;text-decoration:none;border-radius:999px;padding:14px 22px;min-height:50px;transition:transform .15s,background .15s}
.btn:active{transform:scale(.97)}
.btn-ink{background:var(--ink);color:#fff}
.btn-ink:hover{background:#000}
.btn-orange{background:var(--orange);color:#fff}
.btn-orange:hover{background:var(--orange-dark)}
.btn-sm{padding:10px 18px;min-height:42px;font-size:15px}

/* ---------- hero ---------- */
.hero{padding:50px 0 60px;overflow:hidden}
.hero .wrap{display:grid;grid-template-columns:1.05fr .95fr;gap:40px;align-items:center}
.hero .wrap>*,.try .wrap>*,.story>*{min-width:0}
.offer{display:inline-flex;align-items:center;gap:10px;background:var(--ink);color:#fff;border-radius:999px;padding:7px 16px 7px 7px;font-weight:700;font-size:14px;text-decoration:none;max-width:100%}
.offer b{white-space:nowrap;background:var(--orange);border-radius:999px;padding:4px 11px;font-size:13px}
.offer span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
h1.display{font-size:clamp(52px,7.6vw,100px);margin:22px 0 4px}
h1 .w{display:inline-block}
.hero .lead{margin-top:18px;max-width:29em}

/* one orchestrated load sequence */
.intro .w{opacity:0;transform:translateY(.45em) rotate(2deg);animation:rise .9s var(--ease) forwards}
.intro .w:nth-child(2){animation-delay:.08s}.intro .w:nth-child(3){animation-delay:.16s}.intro .w:nth-child(4){animation-delay:.24s}
.intro-fade{opacity:0;animation:fade .9s var(--ease) .45s forwards}
.hero-art{opacity:0;animation:phoneIn 1.1s var(--ease) .25s forwards}
@keyframes rise{to{opacity:1;transform:none}}
@keyframes fade{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
@keyframes phoneIn{from{opacity:0;transform:translateY(60px) scale(.96)}to{opacity:1;transform:none}}

.hero-art{position:relative;height:640px;perspective:1200px}
.glow{position:absolute;inset:40px 0 0 40px;border-radius:50%;background:radial-gradient(circle at 50% 45%,rgba(242,98,46,.28),rgba(242,98,46,0) 62%)}
.tilt{position:absolute;inset:0;display:flex;justify-content:center;align-items:flex-start;transform-style:preserve-3d;transition:transform .5s var(--ease)}
.tilt .phone{margin-top:6px}

/* phone */
.phone{position:relative;width:270px;border-radius:46px;background:#141414;padding:9px;box-shadow:0 30px 60px rgba(34,32,29,.22),0 6px 16px rgba(34,32,29,.12);flex:none}
.phone .scr{border-radius:38px;overflow:hidden;position:relative;aspect-ratio:390/800;background:#fff}
.phone .scr>img{width:100%;height:auto;margin-top:31px}
.phone .sb{position:absolute;inset:0 0 auto 0;height:31px;display:flex;align-items:center;justify-content:space-between;padding:3px 24px 0 28px;font:700 12px "DM Sans",sans-serif;z-index:3}
.phone .sb.dark{color:#fff}
.phone .di{position:absolute;left:50%;top:8px;transform:translateX(-50%);width:78px;height:22px;border-radius:13px;background:#000}
.phone.big{width:310px;border-radius:52px;padding:10px}
.phone.big .scr{border-radius:43px}
.phone.big .scr>img{margin-top:36px}
.phone.big .sb{height:36px;font-size:13.5px;padding:4px 28px 0 32px}
.phone.big .di{width:90px;height:25px;top:9px}

/* hero scan loop */
.scanline{position:absolute;left:8%;right:8%;top:22%;height:3px;border-radius:3px;background:var(--orange);box-shadow:0 0 18px 4px rgba(242,98,46,.75);z-index:2;animation:scan 7s var(--ease) infinite}
.result{position:absolute;inset:0;background:#FBE3E1;z-index:4;transform:translateY(102%);animation:resultIn 7s var(--ease) infinite}
.result img{width:100%;margin-top:36px}
@keyframes scan{0%{top:20%;opacity:0}6%{opacity:1}22%{top:72%}38%{top:20%}46%{opacity:1}50%,100%{opacity:0;top:20%}}
@keyframes resultIn{0%,46%{transform:translateY(102%)}54%,90%{transform:none}97%,100%{transform:translateY(102%)}}
.float-card{position:absolute;display:flex;gap:12px;align-items:center;background:#fff;border-radius:18px;padding:12px 16px;box-shadow:0 18px 40px rgba(34,32,29,.16);font-size:14px;z-index:5}
.float-card b{display:block;font-family:"Bricolage Grotesque",sans-serif;font-size:17px;letter-spacing:-.01em}
.float-card span{color:var(--muted)}
.float-card .dot{width:12px;height:12px;border-radius:50%}
.dot.r{background:var(--red)}.dot.g{background:var(--green)}
.fc1{left:0;top:330px;animation:bob 5s ease-in-out infinite}
.fc2{right:0;top:120px;animation:bob 5s ease-in-out 1.2s infinite}
@keyframes bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}

/* waitlist form */
.join{margin-top:28px;max-width:520px}
.join form{display:flex;gap:8px;background:var(--card);border:1px solid var(--line);border-radius:999px;padding:6px;box-shadow:0 10px 30px rgba(34,32,29,.07)}
.join input[type=email]{flex:1;min-width:0;border:0;outline:0;background:transparent;font:500 17px "DM Sans",sans-serif;color:var(--ink);padding:0 16px}
.join input::placeholder{color:#A39B92}
.join .hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}
.join .note{font-size:14px;color:var(--muted);margin-top:12px;padding-left:18px}
.join .msg{font-weight:700;margin-top:12px;padding-left:18px}
.join .msg:empty{display:none}
.join .msg.err{color:var(--red)}
.join .joined{display:none;width:100%;text-align:left;border:0;cursor:pointer;background:var(--green-tint);color:var(--green-ink);border-radius:22px;padding:16px 20px;font-weight:700}
.join .joined u{text-underline-offset:3px}
.join.done form,.join.done .note{display:none}
.join.done .joined{display:block}

/* ticker */
.ticker{overflow:hidden;border-block:1px solid var(--line);background:#fff;padding:16px 0}
.track{display:flex;gap:12px;width:max-content;animation:marquee 45s linear infinite}
.ticker:hover .track{animation-play-state:paused}
.t{display:inline-flex;align-items:center;gap:8px;white-space:nowrap;border-radius:999px;padding:8px 16px;font-weight:700;font-size:15px}
.t::before{content:"";width:9px;height:9px;border-radius:50%}
.t.r{background:var(--red-tint);color:var(--red-ink)}.t.r::before{background:var(--red)}
.t.g{background:var(--green-tint);color:var(--green-ink)}.t.g::before{background:var(--green)}
.t.a{background:var(--amber-tint);color:var(--amber-ink)}.t.a::before{background:var(--amber)}
@keyframes marquee{to{transform:translateX(calc(-50% - 6px))}}

/* ---------- the ordinary day ---------- */
.day{background:var(--night);color:#fff;padding:110px 0 100px}
.day h2.display{font-size:clamp(40px,6vw,78px);max-width:12em}
.day .lead{color:var(--night-text)}
.timeline{list-style:none;margin:64px 0 0 8px;position:relative;--p:0}
.timeline::before,.timeline::after{content:"";position:absolute;left:0;top:0;width:2px;bottom:46px;background:var(--night-line)}
.timeline::after{background:var(--orange);bottom:auto;height:calc((100% - 46px) * var(--p));box-shadow:0 0 12px rgba(242,98,46,.7)}
.timeline li{position:relative;display:grid;grid-template-columns:180px 1fr;gap:28px;padding:0 0 46px 40px;opacity:.38;transition:opacity .5s var(--ease)}
.timeline li.lit{opacity:1}
.timeline li::before{content:"";position:absolute;left:-7px;top:12px;width:16px;height:16px;border-radius:50%;background:var(--night);border:3px solid var(--night-line);z-index:1;transition:border-color .3s,box-shadow .3s,transform .3s}
.timeline li.lit::before{border-color:var(--orange);box-shadow:0 0 0 6px rgba(242,98,46,.18);transform:scale(1.1)}
.timeline time{font:800 40px/1 "Bricolage Grotesque",sans-serif;letter-spacing:-.03em}
.timeline time small{font-size:18px;margin-left:4px;color:var(--night-text);letter-spacing:0}
.timeline h3{font:800 26px/1.15 "Bricolage Grotesque",sans-serif;letter-spacing:-.015em}
.timeline p{color:var(--night-text);margin-top:8px;max-width:36em}
.timeline .who{display:inline-block;margin-top:12px;font-weight:700;font-size:13px;color:#FFB59A;background:rgba(242,98,46,.14);border-radius:999px;padding:5px 12px}
.punch{margin-top:20px;padding-top:56px;border-top:1px solid var(--night-line);display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:end}
.paws{display:flex;gap:10px;flex-wrap:wrap}
.paws svg{width:44px;height:44px;fill:#3A322C;transition:fill .4s,transform .4s var(--ease)}
.paws svg.hit{fill:var(--orange);transform:scale(1.12)}
.stat-line{font:800 30px/1.15 "Bricolage Grotesque",sans-serif;letter-spacing:-.015em;margin-top:22px}
.stat{color:var(--orange);font-size:1.6em;letter-spacing:-.04em;margin-right:6px}
.src{font-size:13px;color:#9C9289;margin-top:12px}
.punch .big{font-size:clamp(40px,5.2vw,70px)}

/* ---------- try it ---------- */
.try{padding:110px 0}
.try .wrap{display:grid;grid-template-columns:1fr 470px;gap:56px;align-items:center}
.checker{background:var(--card);border:1px solid var(--line);border-radius:32px;padding:22px;box-shadow:0 30px 70px rgba(34,32,29,.12),0 6px 16px rgba(34,32,29,.06)}
.pets{display:flex;gap:6px;background:#F3EEE6;border-radius:14px;padding:4px}
.pets button{flex:1;border:0;background:transparent;border-radius:11px;min-height:42px;font-weight:700;font-size:15px;color:var(--muted);cursor:pointer}
.pets button[aria-pressed=true]{background:var(--card);color:var(--ink);box-shadow:0 1px 4px rgba(34,32,29,.14)}
.search{position:relative;margin-top:12px}
.search input{width:100%;height:56px;border-radius:18px;border:1px solid var(--line);background:var(--cream);padding:0 18px 0 50px;font:500 17px "DM Sans",sans-serif;color:var(--ink);outline:0}
.search input:focus{border-color:var(--orange);background:#fff}
.search svg{position:absolute;left:18px;top:18px}
.chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.chip{border:1px solid var(--line);background:var(--card);border-radius:999px;padding:8px 14px;font-weight:700;font-size:14px;cursor:pointer}
.chip:hover{border-color:var(--ink)}
.answer{margin-top:16px;border-radius:24px;padding:18px;display:grid;grid-template-columns:52px 1fr;gap:14px;align-items:start;min-height:124px}
.answer .icon{width:52px;height:52px;border-radius:50%;display:grid;place-items:center}
.answer .v{font-weight:700;font-size:13px;letter-spacing:.04em}
.answer h3{font:800 28px/1.05 "Bricolage Grotesque",sans-serif;letter-spacing:-.02em;margin:2px 0 6px}
.answer p{font-size:15.5px;line-height:1.5}
.answer.t{background:var(--red-tint);color:var(--red-ink)}.answer.t .icon{background:var(--red)}
.answer.c{background:var(--amber-tint);color:var(--amber-ink)}.answer.c .icon{background:var(--amber)}
.answer.s{background:var(--green-tint);color:var(--green-ink)}.answer.s .icon{background:var(--green)}
.answer.empty{background:var(--cream);color:var(--muted);grid-template-columns:1fr;place-items:center;text-align:center;font-size:15px}
.answer.pop{animation:pop .45s cubic-bezier(.2,.9,.25,1.25)}
.answer.t.pop{animation:pop .45s cubic-bezier(.2,.9,.25,1.25),shake .4s .1s}
@keyframes pop{from{transform:scale(.95);opacity:.3}to{transform:none;opacity:1}}
@keyframes shake{25%{translate:-5px 0}50%{translate:5px 0}75%{translate:-3px 0}}
.checker .fine{font-size:12.5px;color:#A39B92;margin-top:12px;text-align:center}

/* ---------- how it works: sticky phone ---------- */
.how{padding:40px 0 60px}
.story{display:grid;grid-template-columns:1fr 1fr;gap:40px;margin-top:20px}
.chapter{min-height:72vh;display:flex;flex-direction:column;justify-content:center;max-width:28em;opacity:.3;transition:opacity .4s var(--ease)}
.chapter.on{opacity:1}
.chapter .num{display:grid;place-items:center;width:44px;height:44px;border-radius:14px;background:var(--orange);color:#fff;font:800 20px "Bricolage Grotesque",sans-serif}
.chapter h3{font:800 clamp(32px,3.6vw,46px)/1.02 "Bricolage Grotesque",sans-serif;letter-spacing:-.03em;margin-top:18px}
.chapter p{color:var(--muted);font-size:19px;margin-top:12px}
.inline-phone{display:none}
.stage{position:sticky;top:90px;height:calc(100vh - 110px);max-height:760px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:22px}
.stage .scr{transition:background-color .4s}
.stage .scr img{position:absolute;inset:36px 0 auto 0;width:100%;margin:0;opacity:0;transform:scale(1.04);transition:opacity .5s var(--ease),transform .7s var(--ease)}
.stage .scr img.on{opacity:1;transform:none}
.dots{display:flex;gap:8px}
.dots i{width:8px;height:8px;border-radius:4px;background:var(--line);transition:width .3s var(--ease),background .3s}
.dots i.on{width:26px;background:var(--orange)}

/* ---------- features ---------- */
.features{padding:90px 0 110px}
.bento{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:52px}
.tile{border-radius:30px;padding:30px;background:var(--card);border:1px solid var(--line);transition:transform .3s var(--ease),box-shadow .3s}
.tile:hover{transform:translateY(-4px);box-shadow:0 20px 40px rgba(34,32,29,.08)}
.tile h3{font:800 26px/1.12 "Bricolage Grotesque",sans-serif;letter-spacing:-.015em}
.tile p{color:var(--muted);margin-top:8px}
.t-emerg{background:var(--red-tint);border-color:transparent}
.t-emerg h3{color:var(--red-ink)}.t-emerg p{color:#7A3533}
.t-emerg a{display:inline-flex;margin-top:18px;background:var(--red);color:#fff;border-radius:999px;padding:12px 18px;font-weight:700;text-decoration:none}
.t-dark{background:var(--ink);color:#fff;border-color:transparent}.t-dark p{color:var(--night-text)}
.t-orange{background:var(--orange);color:#fff;border-color:transparent}.t-orange p{color:#FFE7DC}
.ticon{width:48px;height:48px;border-radius:15px;display:grid;place-items:center;margin-bottom:18px;background:var(--peach)}
.t-dark .ticon{background:#3A322C}.t-orange .ticon{background:rgba(255,255,255,.2)}
.mini-tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}
.mini-tags span{background:#3A322C;color:#fff;border-radius:999px;padding:6px 12px;font-weight:700;font-size:13px}

/* ---------- pricing ---------- */
.pricing{background:var(--orange);color:#fff;padding:100px 0;position:relative;overflow:hidden}
.pricing .paw{position:absolute;right:-120px;top:-60px;width:520px;opacity:.1;filter:brightness(0) invert(1);pointer-events:none}
.pricing .lead{color:#FFE7DC}
.spots{margin-top:34px;max-width:640px;position:relative}
.spots .row{display:flex;justify-content:space-between;gap:12px;font-weight:700}
.spots .bar{height:14px;border-radius:7px;background:rgba(255,255,255,.25);margin-top:10px;overflow:hidden}
.spots .bar i{display:block;height:100%;width:0;background:#fff;border-radius:7px;transition:width 1.4s var(--ease)}
.plans{display:grid;grid-template-columns:1fr 1fr 1.25fr;gap:18px;margin-top:44px;align-items:stretch;position:relative}
.plan{background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.28);border-radius:28px;padding:28px;position:relative}
.plan h3{font:800 22px "Bricolage Grotesque",sans-serif;letter-spacing:-.01em}
.plan .amt{font:800 50px/1 "Bricolage Grotesque",sans-serif;letter-spacing:-.04em;margin-top:16px}
.plan .amt small{font:700 16px "DM Sans",sans-serif;letter-spacing:0;margin-left:6px;opacity:.85}
.plan .cap{margin-top:10px;color:#FFE7DC;font-size:15px}
.plan.best{background:#fff;color:var(--ink);border-color:#fff;box-shadow:0 30px 70px rgba(120,40,10,.3);transform:translateY(-10px)}
.plan.best .cap{color:var(--muted)}
.plan.best .btn{margin-top:22px;width:100%}
.ribbon{position:absolute;top:-14px;left:28px;background:var(--ink);color:#fff;font-weight:700;font-size:13px;border-radius:999px;padding:6px 12px}
.incl{list-style:none;display:flex;flex-wrap:wrap;gap:10px;margin-top:34px;position:relative}
.incl li{background:rgba(255,255,255,.16);border-radius:999px;padding:8px 14px;font-weight:700;font-size:14px}
.fine-print{margin-top:18px;font-size:13px;color:#FFD8C8;position:relative}

/* ---------- referral ladder ---------- */
.invite{padding:110px 0 30px}
.ladder{list-style:none;display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:48px;position:relative}
.ladder::before{content:"";position:absolute;left:8%;right:8%;top:30px;height:2px;background:repeating-linear-gradient(90deg,var(--line) 0 10px,transparent 10px 18px)}
.ladder li{position:relative;background:var(--card);border:1px solid var(--line);border-radius:28px;padding:26px}
.ladder .n{display:inline-block;background:var(--ink);color:#fff;font-weight:700;font-size:14px;border-radius:999px;padding:6px 14px}
.ladder li:last-child .n{background:var(--orange)}
.ladder h3{font:800 24px/1.15 "Bricolage Grotesque",sans-serif;letter-spacing:-.015em;margin-top:16px}
.ladder p{color:var(--muted);margin-top:6px}

/* ---------- faq ---------- */
.faq{padding:100px 0 30px}
.faq .wrap{display:grid;grid-template-columns:1fr 1.4fr;gap:56px;align-items:start}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:20px;padding:22px 0;font:800 21px/1.25 "Bricolage Grotesque",sans-serif;letter-spacing:-.01em}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"";flex:none;width:30px;height:30px;border-radius:50%;background:var(--card) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%2322201D' stroke-width='3' stroke-linecap='round'%3E%3Cpath d='M12 5v14M5 12h14'/%3E%3C/svg%3E") center no-repeat;border:1px solid var(--line);transition:transform .25s var(--ease)}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq details p{color:var(--soft);padding:0 0 22px;max-width:38em}

/* ---------- final ---------- */
.final{padding:90px 0 40px;text-align:center}
.final h2.display{font-size:clamp(44px,7vw,92px);margin:0 auto;max-width:none}
.final .lead{margin:16px auto 0}
.final .join{margin:30px auto 0}
.final .join .note,.final .join .msg{padding-left:0}
.final .join .joined{text-align:center}

/* ---------- status dialog ---------- */
.status{margin:auto;border:0;border-radius:32px;padding:30px;width:min(480px,calc(100vw - 32px));background:#fff;color:var(--ink);box-shadow:0 40px 100px rgba(0,0,0,.35)}
.status::backdrop{background:rgba(30,26,23,.55);backdrop-filter:blur(4px)}
.status[open]{animation:dlg .5s var(--ease)}
@keyframes dlg{from{opacity:0;transform:translateY(24px) scale(.97)}to{opacity:1;transform:none}}
.status .x{position:absolute;right:18px;top:18px;width:38px;height:38px;border-radius:50%;border:0;background:var(--cream);cursor:pointer;display:grid;place-items:center}
.st-kicker{font-weight:700;color:var(--green)}
.status h2{font-size:56px;margin-top:6px}
.st-badge{margin-top:12px;background:var(--peach);color:var(--orange-dark);border-radius:16px;padding:12px 14px;font-weight:700;font-size:15px}
.st-badge.off{background:var(--cream);color:var(--soft)}
.st-link{display:flex;gap:8px;margin-top:18px;background:var(--cream);border-radius:999px;padding:5px 5px 5px 16px;align-items:center}
.st-link input{flex:1;min-width:0;border:0;background:transparent;font:500 15px "DM Sans",sans-serif;color:var(--ink);outline:0}
.st-share{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:10px}
.st-share a,.st-share button{display:grid;place-items:center;min-height:44px;border-radius:14px;border:1px solid var(--line);background:#fff;text-decoration:none;font-weight:700;font-size:14px;cursor:pointer}
.st-share a:hover,.st-share button:hover{border-color:var(--ink)}
.st-share button{grid-column:1/-1}
.st-ladder{margin-top:20px;display:grid;gap:10px}
.st-step{display:grid;grid-template-columns:34px 1fr auto;gap:12px;align-items:center;font-size:15px}
.st-step .c{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:var(--cream);font-weight:800;font-family:"Bricolage Grotesque",sans-serif}
.st-step.done .c{background:var(--green);color:#fff}
.st-step b{display:block}
.st-step span{color:var(--muted);font-size:13.5px}
.st-step em{font-style:normal;font-weight:700;font-size:13px;color:var(--muted)}

/* footer */
footer{border-top:1px solid var(--line);padding:36px 0 48px;margin-top:60px;font-size:15px;color:var(--muted)}
footer .wrap{display:flex;flex-wrap:wrap;gap:18px 32px;justify-content:space-between;align-items:flex-start}
footer nav{display:flex;gap:22px;flex-wrap:wrap}
footer nav a{text-decoration:none;font-weight:700;color:var(--ink)}
footer nav a:hover{color:var(--orange-dark)}
footer .fine{flex-basis:100%;font-size:13px;line-height:1.6;max-width:760px}

/* legal + simple pages */
.pill{display:inline-flex;align-items:center;gap:8px;background:var(--peach);color:var(--orange-dark);font-weight:700;font-size:14px;border-radius:999px;padding:8px 14px}
.pill .dot{width:8px;height:8px;border-radius:50%;background:var(--orange)}
.doc{max-width:720px;margin:0 auto;padding:48px 24px 40px}
.doc h1{font:800 clamp(38px,6vw,54px)/1.05 "Bricolage Grotesque",sans-serif;letter-spacing:-.03em;margin:14px 0 10px}
.doc .muted{color:var(--muted);font-size:15px}
.doc h2{font:800 22px/1.2 "Bricolage Grotesque",sans-serif;letter-spacing:-.01em;margin:34px 0 8px}
.doc p{margin:10px 0;color:var(--soft)}
.doc .intro{font-size:19px;color:var(--ink);margin-top:18px}
.card{background:var(--card);border:1px solid var(--line);border-radius:24px;padding:24px;margin-top:20px}
.card h2{margin-top:0}
.emerg{background:var(--red-tint);border-color:#F3C9C6}
.emerg a{font-weight:800;color:var(--red-ink)}

/* ---------- tablets ---------- */
@media (max-width:980px){
  .navlinks a:not(.btn){display:none}
  .hero .wrap,.try .wrap,.punch,.faq .wrap{grid-template-columns:1fr;gap:34px}
  .hero-art{height:560px}
  .checker{max-width:560px}
  .timeline li{grid-template-columns:1fr;gap:6px;padding-left:30px}
  .story{grid-template-columns:1fr}
  .stage{display:none}
  .chapter{min-height:0;opacity:1;padding:34px 0;max-width:none}
  .inline-phone{display:flex;justify-content:center;margin-top:28px;background:var(--peach);border-radius:30px;padding-top:30px;height:420px;overflow:hidden}
  .chapter:nth-child(2) .inline-phone{background:#F6DCD8}
  .chapter:nth-child(3) .inline-phone{background:var(--green-tint)}
  .chapter:nth-child(4) .inline-phone{background:#ECE6DC}
  .bento{grid-template-columns:1fr 1fr}
  .plans{grid-template-columns:1fr;gap:22px}
  .plan.best{transform:none;order:-1}
  .ladder{grid-template-columns:1fr}
  .ladder::before{display:none}
}
/* ---------- phones ---------- */
@media (max-width:520px){
  body{font-size:16px}
  .wrap{padding:0 16px}
  .hero{padding:26px 0 44px}
  .offer span{font-size:13px;white-space:normal;line-height:1.25}
  .hero-art{height:500px}
  .phone.big{width:250px;border-radius:44px;padding:8px}
  .phone.big .scr{border-radius:37px}
  .phone.big .scr>img,.result img{margin-top:30px}
  .phone.big .sb{height:30px;font-size:12px}
  .phone.big .di{width:72px;height:20px;top:7px}
  .fc1{top:300px;left:-4px}
  .fc2{top:70px;right:-4px}
  .float-card{padding:10px 12px;font-size:13px}
  .float-card b{font-size:15px}
  .join form{flex-direction:column;border-radius:24px;padding:8px}
  .join input[type=email]{height:50px;padding:0 12px}
  .join .btn{width:100%}
  .join .note,.join .msg{padding-left:4px}
  .navlinks .btn{padding:9px 14px;min-height:38px;font-size:14px}
  .day,.features,.pricing,.try{padding:76px 0}
  .invite,.faq{padding-top:76px}
  .timeline{margin-top:44px}
  .timeline time{font-size:32px}
  .timeline h3{font-size:22px}
  .paws svg{width:32px;height:32px}
  .stat-line{font-size:24px}
  .checker{padding:16px;border-radius:26px}
  .answer h3{font-size:24px}
  .bento{grid-template-columns:1fr}
  .tile{padding:24px;border-radius:26px}
  .plan{padding:24px}
  .plan .amt{font-size:44px}
  .faq summary{font-size:19px}
  .status{padding:24px;border-radius:28px}
  .status h2{font-size:46px}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
  .intro .w,.intro-fade,.hero-art{opacity:1;transform:none}
  .result{transform:none}
  .scanline{display:none}
  .track{animation:none;flex-wrap:wrap;width:auto;justify-content:center}
  .track [aria-hidden]{display:none}
}