:root{--sand:#f6ead3;--sand2:#efdcb9;--ink:#2d241b;--muted:#6b5a47;--sunset:#e8783a;--sunset2:#f2a541;--ocean:#1f6f78;--deep:#0f3740}
*{box-sizing:border-box}html{scroll-behavior:smooth}
body{margin:0;font-family:Nunito,system-ui,sans-serif;color:var(--ink);background:var(--sand);line-height:1.6;font-size:18px}
img{max-width:100%;display:block}
h1,h2,.logo{font-family:Caveat,"Segoe Print",cursive;font-weight:700;line-height:1.05;margin:0 0 .4em}
h1{font-size:clamp(3rem,7vw,5.6rem)}h2{font-size:clamp(2.6rem,5vw,3.8rem);color:var(--deep)}h3{margin:.3em 0}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.kicker{text-transform:uppercase;letter-spacing:.14em;font-size:.78rem;font-weight:800;color:var(--sunset);margin:0 0 .3em}
section{padding:96px 6vw}
.center{max-width:720px;margin:0 auto;text-align:center}
/* hero */
.hero{position:relative;min-height:100vh;min-height:100svh;display:flex;align-items:flex-end;color:#fff;overflow:hidden}
.hero-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:60% 50%;animation:drift 30s ease-in-out infinite alternate}
@keyframes drift{to{transform:scale(1.07)}}
.hero:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(15,30,40,.45) 0,rgba(15,30,40,0) 30%,rgba(20,20,30,.15) 50%,rgba(25,15,10,.85) 100%)}
.nav{position:absolute;top:0;left:0;right:0;z-index:2;display:flex;justify-content:space-between;align-items:center;padding:22px 6vw}
.logo{font-size:2rem;margin:0}
.nav-cta{color:#fff;text-decoration:none;font-weight:800;font-size:.9rem;border:1.5px solid rgba(255,255,255,.7);padding:8px 16px;border-radius:999px;backdrop-filter:blur(4px)}
.hero-inner{position:relative;z-index:2;padding:0 6vw 9vh;max-width:820px}
.eyebrow{font-weight:800;letter-spacing:.14em;text-transform:uppercase;font-size:.8rem;color:var(--sunset2);margin:0 0 .5em}
.lede{font-size:1.15rem;max-width:600px;text-shadow:0 1px 8px rgba(0,0,0,.5)}
.hero h1{text-shadow:0 3px 20px rgba(0,0,0,.45)}
.fine{font-size:.85rem;opacity:.85;margin-top:.6em}
/* form */
.waitlist{display:flex;flex-wrap:wrap;gap:10px;max-width:520px;margin-top:1.4em}
.cta .waitlist{margin:1.4em auto 0}
.waitlist input{flex:1 1 240px;padding:15px 20px;border-radius:999px;border:2px solid transparent;font:inherit;font-size:1rem;background:#fffaf1;color:var(--ink)}
.waitlist input:focus{outline:none;border-color:var(--sunset2)}
.waitlist button{padding:15px 26px;border:0;border-radius:999px;font:inherit;font-weight:800;font-size:1rem;color:#fff;cursor:pointer;background:linear-gradient(135deg,var(--sunset),var(--sunset2));box-shadow:0 8px 24px rgba(232,120,58,.4);transition:transform .2s}
.waitlist button:hover{transform:translateY(-2px)}
.form-msg{flex-basis:100%;margin:.2em 0 0;font-weight:700;min-height:1.4em}
.form-msg.err{color:#ffb4a0}.cta .form-msg.err{color:#b8432a}
.waitlist.done input,.waitlist.done button{display:none}
.waitlist.done .form-msg{font-family:Caveat,cursive;font-size:1.8rem}
/* split */
.split,.desk{display:grid;grid-template-columns:1fr 1.15fr;gap:64px;align-items:center;max-width:1240px;margin:0 auto}
.photo{margin:0}.photo img,.days img{border-radius:22px;box-shadow:0 24px 50px rgba(60,35,10,.25)}
figcaption{font-family:Caveat,cursive;font-size:1.5rem;color:var(--muted);margin-top:.5em;text-align:center}
.pairs{list-style:none;padding:0;margin:1.2em 0}
.pairs li{display:grid;grid-template-columns:1fr auto 1fr;gap:12px;align-items:center;background:#fffaf1;border-radius:14px;padding:12px 18px;margin-bottom:10px;box-shadow:0 4px 14px rgba(60,35,10,.07)}
.pairs b{color:var(--sunset)}.pairs span:last-child{font-weight:800;color:var(--ocean)}
/* learns */
.learns{background:var(--sand2)}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;max-width:1140px;margin:48px auto 0}
.card{background:#fffaf1;border-radius:22px;padding:30px;box-shadow:0 10px 30px rgba(60,35,10,.1)}
.card p{color:var(--muted);margin:0}.ico{font-size:2.2rem}
/* weather */
.weather{position:relative;padding:0;min-height:640px;display:flex;align-items:center;color:#fff;overflow:hidden}
.weather img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.weather:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(8,20,30,.85),rgba(8,20,30,.2) 65%)}
.weather-copy{position:relative;z-index:1;max-width:520px;padding:96px 6vw}
.weather h2{color:#fff}.weather .kicker{color:var(--sunset2)}
/* progress */
.days{display:grid;grid-template-columns:1fr 1fr;gap:36px;max-width:1240px;margin:48px auto 0}
.days figure{margin:0}.days img{aspect-ratio:16/9;object-fit:cover;width:100%}
.tag{display:inline-block;font-family:Nunito,sans-serif;font-size:.8rem;font-weight:800;color:#fff;background:var(--ocean);border-radius:999px;padding:2px 12px;margin-right:10px;vertical-align:middle}
/* desk */
.desk{grid-template-columns:1.1fr 1fr}
.device{background:#1d1d1f;border-radius:34px;padding:16px;box-shadow:0 30px 60px rgba(30,20,10,.35),inset 0 0 0 2px #444;transform:rotate(-2deg)}
.screen{border-radius:20px;overflow:hidden;aspect-ratio:4/3}.screen img{width:100%;height:100%;object-fit:cover}
.checks{padding:0;list-style:none}.checks li{padding-left:34px;position:relative;margin-bottom:12px}
.checks li:before{content:"🌴";position:absolute;left:0}
/* cta */
.cta{background:linear-gradient(180deg,var(--sand) 0,#f7c98f 55%,var(--sunset) 130%);padding:120px 6vw}
footer{display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px;padding:26px 6vw;background:var(--deep);color:#cfe3e1;font-size:.9rem}
/* reveal */
.reveal{opacity:0;transform:translateY(24px);transition:opacity .8s ease,transform .8s ease}
.reveal.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none}.hero-bg{animation:none}}
@media (max-width:860px){
 body{font-size:17px}section{padding:68px 6vw}
 .split,.desk,.days,.cards{grid-template-columns:1fr;gap:32px}
 .desk .device{order:2}
 .weather{min-height:560px}.weather:after{background:linear-gradient(0deg,rgba(8,20,30,.9),rgba(8,20,30,.3))}
 .weather{align-items:flex-end}.weather-copy{padding:60px 6vw}
 .nav-cta{display:none}
 .hero-bg{object-position:30% 50%}
 .waitlist button{flex:1 1 100%}
}

.wordmark{margin:0 0 .25em;display:flex;flex-direction:column;line-height:.85;text-shadow:0 4px 28px rgba(0,0,0,.5)}
.wm-top{font-family:Nunito,sans-serif;font-weight:800;font-size:clamp(.95rem,1.6vw,1.25rem);letter-spacing:.5em;text-transform:uppercase;color:var(--sunset2);margin-left:.3em}
.wm-milo{font-size:clamp(6rem,15vw,11.5rem);letter-spacing:.02em;color:#fff8ec}
.wm-sub{font-size:clamp(2rem,3.6vw,2.9rem);color:var(--sunset2);margin-left:.15em}
.tagline{font-family:Caveat,cursive;font-weight:700;font-size:clamp(1.9rem,3.2vw,2.6rem);line-height:1.1;margin:.2em 0 .3em;text-shadow:0 2px 14px rgba(0,0,0,.5)}
.hero .eyebrow{margin-bottom:.8em}
.hero:before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(90deg,rgba(15,20,25,.55),rgba(15,20,25,0) 55%)}
.wm-top{text-shadow:0 2px 10px rgba(0,0,0,.8);margin-bottom:.25em}
.wm-sub{margin-top:.15em}
.tagline{margin-top:.5em}
.hero .eyebrow{text-transform:none;letter-spacing:.02em;font-size:1rem;font-style:italic;color:#ffd9a8;font-weight:600;text-shadow:0 1px 8px rgba(0,0,0,.6)}
/* v3 */
:root{--btn1:#a4461a;--btn2:#b4501f}
.kicker{color:#a4461a}
.weather .kicker,.cta .kicker{color:var(--sunset2)}
.waitlist button{background:linear-gradient(135deg,var(--btn1),var(--btn2));box-shadow:0 8px 24px rgba(164,70,26,.35)}
.waitlist button:disabled{opacity:.75;cursor:wait;transform:none}
.form-msg.ok{color:#d7f5e3}.cta .form-msg.ok{color:#1f6a43}
.form-msg.note{color:#ffe2b8}.cta .form-msg.note{color:#5a3a12}
.fine a{color:inherit}
.cta .fine{color:#4a3520;margin-top:1em}
footer a{color:#cfe3e1}
html.js .reveal{opacity:0;transform:translateY(24px)}
html.js .reveal.in{opacity:1;transform:none}
.reveal{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){html.js .reveal{opacity:1;transform:none}}
/* sound */
.sound{display:flex;flex-wrap:wrap;align-items:center;gap:10px 14px;margin:.4em 0 .2em}
.sound-btn{display:inline-flex;align-items:center;gap:10px;padding:10px 18px 10px 12px;border-radius:999px;border:1.5px solid rgba(255,255,255,.75);background:rgba(15,25,30,.45);backdrop-filter:blur(6px);color:#fff;font:inherit;font-weight:800;font-size:.95rem;cursor:pointer}
.sound-btn:hover{background:rgba(15,25,30,.65)}
.sound-ico{display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:#fff;color:var(--deep);font-size:.75rem}
.sound-btn[aria-pressed=true] .sound-ico{animation:pulse 2.4s ease-in-out infinite}
@keyframes pulse{50%{box-shadow:0 0 0 8px rgba(255,255,255,.18)}}
.sound-note{font-size:.8rem;opacity:.9;text-shadow:0 1px 6px rgba(0,0,0,.6)}
/* concept badges */
figure,.screen{position:relative}
.badge{position:absolute;top:12px;left:12px;z-index:2;font:800 .68rem/1 Nunito,sans-serif;letter-spacing:.08em;text-transform:uppercase;color:#fff;background:rgba(20,20,20,.62);padding:6px 10px;border-radius:999px;backdrop-filter:blur(4px)}
.weather .badge-tr{position:absolute;top:18px;right:18px;left:auto}
.weather-copy{position:static}
.weather-copy>*:not(.badge){position:relative;z-index:1}
/* legal */
.legal{background:var(--sand)}.legal-main{max-width:720px;margin:0 auto;padding:60px 6vw}
.legal h1{font-size:4rem;color:var(--deep)}.legal h2{font-size:2.2rem}.legal a{color:var(--ocean)}
.hero-inner{padding-top:100px}
