:root{--bg:#f6efe3;--panel:#fffaf1;--fg:#1d2433;--muted:#6b6f78;--line:#dccfb8;--green:#1f5f4a;--green-soft:#dcebe3;--orange:#e07a12;--gold:#f2c14e;--blue:#4a5fa8;--blue-soft:#dde3f5;--pink:#a3306e;--pink-soft:#f5dbe8;--display:"Barlow Condensed","Arial Narrow",Impact,sans-serif;--body:"Source Sans 3","Segoe UI",system-ui,sans-serif;color-scheme:light}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--bg:#17191f;--panel:#20232b;--fg:#ede6d8;--muted:#a09a8e;--line:#363a45;--green:#6fc29c;--green-soft:#1f3a30;--orange:#f0925a;--gold:#d9a93a;--blue:#8ea2e8;--blue-soft:#242d4d;--pink:#e07ab0;--pink-soft:#44203a;color-scheme:dark}}
:root[data-theme="dark"]{--bg:#17191f;--panel:#20232b;--fg:#ede6d8;--muted:#a09a8e;--line:#363a45;--green:#6fc29c;--green-soft:#1f3a30;--orange:#f0925a;--gold:#d9a93a;--blue:#8ea2e8;--blue-soft:#242d4d;--pink:#e07ab0;--pink-soft:#44203a;color-scheme:dark}
*{box-sizing:border-box}html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--fg);font-family:var(--body);font-size:17px;line-height:1.5}
a{color:var(--green)}img{max-width:100%;display:block}
.wrap{max-width:1080px;margin:0 auto;padding:0 20px}
h1,h2,h3{font-family:var(--display);font-weight:700;line-height:1.05;margin:0;text-wrap:balance;letter-spacing:.01em}
h1{font-size:clamp(40px,7vw,72px)}h2{font-size:clamp(30px,4.5vw,44px)}h3{font-size:24px}
.eyebrow{font-family:var(--display);font-size:14px;letter-spacing:.12em;text-transform:uppercase;color:var(--green);font-weight:600}
.muted{color:var(--muted)}
nav{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:16px 0;flex-wrap:wrap}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--fg);font-family:var(--display);font-size:24px;font-weight:700}
.brand img{width:40px;height:40px;border-radius:10px}
nav ul{list-style:none;display:flex;gap:18px;margin:0;padding:0;align-items:center;flex-wrap:wrap}
nav ul a{color:var(--fg);text-decoration:none;font-weight:600;font-size:15px}
.btn{display:inline-flex;align-items:center;gap:8px;border-radius:999px;padding:12px 22px;font-weight:600;text-decoration:none;border:1px solid var(--line);background:var(--panel);color:var(--fg);font-size:16px;line-height:1.1}
.btn.pri{background:var(--green);border-color:var(--green);color:#fff}
.btn.store{background:#000;border-color:#000;color:#fff;padding:10px 20px}
.btn.store small{display:block;font-size:11px;font-weight:400;opacity:.85;line-height:1}
.btn.store b{display:block;font-size:19px;font-weight:600;line-height:1.1}
.btn.store .apple{font-size:26px;line-height:1}
.btn.soon{background:var(--panel);color:var(--muted);border-style:dashed;cursor:default}
.hero{display:grid;grid-template-columns:1.15fr .85fr;gap:40px;align-items:center;padding:48px 0 32px}
.hero p.lead{font-size:21px;color:var(--muted);max-width:52ch;margin:16px 0 24px}
.cta{display:flex;gap:14px;align-items:center;flex-wrap:wrap}.cta .note{font-size:14px;color:var(--muted)}
.phone{width:min(300px,80vw);margin:0 auto;border-radius:44px;border:10px solid #1d2433;background:#1d2433;box-shadow:0 30px 60px rgba(0,0,0,.25);overflow:hidden;aspect-ratio:1320/2868}
.phone img{width:100%;height:100%;object-fit:cover}
.phone.sm{width:min(240px,70vw);border-width:8px;border-radius:36px}
section{padding:56px 0}
/* .alt bands bleed to the window edges; the padding puts the content back on the page column. */
section.alt{background:var(--panel);border-top:1px solid var(--line);border-bottom:1px solid var(--line);margin-inline:calc(50% - 50vw);padding-inline:calc(50vw - 50%)}
html,body{overflow-x:clip}
.sec-h{max-width:60ch;margin-bottom:28px}.sec-h p{color:var(--muted);font-size:19px;margin:10px 0 0}
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.grid4{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
@media (max-width:1000px){.grid4{grid-template-columns:1fr 1fr}}
.card{background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:22px}
section.alt .card{background:var(--bg)}
.card .ic{width:44px;height:44px;border-radius:12px;display:grid;place-items:center;font-size:22px;margin-bottom:12px;background:var(--green-soft);color:var(--green)}
.card.b .ic{background:var(--blue-soft);color:var(--blue)}.card.p .ic{background:var(--pink-soft);color:var(--pink)}
.card p{margin:8px 0 0;color:var(--muted)}
.feat{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center;padding:28px 0}
.feat:nth-child(even) .phone{order:-1}
.feat h3{font-size:30px}.feat p{color:var(--muted);font-size:18px}
.feat ul{padding-left:18px;color:var(--muted);margin:10px 0 0}.feat li{margin:4px 0}
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;counter-reset:s}
.steps .card{position:relative;padding-top:60px}.steps .card::before{counter-increment:s;content:counter(s);position:absolute;top:18px;left:22px;font-family:var(--display);font-size:34px;font-weight:700;color:var(--gold)}
.price{max-width:520px;margin:0 auto;text-align:center;background:var(--panel);border:2px solid var(--green);border-radius:20px;padding:32px 24px}
.price .big{font-family:var(--display);font-size:64px;font-weight:700;line-height:1}.price .big small{font-size:22px;color:var(--muted);font-weight:600}
.price ul{list-style:none;padding:0;margin:18px auto;text-align:left;display:table}.price li{padding:4px 0}.price li::before{content:"✓ ";color:var(--green);font-weight:700}
details{border-top:1px solid var(--line);padding:14px 0}details:last-of-type{border-bottom:1px solid var(--line)}
summary{cursor:pointer;font-weight:600;font-size:18px;list-style:none;display:flex;justify-content:space-between;align-items:center}summary::after{content:"+";font-family:var(--display);font-size:26px;color:var(--muted)}details[open] summary::after{content:"–"}
details p{color:var(--muted);margin:8px 0 0}
footer{padding:36px 0 48px;color:var(--muted);font-size:14px;border-top:1px solid var(--line)}
footer .row{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;align-items:center}footer a{color:var(--muted)}
.doc{max-width:72ch;padding:32px 0 64px}.doc h2{font-size:26px;margin:32px 0 8px}.doc p,.doc li{color:var(--fg)}.doc .muted{color:var(--muted)}
.kbd{background:var(--panel);border:1px solid var(--line);border-radius:6px;padding:1px 6px;font-size:15px}
@media (max-width:820px){.grid4{grid-template-columns:1fr}.hero{grid-template-columns:1fr;text-align:center;padding-top:28px}.hero p.lead{margin-inline:auto}.cta{justify-content:center}.grid3,.steps{grid-template-columns:1fr}.feat{grid-template-columns:1fr;gap:20px;text-align:center}.feat:nth-child(even) .phone{order:0}.feat ul{display:inline-block;text-align:left}nav ul{gap:12px}}
@media (prefers-reduced-motion:no-preference){.btn{transition:transform .12s}.btn:hover{transform:translateY(-1px)}}