/* ==========================================================================
   Casa Gaia — BASE: variabili, reset, tipografia, utilità.
   Valori dalla bozza 1 "Elegante scura". I colori vengono dalla palette di
   theme.json (--wp--preset--color--*) con il valore della bozza come ripiego.
   ========================================================================== */

:root {
	/* Colori */
	--nero: var(--wp--preset--color--nero, #0a0a0b);
	--nero-piede: #070708;
	--antracite: var(--wp--preset--color--antracite, #131315);
	--antracite-2: var(--wp--preset--color--antracite-2, #1b1b1e);
	--linea: var(--wp--preset--color--linea, #2c2b2a);
	--linea-forte: var(--wp--preset--color--linea-forte, #3d3a36);
	--linea-campo: #77716a; /* bordo dei campi dei moduli: 3,5:1 anche su antracite-2 (WCAG 1.4.11) */
	--avorio: var(--wp--preset--color--avorio, #ece6da);
	--testo: var(--wp--preset--color--testo, #d6d0c4);
	--grigio: var(--wp--preset--color--grigio, #a39d92);
	--segnaposto: #8f8a82;
	--bronzo: var(--wp--preset--color--bronzo, #b8945f);
	--bronzo-chiaro: var(--wp--preset--color--bronzo-chiaro, #d6b98a);
	--bronzo-velo: rgba(184, 148, 95, .45);
	--nero-velo: rgba(10, 10, 11, .78);

	/* Caratteri (le @font-face le stampa WordPress da theme.json) */
	--serif: "Cormorant Garamond", "Cormorant", Georgia, "Times New Roman", serif;
	--sans: "Manrope", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;

	/* Corpi fluidi (uguali ai preset di theme.json) */
	--corpo-piccolo: .86rem;
	--corpo-lead: clamp(1.05rem, 1.4vw, 1.2rem);
	--corpo-h3: clamp(1.6rem, 2.4vw, 2.1rem);
	--corpo-h2: clamp(2.4rem, 5.2vw, 4.6rem);
	--corpo-h1: clamp(3rem, 7vw, 6rem);
	--corpo-enorme: clamp(3.4rem, 9vw, 8.6rem);

	/* Spazi e griglie */
	--gutter: clamp(20px, 5vw, 72px);
	--max: 1320px;
	--max-testata: 1440px;
	--larghezza-testo: 760px;
	--spazio-sezione: clamp(88px, 12vw, 180px);
	--spazio-xl: clamp(56px, 8vw, 120px);
	--spazio-l: clamp(40px, 6vw, 80px);
	--spazio-m: clamp(24px, 3vw, 44px);
	--spazio-s: clamp(14px, 1.6vw, 24px);
	--altezza-testata: 84px;
	--sopra-testata: 0px; /* barra di amministrazione */

	/* Movimento */
	--ease: cubic-bezier(.2, .7, .1, 1);
}

.admin-bar { --sopra-testata: 32px; }
@media (max-width: 782px) { .admin-bar { --sopra-testata: 46px; } }

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

html {
	-webkit-text-size-adjust: 100%;
	scroll-behavior: smooth;
	scroll-padding-top: calc(var(--altezza-testata) + var(--sopra-testata) + 6px);
}

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

body {
	margin: 0;
	background: var(--nero);
	color: var(--testo);
	font: 400 1rem/1.7 var(--sans);
	letter-spacing: .005em;
	overflow-x: hidden;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

img, svg, video { display: block; max-width: 100%; height: auto; }
a { color: inherit; }
button, input, select, textarea { font: inherit; color: inherit; }
[hidden] { display: none !important; }
main:focus { outline: none; }

:focus-visible {
	outline: 2px solid var(--bronzo-chiaro);
	outline-offset: 3px;
	border-radius: 2px;
}

::selection { background: var(--bronzo); color: var(--nero); }

/* --- Tipografia ---------------------------------------------------------- */
h1, h2, h3, h4 {
	font-family: var(--serif);
	font-weight: 500;
	color: var(--avorio);
	margin: 0;
	line-height: 1.05;
	letter-spacing: -.005em;
	text-wrap: balance;
}
h1 { font-size: var(--corpo-h1); line-height: .95; letter-spacing: -.02em; }
h2 { font-size: var(--corpo-h2); }
h3 { font-size: var(--corpo-h3); }
h4 { font-size: 1.45rem; line-height: 1.2; }
h1 em, h2 em, h3 em { font-weight: 400; }
p { margin: 0 0 1.2em; }
em, .it { font-style: italic; }
strong, b { font-weight: 600; }
small { font-size: .82em; }

/* Occhiello: maiuscoletto bronzo con filo a sinistra */
.occhiello {
	display: inline-flex;
	align-items: center;
	gap: 14px;
	font: 600 .72rem/1 var(--sans);
	letter-spacing: .28em;
	text-transform: uppercase;
	color: var(--bronzo);
	margin: 0 0 28px;
}
.occhiello::before { content: ""; width: 36px; height: 1px; background: currentColor; flex: none; }

.lead { font-size: var(--corpo-lead); color: var(--testo); max-width: 58ch; }
.muto { color: var(--grigio); }
.bronzo { color: var(--bronzo-chiaro); }

/* Testo da concordare col cliente (visibile solo a chi è collegato: casagaia_segnaposto()) */
.segnaposto { color: var(--segnaposto); font-style: italic; font-family: var(--serif); font-size: 1.12em; }
.segnaposto::before { content: "✎ "; font-style: normal; font-size: .8em; color: var(--bronzo); }

/* --- Accessibilità ------------------------------------------------------- */
.sr-only, .screen-reader-text {
	position: absolute !important;
	width: 1px; height: 1px;
	padding: 0; margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}
.salta {
	position: absolute;
	left: 16px; top: -60px;
	z-index: 100;
	background: var(--bronzo);
	color: var(--nero);
	padding: 10px 16px;
	font-weight: 600;
	text-decoration: none;
}
.salta:focus { top: calc(12px + var(--sopra-testata)); }

/* --- Bersagli touch (WCAG 2.5.8: almeno 24×24 px) ------------------------- */
.salta { min-height: 44px; }

/* --- Stampa: fondo bianco, testo nero, niente testata/menu/piede/visore ---- */
/* Margini del foglio: senza, l'occhiello finiva a filo della carta. */
@page { size: A4; margin: 14mm 12mm; }
@media print {
	:root {
		--nero: #fff; --nero-piede: #fff; --antracite: #fff; --antracite-2: #fff;
		--avorio: #000; --testo: #111; --grigio: #444; --segnaposto: #666;
		--bronzo: #6b4f22; --bronzo-chiaro: #6b4f22; --linea: #ccc; --linea-forte: #999;
	}
	html { scroll-behavior: auto; }
	body { background: #fff !important; color: #111; font-size: 11pt; overflow: visible; }
	.salta, .testata, .nav, .hamburger, .piede, .visore, .filtri, .fascia-cta, .scheda-nav, .segnaposto, .gc-segnaposto, .piede-nascosti, #wpadminbar { display: none !important; }
	.testata-solida main, main { padding-top: 0 !important; }
	*, *::before, *::after { box-shadow: none !important; text-shadow: none !important; animation: none !important; transition: none !important; }
	h1, h2, h3, h4 { break-after: avoid; page-break-after: avoid; }
	img, figure, tr, li, .riquadro { break-inside: avoid; page-break-inside: avoid; }
	a { text-decoration: none; }
	.sezione { padding: 18pt 0 !important; }
	/* FAQ e altri <details>: su carta le risposte si stampano aperte, senza il "+" (rete JS in casagaia.js). */
	details::details-content { content-visibility: visible; display: block; }
	details > summary::after { display: none; }
}