/*
 * Global surface and accessibility rules shared by templates
 * and editor content.
 */
:root {
	--marcone-line: rgba(214, 220, 170, 0.22);
	--marcone-surface-line: rgba(214, 220, 170, 0.08);
	--marcone-radius: 28px;
}

* {
	box-sizing: border-box;
}

html {
	min-width: 320px;
	scroll-behavior: smooth;
	background: var(--wp--preset--color--forest-deep);
}

body {
	margin: 0;
}

body::before,
body::after {
	content: "";
	position: fixed;
	inset: 0;
	pointer-events: none;
}

/* The print texture stays asset-based to keep the stylesheet readable. */
body::before {
	z-index: 50;
	opacity: 0.26;
	background-image: url(../images/print-noise.svg);
	mix-blend-mode: soft-light;
}

body::after {
	z-index: 49;
	opacity: 0.08;
	background-image: url(../images/scanlines.svg);
}

:focus-visible {
	outline: 3px solid var(--wp--preset--color--sage-light);
	outline-offset: 3px;
}

.wp-site-blocks {
	padding: 0;
}

.marcone-shell {
	width: min(1480px, calc(100% - 24px));
	margin-inline: auto;
}

.marcone-surface {
	overflow: hidden;
	border-radius: var(--marcone-radius);
	box-shadow: inset 0 0 0 1px var(--marcone-surface-line);
}

.marcone-eyebrow {
	margin: 0;
	color: var(--wp--preset--color--sage);
	font-family: var(--wp--preset--font-family--mono);
	font-size: 0.82rem;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.marcone-display-title {
	max-width: 1100px;
	margin: 0;
	font-size: clamp(3.5rem, 7vw, 8rem);
	font-weight: 500;
	letter-spacing: -0.07em;
	line-height: 0.9;
}

.marcone-page-lead {
	max-width: 760px;
	margin-top: 2rem;
	color: var(--wp--preset--color--sage);
	font-size: clamp(1.15rem, 2vw, 1.45rem);
	line-height: 1.6;
}