/* Schologists design system: tokens v2.0 (November 2026)
   One source of truth for colour, type, space, shape and motion.
   Load before components.css. Components use the semantic tokens, never raw hexes. */

:root {
  /* Core brand colours (2021 guidelines, unchanged) */
  --sch-blue:   #004272; /* Discovery Blue: primary, the scholarly half */
  --sch-yellow: #FBC258; /* Empathy Yellow: warmth */
  --sch-green:  #8DC1B5; /* Mindful Green: calm, lived experience */
  --sch-red:    #E9194B; /* Strength Red: the lift, one accent per view */
  --sch-black:  #000000; /* Confident Black */
  --sch-white:  #FFFFFF; /* Honest White */
  --sch-navy:   #12304C; /* Deep Navy (extended) */

  /* Scales: 50 to 300 fills, 500 brand, 700 text-safe on white, 900 deep */
  --sch-blue-50: #EBF0F4;  --sch-blue-100: #D1DDE6;  --sch-blue-200: #9EB7C9;  --sch-blue-300: #618AA8;
  --sch-blue-500: #004272; --sch-blue-700: #043459;  --sch-blue-900: #082640;
  --sch-yellow-50: #FFFAF2; --sch-yellow-100: #FEF4E1; --sch-yellow-200: #FDE8C0; --sch-yellow-300: #FDD997;
  --sch-yellow-500: #FBC258; --sch-yellow-700: #7A5A12; --sch-yellow-900: #4A3708;
  --sch-green-50: #F6FAF9;  --sch-green-100: #EAF4F2;  --sch-green-200: #D4E7E3;  --sch-green-300: #B8D9D1;
  --sch-green-500: #8DC1B5; --sch-green-700: #2E6A5D;  --sch-green-900: #1B3F37;
  --sch-red-50: #FDEDF1;    --sch-red-100: #FBD6DF;    --sch-red-200: #F7A8BB;    --sch-red-300: #F1708F;
  --sch-red-500: #E9194B;   --sch-red-700: #C8103D;    --sch-red-900: #4E1A34;

  /* Neutrals */
  --sch-paper:     #F6F4EE;
  --sch-paper-2:   #EFECE3;
  --sch-line:      #DCD8CE;
  --sch-line-soft: #E8E5DC;
  --sch-muted:     #55626E; /* 6.3:1 on white */
  --sch-ink-2:     #3A4652;
  --sch-ink:       #14202B; /* 16.5:1 on white */
  --sch-night:     #0B1A2A;

  /* Veyra, used only where Veyra appears on Schologists pages (Veyra guidelines 2.0) */
  --vey-purple:      #8452B5;
  --vey-purple-deep: #6E3F9C;
  --vey-cream:       #F7EABF;
  --vey-ink:         #1B2139;

  /* Duotone pairs: shadows take the dark, highlights take the light */
  --duo-blue-dark: #003358;    --duo-blue-light: #B5CDE0;
  --duo-green-dark: #2E6A5D;   --duo-green-light: #D5EBE5;
  --duo-yellow-dark: #9A6408;  --duo-yellow-light: #FDDB98;
  --duo-red-dark: #8F0C30;     --duo-red-light: #F7B3C3;
  --duo-navy-dark: #0B1A2A;    --duo-navy-light: #5E7790;
  --duo-ink-dark: #1A2D40;     --duo-ink-light: #F3EFE6;   /* the one treatment for Schologists photography */

  /* Semantic roles (light). Build with these. */
  --sch-bg:            var(--sch-white);
  --sch-bg-alt:        var(--sch-paper);
  --sch-surface:       var(--sch-white);
  --sch-text:          var(--sch-ink);
  --sch-text-2:        var(--sch-ink-2);
  --sch-text-muted:    var(--sch-muted);
  --sch-heading:       var(--sch-ink);
  --sch-eyebrow:       var(--sch-blue);
  --sch-link:          var(--sch-blue);
  --sch-link-hover:    var(--sch-blue-700);
  --sch-primary:       var(--sch-blue);
  --sch-primary-hover: var(--sch-navy);
  --sch-primary-tint:  var(--sch-blue-50);
  --sch-on-primary:    var(--sch-white);
  --sch-border:        var(--sch-line);
  --sch-focus:         var(--sch-blue);
  --sch-error:         var(--sch-red-700);
  --sch-success:       var(--sch-green-700);
  --sch-field-border:  #7D8893;              /* 3.6:1 on white: inputs need 3:1 */
  --sch-mark:          var(--sch-yellow);    /* the piece beside eyebrows */

  /* Door accent: pages set one with .sch-theme--blue | green | red | yellow | veyra */
  --sch-accent:        var(--sch-blue);
  --sch-accent-text:   var(--sch-blue);      /* accent as readable text on white */
  --sch-accent-tint:   var(--sch-blue-50);
  --sch-on-accent:     var(--sch-white);

  /* Type */
  --sch-font-display: 'Bodoni Moda', Didot, 'Bodoni 72', 'GFS Didot', Georgia, serif;  /* Didot role */
  --sch-font-strap:   'EB Garamond', Garamond, 'Adobe Garamond Pro', Georgia, serif;   /* Garamond role */
  --sch-font-sans:    'Jost', 'Futura PT', Futura, 'Century Gothic', system-ui, sans-serif; /* Futura role */
  --sch-font-mono:    ui-monospace, 'SF Mono', Menlo, Consolas, monospace;

  /* Sizes scale with the page container (cqi), so phone frames render true phone sizes */
  --sch-text-display: clamp(2.75rem, 1.36rem + 5.71cqi, 5.5rem);  /* 44 / 66 / 88: the line on /work/, Bodoni 500 */
  --sch-text-h1:      clamp(2.5rem, 1.6rem + 3.6cqi, 4.75rem);    /* 40 / 53 / 76: door pages, About, Bodoni 500 */
  --sch-text-h1-utility: clamp(2.25rem, 1.6rem + 2.4cqi, 3.75rem); /* 36 / 44 / 60: landing, contact, privacy, 404 */
  --sch-text-close:   clamp(2.25rem, 1.4rem + 3.4cqi, 4.5rem);     /* 36 / 49 / 72: the closing line */
  --sch-text-h2:      clamp(1.875rem, 1.27rem + 2.48cqi, 3.5rem); /* 30 / 39 / 56: section heading, Bodoni 500 */
  --sch-text-h3-serif: clamp(1.625rem, 1.38rem + 0.95cqi, 2.25rem); /* 26 / 29 / 36: door, person and funder names */
  --sch-text-quote:   clamp(1.75rem, 1.03rem + 2.3cqi, 3rem);      /* 28 / 34 / 48: Garamond italic 500 */
  --sch-text-label:   0.8125rem;                                   /* 13 caps: Jost 500, 0.12em */
  --sch-text-h3:      1.25rem;                           /* 20px, Jost 600 */
  --sch-text-strap:   clamp(1.375rem, 2.3cqi, 1.875rem); /* 22 to 30px, Garamond */
  --sch-text-lead:    clamp(1.1875rem, 1.1rem + 0.3cqi, 1.375rem); /* 19 / 20 / 22: Jost 400 */
  --sch-text-body:    1.0625rem;                         /* 17px */
  --sch-text-small:   0.9375rem;                         /* 15px */
  --sch-text-caption: 0.8125rem;                         /* 13px */

  /* Space: 4px base */
  --sch-space-1: 4px;   --sch-space-2: 8px;   --sch-space-3: 12px;  --sch-space-4: 16px;
  --sch-space-6: 24px;  --sch-space-8: 32px;  --sch-space-12: 48px; --sch-space-16: 64px;
  --sch-space-24: 96px; --sch-space-32: 128px;
  --sch-section-y: clamp(64px, 34px + 7.6cqi, 144px); /* 64 / 92 / 144 */
  --sch-col-gap:   clamp(16px, 2.2cqi, 32px);
  --sch-rule:        1px solid var(--sch-border);
  --sch-rule-strong: 1px solid var(--sch-heading);
  --sch-gutter:    clamp(20px, 5cqi, 72px);
  --sch-container: 1296px;

  /* Shape, depth, motion */
  --sch-radius-sm: 6px; --sch-radius-md: 12px; --sch-radius-lg: 20px; --sch-radius-xl: 28px; --sch-radius-pill: 999px;
  --sch-shadow-soft: 0 12px 32px rgba(18, 48, 76, 0.14);
  --sch-ease: cubic-bezier(0.2, 0.7, 0.2, 1);
  --sch-dur: 200ms; --sch-dur-slow: 420ms;
  --sch-target-min: 44px;
  --sch-dur-image: 700ms;

  /* Type weights: Bodoni Moda at one weight (its optical size follows font-size); Garamond italic matched to Bodoni's x-height */
  --sch-serif-wght: 500;
  --sch-italic-wght: 500;
  --sch-italic-adjust: 0.44; /* Garamond x-height 0.40 em, Bodoni 0.46 em: renders the italic at 1.1x */
  --sch-header-offset: 96px; /* sticky header height plus breathing room, for scroll-padding */
}

/* Dark theme: opt in with <html data-theme="dark"> */
:root[data-theme="dark"] {
  --sch-bg: var(--sch-night); --sch-bg-alt: var(--sch-navy); --sch-surface: var(--sch-navy);
  --sch-text: var(--sch-paper); --sch-text-2: #D1DDE6; --sch-text-muted: #B8C6D3; --sch-heading: var(--sch-white);
  --sch-eyebrow: var(--sch-yellow); --sch-link: var(--sch-yellow); --sch-link-hover: var(--sch-white);
  --sch-primary: var(--sch-yellow); --sch-primary-hover: var(--sch-yellow-300); --sch-primary-tint: rgba(251,194,88,.12);
  --sch-on-primary: var(--sch-black); --sch-border: #2C4A68; --sch-focus: var(--sch-yellow);
  --sch-error: #FF6B8B; --sch-success: var(--sch-green); --sch-field-border: #6D8299;
}

@media (prefers-reduced-motion: reduce) {
  :root { --sch-dur: 0ms; --sch-dur-slow: 0ms; --sch-dur-image: 0ms; }
}