:root{
  --fg:#f5f5f5;
  --muted:#d8d8d8;
  --accent:#4CAF50;
}

*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  color:var(--fg);
  font:400 16px/1.6 system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,Apple Color Emoji,Segoe UI Emoji;
  background:#000;
  display:flex;
  flex-direction:column;
  min-height:100dvh;
}

.video-bg{position:fixed;inset:0;overflow:hidden;z-index:-2}
.video{
  position:absolute;top:50%;left:50%;
  min-width:100%;min-height:100%;
  width:auto;height:auto;
  transform:translate(-50%,-50%);
  object-fit:cover;
  filter:saturate(1.05) contrast(1.05) brightness(.88);
}
.vignette{position:absolute;inset:0;background:radial-gradient(1200px 800px at 50% -10%, rgba(76,175,80,.18), transparent 60%);z-index:-1}
.scrim{position:absolute;inset:0;background:linear-gradient(to bottom, rgba(0,0,0,.50) 0%, rgba(0,0,0,.40) 35%, rgba(0,0,0,.55) 100%)}

.site-header{display:flex;align-items:center;justify-content:center;padding:clamp(12px,3vw,20px)}
.brand{width:min(40vw,800px);height:auto;filter:drop-shadow(0 6px 18px rgba(0,0,0,.35))}

.content{margin:auto;padding:clamp(16px, 4vw, 56px);text-align:center;display:grid;gap:.4rem}
.content h1{margin:0;font-size:clamp(28px,5vw,42px);letter-spacing:.02em}
.tag{margin:0;color:var(--muted);font-size:clamp(16px,2.4vw,18px)}
.soon{margin:.35rem 0 0;text-transform:uppercase;letter-spacing:.08em;font-weight:600}
.cta{margin-top:1rem;display:inline-block;color:#fff;text-decoration:none;border:1px solid rgba(255,255,255,.35);padding:.6rem 1rem;border-radius:999px;background:rgba(0,0,0,.2);backdrop-filter:saturate(1.2) blur(2px)}
.cta:hover{background:rgba(0,0,0,.34)}

.site-foot{text-align:center;padding:12px;font-size:.9rem;color:#d0d0d0}

@media (prefers-reduced-motion: reduce){.video{animation:none}}