/* Dark tech look with silver accents */
:root{
  --bg: radial-gradient(1200px 800px at 20% 10%, #2a2a2a 0%, #141414 60%, #0b0b0b 100%);
  --text: #d9d9d9;
  --muted: #a8a8a8;
  --silver: #c0c0c0;
  --glass: rgba(255,255,255,0.06);
  --border: rgba(255,255,255,0.12);
}

*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  font:16px/1.6 system-ui, -apple-system, Segoe UI, Roboto, Inter, Arial, sans-serif;
  color:var(--text);
  background:var(--bg) fixed no-repeat;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
.wrap{
  min-height:100%;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  padding:48px 20px;
  gap:28px;
}

.brand{
  text-align:center;
}
.logo{
  width:350px;
  height:auto;
  filter: drop-shadow(0 6px 24px rgba(0,0,0,.4));
  margin-bottom:6px;
}
h1{
  margin:0 0 6px 0;
  letter-spacing:2px;
  font-weight:800;
  font-size: clamp(28px, 5vw, 42px);
  background: linear-gradient(180deg,#f2f2f2,#bdbdbd 65%, #9e9e9e);
  -webkit-background-clip:text;
  background-clip:text;
  color: transparent;
}
.tag{
  margin:0;
  color:var(--silver);
  opacity:.9;
  font-size: clamp(14px, 2.4vw, 18px);
}

.card{
  width:min(720px, 96vw);
  border:1px solid var(--border);
  background:linear-gradient(180deg, rgba(255,255,255,.07), rgba(255,255,255,.03));
  backdrop-filter: blur(8px);
  border-radius:20px;
  padding:24px;
  box-shadow: 0 10px 40px rgba(0,0,0,.45);
}
.lead{
  margin:0 0 16px 0;
  color:#e3e3e3;
  font-size: clamp(16px, 2.6vw, 20px);
}
.cta{
  display:flex;
  gap:12px;
  flex-wrap:wrap;
}
.btn{
  appearance:none;
  border-radius:14px;
  padding:12px 18px;
  text-decoration:none;
  font-weight:600;
  border:1px solid var(--border);
  transition: transform .06s ease, box-shadow .2s ease, background .2s ease;
  will-change: transform;
  color:var(--text);
}
.btn[aria-disabled="true"]{opacity:.6; pointer-events:none}
.btn.primary{
  background:#2a2a2a;
  box-shadow: 0 4px 16px rgba(0,0,0,.35);
}
.btn.primary:hover{ transform: translateY(-1px); box-shadow: 0 8px 24px rgba(0,0,0,.45); }
.btn.ghost{
  background:transparent;
}
.btn.ghost:hover{
  background:var(--glass);
}

.foot{
  color:var(--muted);
  font-size:14px;
  text-align:center;
  opacity:.9;
}

/* Small screens */
@media (max-width:480px){
  .card{padding:18px}
  .btn{width:100%; text-align:center}
}