/* Cardenius — base.css
	Design tokens, reset, typography primitives, motion primitives. */

:root {
	--cd-teal: #0B9A8D;
	--cd-teal-deep: #0A7F75;
	--cd-teal-bright: #1DE9D2;
	--cd-navy: #0A1424;
	--cd-navy-deep: #07101C;
	--cd-navy-footer: #050B14;
	--cd-paper: #F7F9F7;
	--cd-paper-alt: #F1F6F4;
	--cd-mint: #E2F2EE;
	--cd-surface: #FFFFFF;
	--cd-text: #0A1424;
	--cd-body: #1F2D3D;
	--cd-muted: #3A4658;
	--cd-subtle: #4B5565;
	--cd-line: #C9DBD7;
	--cd-line-strong: #0A1424;
	--cd-on-dark: #F7FAF9;
	--cd-on-dark-muted: #C5D1DD;
	--cd-on-dark-dim: #A8B6C6;
	--cd-teal-line: rgba(29, 233, 210, .3);

	--container-wide: 1480px;
	--container-reading: 740px;
	--gutter: clamp(20px, 3.6vw, 56px);
	--space-section: clamp(80px, 10vw, 160px);
	--space-block: clamp(48px, 6vw, 96px);
	--header-h: 72px;

	--font-display: 'Schibsted Grotesk', system-ui, sans-serif;
	--font-body: 'Schibsted Grotesk', system-ui, sans-serif;
	--font-mono: 'IBM Plex Mono', ui-monospace, monospace;
	--font-script: 'Schibsted Grotesk', 'Noto Sans Devanagari', 'Noto Sans Gujarati', 'Noto Sans Bengali', 'Noto Sans Gurmukhi', 'Noto Sans Tamil', 'Noto Sans Telugu', 'Noto Sans Kannada', 'Noto Sans Malayalam', 'Noto Sans Oriya', 'Noto Sans Arabic', system-ui, sans-serif;

	--ease-out: cubic-bezier(.2, .7, .1, 1);
}

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

html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }

body {
	margin: 0;
	background: var(--cd-paper);
	color: var(--cd-text);
	font-family: var(--font-body);
	font-size: 16px;
	line-height: 1.5;
	-webkit-font-smoothing: antialiased;
	overflow-x: clip;
}

body.is-menu-open { overflow: hidden; }

img, svg { display: block; max-width: 100%; }
img { height: auto; }

h1, h2, h3, h4, h5, h6, p, figure, blockquote, dl, dd { margin: 0; }
ul, ol { margin: 0; padding: 0; list-style: none; }
button { font: inherit; color: inherit; }

a { color: var(--cd-teal-deep); text-decoration: none; }
a:hover { color: var(--cd-teal-deep); }

:focus-visible {
	outline: 3px solid var(--cd-navy);
	outline-offset: 3px;
	/* Retain the light inner ring even on components with their own shadow. */
	box-shadow: 0 0 0 3px var(--cd-paper) !important;
}

.skip-link {
	position: absolute;
	left: -999px;
	top: 8px;
	z-index: 100;
	padding: 10px 16px;
	background: var(--cd-navy);
	color: #fff;
}
.skip-link:focus { left: 8px; color: #fff; }

.visually-hidden {
	position: absolute !important;
	width: 1px; height: 1px;
	margin: -1px; padding: 0;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
	border: 0;
}

[id] { scroll-margin-top: calc(var(--header-h) + 24px); }

/* Motion primitives */
@keyframes cd-line { from { transform: translateY(108%); } to { transform: none; } }
@keyframes cd-fade { from { opacity: 0; } to { opacity: 1; } }
@keyframes cd-grid { from { background-position: 0 0; } to { background-position: 80px 80px; } }


@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after { animation: none !important; transition: none !important; }
	html { scroll-behavior: auto; }
}