/* Home page only. Shared header, footer, FAQ and launch styles live in site.css. */
.home{overflow-x:clip}
.home .site-header{position:sticky;top:0;z-index:10;height:76px;background:rgba(14,14,18,.72);-webkit-backdrop-filter:saturate(1.4) blur(14px);backdrop-filter:saturate(1.4) blur(14px);transition:border-color .3s;border-bottom:1px solid transparent}
.home .site-header.scrolled{border-bottom-color:#25252c}
.home section{scroll-margin-top:90px}

/* Hero */
.home .hero{grid-template-columns:1.05fr 1fr;min-height:min(calc(100vh - 76px),860px);padding-top:24px;padding-bottom:40px;overflow:visible}
.home h1{font-size:clamp(44px,5.6vw,76px);letter-spacing:-3px;line-height:1.02}
.home h1 em{display:block}
.home .hero-sub{font-size:19px;line-height:1.55;letter-spacing:-.2px;color:#c9c9cf;max-width:480px;margin-bottom:32px}
.hero-cta{display:flex;align-items:center;gap:18px;flex-wrap:wrap}
.hero-meta{margin:0;color:var(--muted);font-size:13px}
.founder-chip{display:inline-flex;align-items:center;gap:10px;margin:34px 0 0;padding:8px 16px 8px 8px;border:1px solid #2d2d34;border-radius:40px;background:#16161b;font-size:13px;color:#d4d4d9}
.founder-chip img{border-radius:50%}
.hero-art{position:relative;height:660px}
.glow{position:absolute;inset:8% 0;z-index:-1;border-radius:50%;background:radial-gradient(closest-side,rgba(34,197,94,.2),rgba(34,197,94,0))}
.phone-img{position:absolute;top:50%;left:50%;height:auto;filter:drop-shadow(0 30px 50px rgba(0,0,0,.6))}
.phone-front{width:300px;transform:translate(-78%,-50%)}
.phone-back{width:262px;transform:translate(8%,-44%);opacity:.9}
.chip{position:absolute;display:flex;gap:10px;align-items:center;padding:14px 18px;border-radius:20px;background:#1c1c22;border:1px solid rgba(255,255,255,.08);box-shadow:0 18px 40px rgba(0,0,0,.45);font-size:13px;line-height:1.35;color:#d4d4d9}
.chip-rom{flex-direction:column;align-items:flex-start;gap:2px;left:0;bottom:8%}
.chip-label{font-size:10px;letter-spacing:1.6px;text-transform:uppercase;font-weight:750;color:var(--muted)}
.chip-value{font-size:34px;font-weight:900;letter-spacing:-1px;color:var(--green);line-height:1.05}
.chip-sub{font-size:12px;color:#a5a5ad}
.chip-streak{right:0;top:14%}
.chip-streak strong{color:var(--text);font-weight:650}
.chip-dot{width:28px;height:28px;border-radius:50%;background:var(--green);box-shadow:0 0 0 5px rgba(34,197,94,.18);flex-shrink:0;position:relative}
.chip-dot:after{content:'';position:absolute;left:10px;top:6px;width:6px;height:11px;border:solid #08190e;border-width:0 2.5px 2.5px 0;transform:rotate(45deg)}

/* Direct answer block, written to be quoted by search and AI answers */
.answer{display:grid;grid-template-columns:1fr 1.4fr;gap:24px 80px;padding-top:60px;padding-bottom:90px;border-top:1px solid #23232a}
.answer h2{font-size:40px;letter-spacing:-1.6px;margin:0}
.answer-lead{font-size:18px;line-height:1.7;color:#c9c9cf;margin:0}
.answer-lead strong{color:var(--text)}
.facts{grid-column:1/-1;display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:24px 0 0}
.facts div{background:#16161b;border:1px solid #26262d;border-radius:18px;padding:18px 20px}
.facts dt{font-size:10px;letter-spacing:2px;font-weight:750;color:var(--muted);text-transform:uppercase;margin-bottom:6px}
.facts dd{margin:0;font-size:14px;line-height:1.5}

/* Video slot */
.video-band{padding-top:20px;padding-bottom:100px}
.video-intro{text-align:center;margin-bottom:32px}
.video-intro h2{font-size:44px;letter-spacing:-1.8px;line-height:1.1;margin:0}
.video-frame{position:relative;max-width:1000px;margin:0 auto;aspect-ratio:16/9;border-radius:28px;overflow:hidden;background:#141418;border:1px solid #26262d;box-shadow:0 40px 90px rgba(0,0,0,.5),0 0 0 1px rgba(34,197,94,.06)}
.video-frame.is-vertical{max-width:360px;aspect-ratio:9/16;border-radius:36px}
.video-frame video{width:100%;height:100%;object-fit:cover;display:block}
.video-sound{position:absolute;right:16px;bottom:16px;border:1px solid rgba(255,255,255,.14);background:rgba(14,14,18,.75);color:var(--text);font-size:12px;font-weight:650;letter-spacing:.3px;padding:9px 14px;border-radius:30px;cursor:pointer;transition:background .2s}
.video-sound:hover{background:rgba(34,197,94,.25)}
.video-sound .sound-on,.video-sound[aria-pressed=true] .sound-off{display:none}
.video-sound[aria-pressed=true] .sound-on{display:inline}

/* Feature tour: sticky phone on desktop, inline phones on mobile */
.tour{padding-top:40px;padding-bottom:60px}
.tour-grid{display:grid;grid-template-columns:1fr 1fr;gap:60px}
.tour-stage{position:sticky;top:110px;height:min(640px,calc(100vh - 140px));display:grid;place-items:center}
.tour-phone{position:absolute;height:100%;width:auto;max-width:100%;object-fit:contain;opacity:0;transform:translateY(16px) scale(.97);transition:opacity .5s ease,transform .6s cubic-bezier(.2,.8,.2,1);}
.tour-phone.is-active{opacity:1;transform:none}
.tour-steps{list-style:none;margin:0;padding:0}
.tour-step{min-height:min(72vh,620px);display:flex;flex-direction:column;justify-content:center;max-width:440px;transition:opacity .4s}
.js .tour-step{opacity:.35}
.js .tour-step.is-active{opacity:1}
.tour-step h3{font-size:34px;line-height:1.12;letter-spacing:-1.2px;margin:14px 0 16px}
.tour-step p{font-size:17px;line-height:1.7;color:#b8b8bf;margin:0}
.step-phone{display:none}
.phase-tag{align-self:flex-start;font-size:10px;letter-spacing:2px;font-weight:750;padding:6px 11px;border-radius:30px;color:#86e3a8;background:#14301f;border:1px solid #1f4a2e}
.phase-tag.gym{color:#9cc7ff;background:#14223a;border-color:#22385d}
.phase-tag.ai{color:var(--gold);background:rgba(251,191,36,.1);border-color:rgba(251,191,36,.35)}

/* Journey */
.journey{padding-top:60px;padding-bottom:100px}
.journey-path{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:16px;position:relative}
.journey-path:before{content:'';position:absolute;top:13px;left:14px;right:14px;height:2px;background:linear-gradient(90deg,var(--green),#2a6b43 70%,var(--gold))}
.journey-path li{position:relative;padding-top:44px}
.journey-path .node{position:absolute;top:4px;left:0;width:20px;height:20px;border-radius:50%;background:var(--bg);border:3px solid var(--green)}
.journey-path .goal .node{border-color:var(--gold);transform:rotate(45deg);border-radius:4px}
.journey-path h3{font-size:20px;letter-spacing:-.5px;margin-bottom:8px}
.journey-path p{font-size:14px;color:var(--muted);line-height:1.6;margin:0;max-width:240px}

/* Interactive symmetry */
.try{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center;padding-top:40px;padding-bottom:110px}
.try h2{font-size:44px;letter-spacing:-1.8px;line-height:1.1;margin-bottom:18px}
.try-copy>p:not(.eyebrow){color:var(--muted);font-size:16px}
.try-card{background:linear-gradient(170deg,#1b1b21,#141418);border:1px solid #2a2a31;border-radius:28px;padding:30px}
.try-card label{display:flex;justify-content:space-between;font-size:13px;font-weight:600;color:#d4d4d9;margin-top:14px}
.try-card output{font-variant-numeric:tabular-nums;color:var(--text)}
.try-card input[type=range]{width:100%;margin:12px 0 6px;accent-color:var(--green);height:28px}
.try-result{display:flex;align-items:baseline;gap:12px;margin-top:20px}
.try-value{font-size:72px;font-weight:900;letter-spacing:-3px;line-height:1;font-variant-numeric:tabular-nums;color:var(--green);transition:color .3s}
.try-value.mid{color:#f59e0b}
.try-value.low{color:#f97316}
.try-label{font-size:12px;letter-spacing:2px;color:var(--muted);text-transform:uppercase;font-weight:700}
.try-bar{height:8px;border-radius:8px;background:#26262d;margin:16px 0 18px;overflow:hidden}
.try-bar span{display:block;height:100%;width:75%;border-radius:8px;background:var(--green);transition:width .25s ease,background .3s}
.fine-print{font-size:12px;line-height:1.7;color:#8d8d96;margin:0}
.fine-print.center{text-align:center;margin-top:22px}

/* Founder */
.founder{padding-top:90px;padding-bottom:100px;border-top:1px solid #23232a;display:grid;grid-template-columns:1fr 1.2fr;gap:0 80px}
.founder .eyebrow{grid-column:1/-1}
.founder h2{font-size:40px;letter-spacing:-1.6px;line-height:1.12}
.founder-body p{font-size:17px;line-height:1.8;color:#c3c3c9}
.founder .signature{color:var(--text);font-weight:650;margin:0}

/* Pricing */
.pricing{padding-bottom:110px}
.plans{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.plan{position:relative;background:#16161b;border:1px solid #26262d;border-radius:24px;padding:28px}
.plan.featured{border-color:rgba(251,191,36,.5);background:linear-gradient(170deg,rgba(251,191,36,.08),#16161b 60%)}
.plan-badge{position:absolute;top:-11px;left:24px;font-size:10px;letter-spacing:1.5px;font-weight:800;color:#1a1405;background:var(--gold);padding:4px 10px;border-radius:20px}
.plan h3{font-size:14px;letter-spacing:1.5px;text-transform:uppercase;color:var(--muted);margin-bottom:12px}
.price{font-size:40px;font-weight:800;letter-spacing:-1.5px;margin-bottom:8px}
.price span{font-size:15px;font-weight:500;color:var(--muted);letter-spacing:0}
.plan>p:last-child{font-size:13px;color:var(--muted);margin:0}

/* Guides */
.learn{padding-bottom:40px}
.guide-cards{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.guide-cards a{display:block;background:#16161b;border:1px solid #26262d;border-radius:22px;padding:24px;transition:border-color .25s,transform .25s}
.guide-cards a:hover{border-color:#2f6b45;transform:translateY(-3px)}
.guide-cards h3{font-size:17px;letter-spacing:-.3px;margin-bottom:8px}
.guide-cards p{font-size:13px;color:var(--muted);line-height:1.6;margin:0}

/* Scroll reveal (only when JS has marked the page ready) */
.js .reveal{opacity:0;transform:translateY(24px);transition:opacity .7s ease,transform .7s cubic-bezier(.2,.8,.2,1)}
.js .reveal.in{opacity:1;transform:none}

@media(prefers-reduced-motion:reduce){
  .js .reveal{opacity:1;transform:none;transition:none}
  .tour-phone{transition:none}
}

@media(max-width:950px){
  .home .hero{grid-template-columns:1fr;max-height:none;min-height:0;text-align:center;gap:20px;padding-top:40px}
  .home .hero-sub,.home h1{margin-left:auto;margin-right:auto}
  .hero-cta{justify-content:center}
  .hero-copy .eyebrow{justify-content:center}
  .hero-art{height:560px;max-width:520px;margin:0 auto;width:100%}
  .phone-front{width:250px}
  .phone-back{width:218px}
  .answer,.founder,.try{grid-template-columns:1fr;gap:24px}
  .facts{grid-template-columns:1fr 1fr}
  .tour-grid{display:block}
  .tour-stage{display:none}
  .js .tour-step,.tour-step{min-height:0;max-width:none;opacity:1;padding:40px 0;align-items:center;text-align:center}
  .tour-step .phase-tag{align-self:center}
  .tour-step p{max-width:520px}
  .step-phone{display:block;width:240px;height:auto;margin-top:30px}
  .journey-path{grid-template-columns:1fr 1fr;row-gap:36px}
  .journey-path:before{display:none}
  .plans,.guide-cards{grid-template-columns:1fr 1fr}
}
@media(max-width:700px){
  .home .site-header{height:64px}
  .home .site-header nav a:not(.nav-pill){display:none}
  .home h1{font-size:42px;letter-spacing:-2px}
  .home .hero-sub{font-size:17px}
  .hero-art{height:450px}
  .phone-front{width:200px;transform:translate(-72%,-50%)}
  .phone-back{width:172px;transform:translate(2%,-44%)}
  .chip{padding:10px 13px;font-size:11px;border-radius:16px}
  .chip-value{font-size:26px}
  .chip-rom{left:0;bottom:10%}
  .chip-streak{top:8%}
  .answer h2,.founder h2,.video-intro h2{font-size:32px}
  .video-frame{border-radius:20px}
  .try h2{font-size:34px}
  .answer{padding-top:40px;padding-bottom:60px}
  .facts,.plans,.guide-cards,.journey-path{grid-template-columns:1fr}
  .tour-step h3{font-size:28px}
  .try-card{padding:22px}
  .try-value{font-size:60px}
}

/* FAQ: the + turns into × as the answer slides open */
.faq-list summary:after,.faq-list details[open] summary:after{content:'+';transition:transform .32s cubic-bezier(.2,.8,.2,1);display:inline-block}
.faq-list details.is-open summary:after,html:not(.js) .faq-list details[open] summary:after{transform:rotate(45deg)}
.faq-list summary{transition:color .2s}
.faq-list summary:hover{color:#fff}
