/* ============================================================================
   THEME — design tokens (colours, type, spacing, shadows, z-index)
   Premium · Navy · Royal Blue · Metallic Gold · White · Dark-tech gradient
   ============================================================================ */

/* --- Optional bundled fonts -------------------------------------------------
   For the exact ceremonial look, drop font files into /assets/fonts and
   uncomment these @font-face blocks. Until then, elegant system fonts are used.

@font-face{ font-family:"Cormorant Garamond"; src:url("../assets/fonts/CormorantGaramond.woff2") format("woff2"); font-weight:300 700; font-display:swap; }
@font-face{ font-family:"Sora"; src:url("../assets/fonts/Sora.woff2") format("woff2"); font-weight:200 800; font-display:swap; }
--------------------------------------------------------------------------- */

:root{
  /* ---- Core palette ---- */
  --navy-950: #04060F;
  --navy-900: #060B1A;
  --navy-850: #081124;
  --navy-800: #0A1428;
  --navy-700: #0E1C3C;
  --navy-600: #122553;

  --royal:      #2B5CE6;
  --royal-deep: #1E3A8A;
  --royal-soft: #4F7BF0;

  --gold-1:  #B8860B;   /* deep antique gold */
  --gold-2:  #C9A227;   /* metallic gold     */
  --gold-3:  #E7C56B;   /* light gold        */
  --gold-hi: #FFE9A8;   /* gold highlight    */
  --gold-glow: rgba(228,197,107,.55);

  --ribbon-red:  #B11226;
  --ribbon-red2: #7C0A1A;

  --white:   #F5F7FA;
  --white-2: #E6ECF5;
  --muted:   #9DB0CE;
  --muted-2: #6F84A8;

  /* ---- Glass ---- */
  --glass-bg:    rgba(20, 38, 74, 0.34);
  --glass-bg-2:  rgba(12, 24, 50, 0.55);
  --glass-brd:   rgba(228, 197, 107, 0.30);
  --glass-brd-2: rgba(160, 190, 240, 0.16);
  --glass-blur:  18px;

  /* ---- Gradients ---- */
  --grad-bg:
    radial-gradient(120% 90% at 50% -10%, #0E2150 0%, rgba(14,33,80,0) 55%),
    radial-gradient(90% 70% at 85% 110%, #122553 0%, rgba(18,37,83,0) 60%),
    radial-gradient(80% 60% at 10% 100%, #0a1b3a 0%, rgba(10,27,58,0) 55%),
    linear-gradient(180deg, #060B1A 0%, #04060F 100%);
  --grad-gold:  linear-gradient(135deg, var(--gold-1) 0%, var(--gold-3) 38%, var(--gold-hi) 52%, var(--gold-2) 70%, var(--gold-1) 100%);
  --grad-gold-soft: linear-gradient(180deg, var(--gold-hi), var(--gold-2));
  --grad-royal: linear-gradient(135deg, var(--royal-deep), var(--royal));

  /* ---- Type ---- */
  --font-display: "Cormorant Garamond","EB Garamond","Cambria","Georgia",serif;
  --font-ui: "Sora","Space Grotesk","Segoe UI",system-ui,-apple-system,"Helvetica Neue",Arial,sans-serif;
  --font-plaque: var(--font-display);

  /* ---- Shadows / glows ---- */
  --shadow-soft: 0 18px 60px rgba(0,0,0,.45);
  --shadow-card: 0 24px 80px rgba(0,0,0,.55), inset 0 1px 0 rgba(255,255,255,.06);
  --glow-gold:  0 0 28px rgba(228,197,107,.45), 0 0 64px rgba(228,197,107,.18);
  --glow-royal: 0 0 40px rgba(43,92,230,.40);

  /* ---- Geometry ---- */
  --stage-w: 1920px;
  --stage-h: 1080px;
  --radius:  22px;
  --radius-s: 14px;
  --hairline: 1px;

  /* ---- z-index ---- */
  --z-particles: 1;
  --z-grid: 2;
  --z-vignette: 3;
  --z-screens: 10;
  --z-confetti: 40;
  --z-progress: 50;
  --z-hint: 55;
  --z-controls: 60;
}