/* UpLearning design tokens — sampled from the approved mockup. Mirrored in theme.json. */
:root {
	/* Colour */
	--upl-ink: #1C0B4B;          /* Headings, primary text */
	--upl-text: #2E2752;         /* Body text */
	--upl-muted: #5A5178;        /* Secondary text — 6.6:1 on --upl-bg */
	--upl-primary: #6B3FE0;      /* Buttons, links — 6.1:1 with white */
	--upl-primary-hover: #5A2FCC;
	--upl-primary-deep: #2A1260; /* Dark band start */
	--upl-primary-deep-2: #3F2A78; /* Dark band end */
	--upl-on-dark: #FFFFFF;
	--upl-on-dark-muted: #D9D0F5; /* ≥ 9:1 on deep purple (replaces mockup grey "Learn more") */
	--upl-accent-orange: #FF7A45; /* Decorative only — text on it uses --upl-ink */
	--upl-accent-yellow: #FFC93C; /* Decorative only */
	--upl-accent-sky: #3FB8F5;    /* Decorative only */
	--upl-accent-green: #2BB673;  /* Decorative only */
	--upl-bg: #F5F2FC;
	--upl-bg-alt: #EDE7FA;
	--upl-surface: #FFFFFF;
	--upl-line: #E4DEF3;
	--upl-error: #B42318;
	--upl-success: #0F7A4A;

	/* Type */
	--upl-font-head: 'Fraunces', Georgia, 'Times New Roman', serif;
	--upl-font-body: 'Plus Jakarta Sans', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
	--upl-fs-h1: clamp(2.5rem, 1.6rem + 3.9vw, 4.5rem);   /* 40 → 72px */
	--upl-fs-h1-inner: clamp(2.25rem, 1.6rem + 2.6vw, 3.5rem);
	--upl-fs-h2: clamp(1.875rem, 1.4rem + 1.9vw, 2.75rem); /* 30 → 44px */
	--upl-fs-h3: clamp(1.25rem, 1.1rem + .5vw, 1.5rem);
	--upl-fs-body: clamp(1rem, .96rem + .2vw, 1.0625rem);  /* 16 → 17px */
	--upl-fs-small: .9375rem;                              /* 15px — never below 14px */
	--upl-lh: 1.7;

	/* Spacing (8px scale) */
	--upl-s1: .5rem; --upl-s2: 1rem; --upl-s3: 1.5rem; --upl-s4: 2rem;
	--upl-s5: 2.5rem; --upl-s6: 3rem; --upl-s8: 4rem; --upl-s10: 5rem; --upl-s12: 6rem;
	--upl-section: clamp(4rem, 2.5rem + 6vw, 7.5rem);
	--upl-gutter: clamp(1rem, .5rem + 2.5vw, 2rem);
	--upl-max: 1200px;

	/* Shape & depth */
	--upl-r-sm: 12px; --upl-r: 16px; --upl-r-lg: 24px; --upl-r-xl: 32px; --upl-r-pill: 999px;
	--upl-shadow-sm: 0 2px 8px rgba(28, 11, 75, .06);
	--upl-shadow: 0 10px 30px -12px rgba(28, 11, 75, .18);
	--upl-shadow-lg: 0 24px 60px -20px rgba(28, 11, 75, .28);
	--upl-glow: 0 14px 30px -10px rgba(107, 63, 224, .55);

	/* Motion */
	--upl-ease: cubic-bezier(.22, .61, .36, 1);
	--upl-t: .28s;
}