:root {
  --bg: #02050b;
  --panel: #101827;
  --muted: #e8f4ff;
  --cyan: #73f5ff;
  --gold: #fff05a;
  --line: #ff5f57;
}

.hero {
  grid-template-columns: minmax(360px, 560px) 1fr;
  gap: clamp(2rem, 5vw, 5rem);
  background:
    radial-gradient(circle at 83% 22%, rgba(115, 245, 255, .24), transparent 28%),
    radial-gradient(circle at 18% 82%, rgba(255, 95, 87, .22), transparent 30%),
    linear-gradient(120deg, #02050b, #3a1820);
}

.cover::after { border-width: 3px; }

@media (max-width: 780px) {
  .hero { grid-template-columns: 1fr; }
}