/* SILA Childcare design tokens.
   Values come from the SILA design system pack v1.1 (sila-design-system-v1.1.zip: tokens/sila-tokens.css).
   Rules from the pack: pastels are accents only, never text; body text is deep sage on Paper or Cream;
   never recolour, stretch or rotate the logo. Change a value here and it updates everywhere. */
:root {
  /* Surfaces */
  --sila-ivory: #F1E9DE;        /* pack Paper: page background */
  --sila-ivory-deep: #E9DFD1;   /* slightly deeper Paper for alternate bands */
  --sila-paper: #FFF8F3;        /* pack Cream: header, cards, content surfaces */
  --sila-white: #FFFFFF;

  /* Text and actions */
  --sila-forest: #2F4A3F;       /* pack Deep sage: body text, primary text */
  --sila-forest-hover: #243A31;
  --sila-heading: #5B7B66;      /* pack Sage: headings (large text only) */
  --sila-action: #4F6F5A;       /* pack Moss: primary buttons */
  --sila-action-hover: #2F4A3F;
  --sila-body: #2F4A3F;
  --sila-secondary: #4F6F5A;
  --sila-muted: #536C5C;
  --sila-link: #3E6B55;

  /* Brand accents (pastels are never used for text) */
  --sila-sage: #5B7B66;
  --sila-sage-deep: #4F6F5A;
  --sila-sage-pale: #E4EFE7;    /* Light sage */
  --sila-mist: #EFF2F0;         /* sage-50 */
  --sila-mint: #A9D6BF;
  --sila-mint-pale: #EEF7F2;
  --sila-coral: #EFB2B5;        /* Blush */
  --sila-coral-deep: #9C7E7D;   /* blush-700: small marks */
  --sila-coral-pale: #FCF0F0;   /* blush-100 */
  --sila-blush-pale: #F9E4E5;   /* blush-200 */
  --sila-peach: #F2A98B;
  --sila-peach-deep: #9E7863;   /* peach-700: small marks */
  --sila-peach-pale: #FCEEE8;   /* peach-100 */

  /* Lines and states */
  --sila-border: #DDD2C1;
  --sila-border-strong: #B7C7BB;
  --sila-error: #9A3F4E;
  --sila-error-pale: #F9E0E2;
  --sila-success: #2F6B4F;
  --sila-success-pale: #E4EFE7;
  --sila-warning: #7A5410;
  --sila-warning-pale: #FBEBC8;

  /* Type (pack: Cormorant Garamond 500/600 for headlines, DM Sans 400–600 for body and UI) */
  --font-display: 'Cormorant Garamond', Georgia, 'Times New Roman', serif;
  --font-body: 'DM Sans', system-ui, -apple-system, 'Segoe UI', Arial, sans-serif;
  --heading-weight: 600;
  --fs-hero: clamp(2.25rem, 1.4rem + 3.4vw, 3.5rem);       /* 36 → 56 px (pack H1 56) */
  --fs-h1: clamp(2.25rem, 1.7rem + 2.2vw, 3.25rem);        /* 36 → 52 px */
  --fs-h2: clamp(1.875rem, 1.55rem + 1.3vw, 2.5rem);       /* 30 → 40 px (pack H2 40) */
  --fs-h3: clamp(1.375rem, 1.25rem + 0.5vw, 1.625rem);     /* 22 → 26 px */
  --fs-body: 1rem;        /* 16 px */
  --fs-lead: 1.125rem;    /* 18 px */
  --fs-small: 0.875rem;   /* 14 px */
  --fs-eyebrow: 0.75rem;  /* 12 px (pack overline) */
  --fs-nav: 0.9375rem;    /* 15 px */
  --fs-button: 0.9375rem; /* 15 px (pack button) */

  /* Spacing */
  --sp-1: 4px; --sp-2: 8px; --sp-3: 12px; --sp-4: 16px; --sp-5: 24px; --sp-6: 32px;
  --sp-7: 40px; --sp-8: 48px; --sp-9: 64px; --sp-10: 80px; --sp-11: 96px;

  /* Layout */
  --max-content: 1200px;
  --max-wide: 1440px;
  --gutter: 20px;
  --header-h: 70px;
  --section-y: 48px;

  /* Shape (pack radii: sm 6, md 12, lg 20, arch) */
  --radius-sm: 6px;
  --radius: 12px;
  --radius-lg: 20px;
  --radius-pill: 999px;
  --radius-arch: 999px 999px 12px 12px;
  --shadow-soft: 0 6px 16px rgba(47, 74, 63, .10), 0 2px 4px rgba(47, 74, 63, .06);
  --shadow-sm: 0 1px 2px rgba(47, 74, 63, .08), 0 1px 1px rgba(47, 74, 63, .06);

  /* Motion */
  --ease: cubic-bezier(.2, .7, .2, 1);
  --fast: 150ms;
}

@media (min-width: 768px) {
  :root { --gutter: 32px; --section-y: 64px; }
}
@media (min-width: 1024px) {
  :root { --gutter: 48px; --header-h: 80px; --section-y: 80px; }
}