/**
 * YORKMI / CCIS — Design tokens (CSS custom properties)
 * Source: design-tokens.json / design-system.md (Phase 1 rev. 1.1)
 * Visual truth: live screenshots (crimson header + navy Founders) — English only.
 *
 * Naming: --yorkmi-{category}-{role}[-variant]
 */

:root {
	/* -------------------------------------------------------------------------
	   Color — screenshot-authoritative
	   ------------------------------------------------------------------------- */
	--yorkmi-color-primary: #B62021;
	--yorkmi-color-secondary: #15233E;
	--yorkmi-color-accent: #B62021;
	--yorkmi-color-tertiary: #E8ECF2;
	--yorkmi-color-base: #FFFFFF;
	--yorkmi-color-contrast: #12141C;
	--yorkmi-color-heading: #000000;
	--yorkmi-color-header-bg: #B62021;
	--yorkmi-color-header-fg: #FFFFFF;
	--yorkmi-color-surface-brand: #15233E;
	--yorkmi-color-on-brand: #FFFFFF;
	--yorkmi-color-on-brand-muted: #C5CBD3;
	--yorkmi-color-black: #000000;
	--yorkmi-color-white: #FFFFFF;

	/* Color — proposed / derived */
	--yorkmi-color-border: #CFCFCF;
	--yorkmi-color-border-subtle: #E6E6E6;
	--yorkmi-color-muted: #5C5C5C;
	--yorkmi-color-bg-alt: #F7F7F7;
	--yorkmi-color-primary-active: #8F1819;
	--yorkmi-color-focus: #15233E;
	--yorkmi-color-error: #8F1819;
	--yorkmi-color-success: #15233E;
	--yorkmi-color-warning: #8F1819;

	/* -------------------------------------------------------------------------
	   Typography — English
	   ------------------------------------------------------------------------- */
	--yorkmi-font-display: "Playfair Display", Charter, "Bitstream Charter", "Sitka Text", Cambria, serif;
	--yorkmi-font-body: "Source Sans 3", "Source Sans Pro", Bahnschrift, "DIN Alternate", "Franklin Gothic Medium", sans-serif;

	--yorkmi-font-weight-regular: 400;
	--yorkmi-font-weight-semibold: 600;
	--yorkmi-font-weight-bold: 700;

	--yorkmi-line-height-body: 1.6;
	--yorkmi-line-height-heading: 1.25;
	--yorkmi-line-height-heading-tight: 1.2;
	--yorkmi-line-height-caption: 1.4;
	--yorkmi-line-height-nav: 1.2;

	--yorkmi-text-caption: 0.875rem;
	--yorkmi-text-small: clamp(1rem, 0.98rem + 0.1vw, 1.08rem);
	--yorkmi-text-body: clamp(1rem, 0.97rem + 0.15vw, 1.125rem);
	--yorkmi-text-nav: 0.875rem;
	--yorkmi-text-h6: clamp(1rem, 0.98rem + 0.1vw, 1.08rem);
	--yorkmi-text-h5: clamp(1rem, 0.97rem + 0.15vw, 1.125rem);
	--yorkmi-text-h4: clamp(1.3rem, 1.22rem + 0.35vw, 1.5rem);
	--yorkmi-text-h3: clamp(1.3125rem, 1.15rem + 0.7vw, 1.75rem);
	--yorkmi-text-h2: clamp(1.5rem, 1.3rem + 0.9vw, 2rem);
	--yorkmi-text-h1: clamp(2.1875rem, 1.85rem + 1.5vw, 3rem);

	--yorkmi-letter-spacing-h1: -0.01em;
	--yorkmi-letter-spacing-h6: 0.02em;
	--yorkmi-letter-spacing-nav: 0.06em;

	/* -------------------------------------------------------------------------
	   Spacing
	   ------------------------------------------------------------------------- */
	--yorkmi-space-2xs: 0.25rem;
	--yorkmi-space-xs: 0.44rem;
	--yorkmi-space-sm: 0.67rem;
	--yorkmi-space-md: 1rem;
	--yorkmi-space-lg: 1.5rem;
	--yorkmi-space-xl: 2.25rem;
	--yorkmi-space-2xl: 3.38rem;
	--yorkmi-space-3xl: 5.06rem;
	--yorkmi-spacing: 20px;
	--yorkmi-gutter: 1.5rem;

	/* -------------------------------------------------------------------------
	   Layout
	   ------------------------------------------------------------------------- */
	--yorkmi-content-width: 1140px;
	--yorkmi-wide-width: 1510px;
	--yorkmi-grid-columns: 12;
	--yorkmi-bp-mobile: 767px;
	--yorkmi-bp-tablet: 1024px;
	--yorkmi-bp-desktop-lg: 1440px;

	/* -------------------------------------------------------------------------
	   Elevation / effects
	   ------------------------------------------------------------------------- */
	--yorkmi-radius-none: 0;
	--yorkmi-radius-sm: 2px;
	--yorkmi-radius-pill: 999px;

	--yorkmi-shadow-none: none;
	--yorkmi-shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.06);
	--yorkmi-shadow-md: 0 4px 12px rgba(21, 35, 62, 0.16);

	--yorkmi-duration-fast: 150ms;
	--yorkmi-duration: 200ms;
	--yorkmi-easing: ease;
	--yorkmi-transition: 200ms ease;

	--yorkmi-overlay-cta: rgba(21, 35, 62, 0.65);

	/* -------------------------------------------------------------------------
	   Component aliases
	   ------------------------------------------------------------------------- */
	--yorkmi-button-bg: var(--yorkmi-color-primary);
	--yorkmi-button-fg: var(--yorkmi-color-white);
	--yorkmi-button-bg-hover: var(--yorkmi-color-secondary);
	--yorkmi-button-fg-hover: var(--yorkmi-color-white);
	--yorkmi-button-bg-active: var(--yorkmi-color-primary-active);
	--yorkmi-button-radius: var(--yorkmi-radius-none);
	--yorkmi-button-pad-y: 0.75rem;
	--yorkmi-button-pad-x: 1.5rem;

	--yorkmi-link-color: var(--yorkmi-color-primary);
	--yorkmi-link-hover: var(--yorkmi-color-secondary);

	--yorkmi-input-border: var(--yorkmi-color-border);
	--yorkmi-input-radius: var(--yorkmi-radius-none);
	--yorkmi-input-pad: 0.75rem 1rem;

	--yorkmi-card-border: var(--yorkmi-color-border-subtle);
	--yorkmi-card-pad: var(--yorkmi-space-lg);
	--yorkmi-card-radius: var(--yorkmi-radius-none);

	--yorkmi-avatar-size: 132px;
	--yorkmi-avatar-radius: var(--yorkmi-radius-pill);
}

*,
*::before,
*::after {
	box-sizing: border-box;
}

html {
	color-scheme: light;
}

body {
	font-family: var(--yorkmi-font-body);
	font-weight: var(--yorkmi-font-weight-regular);
	font-size: var(--yorkmi-text-body);
	line-height: var(--yorkmi-line-height-body);
	color: var(--yorkmi-color-contrast);
	background-color: var(--yorkmi-color-base);
}

h1,
h2,
h3 {
	font-family: var(--yorkmi-font-display);
	font-weight: var(--yorkmi-font-weight-semibold);
	color: var(--yorkmi-color-heading);
}

h1 {
	font-size: var(--yorkmi-text-h1);
	font-weight: var(--yorkmi-font-weight-bold);
	line-height: var(--yorkmi-line-height-heading-tight);
	letter-spacing: var(--yorkmi-letter-spacing-h1);
}

h2 {
	font-size: var(--yorkmi-text-h2);
	line-height: var(--yorkmi-line-height-heading);
}

h3 {
	font-size: var(--yorkmi-text-h3);
	line-height: 1.3;
}

h4,
h5,
h6 {
	font-family: var(--yorkmi-font-body);
	font-weight: var(--yorkmi-font-weight-semibold);
	color: var(--yorkmi-color-heading);
}

h4 {
	font-size: var(--yorkmi-text-h4);
	line-height: 1.35;
}

h5 {
	font-size: var(--yorkmi-text-h5);
	line-height: 1.4;
}

h6 {
	font-size: var(--yorkmi-text-h6);
	line-height: 1.4;
	letter-spacing: var(--yorkmi-letter-spacing-h6);
}

a {
	color: var(--yorkmi-link-color);
	transition: color var(--yorkmi-transition);
}

a:hover,
a:focus {
	color: var(--yorkmi-link-hover);
}

a:focus-visible {
	outline: 2px solid var(--yorkmi-color-secondary);
	outline-offset: 2px;
}

::selection {
	background-color: var(--yorkmi-color-tertiary);
	color: var(--yorkmi-color-heading);
}

@media (prefers-reduced-motion: reduce) {
	:root {
		--yorkmi-duration-fast: 0.01ms;
		--yorkmi-duration: 0.01ms;
		--yorkmi-transition: 0.01ms linear;
	}
}