/* ==========================================================================
   MAX [MAXIMOS] — CORE TOKENS
   Single source of truth. Semua media meng-import file ini.
   DILARANG hardcode warna/spacing/radius di level media.
   Brand: Max [Maximos] · Canggu, Bali · +62 889-9420-0515 · @maximosbali
   ========================================================================== */

:root {
  /* ------------------------------------------------------------------
     BACKGROUND SCALE — hitam (bukan #000) → abu-abu gelap netral.
     DOMINASI WARNA (keputusan user, Fase 1): hitam + abu gelap dominan,
     merah HANYA aksen. Maroon muncul sebatas hint di ujung gradient.
     Flat #000000 dilarang sebagai bg halaman.
     ------------------------------------------------------------------ */
  --bg-0: #0B0A0B; /* near-black, dasar halaman */
  --bg-1: #121112; /* panel gelap */
  --bg-2: #1A191A; /* abu gelap */
  --bg-3: #221D1F; /* abu gelap + hint maroon — ujung gradient */

  /* Solid surfaces (card opaque, alternatif glass utk print/foto ramai) */
  --surface-1: #171617;
  --surface-2: #201F20;

  /* ------------------------------------------------------------------
     CRIMSON SCALE — FINAL (keputusan user): Opsi B "crimson-warm bridge",
     nyambung ke merah logo (#FF2305). Merah = AKSEN, bukan warna dominan.
     ATURAN: red-100–300 = hover/heading terang (AA di semua bg).
     red-500 = aksen inti — sebagai teks HANYA heading besar di bg-0/bg-1
     (3.34:1 AA large; di bg-2/bg-3 kontras < 3.0 → pakai red-300).
     red-600–900 = elemen grafis/permukaan saja, BUKAN teks.
     Crimson DILARANG sebagai warna body text di atas bg gelap.
     ------------------------------------------------------------------ */
  --red-100: #FF6A5A;
  --red-200: #F84E3E;
  --red-300: #EE3A2C;
  --red-400: #DC2A20;
  --red-500: #C41E1A;
  --red-600: #A31217;
  --red-700: #821016;
  --red-800: #611013;
  --red-900: #40090C;
  --red-950: #2A0709; /* maroon terdalam — hanya untuk permukaan/vignette red-deep */

  /* Glossy accents */
  --red-gloss: #FFD9CF;       /* specular highlight di permukaan merah lacquer */
  --gold-seam: #FFC440;       /* emas bevel dari logo — aksen langka, jangan diobral */

  /* ------------------------------------------------------------------
     TEXT — teks selalu putih/abu. Kontras terhadap bg-0…bg-3 & surface:
     primary ≥15.6:1 · secondary ≥9.9:1 · muted ≥5.3:1 (semua AA ok)
     ------------------------------------------------------------------ */
  --text-primary: #F5F1EE;    /* off-white hangat — heading & body utama */
  --text-secondary: #C9C2BE;  /* abu terang — body sekunder */
  --text-muted: #948C89;      /* label, caption, metadata */
  --text-on-red: #FFF6F4;     /* teks di atas red-500+ (5.56:1 pada red-500) */

  /* ------------------------------------------------------------------
     GLASS — glassmorphism (digital only; print pakai .glass--print)
     ------------------------------------------------------------------ */
  --glass-bg: rgba(255, 244, 240, 0.05);
  --glass-bg-strong: rgba(255, 244, 240, 0.09);
  --glass-border: rgba(255, 244, 240, 0.14);
  --glass-highlight: rgba(255, 255, 255, 0.08); /* inner glow */
  --glass-blur: 24px;

  /* ------------------------------------------------------------------
     SPACING — skala 4px-based
     ------------------------------------------------------------------ */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --space-10: 40px;
  --space-12: 48px;
  --space-16: 64px;
  --space-20: 80px;
  --space-24: 96px;
  --space-32: 128px;

  /* ------------------------------------------------------------------
     RADIUS
     ------------------------------------------------------------------ */
  --radius-sm: 6px;   /* badge, input */
  --radius-md: 10px;  /* button */
  --radius-lg: 16px;  /* card, glass panel */
  --radius-xl: 24px;  /* hero panel */
  --radius-pill: 999px;

  /* ------------------------------------------------------------------
     SHADOW & GLOW
     ------------------------------------------------------------------ */
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.5), 0 2px 8px rgba(0, 0, 0, 0.35);
  --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.45), 0 12px 32px rgba(0, 0, 0, 0.35);
  --shadow-lg: 0 12px 32px rgba(0, 0, 0, 0.5), 0 32px 80px rgba(0, 0, 0, 0.45);
  --glow-red: 0 0 24px rgba(238, 58, 44, 0.28), 0 0 64px rgba(196, 30, 26, 0.18);

  /* ------------------------------------------------------------------
     BORDERS & RULES
     ------------------------------------------------------------------ */
  --rule-subtle: rgba(255, 244, 240, 0.10); /* garis pemisah tipis */
  --rule-strong: rgba(255, 244, 240, 0.18);
}
