/*
  Design Tokens — Compassion Church Ministries Portal
  Single source of truth for the visual system. Change values here,
  not in individual component/page rules.
*/
:root {
  /* ---- Color: base palette ---- */
  --color-ink:            #1B2A41; /* primary — nav, headings on light, footer */
  --color-ink-700:        #24384F;
  --color-ink-050:        #EEF1F5; /* tint for subtle fills on ink */
  --color-brass:          #9C7A44; /* accent — CTAs, dividers, small emphasis. Use sparingly. */
  --color-brass-600:      #83643A;
  --color-brass-100:      #F1E9DA;
  --color-parchment:      #F6F4EE; /* section background, alternates with white */
  --color-white:          #FEFEFC;
  --color-charcoal:       #23262B; /* body text */
  --color-slate:          #5B6472; /* secondary text */
  --color-slate-300:      #C7CCD3; /* borders, hairlines */
  --color-slate-100:      #E7E9ED;
  --color-success:        #3D6B4A;
  --color-focus:          #2F6FED;

  /* ---- Typography ---- */
  --font-display: "Newsreader", Georgia, "Times New Roman", serif;
  --font-body:    "Source Sans 3", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;

  --step--1: clamp(0.83rem, 0.80rem + 0.15vw, 0.9rem);
  --step-0:  clamp(1rem, 0.96rem + 0.2vw, 1.08rem);
  --step-1:  clamp(1.2rem, 1.12rem + 0.4vw, 1.35rem);
  --step-2:  clamp(1.44rem, 1.3rem + 0.7vw, 1.75rem);
  --step-3:  clamp(1.85rem, 1.6rem + 1.2vw, 2.4rem);
  --step-4:  clamp(2.3rem, 1.9rem + 2vw, 3.4rem);
  --step-5:  clamp(2.8rem, 2.2rem + 3vw, 4.4rem);

  --leading-tight: 1.15;
  --leading-snug:  1.35;
  --leading-body:  1.6;

  /* ---- Spacing scale ---- */
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.5rem;
  --space-6: 2rem;
  --space-7: 3rem;
  --space-8: 4.5rem;
  --space-9: 6.5rem;

  /* ---- Layout ---- */
  --content-max: 78rem;
  --measure: 62ch; /* line-length cap for body copy */
  --radius-sm: 3px;
  --radius-md: 4px;
  --border-hairline: 1px solid var(--color-slate-300);

  /* ---- Elevation (used once, not stacked on every card) ---- */
  --shadow-card: 0 1px 2px rgba(27, 42, 65, 0.06), 0 6px 20px rgba(27, 42, 65, 0.06);

  /* ---- Motion ---- */
  --ease-standard: cubic-bezier(0.2, 0.65, 0.3, 1);
  --duration-fast: 150ms;
  --duration-med: 320ms;
}

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