:root { color-scheme: dark; --bg:#080910; --text:#f5f1fc; --muted:#b0abc2; --pink:#ff00d4; --cyan:#00dcec; --line:#2b293f; font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; background:var(--bg); color:var(--text); }
* { box-sizing:border-box; } body { margin:0; } a { color:inherit; text-decoration:none; }
a:focus-visible { outline:2px solid var(--cyan); outline-offset:6px; }
.page { max-width:1600px; margin:auto; padding:30px 6vw; }
header,footer { display:flex; justify-content:space-between; align-items:center; gap:24px; }
header { padding-bottom:24px; border-bottom:1px solid var(--line); }
.brand { font-size:30px; font-weight:750; letter-spacing:-2px; } .brand span { color:var(--pink); }
nav { display:flex; gap:20px; font-size:14px; color:var(--muted); } nav a { display:flex; align-items:center; min-height:44px; padding:0 4px; } nav a:hover { color:var(--text); }
.label { font-size:11px; letter-spacing:2px; text-transform:uppercase; color:var(--muted); }
.hero { padding:84px 0 0; }
.hero-copy { display:flex; align-items:flex-end; justify-content:space-between; gap:48px; margin-bottom:40px; }
.eyebrow { display:flex; align-items:center; gap:10px; margin:0 0 20px; }
.dot { width:7px; height:7px; border-radius:50%; background:var(--cyan); }
h1 { font-size:clamp(90px,13vw,190px); line-height:.82; letter-spacing:-.075em; margin:0; font-weight:650; } h1 span { color:var(--pink); }
.intro { max-width:350px; } .intro p { color:var(--muted); font-size:17px; line-height:1.65; margin:0 0 20px; }
.text-link { color:var(--cyan); font-size:14px; display:inline-flex; align-items:center; gap:6px; min-height:44px; padding:10px 0; }
html,body { overflow-x:clip; }
.voice > * { min-width:0; }
figure { margin:0; }
.product-image { display:block; border:1px solid #333047; border-radius:14px; overflow:hidden; background:#000; box-shadow:0 -24px 100px -65px var(--pink); }
.product-image img { display:block; width:100%; height:auto; }
figcaption { display:flex; justify-content:space-between; gap:24px; padding:16px 0; color:var(--muted); font-size:12px; } figcaption span:last-child { color:var(--cyan); }
.voice { display:grid; grid-template-columns:.65fr 1.35fr; align-items:center; gap:6vw; padding:100px 0; }
h2 { font-size:clamp(32px,3.4vw,52px); line-height:1.08; letter-spacing:-.04em; font-weight:550; margin:20px 0; }
.voice p { color:var(--muted); line-height:1.75; font-size:16px; max-width:350px; }
.product-image video { display:block; width:100%; max-width:100%; height:auto; }
.voice .product-image { box-shadow:0 10px 100px -70px var(--cyan); }
.coming { border-top:1px solid var(--line); display:flex; justify-content:space-between; gap:32px; align-items:center; padding:44px 0; }
.coming h2 { margin:0 0 12px; font-size:28px; } .coming p { margin:0; color:var(--muted); font-size:14px; line-height:1.7; max-width:580px; }
.status { white-space:nowrap; border:1px solid #59405c; border-radius:100px; padding:12px 18px; font-size:12px; color:#f4bce9; }
.origin { margin:0 0 20px; font-size:13px; line-height:1.5; color:var(--muted); }
#wave { position:fixed; inset:0; width:100%; height:100vh; height:100lvh; z-index:-1; pointer-events:none; }
html:not(.wave-on) #wave,html:not(.wave-on) .drive { display:none; }
.drive { height:340vh; }
.drive-view { position:sticky; top:0; height:100vh; height:100svh; display:flex; justify-content:space-between; align-items:flex-end; gap:24px; padding-bottom:36px; }
.drive-text { min-width:0; }
.drive h2 { font-size:clamp(44px,7vw,104px); line-height:1; letter-spacing:-.045em; font-weight:550; margin:10px 0 12px; }
.drive-readout { font-variant-numeric:tabular-nums; color:var(--text); }
.drive-bar { display:block; height:3px; width:clamp(160px,22vw,320px); background:var(--line); margin-bottom:14px; }
.drive-bar i { display:block; height:100%; background:var(--pink); transform:scaleX(0); transform-origin:left; }
.drive p.drive-note { margin:0; color:var(--muted); font-size:14px; line-height:1.6; max-width:340px; }
#drive-curve { flex:none; width:clamp(92px,15vw,200px); height:clamp(92px,15vw,200px); background:#000; border:1px solid #333047; border-radius:10px; }
footer { border-top:1px solid var(--line); padding-top:24px; padding-bottom:8px; font-size:12px; color:var(--muted); }
@media (max-width:720px) {
.page { padding:20px max(20px,env(safe-area-inset-right)) 24px max(20px,env(safe-area-inset-left)); } .hero { padding-top:44px; }
.hero-copy { flex-direction:column; align-items:flex-start; gap:30px; } h1 { font-size:clamp(90px,24vw,150px); }
.intro { max-width:420px; } .intro p { font-size:16px; }
.voice { grid-template-columns:1fr; padding:60px 0; gap:24px; } .voice p { max-width:none; }
.coming { flex-direction:column; align-items:flex-start; } figcaption { font-size:12px; gap:8px; flex-direction:column; line-height:1.5; }
footer { flex-wrap:wrap; gap:12px; } nav { gap:14px; }
.label { font-size:10px; letter-spacing:1.5px; } .product-image { border-radius:8px; }
}

header { flex-wrap:wrap; } nav a[aria-current="page"] { color:var(--cyan); }
@media(max-width:400px) { header { gap:8px; } nav { width:100%; justify-content:space-between; gap:8px; } }
.brand { display:inline-flex; align-items:center; min-height:44px; }