:root {
  --bg: #f4f1e9; --surface: #fffdf8; --surface-2: #ece8df;
  --text: #13231f; --muted: #65706c; --line: #dcd8ce;
  --accent: #176f61; --accent-2: #5ec9b5; --accent-soft: #dcece8;
  --on-accent: #ffffff; --gold: #b68a3d; --danger: #a34434; --shadow: 0 26px 80px rgba(25,39,35,.12);
  color-scheme: light dark;
}
@media (prefers-color-scheme: dark) { :root {
  --bg:#0c110f; --surface:#151b18; --surface-2:#1d2522; --text:#edf2ef;
  --muted:#9ba7a2; --line:#29322e; --accent:#6ed1bd; --accent-2:#65cfba;
  --accent-soft:#19332d; --on-accent:#0c110f; --gold:#d7b66d; --shadow:0 30px 90px rgba(0,0,0,.38);
}}
* { box-sizing:border-box; }
html { scroll-behavior:smooth; -webkit-text-size-adjust:100%; }
body { margin:0; overflow-x:hidden; background:var(--bg); color:var(--text); font:17px/1.62 -apple-system,BlinkMacSystemFont,"SF Pro Text","Segoe UI",sans-serif; }
button,input { font:inherit; } a { color:var(--accent); text-underline-offset:4px; }
.wrap { width:min(1180px,calc(100% - 48px)); margin:0 auto; }
.skip-link { position:fixed; left:20px; top:-60px; z-index:99; padding:10px 16px; border-radius:10px; background:var(--text); color:var(--bg); transition:top .2s; }
.skip-link:focus { top:16px; }
header.site { position:sticky; top:0; z-index:20; border-bottom:1px solid color-mix(in srgb,var(--line) 70%,transparent); background:color-mix(in srgb,var(--bg) 82%,transparent); backdrop-filter:blur(18px) saturate(140%); }
.nav-wrap { height:72px; display:flex; justify-content:space-between; align-items:center; gap:22px; }
.brand { display:flex; align-items:center; gap:11px; color:var(--text); text-decoration:none; font-size:18px; font-weight:720; letter-spacing:-.01em; }
.brand img { width:34px; height:34px; border-radius:9px; box-shadow:0 5px 16px rgba(0,0,0,.18); }
nav.site { display:flex; align-items:center; gap:28px; }
nav.site a { color:var(--muted); text-decoration:none; font-size:14px; font-weight:620; transition:color .2s; }
nav.site a:hover,nav.site a[aria-current="page"] { color:var(--text); }

.hero { position:relative; min-height:790px; display:grid; align-items:center; padding:72px 0 84px; overflow:hidden; }
.hero-glow { position:absolute; width:700px; height:700px; right:-100px; top:60px; border-radius:50%; background:radial-gradient(circle,color-mix(in srgb,var(--accent-2) 20%,transparent),transparent 68%); filter:blur(20px); pointer-events:none; }
.hero-grid { display:grid; grid-template-columns:minmax(0,1.05fr) minmax(360px,.8fr); align-items:center; gap:90px; }
.eyebrow { margin:0 0 16px; color:var(--gold); font-size:12px; line-height:1.2; font-weight:760; letter-spacing:.14em; text-transform:uppercase; }
.eyebrow span { width:24px; height:1px; display:inline-block; vertical-align:middle; margin-right:10px; background:currentColor; }
.hero h1 { max-width:760px; margin:0 0 24px; font-size:clamp(52px,6.5vw,88px); line-height:.98; letter-spacing:-.055em; }
.hero h1 em { color:var(--accent); font-style:normal; font-weight:inherit; }
.lead { max-width:640px; margin:0 0 32px; color:var(--muted); font-size:clamp(18px,2vw,22px); line-height:1.55; }
.cta { display:flex; flex-wrap:wrap; gap:18px; align-items:center; }
.button { display:inline-flex; align-items:center; gap:12px; padding:14px 22px; border:1px solid var(--accent); border-radius:999px; background:var(--accent); color:var(--on-accent); text-decoration:none; font-size:15px; font-weight:720; box-shadow:0 12px 28px color-mix(in srgb,var(--accent) 20%,transparent); transition:transform .2s,box-shadow .2s; }
.button:hover { transform:translateY(-2px); box-shadow:0 16px 36px color-mix(in srgb,var(--accent) 28%,transparent); }
.availability { display:inline-flex; align-items:center; gap:8px; color:var(--muted); font-size:14px; }
.availability i,.live-pill i { width:8px; height:8px; border-radius:50%; background:var(--accent-2); box-shadow:0 0 0 5px color-mix(in srgb,var(--accent-2) 16%,transparent); }
.hero-facts { display:flex; gap:32px; margin:46px 0 0; }
.hero-facts div { min-width:96px; padding-left:14px; border-left:1px solid var(--line); }
.hero-facts dt { font-size:22px; font-weight:750; letter-spacing:-.03em; }.hero-facts dd { margin:0; color:var(--muted); font-size:12px; }
.hero-device { position:relative; display:grid; place-items:center; }
.phone { width:min(330px,78vw); overflow:hidden; border:9px solid #222a27; border-radius:54px; background:#111; box-shadow:var(--shadow),0 0 0 1px rgba(255,255,255,.2) inset; }
.phone img { display:block; width:100%; height:auto; }.hero-phone { transform:rotate(1.25deg); }
.signal-card { position:absolute; min-width:155px; padding:13px 16px; border:1px solid color-mix(in srgb,var(--line) 70%,transparent); border-radius:16px; background:color-mix(in srgb,var(--surface) 88%,transparent); box-shadow:0 15px 42px rgba(20,35,30,.14); backdrop-filter:blur(14px); }
.signal-card b,.signal-card small { display:block; }.signal-card b { font-size:14px; }.signal-card small { color:var(--muted); font-size:11px; }.signal-one { right:-20px; top:21%; }.signal-two { left:-40px; bottom:20%; }
.signal-dot { width:7px; height:7px; display:inline-block; margin-right:6px; border-radius:50%; }.green { background:#27a069; }
.proof-strip { border-block:1px solid var(--line); background:color-mix(in srgb,var(--surface) 40%,transparent); }
.proof-strip .wrap { min-height:74px; display:flex; align-items:center; justify-content:space-between; gap:20px; }
.proof-strip span { color:var(--muted); font-size:12px; font-weight:690; letter-spacing:.09em; text-transform:uppercase; }.proof-strip span::before { content:"◆"; margin-right:12px; color:var(--gold); font-size:8px; }

.band,.experience { padding:112px 0; border-top:1px solid var(--line); }
.split { display:grid; grid-template-columns:minmax(0,.92fr) minmax(460px,1.08fr); align-items:center; gap:90px; }
.split.reverse>:first-child { order:2; }.split.reverse>:last-child { order:1; }
.section-copy h2,.section-heading h2,.privacy-card h2,.closing h2 { margin:0 0 22px; font-size:clamp(38px,5vw,60px); line-height:1.04; letter-spacing:-.045em; }
.section-copy>p:not(.eyebrow),.section-heading>p:not(.eyebrow) { max-width:660px; color:var(--muted); font-size:18px; }
.section-heading { max-width:760px; margin-bottom:52px; }
.check-list { display:grid; gap:18px; margin:34px 0 0; padding:0; list-style:none; }.check-list li { position:relative; padding-left:34px; }.check-list li::before { content:"✓"; position:absolute; left:0; top:2px; width:22px; height:22px; display:grid; place-items:center; border-radius:50%; background:var(--accent-soft); color:var(--accent); font-size:12px; font-weight:800; }
.check-list b,.check-list span { display:block; }.check-list b { font-size:16px; }.check-list span { color:var(--muted); font-size:14px; }

.meter-demo { padding:34px; border:1px solid var(--line); border-radius:34px; background:var(--surface); box-shadow:var(--shadow); }
.demo-top { display:flex; justify-content:space-between; color:var(--muted); font-size:12px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; }.live-pill { display:inline-flex; gap:7px; align-items:center; color:var(--accent); }.live-pill i { width:6px; height:6px; animation:pulse 1.6s infinite; }
.demo-note { margin:24px 0 16px; text-align:center; font-size:74px; line-height:1; font-weight:770; letter-spacing:-.05em; }.meter-labels { display:flex; justify-content:space-between; margin-bottom:8px; color:var(--muted); font-size:12px; }
.meter-track { position:relative; height:18px; margin:0 10px; }.meter-track::before { content:""; position:absolute; left:0; right:0; top:8px; height:5px; border-radius:9px; background:var(--surface-2); }.meter-track .tick,.meter-track .center { position:absolute; top:4px; width:1px; height:13px; background:color-mix(in srgb,var(--muted) 45%,transparent); }
.t1 { left:0 }.t2 { left:25% }.center { left:50%; height:20px!important; top:0!important; background:var(--muted)!important }.t3 { left:75% }.t4 { right:0 }
.needle { position:absolute; left:38.75%; top:0; width:21px; height:21px; border-radius:50%; background:var(--gold); box-shadow:0 3px 10px color-mix(in srgb,var(--gold) 35%,transparent); transform:translateX(-50%); transition:left .35s ease,background .25s; }
.demo-reading { display:block; margin-top:18px; text-align:center; color:var(--gold); transition:color .25s; }.demo-reading strong { font-size:52px; line-height:1; letter-spacing:-.05em; }.demo-reading span { color:var(--muted); font-size:13px; }.demo-status { margin:2px 0 12px; text-align:center; color:var(--muted); font-size:13px; }
.settle { width:150px; height:4px; margin:0 auto 26px; overflow:hidden; border-radius:8px; background:var(--surface-2); }.settle span { display:block; width:62%; height:100%; background:var(--accent); transition:width .35s; }.meter-demo label { display:block; margin-bottom:5px; color:var(--muted); font-size:12px; }.meter-demo input[type="range"] { width:100%; accent-color:var(--accent); }
.quick-values { display:grid; grid-template-columns:repeat(4,1fr); gap:8px; margin-top:18px; }.quick-values button,.curve-modes button,.gallery-tabs button { border:1px solid var(--line); background:var(--bg); color:var(--muted); cursor:pointer; }.quick-values button { padding:8px; border-radius:10px; font-size:11px; }.quick-values button:hover { color:var(--text); border-color:var(--accent); }

.workflow { background:color-mix(in srgb,var(--surface) 42%,transparent); }.steps { margin:0; padding:0; list-style:none; border-top:1px solid var(--line); }.steps li { display:grid; grid-template-columns:90px 1fr; gap:20px; padding:32px 8px; border-bottom:1px solid var(--line); }.steps li>span { color:var(--accent); font-size:13px; font-weight:760; letter-spacing:.1em; }.steps h3 { margin:0 0 6px; font-size:clamp(22px,3vw,30px); letter-spacing:-.025em; }.steps p { max-width:720px; margin:0; color:var(--muted); }

.gallery { padding:18px; border:1px solid var(--line); border-radius:34px; background:var(--surface); box-shadow:var(--shadow); }.gallery-tabs { display:flex; gap:6px; padding:4px; overflow-x:auto; }.gallery-tabs button { flex:1 0 auto; padding:11px 16px; border-color:transparent; border-radius:999px; font-size:13px; font-weight:660; }.gallery-tabs button[aria-selected="true"] { background:var(--accent); color:var(--on-accent); }
.gallery-stage { min-height:720px; display:grid; grid-template-columns:.8fr 1.2fr; align-items:center; gap:40px; padding:44px; background:var(--bg); border-radius:24px; }.shot-copy { display:none; max-width:390px; }.shot-copy.is-active { display:block; animation:enter .45s ease both; }.shot-copy h3 { margin:0 0 14px; font-size:38px; line-height:1.06; letter-spacing:-.04em; }.shot-copy>p:not(.eyebrow) { color:var(--muted); }
.device-stage { min-width:0; display:grid; place-items:center; }.device-shot { grid-area:1/1; margin:0; text-align:center; }.device-shot[hidden] { display:none; }.device-shot.is-active { animation:deviceIn .5s cubic-bezier(.2,.7,.2,1) both; }.device-shot img { display:block; width:100%; height:auto; border:7px solid #202523; background:#111; box-shadow:0 26px 60px rgba(0,0,0,.22); }.phone-shot { width:min(330px,100%); }.phone-shot img { border-radius:48px; }.tablet-shot { width:min(610px,100%); }.tablet-shot img { border-radius:30px; }.device-shot figcaption { margin-top:14px; color:var(--muted); font-size:12px; }

.curve-story { overflow:hidden; }.curve-visual { padding:26px; border:1px solid var(--line); border-radius:28px; background:var(--surface); box-shadow:var(--shadow); }.curve-header,.curve-axis { display:flex; justify-content:space-between; color:var(--muted); font-size:11px; }.curve-visual svg { display:block; width:100%; height:auto; margin:14px 0 4px; }.grid-lines path { fill:none; stroke:var(--line); stroke-width:1; }.curve-fill { fill:url(#curveFill); }.curve-line { fill:none; stroke:var(--accent); stroke-width:4; stroke-linecap:round; }.curve-dots circle { fill:var(--surface); stroke:var(--accent); stroke-width:3; }
.curve-modes { display:inline-flex; gap:4px; padding:4px; margin:20px 0 10px; border:1px solid var(--line); border-radius:999px; background:var(--surface); }.curve-modes button { padding:8px 14px; border-color:transparent; border-radius:999px; font-size:13px; }.curve-modes button.active { background:var(--accent); color:var(--on-accent); }.mode-description { min-height:56px; }.fine-print { font-size:13px!important; }

.feature-depth { background:#10201c; color:#eef4f1; }.feature-depth .eyebrow { color:#d7b66d; }.feature-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; }.feature-card { min-height:250px; padding:26px; border:1px solid #31413b; border-radius:22px; background:#172a24; }.feature-card h3 { margin:28px 0 8px; font-size:20px; }.feature-card p { margin:0; color:#aebbb6; font-size:14px; }.feature-icon { width:38px; height:38px; display:grid; place-items:center; border-radius:12px; background:#21443a; color:#71dac4; font-size:22px; }
.privacy-card { display:grid; grid-template-columns:1fr 1fr; gap:80px; padding:52px; border-radius:34px; background:var(--accent-soft); }.privacy-card h2 { font-size:clamp(32px,4vw,48px); }.privacy-card p { margin-top:0; color:var(--muted); }.privacy-links { display:flex; gap:22px; margin-top:24px; }.privacy-links a { font-weight:670; }
.closing { padding:130px 0; text-align:center; }.closing img { border-radius:22px; box-shadow:var(--shadow); }.closing .eyebrow { margin-top:28px; }.closing h2 { font-size:clamp(48px,7vw,82px); }.closing p { color:var(--muted); }.ghost { margin-top:18px; background:transparent; color:var(--accent); box-shadow:none; }

.prose { max-width:760px; padding:64px 24px 96px; margin:0 auto; }.prose h1 { margin:0 0 6px; font-size:46px; letter-spacing:-.04em; }.prose h2 { margin:42px 0 8px; font-size:23px; }.prose .meta { margin:0 0 32px; color:var(--muted); }.prose ul { padding-left:22px; }.prose details { margin:12px 0; padding:15px 18px; border:1px solid var(--line); border-radius:14px; background:var(--surface); }.prose summary { cursor:pointer; font-weight:650; }.prose details p { color:var(--muted); }
footer.site { padding:34px 0 48px; border-top:1px solid var(--line); color:var(--muted); font-size:13px; } footer.site .wrap { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:20px; } footer.site a { margin-right:18px; color:var(--muted); }.footer-brand { margin-right:0!important; color:var(--text)!important; }

.reveal { opacity:0; transform:translateY(18px); transition:opacity .65s ease,transform .65s ease; }.reveal.visible { opacity:1; transform:none; }
@keyframes pulse { 50% { opacity:.35; transform:scale(.75); } } @keyframes enter { from { opacity:0; transform:translateY(10px); } } @keyframes deviceIn { from { opacity:0; transform:translateY(18px) scale(.985); } }
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } *,*::before,*::after { animation:none!important; transition:none!important; }.reveal { opacity:1; transform:none; } }
@media (max-width:920px) {
  .hero { min-height:auto; }.hero-grid,.split { grid-template-columns:1fr; gap:60px; }.hero-copy { padding-top:20px; }.hero-device { max-width:520px; margin:0 auto; }.split.reverse>:first-child,.split.reverse>:last-child { order:initial; }
  .proof-strip .wrap { flex-wrap:wrap; justify-content:center; padding-block:22px; }.feature-grid { grid-template-columns:repeat(2,1fr); }.gallery-stage { grid-template-columns:1fr; min-height:0; }.shot-copy { max-width:620px; }.privacy-card { grid-template-columns:1fr; gap:20px; }
}
@media (max-width:620px) {
  .wrap { width:min(100% - 30px,1180px); }.nav-wrap { height:62px; }.brand { font-size:16px; }.brand img { width:30px; height:30px; } nav.site { gap:15px; } nav.site a[href="#workflow"] { display:none; }
  .hero { padding:52px 0 68px; }.hero-grid { gap:52px; }.hero h1 { font-size:50px; }.hero-facts { gap:14px; justify-content:space-between; }.hero-facts div { min-width:0; padding-left:9px; }.hero-facts dt { font-size:18px; }.signal-card { display:none; }
  .band,.experience { padding:80px 0; }.section-heading { margin-bottom:36px; }.section-copy h2,.section-heading h2,.privacy-card h2 { font-size:38px; }.meter-demo { padding:24px 18px; }.quick-values { grid-template-columns:repeat(2,1fr); }.steps li { grid-template-columns:48px 1fr; padding:26px 2px; }
  .gallery { padding:8px; border-radius:24px; }.gallery-stage { gap:26px; padding:30px 14px; border-radius:18px; }.shot-copy h3 { font-size:32px; }.feature-grid { grid-template-columns:1fr; }.feature-card { min-height:0; }.privacy-card { padding:32px 24px; }.closing { padding:90px 0; }.closing h2 { font-size:48px; }
}