/* Marigold & Cedar — design tokens.
   These mirror the Elementor Global Colors exactly. Elementor globals drive
   the widgets; these variables let custom CSS and the child theme reference
   the same values without hardcoding a hex anywhere. */

:root {
  --nws-primary:        #0F5257; /* Cedar Teal    — 8.9:1 on white */
  --nws-primary-600:    #146B72; /* Teal 600      — 5.6:1 on white */
  --nws-primary-100:    #E3F0F0; /* Teal Wash     — backgrounds only */

  --nws-marigold:       #F2A007; /* decorative + large display ONLY */
  --nws-marigold-deep:  #A85E00; /* accessible marigold for text — 5.6:1 */
  --nws-marigold-100:   #FDF3E0;

  --nws-cta:            #C1361F; /* Vermilion — Donate button only */
  --nws-cta-hover:      #9C2A15;

  --nws-accent:         #2E6B4F; /* Sanctuary Green — "Free" pills, success */

  --nws-ink:            #16181D;
  --nws-slate:          #4A5058;
  --nws-mist:           #E4E7E2;
  --nws-paper:          #FDFCF9;
  --nws-white:          #FFFFFF;

  --nws-error:          #B3261E;
  --nws-focus:          #0B57D0;

  --nws-r-card: 12px;
  --nws-r-btn:  8px;
  --nws-r-pill: 999px;

  --nws-sh-sm: 0 1px 2px rgba(22,24,29,.06);
  --nws-sh-md: 0 4px 12px rgba(22,24,29,.08);
  --nws-sh-lg: 0 12px 32px rgba(22,24,29,.10);

  --nws-ease: cubic-bezier(.2,0,0,1);
}

/* Visible focus everywhere. Elementor removes outlines by default;
   this puts them back. Do not delete — WCAG 2.2 SC 2.4.11 and 2.4.13. */
:focus-visible {
  outline: 3px solid var(--nws-focus);
  outline-offset: 2px;
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .001ms !important;
    transition-duration: .001ms !important;
    scroll-behavior: auto !important;
  }
}
