:root {
	--bg: #ffffff;
	--ink: #0b1220;
	--muted: #6b7280;
	--line: #e5e7eb;
	--accent: #050E39;
	--accent-weak: #eaffc7;

	/* Gradient tokens */
	--gradient-pink: linear-gradient(135deg, #EC4899, #831843);
	--gradient-orange: linear-gradient(135deg, #F97316, #7C2D12);
	--gradient-green: linear-gradient(135deg, #84CC16, #14532D);
	--gradient-violet: linear-gradient(135deg, #A78BFA, #4C1D95);

	/* Breakpoint tokens */
	--bp-tiny: 640px;
	--bp-small: 680px;
	--bp-medium: 800px;
	--bp-large: 900px;
	--bp-xl: 940px;
	--bp-xxl: 1100px;
}

* {
	box-sizing: border-box;
}

html,
body {
	height: 100%;
	scroll-padding-top: 84px;
	font-size: 18px;
}

body {
	margin: 0;
	font-family:
		ui-sans-serif,
		system-ui,
		-apple-system,
		'Segoe UI',
		Roboto,
		Inter,
		'Helvetica Neue',
		Arial,
		'Noto Sans',
		'Apple Color Emoji',
		'Segoe UI Emoji';
	color: var(--ink);
	background: var(--bg);
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
}

a {
	transition: all 0.3s;
}

h2 {
    font-size: clamp(32px, 5vw, 42px);
    font-weight: 700;
    color: #050E39;
    line-height: 1.2;
	margin: 0 0 30px;
}

h3 {
	margin: 0 0 20px;
	font-weight: 500;
}

.hero-copy p,
.lead-text {
	font-size: 20px;
	line-height: 1.6;
	margin-bottom: 1.5rem;
}

img,
svg {
	display: block;
}

.logged-in .site-header {
	top: 32px;
}

/* Container Variants */
.container {
	max-width: 1100px;
	margin: 0 auto;
	padding: 0 16px;
}

.container-wide {
	max-width: 1200px;
	margin: 0 auto;
	padding: 0 16px;
}

.container-narrow {
	max-width: 800px;
	margin: 0 auto;
	padding: 0 16px;
}

.section {
	padding: 72px 0;
}

.skip-link {
	position: absolute;
	left: -9999px;
	top: auto;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

.skip-link:focus {
	left: 16px;
	top: 12px;
	width: auto;
	height: auto;
	background: #000;
	color: #fff;
	padding: 8px 10px;
	border-radius: 8px;
	outline: none;
}

/* Screen reader only - visually hidden but accessible */
.sr-only {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}