:root {
  --bg: #0B0B12;
  --surface: #16161F;
  --text: #F5F5F7;
  --muted: #A8A8B8;
  --grad: linear-gradient(105deg, #FFC400 0%, #FF8A00 22%, #FF2D95 48%, #8B2CF5 74%, #00C2FF 100%);
}
* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; background: var(--bg); color: var(--text); font-family: Poppins, system-ui, sans-serif; }
a { color: #00C2FF; text-decoration: none; }
a:hover { text-decoration: underline; }
.wrap { max-width: 820px; margin: 0 auto; padding: 2rem 1.25rem 4rem; }
header { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-bottom: 2.5rem; }
.logo {
  font-weight: 700; font-size: 1.6rem; letter-spacing: 0.02em;
  background: var(--grad); -webkit-background-clip: text; background-clip: text; color: transparent;
}
nav { display: flex; flex-wrap: wrap; gap: 1rem; font-size: 0.92rem; }
nav a { color: var(--muted); }
nav a:hover { color: var(--text); }
.hero {
  padding: 2.5rem 0 1.5rem;
  border-bottom: 1px solid #2A2A38;
  margin-bottom: 2rem;
}
.hero h1 {
  margin: 0 0 0.75rem; font-size: clamp(1.8rem, 4vw, 2.6rem); font-weight: 700;
  background: var(--grad); -webkit-background-clip: text; background-clip: text; color: transparent;
}
.hero p { margin: 0; color: var(--muted); max-width: 36rem; line-height: 1.6; }
.card {
  background: var(--surface); border: 1px solid #2A2A38; border-radius: 16px;
  padding: 1.5rem; margin: 1rem 0;
}
h2 { font-size: 1.15rem; margin: 0 0 0.75rem; }
p, li { color: var(--muted); line-height: 1.7; }
.note {
  display: inline-block; margin-top: 0.75rem; padding: 0.35rem 0.65rem;
  border-radius: 999px; font-size: 0.75rem; font-weight: 600;
  background: rgba(255, 196, 0, 0.12); color: #FFC400;
}
footer {
  margin-top: 3rem; padding-top: 1.5rem; border-top: 1px solid #2A2A38;
  color: var(--muted); font-size: 0.85rem; line-height: 1.6;
}
.btn {
  display: inline-block; margin-top: 1.25rem; padding: 0.85rem 1.4rem; border-radius: 999px;
  font-weight: 600; color: #0B0B12; background: var(--grad); text-decoration: none;
}
.btn:hover { text-decoration: none; filter: brightness(1.05); }