/* ==========================================================================
   DESIGN TOKENS
   Source of truth: MEDFEST V Brand Presentation (Novura Studios).
   Brand colors:  fb0376 (magenta) · 662d91 (purple) · 000000 (black) · fff4d2 (cream)
  Brand type:    Display "Neulis" · Subheading/Body "Poppins"
   ========================================================================== */

@font-face {
  font-family: "Neulis";
  src: url("../assets/fonts/Neulis%20Font%20Family/Neulis-SemiBold.otf")
    format("opentype");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

:root {
  /* ---- Brand colors (verbatim from brand doc) ---- */
  --brand-magenta: #fb0376;
  --brand-purple: #662d91;
  --brand-black: #000000;
  --brand-cream: #fff4d2;

  /* ---- Semantic color roles ---- */
  --color-background: #0c0410; /* near-black with a purple cast — festival night sky */
  --color-background-alt: #150819; /* slightly lifted panel background */
  --color-surface: #1c0d22; /* cards, panels */
  --color-surface-glass: rgba(
    102,
    45,
    145,
    0.28
  ); /* glassmorphism fill, tinted with brand purple */
  --color-border-glass: rgba(255, 244, 210, 0.14);
  --color-primary: var(--brand-magenta);
  --color-secondary: var(--brand-purple);
  --color-text: var(--brand-cream);
  --color-text-dim: #cbb9c4;
  --color-muted: #8d7a92;
  --color-accent: var(--brand-magenta);
  --color-on-light: var(--brand-black);

  /* Light section variant (for future content sections that flip to cream) */
  --color-background-light: var(--brand-cream);
  --color-text-on-light: #241129;

  /* ---- Typography ---- */
  --font-display: "Neulis", sans-serif;
  --font-body: "Poppins", system-ui, sans-serif;

  --fs-2xs: 0.75rem;
  --fs-xs: 0.875rem;
  --fs-sm: 1rem;
  --fs-md: 1.25rem;
  --fs-lg: 1.75rem;
  --fs-xl: 2.5rem;
  --fs-2xl: clamp(2.75rem, 6vw, 4.5rem);
  --fs-3xl: clamp(3.5rem, 9vw, 7.5rem);

  /* ---- Spacing scale ---- */
  --space-3xs: 0.25rem;
  --space-2xs: 0.5rem;
  --space-xs: 0.75rem;
  --space-sm: 1rem;
  --space-md: 1.5rem;
  --space-lg: 2.5rem;
  --space-xl: 4rem;
  --space-2xl: 6rem;
  --space-3xl: 9rem;

  /* ---- Radius ---- */
  --radius-sm: 0.5rem;
  --radius-md: 1rem;
  --radius-lg: 1.75rem;
  --radius-pill: 999px;

  /* ---- Motion ---- */
  --transition-fast: 150ms ease;
  --transition-medium: 320ms cubic-bezier(0.22, 1, 0.36, 1);
  --transition-slow: 640ms cubic-bezier(0.22, 1, 0.36, 1);

  /* ---- Layout ---- */
  --container-max: 1280px;
  --container-pad: clamp(1.25rem, 5vw, 3rem);
  --nav-height: 84px;

  /* ---- Elevation ---- */
  --shadow-glass: 0 8px 32px rgba(0, 0, 0, 0.45);
  --shadow-glow-magenta: 0 0 60px rgba(251, 3, 118, 0.35);
  --shadow-glow-purple: 0 0 80px rgba(102, 45, 145, 0.45);

  --z-nav: 100;
  --z-menu: 200;
  --z-overlay: 150;
}