/*
 * Design tokens — the one place to change the palette, type and shape.
 * Structure follows the EduPro kit; colours are the Haibo Africa Institute
 * brand (concept treatment: Rose Red #E61C5B → #D72028, plus a secondary
 * palette). Mirrored in theme.json for the editor.
 *
 * Contrast rule: white text on the brand gradient (#E61C5B starts at 4.45:1)
 * is for LARGE text only. Buttons and small white text use --hai-gradient,
 * which starts at #D72028 (5.1:1).
 */

@font-face {
	font-family: "Nunito";
	font-style: normal;
	font-weight: 200 1000;
	font-display: swap;
	src: url("../fonts/nunito-latin-wght-normal.woff2") format("woff2");
}

@font-face {
	font-family: "Nunito";
	font-style: italic;
	font-weight: 200 1000;
	font-display: swap;
	src: url("../fonts/nunito-latin-wght-italic.woff2") format("woff2");
}

:root {
	/* Colour — EduPro roles, Haibo values. */
	--hai-rose: #e61c5b;            /* brand Rose Red (gradient start) */
	--hai-red: #d72028;             /* brand red (gradient end) */
	--hai-accent: #d72028;          /* links, icons, buttons (white text 5.1:1) */
	--hai-accent-dark: #a8122b;     /* hover, gradient end, stat cards, open FAQ */
	--hai-highlight: #e61c5b;       /* large text & decoration */
	--hai-glow: #f84e4e;            /* hover glow */
	--hai-primary: #e61c5b;         /* rare emphasis (badges, errors) */
	--hai-secondary: #9719b1;       /* rare secondary accent */

	/* Secondary palette (concept treatment) — category tiles, illustrations. */
	--hai-c-blue: #1743a6;
	--hai-c-sky: #008ad8;
	--hai-c-violet: #9719b1;
	--hai-c-orange: #f57f46;
	--hai-c-green: #5aa646;
	--hai-c-yellow: #ffd862;
	--hai-c-coral: #f84e4e;
	--hai-c-pink: #d53d58;
	--hai-heading: #181818;
	--hai-text: #3c3c3c;
	--hai-muted: #6b6b6b;           /* 5.3:1 on white */
	--hai-alt-bg: #fff1f4;          /* EduPro lavender → warm blush */
	--hai-border: #ffc9d6;
	--hai-border-soft: #ffc9d64a;
	--hai-white: #fff;
	--hai-black: #000;
	--hai-ink: #14080c;             /* footer / dark panels */

	--hai-gradient: linear-gradient(135deg, var(--hai-accent) 0%, var(--hai-accent-dark) 100%);
	--hai-gradient-rev: linear-gradient(135deg, var(--hai-accent-dark) 0%, var(--hai-accent) 100%);
	--hai-brand: linear-gradient(135deg, var(--hai-rose) 0%, var(--hai-red) 100%); /* panels, large text only */
	--hai-band: linear-gradient(100deg, var(--hai-rose) 0%, var(--hai-red) 60%, var(--hai-accent-dark) 100%);
	--hai-wash: radial-gradient(120% 90% at 85% 0%, #ffd3df 0%, #fff1f4 38%, #fff 70%);

	/* Type — Nunito on EduPro's scale (desktop / mobile, fluid between). */
	--hai-font: "Nunito", ui-rounded, "Hiragino Maru Gothic ProN", system-ui, sans-serif;
	--hai-fs-display: clamp(2.625rem, 1.25rem + 5.6vw, 4.5rem);   /* 72 */
	--hai-fs-h1: clamp(2.625rem, 2.13rem + 2.02vw, 3.75rem);      /* 60 / 48 / 42 */
	--hai-fs-h2: clamp(2.1875rem, 1.83rem + 1.46vw, 3rem);        /* 48 / 35 */
	--hai-fs-h3: clamp(1.75rem, 1.53rem + 0.9vw, 2.25rem);        /* 36 / 28 */
	--hai-fs-h4: clamp(1.375rem, 1.27rem + 0.45vw, 1.625rem);     /* 26 / 22 */
	--hai-fs-h5: clamp(1.125rem, 1.07rem + 0.22vw, 1.25rem);      /* 20 / 18 */
	--hai-fs-h6: 0.9375rem;                                       /* 15 */
	--hai-fs-body: 1rem;                                          /* 16 */
	--hai-fs-small: 0.875rem;                                     /* 14 */

	/* Shape & space. */
	--hai-container: 1280px;
	--hai-gutter: clamp(1rem, 4vw, 2rem);
	--hai-inset: clamp(10px, 1.4vw, 20px);  /* full-bleed sections sit this far in */
	--hai-radius-section: clamp(14px, 1.4vw, 20px);
	--hai-radius-card: 16px;
	--hai-radius-btn: 8px;
	--hai-radius-pill: 999px;
	--hai-section-y: clamp(4rem, 8vw, 7.5rem);

	/* Depth & motion. */
	--hai-shadow-card: 0 10px 30px -12px rgb(168 18 43 / 0.16);
	--hai-shadow-card-hover: 0 22px 40px -16px rgb(168 18 43 / 0.28);
	--hai-shadow-btn: 5px 5px 0 0 rgb(230 28 91 / 0.22);
	--hai-shadow-header: 0 0 10px rgb(0 0 0 / 0.08);
	--hai-ease: cubic-bezier(0.22, 1, 0.36, 1);
	--hai-speed: 0.3s;
}