:root{
  --text:#f0f0f0;
  --muted:#a0a0a0;
  --accent:#e02828;
}

*{margin:0;padding:0;box-sizing:border-box;font-family:system-ui,sans-serif;}

body{background:#000;color:var(--text);overflow:hidden;}

.site-header{
  height:72px;background:rgba(0,0,0,0.9);
  border-bottom:1px solid #111;z-index:10;
}

.container{max-width:1200px;margin:auto;padding:1.5rem 2rem;}
.nav{display:flex;justify-content:space-between;align-items:center;}
.logo{display:flex;gap:0.75rem;align-items:center;}
.logo img{height:40px;}
.desktop-nav a{margin-left:1.5rem;color:var(--muted);}

.hero{position:relative;height:calc(100vh - 72px);overflow:hidden;}
#gfx{position:absolute;inset:0;z-index:1;}

.hero-content{
  position:relative;z-index:2;height:100%;
  display:flex;flex-direction:column;justify-content:center;align-items:center;
  text-align:center;pointer-events:none;padding:0 1rem;
}
.cta{pointer-events:auto;}
.btn{margin:0.5rem;padding:0.75rem 1.5rem;border-radius:6px;border:none;font-size:1rem;cursor:pointer;}
.primary{background:var(--accent);color:#fff;font-weight:700;}
.ghost{border:1px solid var(--accent);background:transparent;color:var(--accent);}

.err{
  margin-top:14px;
  max-width:860px;
  color:#ffd2d2;
  font-size:12px;
  line-height:1.35;
  white-space:pre-wrap;
  pointer-events:auto;
}