/*
  RHSGP design tokens: the only place colours are defined.

  Brand colours, sampled from the supplied logo (assets/images/brand/rhsgp-logo-original.png):
    Olive        #999D37  ring          -> --c-brass (decorative only; 2.9:1 on white)
    Forest green #204721  lettering     -> --c-night, --c-emerald (light mode)
    Red          #AD1E23  "study", minaret -> --c-crimson (light mode)

  Token names follow the design spec (Section 3.1). Roles are unchanged; only the
  values moved to the brand palette. Roles and contrast ratios: docs/brand-tokens.md.
  tools/check.py re-checks every text/background pair below in both modes.
*/

:root {
  color-scheme: light;

  /* Surfaces */
  --c-night: #204721; /* brand forest green: hero, footer, mobile menu */
  --c-dawn: #eef3ec; /* quiet section backgrounds */
  --c-paper: #fbfcfa; /* page background */
  --c-surface: #ffffff; /* raised items, form fields */

  /* Text */
  --c-ink: #1c2520;
  --c-ink-soft: #4a5a4f;
  --c-on-night: #f4f7f2;
  --c-on-night-soft: #c9d6cb;

  /* Action */
  --c-emerald: #204721; /* brand forest green: links, primary buttons, focus ring */
  --c-emerald-deep: #15301a; /* hover */
  --c-on-emerald: #f4f7f2; /* text on emerald fills */

  /* Accents */
  --c-brass: #999d37; /* brand olive: crescent, season highlights. Decorative only on light surfaces */
  --c-brass-text: #5e6120; /* olive that is safe for text */
  --c-crimson: #ad1e23; /* brand red: "you are here" markers, error text */

  /* Lines and notices */
  --c-rule: #d3ddd3; /* hairlines only; form field borders use --c-ink-soft */
  --c-alert-bg: #f7f7e8;
  --c-alert-ink: #45471a;
  --c-olive-tint: #eff1d8; /* call-to-action band behind the olive lattice */
  --c-cream: #f6ede1; /* home hero: matches the background of the 3D slide renders */
  --c-charcoal: #1c2520; /* dark publication cover; text on olive covers. Same in both modes */

  /* Fixed in both modes */
  --c-logo-plate: #ffffff; /* white disc behind the logo (its centre is transparent) */
  --c-scrim: rgb(11 22 13 / 0.55);
  --c-scrim-strong: rgb(11 22 13 / 0.88); /* photo captions, photo viewer */
  --shadow-raise: 0 1px 2px rgb(32 71 33 / 0.07), 0 6px 18px rgb(32 71 33 / 0.08);
  --texture-opacity: 0.055;
  --shadow-photo: 0 14px 32px rgb(32 71 33 / 0.18);
  --shadow-logo: 0 2px 4px rgb(32 71 33 / 0.18);
  --shadow-card: 0 2px 4px rgb(32 71 33 / 0.05), 0 12px 32px rgb(32 71 33 / 0.08);

  /* Typography */
  --font-head: "Poppins", "Segoe UI", system-ui, -apple-system, Roboto, Arial, sans-serif;
  --font-body: "Inter", "Segoe UI", system-ui, -apple-system, Roboto, Arial, sans-serif;
  --font: 'Inter', system-ui, -apple-system, sans-serif; /* the name in the site header (client's stack) */
  --font-display: "Playfair Display", Georgia, "Times New Roman", serif; /* home hero headline only */

  --fs-display: clamp(2.25rem, 1.6rem + 3vw, 3.75rem);
  --fs-h1: clamp(2rem, 1.6rem + 1.8vw, 2.75rem);
  --fs-h2: clamp(1.5rem, 1.3rem + 1vw, 2rem);
  --fs-h3: 1.25rem;
  --fs-body: 1.125rem;
  --fs-small: 1rem;

  /* Spacing */
  --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: 6rem;

  /* Shape */
  --radius-s: 4px;
  --radius-m: 10px;
  --radius-l: 32px; /* large rounded panels */
  --radius-pill: 999px;

  /* Layout */
  --container: 72rem;
  --measure: 68ch;
  --gutter: 1rem;
  --header-h: 64px;
}

@media (min-width: 768px) {
  :root {
    --gutter: 1.5rem;
  }
}

@media (min-width: 1024px) {
  :root {
    --gutter: 2rem;
    --header-h: 72px;
  }
}

/* The site is light only (client decision). These dark values are kept for the style guide's
   preview switch and a possible later dark mode; nothing switches to them automatically. */
:root[data-theme="dark"] {
  color-scheme: dark;
  --c-night: #0b160d;
  --c-dawn: #152319;
  --c-paper: #101b13;
  --c-surface: #1a2b1e;
  --c-ink: #e6eee7;
  --c-ink-soft: #afc0b3;
  --c-on-night: #f4f7f2;
  --c-on-night-soft: #c9d6cb;
  --c-emerald: #86c98d;
  --c-emerald-deep: #a9dbae;
  --c-on-emerald: #101b13;
  --c-brass: #999d37;
  --c-brass-text: #c9cd6a;
  --c-crimson: #f28a8d;
  --c-rule: #2e4433;
  --c-alert-bg: #262812;
  --c-alert-ink: #e7e8b8;
  --c-olive-tint: #23260f;
  --c-cream: #1f1b15;
  --c-charcoal: #1c2520;
  --shadow-raise: 0 1px 2px rgb(0 0 0 / 0.3), 0 6px 18px rgb(0 0 0 / 0.35);
}