/* =============================================================================
   STADSGENOOTJES — Theme baseline
   -----------------------------------------------------------------------------
   Maps tokens to base elements. Elementor and Hello Elementor handle most
   layout; this layer brings in our type and color from the design system.
   ============================================================================= */

body {
	font-family: var(--sg-font-body, "Nunito", sans-serif);
	font-size: var(--sg-fs-base, 17px);
	line-height: var(--sg-lh-normal, 1.45);
	color: var(--sg-ink, #1B1A17);
	background: var(--sg-bg, var(--sg-cream, #FBF5EC));
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	overflow-x: hidden;
}

h1, h2, h3, h4, h5, h6 {
	font-family: var(--sg-font-display);
	/* Caprasimo is een single-weight (400) display-font; 700/800 forceert
	   lelijke synthetische bold. Design ref: "volume comes from size". */
	font-weight: 400;
	line-height: var(--sg-lh-tight);
	color: var(--sg-ink);
	margin: 0 0 var(--sg-space-4);
}
h1 { font-size: var(--sg-fs-4xl); }
h2 { font-size: var(--sg-fs-3xl); }
h3 { font-size: var(--sg-fs-2xl); }
h4 { font-size: var(--sg-fs-xl); }
h5 { font-size: var(--sg-fs-lg); }
h6 { font-size: var(--sg-fs-base); text-transform: uppercase; letter-spacing: 0.05em; }

p {
	margin: 0 0 var(--sg-space-4);
	line-height: var(--sg-lh-loose);
}

a {
	color: var(--sg-accent);
	text-decoration-color: color-mix(in srgb, var(--sg-accent) 50%, transparent);
	text-underline-offset: 0.15em;
	transition: color var(--sg-dur-fast) var(--sg-ease);
}
a:hover,
a:focus-visible {
	color: var(--sg-accent-deep);
}

::selection {
	background: var(--sg-accent);
	color: var(--sg-paper);
}

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