/* Fonts ship with the template (SIL OFL, see assets/fonts/OFL-*.txt): no request to Google Fonts. */
@font-face { font-family: "Gabarito"; font-style: normal; font-weight: 400 900; font-display: swap; src: url(../fonts/gabarito-400-900-latin-ext.woff2) format("woff2"); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Gabarito"; font-style: normal; font-weight: 400 900; font-display: swap; src: url(../fonts/gabarito-400-900-latin.woff2) format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
/* Campanile design tokens. Change --brand (the yellow) and --dark (the navy) to recolor the whole template:
 * every accent, button, chip, pennant and the 3D campus model derive from them. */
@font-face { font-family: "Atkinson Hyperlegible Next"; font-style: normal; font-weight: 400 700; font-display: swap; src: url(../fonts/atkinson-hyperlegible-next-400-700-latin-ext.woff2) format("woff2"); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Atkinson Hyperlegible Next"; font-style: normal; font-weight: 400 700; font-display: swap; src: url(../fonts/atkinson-hyperlegible-next-400-700-latin.woff2) format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
:root {
  /* color */
  --brand:      oklch(86% 0.17 92);     /* the yellow of the pennant and the highlighter */
  --brand-hi:   oklch(90% 0.16 96);     /* hover: lighter, never darker (dark text stays readable) */
  --brand-deep: oklch(52% 0.12 78);     /* text-size yellow on paper (AA): ochre */
  --on-brand:   oklch(22% 0.06 265);    /* ink on yellow */
  --tint:       oklch(95.5% 0.06 95);   /* pale yellow panel */
  --dark:       oklch(27% 0.1 265);     /* the navy of the gown */
  --dark-2:     oklch(31% 0.1 265);
  --dark-3:     oklch(38% 0.09 265);
  --rule-dark:  oklch(44% 0.07 265);
  --paper:      oklch(98% 0.006 95);    /* chalk white, warm */
  --wash:       oklch(94.5% 0.012 95);
  --ink:        oklch(22% 0.06 265);
  --ink-2:      oklch(38% 0.05 265);
  --muted:      oklch(50% 0.035 265);
  --rule:       oklch(88% 0.012 260);
  --on-dark:    oklch(97% 0.005 95);
  --on-dark-2:  oklch(80% 0.02 265);
  --focus:      oklch(70% 0.16 85);
  --error:      oklch(52% 0.19 25);
  --ok:         oklch(48% 0.13 150);
  --glow:       oklch(88% 0.17 92);     /* the lit building, 3D scene only */
  /* textures and gradients: every dark surface comes from here */
  --grad-dark: linear-gradient(165deg, oklch(24% 0.1 268) 0%, oklch(28% 0.1 265) 60%, oklch(33% 0.09 258) 100%);
  --grad-veil: linear-gradient(180deg, transparent 0%, color-mix(in oklch, var(--dark) 82%, transparent) 100%);
  --grad-side: linear-gradient(90deg, color-mix(in oklch, var(--dark) 92%, transparent) 0%, color-mix(in oklch, var(--dark) 50%, transparent) 55%, transparent 100%);
  --dots: radial-gradient(color-mix(in oklch, var(--on-dark) 16%, transparent) 1px, transparent 1.5px); /* dotted notebook paper */
  --dots-light: radial-gradient(color-mix(in oklch, var(--ink) 12%, transparent) 1px, transparent 1.5px);
  /* type */
  --font-display: "Gabarito", "Avenir Next", -apple-system, system-ui, sans-serif;
  --font-body: "Atkinson Hyperlegible Next", -apple-system, system-ui, sans-serif;
  --text-sm: 0.875rem; --text-base: 1.0625rem; --text-md: 1.3rem; --text-lg: 1.7rem; --text-xl: 2.2rem; --text-2xl: 2.9rem;
  --text-display: clamp(2.8rem, 5.2vw + 1rem, 5.6rem); --text-display-s: clamp(2.3rem, 3.4vw + 1rem, 4rem);
  /* space */
  --space-2xs: .25rem; --space-xs: .5rem; --space-sm: .75rem; --space-md: 1rem; --space-lg: 1.5rem; --space-xl: 2.5rem; --space-2xl: 4rem; --space-3xl: 6.5rem; --space-4xl: 10rem;
  --wrap: 78rem;
  /* motion: the bell. A long ease-out with a soft settle, used on reveals; the swing only on small things. */
  --ease-out: cubic-bezier(0.22, 1, 0.36, 1); --ease-in-out: cubic-bezier(0.77, 0, 0.175, 1); --ease-swing: cubic-bezier(0.34, 1.04, 0.64, 1);
  --dur-micro: 140ms; --dur-short: 260ms; --dur-long: 700ms;
  --z-base: 1; --z-raised: 10; --z-dropdown: 100; --z-sticky: 200; --z-modal: 400;
  --radius: 8px; --radius-s: 4px; --radius-l: 18px; --radius-pill: 999px;
  --shadow: 0 1px 2px oklch(22% 0.06 265 / 0.08), 0 18px 40px -22px oklch(22% 0.06 265 / 0.3);
  --shadow-up: 0 2px 4px oklch(22% 0.06 265 / 0.08), 0 28px 48px -22px oklch(22% 0.06 265 / 0.4);
}
@media (prefers-reduced-motion: reduce) { :root { --dur-micro: 1ms; --dur-short: 1ms; --dur-long: 1ms; } }
