/*
 * EduMinds Africa shared design tokens.
 * This file only defines reusable values and opt-in utility classes.
 * It intentionally does not globally restyle Elementor widgets or theme layouts.
 */
:root {
  /* Brand colors */
  --em-color-forest: #102A1B;
  --em-color-green: #23843B;
  --em-color-gold: #D9A441;
  --em-color-text: #34443B;
  --em-color-muted-text: #66736B;
  --em-color-white: #FFFFFF;

  /* Page surfaces */
  --em-color-canvas: #F0EBDD;
  --em-color-sage: #E3EBE2;
  --em-color-card: #FFFFFF;

  /* Typography: select these same families in Elementor Site Settings > Global Fonts. */
  --em-font-heading: "Newsreader", Georgia, serif;
  --em-font-body: "Geist", Arial, sans-serif;

  /* Responsive type scale */
  --em-size-display: clamp(3rem, 5.5vw, 4.75rem);
  --em-size-h1: clamp(2.5rem, 4.5vw, 4rem);
  --em-size-h2: clamp(2rem, 3.3vw, 3rem);
  --em-size-h3: clamp(1.375rem, 2vw, 1.75rem);
  --em-size-body: 1.0625rem;
  --em-size-small: 0.9375rem;
  --em-size-label: 0.75rem;

  /* Type weights and rhythm */
  --em-weight-regular: 400;
  --em-weight-medium: 500;
  --em-weight-semibold: 600;
  --em-line-heading: 1.08;
  --em-line-body: 1.65;
  --em-letter-heading: -0.025em;
  --em-letter-label: 0.11em;
}

/* Apply to an Elementor widget only when its CSS Classes field includes em-eyebrow. */
.em-eyebrow {
  font-family: var(--em-font-body);
  font-size: var(--em-size-label);
  font-weight: var(--em-weight-semibold);
  line-height: 1.3;
  letter-spacing: var(--em-letter-label);
  text-transform: uppercase;
}