/* ==========================================================================
   OISMUN 2027: design tokens
   Every colour below was sampled from the four concept screenshots
   (oismun-redesign/references/) or from the OISMUN logo, except where a line
   says "derived" (a shade of a sampled colour, needed for readable contrast).
   Contrast ratios are WCAG 2.x, measured against the ice background unless noted.
   ========================================================================== */

:root {
  /* ---- Colour: brand ---------------------------------------------------- */
  --oismun-navy:        #1D3961;  /* logo ink (EiLzGF.png). Text on ice 10.7:1 */
  --oismun-royal:       #204078;  /* "OUR TEAM" / "SPONSORS" headings in the concepts. 9.4:1 */
  --oismun-blue:        #619EDF;  /* concept blob / UN blue. Decorative only (2.6:1) */
  --oismun-blue-deep:   #5496DC;  /* derived: blob behind white text (3.1:1, large text only) */
  --oismun-light-blue:  #D6EFFD;  /* concept bands (committee lower band, countdown band) */
  --oismun-ice:         #EBF8FD;  /* concept page background */
  --oismun-white:       #FFFFFF;
  --oismun-slate:       #587498;  /* concept committee emblem. 4.4:1: emblem / large text only */
  --oismun-mist:        #ADC9DD;  /* concept pale emblem (team wireframe). Decorative */
  --oismun-accent:      #F1C201;  /* concept quote mark. Decorative on light; 6.9:1 on navy */

  /* ---- Colour: roles ------------------------------------------------------ */
  --oismun-text:        var(--oismun-navy);
  --oismun-text-soft:   #44597A;  /* derived (navy -> slate). 6.6:1 on ice, 6.0:1 on light blue */
  --oismun-bg:          var(--oismun-ice);
  --oismun-surface:     var(--oismun-white);
  --oismun-band:        var(--oismun-light-blue);
  --oismun-line:        rgba(29, 57, 97, 0.16);   /* hairlines, dividers */
  --oismun-outline:     var(--oismun-navy);        /* outlined cards (concept: 2px dark frames) */
  --oismun-focus:       #1D6FD1;                   /* derived: focus ring, 5.0:1 on ice */

  /* ---- Colour: programme identities (kept, not re-coloured) -------------- */
  --mal-green:          #5D8865;  /* Model Arab League sections (original page CSS) */
  --mal-green-deep:     #3E6B47;
  --oisfua-yellow:      #FFE16F;  /* OISFUA bands (original page CSS) */
  --oisfua-green:       #3E662A;

  /* ---- Typography --------------------------------------------------------- */
  --font-serif: "Playfair Display", Georgia, "Times New Roman", serif;       /* headings, quotes, editorial */
  --font-editorial: "OISMUN Editorial", "Playfair Display", Georgia, serif;   /* same files, slanted: bold capital headings */
  --font-sans:  "Open Sans", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;  /* nav, body, labels */

  /* fluid type scale (min at 360px, max at 1440px) */
  --text-xs:   0.8125rem;                                   /* 13px labels */
  --text-sm:   0.9375rem;                                   /* 15px */
  --text-base: clamp(1rem, 0.96rem + 0.18vw, 1.0625rem);    /* 16-17px body */
  --text-lg:   clamp(1.125rem, 1.05rem + 0.35vw, 1.3125rem);
  --text-xl:   clamp(1.35rem, 1.2rem + 0.7vw, 1.75rem);
  --text-2xl:  clamp(1.7rem, 1.4rem + 1.4vw, 2.5rem);       /* section titles */
  --text-3xl:  clamp(2.1rem, 1.6rem + 2.3vw, 3.5rem);       /* page titles */
  --text-4xl:  clamp(2.6rem, 1.8rem + 3.6vw, 4.75rem);      /* hero */

  --leading-tight: 1.12;
  --leading-snug:  1.3;
  --leading-body:  1.65;
  --tracking-caps: 0.06em;

  /* ---- Space (4px base) ----------------------------------------------------- */
  --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: 4rem;
  --space-9: 6rem;     --space-10: 8rem;
  --section-y: clamp(3.5rem, 2.2rem + 5.5vw, 7rem);          /* vertical rhythm between sections */
  --gutter:    clamp(1rem, 0.6rem + 2vw, 2.5rem);            /* page side padding */

  /* ---- Layout ------------------------------------------------------------- */
  --container:        74rem;   /* 1184px text + cards */
  --container-wide:   84rem;   /* 1344px heroes */
  --container-narrow: 44rem;   /* 704px reading column */

  /* ---- Shape -------------------------------------------------------------- */
  --radius-sm:   6px;
  --radius-md:   14px;
  --radius-lg:   28px;          /* portrait cards (concept: rounded squares) */
  --radius-pill: 999px;
  --border-thin:   1px solid var(--oismun-line);
  --border-strong: 2px solid var(--oismun-outline);

  --shadow-sm: 0 2px 8px -2px rgba(29, 57, 97, 0.14);
  --shadow-md: 0 14px 34px -16px rgba(29, 57, 97, 0.32);

  /* ---- Motion ------------------------------------------------------------- */
  --dur-fast: 200ms;
  --dur:      350ms;
  --dur-slow: 650ms;
  --ease-out: cubic-bezier(0.2, 0.7, 0.2, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --reveal-distance: 18px;

  /* ---- Header -------------------------------------------------------------- */
  --header-logo-w: clamp(13rem, 9rem + 14vw, 24rem);
  --navbar-h: 3.5rem;
  --z-header: 50;
  --z-dialog: 100;
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --dur-fast: 1ms;
    --dur: 1ms;
    --dur-slow: 1ms;
    --reveal-distance: 0px;
  }
}
