:root { --background:#050505; --surface:#0d0d0e; --foreground:#f7f7f7; --muted:#a5a5a8; --teal:#28a6a2; --line:rgba(255,255,255,.12); }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; background:var(--background); }
body { margin:0; min-width:320px; background:radial-gradient(circle at 50% 18%,rgba(40,166,162,.11),transparent 24rem),var(--background); color:var(--foreground); font-family:Arial,Helvetica,sans-serif; -webkit-font-smoothing:antialiased; }
a { color:inherit; }
.hero { position:relative; min-height:calc(100vh - 126px); overflow:hidden; padding:clamp(3.5rem,8vw,7.5rem) 1.5rem 5rem; }
.hero::before,.hero::after { position:absolute; content:""; border:1px solid rgba(255,255,255,.055); border-radius:50%; pointer-events:none; }
.hero::before { width:42rem; height:42rem; left:-24rem; top:4rem; }
.hero::after { width:30rem; height:30rem; right:-18rem; top:16rem; }
.hero-copy { position:relative; z-index:2; margin:0 auto; max-width:920px; text-align:center; }
.app-icon { width:clamp(78px,8vw,112px); height:auto; margin-bottom:1.4rem; border-radius:23%; box-shadow:0 18px 50px rgba(0,0,0,.42); }
.eyebrow { margin:0 0 .75rem; color:var(--teal); font-size:.8rem; font-weight:700; letter-spacing:.2em; text-transform:uppercase; }
h1 { margin:0; font-size:clamp(3rem,8vw,6.75rem); font-weight:800; letter-spacing:-.065em; line-height:.95; }
.tagline { margin:1.35rem auto 0; color:#c8c8ca; font-size:clamp(1.05rem,2.2vw,1.45rem); line-height:1.55; }
.screenshots { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); align-items:end; gap:clamp(.6rem,2.4vw,2rem); width:min(100%,1040px); margin:clamp(3rem,7vw,6rem) auto 0; padding:0 clamp(.2rem,2vw,1.5rem); pointer-events:none; user-select:none; }
.screenshot { margin:0; filter:drop-shadow(0 32px 42px rgba(0,0,0,.58)); }
.screenshot-1,.screenshot-3 { transform:translateY(7%) scale(.91); opacity:.82; }
.screenshot img { display:block; width:100%; height:auto; }
.download-panel { position:relative; z-index:2; margin:clamp(3.5rem,6vw,5.5rem) auto 0; text-align:center; }
.download-panel>p { margin:0 0 1rem; color:var(--muted); font-size:.78rem; font-weight:700; letter-spacing:.18em; text-transform:uppercase; }
.store-links { display:flex; justify-content:center; align-items:center; gap:1rem; flex-wrap:wrap; }
.store-links a { display:flex; align-items:center; justify-content:center; height:64px; border-radius:12px; transition:transform .2s ease,filter .2s ease; }
.store-links a:hover { transform:translateY(-3px); filter:brightness(1.1); }
.store-links a:focus-visible { outline:3px solid var(--teal); outline-offset:5px; }
.store-links img { display:block; width:auto; height:64px; max-width:100%; }
.site-footer { padding:2rem 1.5rem 2.5rem; border-top:1px solid var(--line); color:#89898c; text-align:center; font-size:.875rem; }
.site-footer nav { display:flex; flex-wrap:wrap; justify-content:center; gap:.7rem 1.5rem; }
.site-footer a { text-decoration:none; }
.site-footer a:hover { color:#fff; }
.site-footer p { margin:1.25rem 0 0; font-size:.78rem; }
.legal-page { min-height:100vh; padding:clamp(3rem,8vw,6rem) 1.25rem; }
.legal-card { width:min(100%,760px); margin:0 auto; padding:clamp(1.5rem,5vw,3.75rem); border:1px solid var(--line); border-radius:24px; background:rgba(13,13,14,.9); box-shadow:0 32px 80px rgba(0,0,0,.38); }
.back-link { display:inline-flex; margin-bottom:2.25rem; color:var(--teal); font-size:.9rem; text-decoration:none; }
.legal-card h1 { font-size:clamp(2.3rem,7vw,4.5rem); }
.legal-card h2 { margin:2.5rem 0 .75rem; font-size:1.35rem; }
.legal-card h3 { margin:1.8rem 0 .6rem; font-size:1.05rem; }
.legal-card p,.legal-card li { color:#c5c5c7; font-size:1rem; line-height:1.75; }
.legal-card ul { padding-left:1.2rem; }
.legal-card a { color:#71d2cf; text-underline-offset:.2em; }
.legal-card .intro { margin-top:1.25rem; color:#e4e4e5; font-size:1.12rem; }
.legal-card .fine-print { color:#7e7e82; font-size:.85rem; }
@media (max-width:680px) {
  .hero { padding:2.75rem 1rem 3.5rem; }
  .screenshots { grid-template-columns:1fr 1fr; gap:.5rem; margin-top:2.6rem; padding:0; }
  .screenshot-1,.screenshot-2 { transform:none; opacity:1; }
  .screenshot-3 { display:none; }
  .download-panel { margin-top:2.8rem; }
  .store-links { flex-direction:column; gap:.8rem; }
  .store-links a { width:auto; max-width:100%; height:64px; }
  .store-links img { width:auto; height:64px; max-width:calc(100vw - 2rem); }
  .site-footer nav { flex-direction:column; gap:.85rem; }
}
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } .store-links a { transition:none; } }