/* sites/fdcla-texas.org/fdcla-child/assets/css/tokens.css
   Palette sampled directly from Festival-Logo-with-Grey-Laurels-1.png.
   Percentages are that colour's share of the mark's opaque pixels. */

:root {
  /* Brand — sampled from the logo */
  --fdcla-slate:   #485460; /* laurel branches, 32.2% */
  --fdcla-cream:   #F0E4C0; /* film reel, 24.8% */
  --fdcla-crimson: #E41848; /* Dallas skyline, 20.9% */
  --fdcla-cyan:    #0CC0CC; /* "FESTIVAL", 16.3% */
  --fdcla-yellow:  #E4E424; /* "LATINO AMERICANO", 3.7% */
  --fdcla-magenta: #C60074; /* "CINE" position, 1.2% - logo's magenta (#E40084) darkened for contrast; white text is 5.75:1 */
  --fdcla-green:   #78B43C; /* "DE", 0.7% */

  /* Brand — from the Est-2016 dark-ground mark */
  --fdcla-purple:  #46066b;

  /* Derived */
  --fdcla-ink:     #1A1F26; /* darkened slate, for maximum-contrast text */
  --fdcla-paper:   #F7EFD8; /* lifted cream, for cards above the ground */
  --fdcla-white:   #FFFFFF;

  /* Crimson has TWO values because one cannot do both jobs.
     --fdcla-crimson is a FILL: white sits on it at 4.64:1, which passes.
     As TEXT on a light ground it fails - 3.66:1 on cream, 4.04:1 on paper.
     --fdcla-crimson-text is the darkened variant for crimson-as-text:
     5.20:1 on cream, 5.75:1 on paper. Same red family, legible.
     Never use --fdcla-crimson as a text colour on cream or paper. */
  --fdcla-crimson-text: #B81239;

  /* Semantic roles.
     TEXT roles may only ever reference slate, ink or white.
     Cyan, yellow and green are deliberately absent here — they are
     background-only, and that omission is what enforces it. */
  --fdcla-text:            var(--fdcla-slate);
  --fdcla-text-strong:     var(--fdcla-ink);
  --fdcla-text-on-dark:    var(--fdcla-white);
  --fdcla-text-on-purple:  var(--fdcla-yellow); /* large display only */

  --fdcla-bg:              var(--fdcla-cream);
  --fdcla-bg-card:         var(--fdcla-paper);
  --fdcla-bg-dark:         var(--fdcla-purple);

  /* Typography */
  --fdcla-font-display: 'Bungee', 'Arial Black', system-ui, sans-serif;
  --fdcla-font-body:    'Rubik', system-ui, -apple-system, 'Segoe UI', sans-serif;

  /* Rhythm */
  --fdcla-space-xs: 0.5rem;
  --fdcla-space-sm: 1rem;
  --fdcla-space-md: 2rem;
  --fdcla-space-lg: 4rem;
  --fdcla-space-xl: 6rem;
  --fdcla-radius:   14px;

  /* Motion — confined to hero and dividers per spec */
  --fdcla-sway-duration: 7s;
  --fdcla-ease:          cubic-bezier(0.34, 1.26, 0.64, 1);
}

body {
  background-color: var(--fdcla-bg);
  color: var(--fdcla-text);
  font-family: var(--fdcla-font-body);
}

h1, h2, h3, .fdcla-display {
  font-family: var(--fdcla-font-display);
  color: var(--fdcla-text-strong);
  letter-spacing: 0.01em;
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.001ms !important;
  }
}