/* Design tokens — Stamford International University demo.
   Direction: modern international university / academic-tech.
   Deep navy structure + white space, magenta brand spark, per-course accent hues. */
:root {
  /* brand — navy structure */
  --navy: #0b1d44;
  --navy-800: #0f2552;
  --navy-700: #163068;
  --navy-600: #214183;
  --navy-400: #5d77ad;
  --navy-200: #b9c6df;

  /* brand spark — Stamford magenta + warm gold */
  --magenta: #e6157a;
  --magenta-600: #c20f66;
  --magenta-300: #ff63a6;
  --gold: #f4b740;

  /* surfaces */
  --bg: #eef2f9;
  --bg-deep: #e6ecf6;
  --bg-tint: #f6f9fd;
  --card: #ffffff;
  --paper: #fbfcff;
  --wash: #eaf0fb;          /* navy-tinted wash */
  --wash-line: #dde6f4;

  /* ink */
  --ink: #0e1830;
  --ink-soft: #44506e;
  --muted: #8590ab;
  --line: #e3e9f4;
  --line-strong: #cdd7e9;

  /* status */
  --ok: #15875a;
  --ok-bg: #e7f5ee;

  /* accent — defaults to brand magenta; overridden per course on the tutor panel */
  --accent: var(--magenta);
  --accent-2: var(--magenta-300);
  --accent-soft: #fdeaf3;
  --accent-line: #f6cfe1;
  --on-accent: #ffffff;

  /* type — one modern Thai+Latin family, weighted for hierarchy */
  --font: 'IBM Plex Sans Thai', 'Sarabun', 'Leelawadee UI', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --text-xs: 0.74rem;
  --text-sm: 0.86rem;
  --text-base: 1rem;
  --text-lg: 1.18rem;
  --text-xl: clamp(1.4rem, 1.1rem + 1.2vw, 2rem);
  --text-hero: clamp(2.1rem, 1.2rem + 3.6vw, 3.9rem);

  /* spacing rhythm */
  --space-1: 0.4rem;
  --space-2: 0.75rem;
  --space-3: 1.1rem;
  --space-4: 1.6rem;
  --space-5: 2.4rem;
  --space-6: 3.6rem;
  --space-section: clamp(3rem, 2rem + 5vw, 6rem);

  /* shape */
  --radius-sm: 10px;
  --radius: 14px;
  --radius-lg: 20px;
  --radius-xl: 28px;
  --radius-pill: 999px;

  /* depth */
  --shadow-sm: 0 1px 2px rgba(11, 29, 68, 0.06), 0 4px 12px rgba(11, 29, 68, 0.06);
  --shadow: 0 2px 6px rgba(11, 29, 68, 0.08), 0 18px 44px rgba(11, 29, 68, 0.14);
  --shadow-lg: 0 8px 20px rgba(11, 29, 68, 0.14), 0 36px 80px rgba(11, 29, 68, 0.24);

  /* motion */
  --dur-fast: 140ms;
  --dur: 280ms;
  --dur-slow: 520ms;
  --ease: cubic-bezier(0.16, 1, 0.3, 1);
}
