/*
Theme Name: ONSEC Osservatorio
Theme URI: https://onsec.it
Author: Studio Parolisi & Partner
Description: Tema WordPress per osservatori, centri studi e istituti di ricerca. Home page istituzionale a sezioni, indicatori di rilevazione, comitato scientifico, sala stampa. Contenuti interamente modificabili dal backend, font ospitati in locale, nessuna chiamata a servizi esterni.
Version: 1.0.0
Requires at least: 6.2
Tested up to: 6.8
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: onsec
Tags: one-column, custom-colors, custom-menu, custom-logo, editor-style, featured-images, translation-ready, block-styles, wide-blocks
*/

/* ============================================================
   1. FONT (ospitati nel tema, nessuna richiesta a terze parti)
   ============================================================ */

@font-face {
	font-family: "Newsreader";
	src: url("assets/fonts/newsreader-var.woff2") format("woff2-variations");
	font-weight: 200 800;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: "Newsreader";
	src: url("assets/fonts/newsreader-var-italic.woff2") format("woff2-variations");
	font-weight: 200 800;
	font-style: italic;
	font-display: swap;
}
@font-face {
	font-family: "Plex Sans";
	src: url("assets/fonts/plex-sans-400.woff2") format("woff2");
	font-weight: 400; font-style: normal; font-display: swap;
}
@font-face {
	font-family: "Plex Sans";
	src: url("assets/fonts/plex-sans-500.woff2") format("woff2");
	font-weight: 500; font-style: normal; font-display: swap;
}
@font-face {
	font-family: "Plex Sans";
	src: url("assets/fonts/plex-sans-600.woff2") format("woff2");
	font-weight: 600; font-style: normal; font-display: swap;
}
@font-face {
	font-family: "Plex Mono";
	src: url("assets/fonts/plex-mono-400.woff2") format("woff2");
	font-weight: 400; font-style: normal; font-display: swap;
}
@font-face {
	font-family: "Plex Mono";
	src: url("assets/fonts/plex-mono-500.woff2") format("woff2");
	font-weight: 500; font-style: normal; font-display: swap;
}

/* ============================================================
   2. TOKEN
   ============================================================ */

:root {
	--ink: #10202a;
	--petrolio: #1b4c5f;
	--petrolio-scuro: #12333f;
	--carta: #ecefec;
	--carta-scura: #dfe4e1;
	--bianco: #ffffff;
	--ottone: #a8761a;
	--salvia: #6e8f7e;
	--grigio: #55656c;
	--linea: #c6cecb;
	--linea-scura: rgba(255, 255, 255, .22);

	--serif: "Newsreader", Georgia, "Times New Roman", serif;
	--sans: "Plex Sans", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
	--mono: "Plex Mono", ui-monospace, "SFMono-Regular", Consolas, monospace;

	--gutter: clamp(1.25rem, 4vw, 3rem);
	--max: 1240px;
	--sezione-y: clamp(4rem, 9vw, 7.5rem);
	--radius: 2px;
	--testata-h: 88px;
}

/* ============================================================
   3. RESET E BASE
   ============================================================ */

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

html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }

body {
	margin: 0;
	background: var(--carta);
	color: var(--ink);
	font-family: var(--sans);
	font-size: 1.0625rem;
	line-height: 1.65;
	font-weight: 400;
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
}

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

a { color: var(--petrolio); text-decoration-thickness: 1px; text-underline-offset: .18em; }
a:hover { color: var(--ottone); }

:focus-visible {
	outline: 2px solid var(--ottone);
	outline-offset: 3px;
}

h1, h2, h3, h4 { margin: 0 0 .6em; font-weight: 400; }

h1, h2 {
	font-family: var(--serif);
	letter-spacing: -.018em;
	line-height: 1.08;
}

h3, h4 { font-family: var(--sans); font-weight: 600; letter-spacing: -.005em; line-height: 1.3; }

p { margin: 0 0 1.15em; }
p:last-child { margin-bottom: 0; }

hr { border: 0; border-top: 1px solid var(--linea); margin: 2.5rem 0; }

blockquote {
	margin: 2rem 0;
	padding-left: 1.5rem;
	border-left: 2px solid var(--ottone);
	font-family: var(--serif);
	font-size: 1.3rem;
	font-style: italic;
	line-height: 1.4;
}

code, pre { font-family: var(--mono); font-size: .9em; }

table { width: 100%; border-collapse: collapse; margin: 2rem 0; font-size: .95rem; }
th, td { text-align: left; padding: .7rem .8rem; border-bottom: 1px solid var(--linea); }
th { font-family: var(--mono); font-size: .78rem; text-transform: uppercase; letter-spacing: .08em; font-weight: 500; }

/* ============================================================
   4. UTILITY
   ============================================================ */

.contenitore {
	width: 100%;
	max-width: var(--max);
	margin-inline: auto;
	padding-inline: var(--gutter);
}

.solo-lettori-schermo {
	position: absolute !important;
	width: 1px; height: 1px;
	overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%);
	white-space: nowrap;
}

.salta-al-contenuto {
	position: absolute; left: 1rem; top: -100px; z-index: 999;
	background: var(--ink); color: #fff; padding: .8rem 1.2rem;
	font-family: var(--mono); font-size: .8rem; text-decoration: none;
	transition: top .15s ease;
}
.salta-al-contenuto:focus { top: 1rem; color: #fff; }

/* Occhiello: etichetta monospaziata con tacca */
.occhiello {
	display: inline-flex; align-items: center; gap: .6rem;
	font-family: var(--mono);
	font-size: .72rem;
	font-weight: 500;
	letter-spacing: .16em;
	text-transform: uppercase;
	color: var(--grigio);
	margin: 0 0 1.4rem;
}
.occhiello::before {
	content: ""; width: 1.6rem; height: 0;
	border-top: 2px solid var(--ottone);
}
.sezione--scura .occhiello { color: rgba(255,255,255,.72); }

/* ---- IL RIGHELLO: elemento firma del tema ---- */
.righello {
	position: relative;
	height: 13px;
	border-bottom: 1px solid var(--linea);
	background-image: repeating-linear-gradient(90deg, var(--linea) 0 1px, transparent 1px 11px);
	background-size: 100% 5px;
	background-position: bottom left;
	background-repeat: repeat-x;
}
.righello::after {
	content: "";
	position: absolute; inset: auto 0 0 0;
	height: 11px;
	background-image: repeating-linear-gradient(90deg, var(--ottone) 0 1px, transparent 1px 55px);
	background-size: 100% 11px;
	background-position: bottom left;
	background-repeat: repeat-x;
	opacity: .85;
}
.sezione--scura .righello { border-bottom-color: var(--linea-scura); background-image: repeating-linear-gradient(90deg, var(--linea-scura) 0 1px, transparent 1px 11px); }

/* animazione di tracciamento */
.righello { clip-path: inset(0 100% 0 0); }
.rivelato .righello, .no-js .righello { clip-path: inset(0 0 0 0); transition: clip-path 1.1s cubic-bezier(.22,.61,.36,1); }
@media (prefers-reduced-motion: reduce) {
	.righello { clip-path: none !important; transition: none !important; }
}

/* ============================================================
   5. PULSANTI
   ============================================================ */

.pulsante {
	display: inline-flex; align-items: center; gap: .55rem;
	font-family: var(--sans); font-size: .92rem; font-weight: 500;
	letter-spacing: .01em;
	padding: .82rem 1.5rem;
	border: 1px solid var(--ink);
	background: var(--ink); color: #fff;
	text-decoration: none;
	border-radius: var(--radius);
	transition: background .18s ease, color .18s ease, border-color .18s ease;
	cursor: pointer;
}
.pulsante:hover { background: var(--petrolio); border-color: var(--petrolio); color: #fff; }
.pulsante svg { flex: none; }

.pulsante--vuoto { background: transparent; color: var(--ink); border-color: var(--linea); }
.pulsante--vuoto:hover { background: transparent; color: var(--petrolio); border-color: var(--petrolio); }

.sezione--scura .pulsante { background: #fff; color: var(--ink); border-color: #fff; }
.sezione--scura .pulsante:hover { background: var(--ottone); border-color: var(--ottone); color: #fff; }
.sezione--scura .pulsante--vuoto { background: transparent; color: #fff; border-color: rgba(255,255,255,.4); }
.sezione--scura .pulsante--vuoto:hover { border-color: #fff; background: transparent; color: #fff; }

.azioni { display: flex; flex-wrap: wrap; gap: .75rem; margin-top: 2rem; }

/* ============================================================
   6. TESTATA
   ============================================================ */

.testata {
	position: sticky; top: 0; z-index: 100;
	background: rgba(236, 239, 236, .93);
	backdrop-filter: saturate(140%) blur(8px);
	border-bottom: 1px solid var(--linea);
}
.admin-bar .testata { top: 32px; }
@media (max-width: 782px) { .admin-bar .testata { top: 46px; } }

.testata__interno {
	display: flex; align-items: center; gap: 1.5rem;
	min-height: var(--testata-h);
	padding-block: .7rem;
}

.marchio { display: flex; align-items: center; gap: .85rem; text-decoration: none; color: var(--ink); margin-right: auto; }
.marchio:hover { color: var(--ink); }
.marchio__sigla {
	font-family: var(--serif);
	font-size: 1.65rem;
	font-weight: 500;
	letter-spacing: .01em;
	line-height: 1;
}
.marchio__testo { display: none; padding-left: .85rem; border-left: 1px solid var(--linea); }
@media (min-width: 900px) { .marchio__testo { display: block; } }
.marchio__nome { display: block; font-size: .8rem; line-height: 1.3; font-weight: 500; max-width: 32ch; }
.marchio__nota { display: block; font-family: var(--mono); font-size: .66rem; letter-spacing: .1em; text-transform: uppercase; color: var(--grigio); margin-top: .15rem; }
.marchio__logo {
	max-height: 56px;
	max-width: min(300px, 42vw);
	width: auto;
	object-fit: contain;
}
.marchio__logo--compatto { display: none; }

@media (max-width: 899px) {
	:root { --testata-h: 72px; }
	.marchio__logo--esteso { display: none; }
	.marchio__logo--compatto { display: block; max-height: 40px; max-width: 40px; }
	.marchio__logo { max-height: 38px; max-width: min(210px, 52vw); }
}

.navigazione ul { display: flex; align-items: center; gap: 1.35rem; list-style: none; margin: 0; padding: 0; }
.navigazione a {
	font-size: .9rem; color: var(--ink); text-decoration: none;
	white-space: nowrap;
	padding-block: .4rem; border-bottom: 1px solid transparent;
}

/* fascia intermedia: il menu si stringe invece di spezzarsi */
@media (min-width: 1200px) and (max-width: 1360px) {
	.navigazione ul { gap: 1.05rem; }
	.navigazione a { font-size: .85rem; }
}
.navigazione a:hover, .navigazione .current-menu-item > a { color: var(--petrolio); border-bottom-color: var(--ottone); }

.testata .pulsante { padding: .6rem 1.1rem; font-size: .85rem; }
@media (max-width: 899px) {
	.testata .pulsante { padding: .5rem .85rem; font-size: .78rem; }
	.testata__interno { gap: .75rem; }
}

.interruttore-menu {
	display: none;
	background: none; border: 1px solid var(--linea); border-radius: var(--radius);
	padding: .55rem .8rem; cursor: pointer;
	font-family: var(--mono); font-size: .72rem; letter-spacing: .1em; text-transform: uppercase;
	color: var(--ink);
}

@media (max-width: 1199px) {
	.interruttore-menu { display: block; }
	.navigazione {
		position: absolute; top: 100%; left: 0; right: 0;
		background: var(--carta);
		border-bottom: 1px solid var(--linea);
		padding: 1rem var(--gutter) 2rem;
		display: none;
	}
	.navigazione.aperta { display: block; }
	.navigazione ul { flex-direction: column; align-items: stretch; gap: 0; }
	.navigazione li { border-bottom: 1px solid var(--linea); }
	.navigazione a { display: block; padding: .95rem 0; font-size: 1.05rem; white-space: normal; }
	.testata__cta { display: none; }
}

/* ============================================================
   7. SEZIONI
   ============================================================ */

.sezione { padding-block: var(--sezione-y); }
.sezione--carta { background: var(--carta); }
.sezione--bianca { background: var(--bianco); }
.sezione--scura { background: var(--ink); color: rgba(255,255,255,.82); }
.sezione--scura h2, .sezione--scura h3, .sezione--scura strong { color: #fff; }
.sezione--petrolio { background: var(--petrolio); color: rgba(255,255,255,.86); }
.sezione--petrolio h2, .sezione--petrolio h3 { color: #fff; }

.sezione__intestazione { max-width: 62ch; margin-bottom: clamp(2.5rem, 5vw, 4rem); }
.sezione__titolo { font-size: clamp(1.85rem, 1.2rem + 2.1vw, 2.9rem); margin-bottom: .5rem; }
.sezione__testo { color: var(--grigio); font-size: 1.05rem; max-width: 58ch; }
.sezione--scura .sezione__testo, .sezione--petrolio .sezione__testo { color: rgba(255,255,255,.75); }

/* ============================================================
   8. APERTURA (hero)
   ============================================================ */

.apertura { padding-block: clamp(3.5rem, 8vw, 6.5rem) 0; background: var(--carta); }

.apertura__titolo {
	font-size: clamp(2.5rem, 1.1rem + 5.4vw, 5.1rem);
	line-height: 1.03;
	max-width: 17ch;
	margin-bottom: 0;
	text-wrap: balance;
}
.apertura__titolo em { font-style: italic; color: var(--petrolio); }

.apertura__griglia {
	display: grid;
	grid-template-columns: 1fr;
	gap: clamp(2rem, 4vw, 3.5rem);
	align-items: start;
}
@media (min-width: 900px) {
	.apertura__griglia {
		grid-template-columns: minmax(0, 1fr) auto;
		align-items: center;
		gap: clamp(2.5rem, 5vw, 5rem);
	}
}
.apertura__abstract {
	font-size: 1.15rem; line-height: 1.6; color: var(--grigio);
	max-width: 52ch; margin-top: clamp(1.6rem, 3vw, 2.4rem);
}
.apertura__abstract strong { color: var(--ink); font-weight: 500; }

.apertura__righello { margin-top: clamp(2.5rem, 5vw, 4rem); }

/* strip indicatori */
.rilevazione {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
	border-left: 1px solid var(--linea);
	background: var(--bianco);
}
.indicatore {
	padding: 1.6rem clamp(1.1rem, 2vw, 1.8rem) 1.5rem;
	border-right: 1px solid var(--linea);
	border-bottom: 1px solid var(--linea);
}
.indicatore__etichetta {
	font-size: .88rem; font-weight: 500; line-height: 1.35;
	margin: 0 0 .9rem; min-height: 2.4em;
}
.indicatore__valore {
	font-family: var(--mono); font-weight: 500;
	font-size: clamp(2rem, 1.4rem + 1.6vw, 2.7rem);
	line-height: 1; letter-spacing: -.03em;
	color: var(--ink);
	display: flex; align-items: baseline; gap: .18em;
}
.indicatore__unita { font-size: .42em; letter-spacing: .02em; color: var(--grigio); }

.scala { margin-top: 1.1rem; }
.scala__barra {
	position: relative; height: 9px;
	border-bottom: 1px solid var(--linea);
	background-image: repeating-linear-gradient(90deg, var(--linea) 0 1px, transparent 1px 9px);
	background-size: 100% 4px; background-position: bottom left; background-repeat: repeat-x;
}
.scala__segno {
	position: absolute; bottom: -1px; width: 2px; height: 15px;
	background: var(--ottone);
	transform: translateX(-1px);
}
.scala__segno::after {
	content: ""; position: absolute; left: 50%; top: -5px;
	width: 7px; height: 7px; border-radius: 50%;
	background: var(--ottone); transform: translateX(-50%);
}
.scala__estremi {
	display: flex; justify-content: space-between;
	font-family: var(--mono); font-size: .66rem; letter-spacing: .06em;
	color: var(--grigio); margin-top: .55rem;
}
.indicatore__meta {
	font-family: var(--mono); font-size: .68rem; letter-spacing: .05em;
	color: var(--grigio); margin-top: 1rem; line-height: 1.5;
}
.indicatore__meta span { display: block; }

/* ============================================================
   9. MANDATO
   ============================================================ */

.mandato { display: grid; gap: clamp(2rem, 5vw, 4.5rem); grid-template-columns: 1fr; }
@media (min-width: 900px) { .mandato { grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); align-items: start; } }

.mandato__testo { font-size: 1.1rem; line-height: 1.7; }
.mandato__testo p + p { margin-top: 1.1em; }

.registro { border-top: 1px solid var(--linea); }
.registro__voce {
	display: flex; justify-content: space-between; align-items: baseline; gap: 1.5rem;
	padding: 1.05rem 0;
	border-bottom: 1px solid var(--linea);
}
.registro__etichetta {
	font-family: var(--mono); font-size: .72rem; letter-spacing: .12em;
	text-transform: uppercase; color: var(--grigio);
}
.registro__valore { font-family: var(--serif); font-size: 1.3rem; text-align: right; line-height: 1.2; }

/* ============================================================
   10. AREE DI OSSERVAZIONE
   ============================================================ */

.aree {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
	gap: 1px;
	background: var(--linea);
	border: 1px solid var(--linea);
}
.area {
	background: var(--bianco);
	padding: clamp(1.6rem, 3vw, 2.4rem);
	display: flex; flex-direction: column;
	transition: background .2s ease;
}
.area:hover { background: #fafcfa; }
.area__sigla {
	font-family: var(--mono); font-size: .72rem; font-weight: 500;
	letter-spacing: .14em; color: var(--ottone); margin-bottom: 1.4rem;
}
.area__titolo { font-family: var(--serif); font-weight: 400; font-size: 1.5rem; line-height: 1.2; margin-bottom: .7rem; }
.area__titolo a { color: inherit; text-decoration: none; }
.area__titolo a:hover { color: var(--petrolio); }
.area__testo { color: var(--grigio); font-size: .97rem; margin-bottom: 1.2rem; }
.area__piede { margin-top: auto; font-family: var(--mono); font-size: .7rem; letter-spacing: .08em; text-transform: uppercase; color: var(--grigio); }

/* ============================================================
   11. DEFINIZIONE, CITAZIONI, AMBIENTE, SCOPI
   ============================================================ */

/* --- riquadro della definizione sotto l'apertura --- */
.definizione {
	margin: 0;
	background: var(--bianco);
	border: 1px solid var(--linea);
	border-top: 2px solid var(--ottone);
	padding: clamp(1.8rem, 3.5vw, 3rem);
	display: grid;
	gap: 1.2rem 3rem;
	grid-template-columns: 1fr;
}
@media (min-width: 900px) {
	.definizione { grid-template-columns: 13rem minmax(0, 1fr); }
	.definizione__fonte { grid-column: 2; }
}
.definizione__etichetta {
	font-family: var(--mono); font-size: .72rem; font-weight: 500;
	letter-spacing: .14em; text-transform: uppercase; color: var(--grigio);
	line-height: 1.6;
}
.definizione__testo {
	margin: 0; padding: 0; border: 0;
	font-family: var(--serif);
	font-size: clamp(1.2rem, 1rem + .8vw, 1.65rem);
	line-height: 1.4;
	font-style: normal;
	color: var(--ink);
	text-wrap: pretty;
}
.definizione__fonte {
	font-family: var(--mono); font-size: .7rem; letter-spacing: .08em;
	text-transform: uppercase; color: var(--grigio); margin: 0;
}

/* --- citazione con fonte --- */
.citazione { margin: 2.2rem 0 0; }
.citazione__testo {
	margin: 0; padding: 0 0 0 1.6rem;
	border-left: 2px solid var(--ottone);
	font-family: var(--serif);
	font-size: clamp(1.3rem, 1.05rem + 1vw, 1.9rem);
	line-height: 1.35;
	font-style: normal;
	color: var(--ink);
	text-wrap: pretty;
}
.citazione__fonte {
	margin: .9rem 0 0 1.6rem;
	font-family: var(--mono); font-size: .7rem; letter-spacing: .08em;
	text-transform: uppercase; color: var(--grigio);
}
.sezione--scura .citazione__testo { color: #fff; }
.sezione--scura .citazione__fonte { color: rgba(255,255,255,.6); }

/* --- ambiente immateriale --- */
.ambiente { display: grid; gap: clamp(2rem, 4vw, 3.5rem); grid-template-columns: 1fr; }
@media (min-width: 900px) { .ambiente { grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); align-items: start; } }
.ambiente .citazione { margin-top: 0; }
.ambiente__testo { margin-top: 2.2rem; color: rgba(255,255,255,.78); }

/* --- scopi --- */
.scopi {
	list-style: none; margin: 0; padding: 0;
	display: grid; gap: 0 clamp(2rem, 4vw, 3.5rem);
	grid-template-columns: repeat(auto-fit, minmax(290px, 1fr));
	border-top: 1px solid var(--linea);
}
.scopo {
	position: relative;
	padding: .95rem 0 .95rem 1.9rem;
	border-bottom: 1px solid var(--linea);
	font-size: .98rem;
	line-height: 1.5;
}
.scopo::before {
	content: ""; position: absolute; left: 0; top: 1.45em;
	width: .95rem; border-top: 2px solid var(--ottone);
}

/* --- discipline --- */
.discipline {
	margin-top: clamp(2.5rem, 5vw, 4rem);
	padding-top: 1.6rem;
	border-top: 1px solid var(--linea);
}
.discipline__titolo {
	font-family: var(--mono); font-size: .72rem; font-weight: 500;
	letter-spacing: .14em; text-transform: uppercase; color: var(--grigio);
	margin-bottom: 1rem;
}
.discipline__elenco {
	list-style: none; margin: 0; padding: 0;
	display: flex; flex-wrap: wrap; gap: .5rem .55rem;
}
.discipline__elenco li {
	font-family: var(--mono); font-size: .78rem; letter-spacing: .03em;
	padding: .4rem .75rem;
	border: 1px solid var(--linea);
	background: var(--bianco);
	border-radius: var(--radius);
	color: var(--ink);
}

/* ============================================================
   12. PUBBLICAZIONI
   ============================================================ */

.pubblicazioni { border-top: 1px solid var(--linea); }
.pubblicazione {
	display: grid; gap: .4rem 2rem;
	grid-template-columns: 1fr;
	padding: 1.5rem 0;
	border-bottom: 1px solid var(--linea);
	align-items: baseline;
	transition: padding-left .2s ease;
}
@media (min-width: 780px) {
	.pubblicazione { grid-template-columns: 8.5rem minmax(0, 1fr) 9rem; padding-block: 1.7rem; }
}
.pubblicazione:hover { padding-left: .6rem; }
.pubblicazione__data { font-family: var(--mono); font-size: .74rem; letter-spacing: .06em; text-transform: uppercase; color: var(--grigio); }
.pubblicazione__titolo { font-family: var(--serif); font-size: clamp(1.25rem, 1rem + .7vw, 1.6rem); line-height: 1.25; margin: 0; }
.pubblicazione__titolo a { color: var(--ink); text-decoration: none; }
.pubblicazione__titolo a:hover { color: var(--petrolio); }
.pubblicazione__estratto { color: var(--grigio); font-size: .95rem; margin-top: .45rem; max-width: 62ch; }
.pubblicazione__tipo { font-family: var(--mono); font-size: .7rem; letter-spacing: .1em; text-transform: uppercase; color: var(--ottone); }
@media (min-width: 780px) { .pubblicazione__tipo { text-align: right; } }

.coda-sezione { margin-top: 2.5rem; }

/* ============================================================
   13. COMITATO
   ============================================================ */

.comitato { display: grid; grid-template-columns: repeat(auto-fill, minmax(215px, 1fr)); gap: clamp(1.8rem, 3vw, 2.6rem); }
.membro__ritratto {
	width: 100%; aspect-ratio: 4 / 5; object-fit: cover;
	filter: grayscale(1) contrast(1.04);
	background: var(--carta-scura);
	margin-bottom: 1rem;
	border-radius: var(--radius);
}
.membro--senza-ritratto { padding-top: 1.15rem; border-top: 1px solid var(--linea); position: relative; }
.membro--senza-ritratto::before {
	content: ""; position: absolute; left: 0; top: -1px;
	width: 1.6rem; border-top: 2px solid var(--ottone);
}
.membro__nome { font-family: var(--serif); font-size: 1.22rem; font-weight: 500; line-height: 1.25; margin-bottom: .3rem; }
.membro__ruolo { font-size: .92rem; color: var(--ink); margin-bottom: .15rem; }
.membro__affiliazione { font-family: var(--mono); font-size: .7rem; letter-spacing: .06em; color: var(--grigio); line-height: 1.5; }

/* ============================================================
   13b. MARCHIO IN APERTURA
   ============================================================ */

.apertura__marchio {
	--lato-marchio: 240px;
	justify-self: start;
	max-width: 100%;
}
@media (min-width: 900px) { .apertura__marchio { justify-self: end; } }

.marchio-quadro {
	display: block;
	width: min(var(--lato-marchio), 46vw);
	aspect-ratio: 1 / 1;
	height: auto;
	object-fit: contain;
}

.apertura__marchio-testo {
	margin: 1rem 0 0;
	max-width: min(var(--lato-marchio), 46vw);
	font-family: var(--mono);
	font-size: .68rem;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--grigio);
	line-height: 1.65;
}

@media (max-width: 899px) {
	.apertura__marchio { order: -1; }
	.marchio-quadro { width: min(var(--lato-marchio), 34vw); }
}

/* segnaposto visibile solo a chi cura il sito */
.segnaposto {
	padding: 1.2rem;
	border: 1px dashed var(--linea);
	background: rgba(255, 255, 255, .6);
	border-radius: var(--radius);
	aspect-ratio: 1 / 1;
	display: flex;
	flex-direction: column;
	justify-content: center;
}
.segnaposto__titolo {
	font-family: var(--mono); font-size: .7rem; font-weight: 500;
	letter-spacing: .14em; text-transform: uppercase; color: var(--ottone);
	margin-bottom: .7rem;
}
.segnaposto__testo { font-size: .82rem; line-height: 1.5; color: var(--grigio); margin-bottom: .6rem; }
.segnaposto__nota {
	font-family: var(--mono); font-size: .64rem; letter-spacing: .06em;
	color: var(--grigio); margin: 0;
}

/* ============================================================
   14. SALA STAMPA
   ============================================================ */

.sala-stampa { display: grid; gap: clamp(2rem, 5vw, 4rem); grid-template-columns: 1fr; }
@media (min-width: 900px) { .sala-stampa { grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); align-items: start; } }

.recapiti { border-top: 1px solid rgba(255,255,255,.28); }
.recapito { padding: 1.1rem 0; border-bottom: 1px solid rgba(255,255,255,.28); }
.recapito__etichetta { font-family: var(--mono); font-size: .7rem; letter-spacing: .12em; text-transform: uppercase; color: rgba(255,255,255,.65); margin-bottom: .3rem; }
.recapito__valore { font-size: 1.08rem; color: #fff; }
.recapito__valore a { color: #fff; text-decoration-color: rgba(255,255,255,.45); }
.recapito__valore a:hover { color: var(--carta); text-decoration-color: #fff; }

/* ============================================================
   15. PIEDE
   ============================================================ */

.piede { background: var(--ink); color: rgba(255,255,255,.68); padding-block: clamp(3rem, 6vw, 4.5rem) 2rem; font-size: .92rem; }
.piede a { color: rgba(255,255,255,.85); }
.piede a:hover { color: var(--ottone); }
.piede__griglia { display: grid; gap: 2.5rem; grid-template-columns: 1fr; }
@media (min-width: 780px) { .piede__griglia { grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr) minmax(0, 1fr); } }
.piede__sigla { font-family: var(--serif); font-size: 1.6rem; color: #fff; margin-bottom: .6rem; }
.piede__marchio { width: 44px; height: auto; aspect-ratio: 1 / 1; object-fit: contain; margin-bottom: 1rem; }
.piede__marchio--schiarito { filter: brightness(0) invert(1); }

.piede__legali { display: flex; flex-wrap: wrap; gap: .6rem 1.5rem; }
.piede__legali ul { display: flex; flex-wrap: wrap; gap: .6rem 1.5rem; }
.piede__legali a { color: rgba(255,255,255,.62); text-decoration: none; border-bottom: 1px solid rgba(255,255,255,.28); }
.piede__legali a:hover { color: #fff; border-bottom-color: var(--ottone); }
.piede__denominazione { max-width: 34ch; }
.piede__titolo { font-family: var(--mono); font-size: .72rem; letter-spacing: .12em; text-transform: uppercase; color: rgba(255,255,255,.5); margin-bottom: 1rem; }
.piede ul { list-style: none; margin: 0; padding: 0; }
.piede li { margin-bottom: .55rem; }
.piede__avvertenza { margin-top: 1.8rem; }

.piede__avvertenza {
	margin-top: 3rem; padding-top: 1.5rem;
	border-top: 1px solid var(--linea-scura);
	font-size: .82rem; color: rgba(255,255,255,.55); max-width: 78ch;
}
.piede__coda {
	margin-top: 1.5rem; padding-top: 1.5rem;
	border-top: 1px solid var(--linea-scura);
	display: flex; flex-wrap: wrap; gap: 1rem 2rem; justify-content: space-between; align-items: flex-start;
	font-family: var(--mono); font-size: .7rem; letter-spacing: .06em; color: rgba(255,255,255,.5);
}
.piede__intestazione-legale { display: flex; flex-direction: column; gap: .5rem; max-width: 78ch; }
.piede__copyright { color: rgba(255,255,255,.62); }
.piede__ente-riga { line-height: 1.7; color: rgba(255,255,255,.5); }

/* ============================================================
   16. PAGINE INTERNE E ARTICOLI
   ============================================================ */

.intestazione-pagina { padding-block: clamp(3rem, 6vw, 5rem) 0; }
.intestazione-pagina__titolo { font-size: clamp(2rem, 1.3rem + 2.6vw, 3.4rem); max-width: 22ch; }
.intestazione-pagina__meta { font-family: var(--mono); font-size: .74rem; letter-spacing: .1em; text-transform: uppercase; color: var(--grigio); margin-bottom: 1.2rem; }
.intestazione-pagina .righello { margin-top: clamp(2rem, 4vw, 3rem); }

.contenuto { max-width: 68ch; margin-inline: auto; padding-block: clamp(2.5rem, 5vw, 4rem); font-size: 1.09rem; line-height: 1.72; }
.contenuto > * { margin-bottom: 1.2em; }
.contenuto h2 { font-size: 1.9rem; margin-top: 2.2em; }
.contenuto h3 { font-size: 1.28rem; margin-top: 1.8em; }
.contenuto ul, .contenuto ol { padding-left: 1.3em; }
.contenuto li { margin-bottom: .45em; }
.contenuto figcaption { font-family: var(--mono); font-size: .74rem; color: var(--grigio); margin-top: .6rem; letter-spacing: .04em; }
.contenuto .wp-block-image { margin-block: 2rem; }
.alignwide { max-width: min(100%, 1100px); margin-inline: auto; }
.alignfull { max-width: none; }

.paginazione { display: flex; gap: .5rem; flex-wrap: wrap; padding-block: 2rem 4rem; font-family: var(--mono); font-size: .82rem; }
.paginazione .page-numbers {
	display: inline-block; padding: .5rem .85rem;
	border: 1px solid var(--linea); text-decoration: none; color: var(--ink);
	border-radius: var(--radius);
}
.paginazione .current, .paginazione .page-numbers:hover { background: var(--ink); color: #fff; border-color: var(--ink); }

.modulo-ricerca { display: flex; gap: .5rem; max-width: 32rem; }
.modulo-ricerca input[type="search"] {
	flex: 1; padding: .78rem .9rem; font: inherit; font-size: .95rem;
	border: 1px solid var(--linea); background: #fff; color: var(--ink); border-radius: var(--radius);
}
.modulo-ricerca input[type="search"]:focus-visible { border-color: var(--petrolio); }

.nessun-risultato { padding-block: 2rem 5rem; max-width: 60ch; }

/* ============================================================
   17. RIVELAZIONE AL SCORRIMENTO
   ============================================================ */

.rivela { opacity: 0; transform: translateY(14px); transition: opacity .7s ease, transform .7s cubic-bezier(.22,.61,.36,1); }
.rivela.rivelato { opacity: 1; transform: none; }
.no-js .rivela { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) {
	.rivela { opacity: 1 !important; transform: none !important; transition: none !important; }
}

/* ============================================================
   18. STAMPA
   ============================================================ */

@media print {
	.testata, .piede, .azioni, .interruttore-menu { display: none !important; }
	body { background: #fff; color: #000; font-size: 11pt; }
	.sezione { padding-block: 1.5rem; }
}