:root { --paper:#fafaf8; --ink:#191918; --coral:#ff6b47; --sage:#bcc8b4; --muted:#686762; --line:#dcdad3; --card:#f0efe9; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--paper); color:var(--ink); font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; }
a { color:inherit; }
.nav { height:82px; max-width:1180px; margin:auto; padding:0 28px; display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid var(--line); }
.brand { font-size:34px; font-weight:900; letter-spacing:-2px; text-decoration:none; }.brand span,.hero em { color:var(--coral); font-style:normal; }
.quiet-link { color:var(--muted); font-weight:700; text-decoration:none; }
main { overflow:hidden; }
.hero { min-height:720px; max-width:1180px; margin:auto; padding:88px 28px 96px; display:grid; grid-template-columns:1.02fr .98fr; align-items:center; gap:80px; }
.eyebrow { font-size:12px; font-weight:900; letter-spacing:.16em; margin:0 0 18px; }
h1 { font-size:clamp(54px,7vw,88px); line-height:.92; letter-spacing:-.065em; margin:0; max-width:720px; }
.lede { font-size:20px; line-height:1.55; color:var(--muted); max-width:600px; margin:32px 0; }
.actions,.store-links { display:flex; gap:12px; flex-wrap:wrap; }
.button { min-height:52px; display:inline-flex; align-items:center; justify-content:center; padding:0 22px; border:2px solid var(--ink); border-radius:14px; font-weight:850; text-decoration:none; transition:transform .18s ease,box-shadow .18s ease; }
.button:hover,.button:focus-visible { transform:translateY(-2px); box-shadow:0 6px 0 var(--ink); outline:none; }
.primary { background:var(--coral); }.secondary { background:transparent; }
.offer { color:var(--muted); font-size:13px; max-width:480px; margin-top:18px; }
.workout-shell { position:relative; background:#20201f; color:white; border-radius:34px; padding:30px; box-shadow:28px 32px 0 var(--sage); transform:rotate(1.5deg); }
.workout-shell:before { content:""; position:absolute; width:180px; height:180px; border-radius:50%; background:var(--coral); right:-82px; top:-90px; z-index:-1; }
.phone-top { display:flex; justify-content:space-between; font-size:13px; color:#aaa; }.status { color:var(--coral); font-weight:900; letter-spacing:.12em; }
.workout-shell h2 { font-size:32px; letter-spacing:-.04em; margin:30px 0 8px; }.rationale { color:#bdbdb7; line-height:1.45; margin:0 0 24px; }
.exercise { display:grid; grid-template-columns:32px 1fr auto; gap:13px; align-items:center; border-top:1px solid #3b3b39; padding:18px 0; }.exercise strong,.exercise small { display:block; }.exercise small { color:#9b9b96; margin-top:4px; }.number { color:#777; font-weight:800; }.pill { background:#343432; color:#d8d8d2; border-radius:99px; padding:6px 9px; font-size:10px; font-weight:900; letter-spacing:.08em; }
.start-bar { margin-top:12px; padding:17px 18px; border-radius:14px; background:var(--coral); color:var(--ink); display:flex; justify-content:space-between; font-size:13px; }
.steps { background:var(--ink); color:white; padding:100px max(28px,calc((100vw - 1124px)/2)); }.steps>h2,.invite h2,.download h2 { font-size:clamp(38px,5vw,58px); line-height:1; letter-spacing:-.05em; margin:0 0 52px; }
.step-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }.step-grid article { padding:28px; background:#262625; border:1px solid #3b3b38; border-radius:20px; }.step-grid article>span { width:34px; height:34px; display:grid; place-items:center; border-radius:50%; background:var(--coral); color:var(--ink); font-weight:900; }.step-grid h3 { font-size:22px; margin:28px 0 10px; }.step-grid p { color:#bdbdb7; line-height:1.55; margin:0; }
.invite { max-width:1124px; margin:0 auto; padding:110px 0; display:grid; grid-template-columns:1fr 1fr; gap:70px; border-bottom:1px solid var(--line); }.invite h2 { margin:0; }.invite>p { font-size:19px; line-height:1.7; color:var(--muted); margin:0; }
.download { max-width:1124px; margin:auto; padding:82px 0; display:grid; grid-template-columns:auto 1fr auto; gap:28px; align-items:center; }.download img { border-radius:22px; }.download h2 { margin:0; font-size:42px; }
footer { max-width:1180px; margin:auto; padding:28px; border-top:1px solid var(--line); color:var(--muted); display:flex; justify-content:space-between; font-size:13px; }
@media (max-width:900px) { .hero { grid-template-columns:1fr; padding-top:64px; gap:70px; }.workout-shell { max-width:590px; }.invite { margin:0 28px; }.download { margin:0 28px; grid-template-columns:auto 1fr; }.store-links { grid-column:1/-1; }.step-grid { grid-template-columns:1fr; } }
@media (max-width:620px) { .nav { height:68px; }.hero { padding:52px 20px 76px; }.lede { font-size:17px; }.workout-shell { padding:22px; border-radius:25px; box-shadow:14px 18px 0 var(--sage); }.workout-shell:before { width:120px; height:120px; right:-55px; top:-60px; }.exercise { grid-template-columns:27px 1fr; }.pill { display:none; }.start-bar { gap:10px; }.steps { padding:76px 20px; }.invite { grid-template-columns:1fr; gap:20px; padding:76px 0; margin:0 20px; }.download { margin:0 20px; padding:68px 0; grid-template-columns:1fr; }.download img { width:72px; height:72px; }.store-links { grid-column:auto; }.button { flex:1; min-width:145px; } footer { padding:24px 20px; flex-direction:column; gap:10px; } }
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; }.button { transition:none; } }
