@import url('https://fonts.googleapis.com/css2?family=Baloo+2:wght@600;700;800&family=Permanent+Marker&family=Inter:wght@400;500;600;700;800&display=swap');

:root {
  --bg: #0d0509;
  --primary: #ff2e93;
  --secondary: #ffffff;
  --accent: #ff7cc0;

  --surface: #1a0a12;
  --surface-2: #241019;
  --border: rgba(255, 130, 190, 0.16);
  --text: #fff5fa;
  --text-dim: #d9a8bf;
  --success: #35d68a;
  --danger: #ff5470;

  --font-display: 'Baloo 2', 'Inter', sans-serif;
  --font-heading: 'Baloo 2', 'Inter', sans-serif;
  --font-script: 'Permanent Marker', cursive;
  --font-body: 'Inter', system-ui, sans-serif;
}

.script {
  font-family: var(--font-script);
  font-weight: 400;
  color: var(--accent);
  text-transform: none;
  letter-spacing: 0;
}

.hero-banner::before {
  background:
    radial-gradient(circle at 18% 18%, rgba(255, 46, 147, 0.30), transparent 45%),
    radial-gradient(circle at 82% 28%, rgba(255, 124, 192, 0.22), transparent 45%);
}

/* Password step for access-code programs (ECYSA team registration) */
.access-gate { max-width: 460px; margin: 48px auto; }
.access-gate .field { margin-bottom: 18px; }
.card-lock-tag { display: inline-block; margin-left: 8px; font-size: 12px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--accent, #ff7cc0); }