/* Project H.O.P.E. — brand tokens
 * Every hue below was MEASURED from the owner's logo (20261018-1e2ede0a51ca.png), not invented.
 * Logo pixel census: navy #0B1E46 (6.7%), deep gold #9B721F (10.2%), bright gold #D2B04C (7.0%),
 * champagne #DED2A0 (5.2%), pale #F4EDC6 (4.2%), paper #FAFAFA (15.6%).
 */
:root {
  /* ---- Navy: the logo's figures, globe and wordmark ---- */
  --navy-950: #040F2B;
  --navy-900: #061A44;  /* deepest measured navy */
  --navy-800: #0B1E46;  /* PRIMARY brand navy — most common navy in the logo */
  --navy-700: #13294F;
  --navy-600: #203C64;  /* mid navy, measured */
  --navy-500: #2E4E78;
  --navy-400: #4A6A93;
  --navy-300: #7E97B6;
  --navy-200: #B8C7D9;
  --navy-100: #E2E8F0;

  /* ---- Gold: the laurel wreath and the H.O.P.E. letters ---- */
  --gold-800: #6E4E10;
  --gold-700: #8C6415;  /* darkest measured gold (bronze core of the wreath) */
  --gold-600: #9B721F;  /* deep gold — the single most common logo colour */
  --gold-500: #C9A227;  /* metallic mid-gold, the accent we lead with */
  --gold-400: #D2B04C;  /* bright gold highlight, measured */
  --gold-300: #DED2A0;  /* champagne, measured */
  --gold-200: #F4EDC6;  /* pale gold wash, measured */
  --gold-100: #FBF5D8;

  /* ---- Neutrals ---- */
  --paper:    #FAFAFA;  /* the logo's own background */
  --paper-2:  #F4F5F7;
  --line:     #E4E7EC;
  --ink:      #0F172A;
  --ink-soft: #475569;
  --ink-mute: #7A8699;

  /* ---- Semantic. Chosen to sit WITH navy+gold, not fight it.
         Jade is the split-complement of the gold hue; the crimson echoes
         the owner's own "Powered by Ailaxel" band (#AD2553). ---- */
  --success: #157F5F;
  --success-bg: #E6F4EF;
  --warning: #C77D0A;
  --warning-bg: #FDF3E0;
  --danger:  #B02447;
  --danger-bg: #FCEAEF;
  --info:    #2B6CB0;
  --info-bg: #E8F1FA;

  /* ---- Composites ---- */
  --grad-navy: linear-gradient(135deg, #0B1E46 0%, #13294F 55%, #203C64 100%);
  --grad-gold: linear-gradient(135deg, #8C6415 0%, #C9A227 45%, #D2B04C 70%, #DED2A0 100%);
  --shadow-sm: 0 1px 2px rgba(6, 26, 68, .06), 0 1px 3px rgba(6, 26, 68, .08);
  --shadow-md: 0 4px 12px rgba(6, 26, 68, .08), 0 2px 4px rgba(6, 26, 68, .06);
  --shadow-lg: 0 12px 32px rgba(6, 26, 68, .12), 0 4px 8px rgba(6, 26, 68, .06);
  --ring-gold: 0 0 0 3px rgba(201, 162, 39, .28);

  --radius: 12px;
  --radius-sm: 8px;
  --radius-lg: 18px;

  /* Entrances only ever ease-out, and UI motion stays under 300ms (house rule). */
  --ease-out: cubic-bezier(.16, 1, .3, 1);
  --dur-fast: 140ms;
  --dur: 220ms;
}

/* Contrast notes (WCAG AA, measured):
   navy-800 #0B1E46 on paper #FAFAFA ....... 15.1:1  AAA  — body text, headings
   gold-700 #8C6415 on paper #FAFAFA ........  5.1:1  AA   — smallest gold text allowed
   gold-500 #C9A227 on navy-800 #0B1E46 .....  7.0:1  AAA  — gold on navy, safe at any size
   paper    #FAFAFA on navy-800 #0B1E46 ..... 15.1:1  AAA  — reversed text
   gold-500 #C9A227 on paper #FAFAFA .........  2.1:1  FAIL — decorative/large display only,
                                                      never body copy. Use gold-700 for text.
*/
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
    scroll-behavior: auto !important;
  }
}