/*
 * Tema Pavanini Zambardi — stili del tema.
 *
 * Colori, tipografia e spaziature arrivano da theme.json come custom property.
 * Qui c'è solo ciò che theme.json non può esprimere: layout, stati, componenti.
 *
 * Il layout è governato da container query e clamp(), non da breakpoint fissi:
 * i componenti si adattano allo spazio che hanno, ovunque vengano collocati.
 */

/* ---------------------------------------------------------------- Base --- */

:root {
	--pz-rule: color-mix(in srgb, var(--wp--preset--color--base) 22%, transparent);
	--pz-focus: #ffbf47;
	--pz-transition: 160ms ease;
}

html {
	scroll-behavior: smooth;
	/* Compensa l'header quando si salta a un'ancora della pagina Attività. */
	scroll-padding-block-start: 5rem;
}

@media (prefers-reduced-motion: reduce) {
	html {
		scroll-behavior: auto;
	}

	*,
	*::before,
	*::after {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
	}
}

body {
	text-rendering: optimizeLegibility;
	-webkit-font-smoothing: antialiased;
}

/* Un solo stile di focus, visibile su fondo chiaro e su fondo blu. */
:where(a, button, input, textarea, select, summary, [tabindex]):focus-visible {
	outline: 3px solid var(--pz-focus);
	outline-offset: 2px;
	border-radius: 2px;
}

/* --------------------------------------------------------------- Testa --- */

.pz-header {
	position: relative;
	z-index: 10;
}

/* Su telefono e tablet la testata resta agganciata in alto: con pagine lunghe
   come "Attività" o la privacy, dover risalire fino in cima per cambiare
   sezione è il motivo per cui si abbandona un sito da telefono. La misura è
   la stessa a cui il menu passa al pannello a comparsa: testata agganciata e
   menu a pannello vanno insieme. */
@media (max-width: 61.99rem) {

	.pz-header {
		position: sticky;
		inset-block-start: 0;
		z-index: 30;
	}

	/* Con la testata agganciata, un salto a un'ancora finirebbe sotto di
	   essa: si lascia lo spazio necessario sopra la destinazione. */
	.pz-area,
	:target {
		scroll-margin-block-start: 6.5rem;
	}
}

.pz-header__inner {
	container-type: inline-size;
	container-name: pz-header;
	gap: var(--wp--preset--spacing--30);
}

.pz-header__logo img {
	block-size: auto;
	max-inline-size: min(200px, 52cqi);
}

.pz-header__right {
	gap: var(--wp--preset--spacing--30);
}

/* Su telefono il marchio e i comandi devono stare sulla stessa riga: se il
   gruppo di destra va a capo, con "space-between" finisce a sinistra sotto
   al logo e la testata si allunga per niente. Basta stringere un po' il
   marchio e ridurre lo spazio fra le voci. */
@container pz-header (max-width: 34rem) {

	.pz-header__logo img {
		max-inline-size: min(200px, 44cqi);
	}

	.pz-header__inner,
	.pz-header__right {
		gap: var(--wp--preset--spacing--20);
	}
}

.pz-header .wp-block-navigation {
	--navigation-layout-justification-setting: flex-end;
	font-weight: 400;
}

/* ------------------------------------------------- Menu su telefono --- */

/* Il pannello a comparsa è la navigazione principale su telefono, non una
   versione ridotta di quella da scrivania: voci a tutta larghezza, alte
   almeno quanto un polpastrello (48 px è la misura consigliata da Apple e
   Google), separate da un filetto così si capisce dove finisce una e inizia
   l'altra. Il sottomenu dei professionisti resta aperto: sono cinque nomi,
   nasconderli dietro un secondo tocco è un ostacolo e basta. */
.pz-header .wp-block-navigation__responsive-container.is-menu-open {
	padding: var(--wp--preset--spacing--40) var(--wp--preset--spacing--20);

	/* Da scrivania il menu è allineato a destra, e WordPress usa questa
	   variabile anche dentro il pannello: lì va rimessa a sinistra, altrimenti
	   le voci del sottomenu restano incolonnate a metà schermo. */
	--navigation-layout-justification-setting: flex-start;
	--navigation-layout-justify: flex-start;
	--navigation-layout-align: stretch;
	--navigation-layout-direction: column;
}

.pz-header .is-menu-open .wp-block-navigation__responsive-dialog {
	inline-size: 100%;
	max-inline-size: 30rem;
	margin-inline: auto;
}

/* Gli stessi selettori usati da WordPress, altrimenti le sue regole — che
   allineano a destra e rientrano i sottomenu di 2rem — hanno la meglio. */
.pz-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container,
.pz-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container {
	align-items: stretch;
	justify-content: flex-start;
	text-align: start;
	inline-size: 100%;
	padding-inline-start: 0;
	gap: 0;
}

.pz-header .is-menu-open .wp-block-navigation-item {
	inline-size: 100%;
	border-block-end: 1px solid var(--pz-rule);
}

/* La voce che ha un sottomenu è essa stessa un contenitore flessibile
   allineato a destra: è da qui che il sottomenu finiva incolonnato a metà
   schermo, largo quanto i nomi invece che quanto la pagina. */
.pz-header .is-menu-open .wp-block-navigation-item.has-child,
.pz-header .is-menu-open .wp-block-navigation-submenu {
	display: block;
}

.pz-header .is-menu-open .wp-block-navigation-item.has-child .wp-block-navigation__submenu-container {
	inline-size: 100% !important;
	padding-inline-start: 0 !important;
	margin: 0 !important;
}

.pz-header .is-menu-open .wp-block-navigation-item__content {
	display: flex;
	align-items: center;
	box-sizing: border-box;
	inline-size: 100%;
	min-block-size: 3rem;
	padding-block: 0.6rem !important;
	font-size: 1.125rem;
	border-block-end: 0 !important;
}

/* La voce della pagina che si sta guardando: filetto a sinistra invece della
   sottolineatura, che a tutta larghezza si confonderebbe con il separatore. */
.pz-header .is-menu-open .current-menu-item > a,
.pz-header .is-menu-open [aria-current="page"] {
	border-block-end: 0 !important;
	border-inline-start: 3px solid var(--pz-focus);
	padding-inline-start: 0.7rem;
	font-weight: 600;
}

/* Sottomenu sempre aperto: niente tendina sovrapposta, niente freccia da
   toccare. I nomi rientrano di poco, quanto basta a leggerli come figli. */
.pz-header .is-menu-open .wp-block-navigation__submenu-container {
	position: static !important;
	inset: auto !important;
	transform: none !important;
	opacity: 1 !important;
	visibility: visible !important;
	min-inline-size: 0;
	padding-block: 0;
	border: 0;
	background: transparent;
}

.pz-header .is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item:last-child {
	border-block-end: 0;
}

.pz-header .is-menu-open .wp-block-navigation__submenu-container a {
	box-sizing: border-box;
	padding-inline-start: 1.25rem !important;
	font-size: 1rem;
	min-block-size: 2.75rem;
	opacity: 0.92;
}

.pz-header .is-menu-open .wp-block-navigation__submenu-container .current-menu-item > a,
.pz-header .is-menu-open .wp-block-navigation__submenu-container [aria-current="page"] {
	background-color: transparent;
	padding-inline-start: 1rem !important;
	opacity: 1;
}

/* La freccia del sottomenu non serve più: il sottomenu è già aperto. */
.pz-header .is-menu-open .wp-block-navigation-submenu__toggle {
	display: none;
}

/* Pulsanti di apertura e chiusura: area toccabile piena, non solo l'icona.
   Qui si descrive come sono fatti, non quando si vedono: il "display" lo
   decidono le due regole qui sotto, altrimenti il pulsante resta acceso anche
   da scrivania e accanto al menu in riga compare un secondo menu. */
.pz-header .wp-block-navigation__responsive-container-open,
.pz-header .wp-block-navigation__responsive-container-close {
	align-items: center;
	justify-content: center;
	inline-size: 2.75rem;
	block-size: 2.75rem;
	padding: 0;
	border-radius: 3px;
}

/* Il pulsante di chiusura esiste soltanto dentro il pannello aperto: lì può
   essere sempre una scatola flessibile. */
.pz-header .wp-block-navigation__responsive-container-close {
	display: flex;
	inset-block-start: var(--wp--preset--spacing--20);
	inset-inline-end: var(--wp--preset--spacing--20);
}

/* WordPress passa al pannello a comparsa sotto i 600 px. Le sette voci del
   menu più il marchio e il selettore di lingua, però, smettono di stare in
   una riga già sotto i 1000: fra i 600 e i 1000 il menu andrebbe a capo sotto
   al logo. Il passaggio si sposta quindi a 62rem, in tutte e due i versi —
   WordPress ha una regola per ciascuno e vanno riscritte entrambe. */
@media (max-width: 61.99rem) {

	.pz-header .wp-block-navigation__responsive-container-open:not(.always-shown) {
		display: flex;
	}

	/* La regola di WordPress che rimette in riga il menu sopra i 600 px ha la
	   stessa specificità di questa: il selettore si ripete per averne una in
	   più e non dipendere dall'ordine di caricamento dei fogli di stile. */
	.pz-header .wp-block-navigation__responsive-container:not(.is-menu-open):not(.is-menu-open) {
		display: none;
	}
}

@media (min-width: 62rem) {

	.pz-header .wp-block-navigation__responsive-container-open:not(.always-shown) {
		display: none;
	}
}

.pz-header .wp-block-navigation__responsive-container-open:focus-visible,
.pz-header .wp-block-navigation__responsive-container-close:focus-visible {
	outline: 2px solid var(--pz-focus);
	outline-offset: 2px;
}

.pz-header .wp-block-navigation a:where(:not(.wp-element-button)) {
	color: var(--wp--preset--color--base);
	text-decoration: none;
	padding-block: 0.35rem;
	border-block-end: 2px solid transparent;
	transition: border-color var(--pz-transition), opacity var(--pz-transition);
}

.pz-header .wp-block-navigation a:where(:not(.wp-element-button)):hover {
	border-block-end-color: var(--pz-focus);
}

.pz-header .wp-block-navigation .current-menu-item > a,
.pz-header .wp-block-navigation .current-menu-ancestor > a,
.pz-header .wp-block-navigation [aria-current="page"] {
	border-block-end-color: var(--wp--preset--color--base);
	font-weight: 600;
}

/* Dentro il sottomenu la voce aperta si segnala con un filetto laterale:
   la sottolineatura, lì, si confonderebbe con il bordo della tendina. */
.pz-header .wp-block-navigation__submenu-container .current-menu-item > a,
.pz-header .wp-block-navigation__submenu-container [aria-current="page"] {
	border-block-end: 0 !important;
	border-inline-start: 3px solid var(--pz-focus);
	background-color: var(--wp--preset--color--primary-light);
	font-weight: 600;
}

/* Sottomenu Professionisti */
.pz-header .wp-block-navigation .wp-block-navigation-submenu__toggle + .wp-block-navigation__submenu-container,
.pz-header .wp-block-navigation .wp-block-navigation__submenu-container {
	background-color: var(--wp--preset--color--primary);
	border: 1px solid var(--pz-rule);
	padding-block: 0.35rem;
	min-inline-size: 15rem;
}

.pz-header .wp-block-navigation__submenu-container a {
	border-block-end: 0 !important;
	padding-block: 0.55rem !important;
}

.pz-header .wp-block-navigation__submenu-container a:hover {
	background-color: var(--wp--preset--color--primary-light);
}

/* ----------------------------------------------------- Selettore lingua --- */

/* Controllo segmentato: due sigle dentro una pillola, quella attiva piena.
   Niente bandiere: una bandiera indica un paese, non una lingua — l'inglese
   non è il Regno Unito, e l'italiano si parla anche fuori dall'Italia. */
.pz-lang {
	flex: 0 0 auto;
}

.pz-lang__list {
	display: inline-flex;
	align-items: center;
	gap: 2px;
	margin: 0;
	padding: 3px;
	list-style: none;
	border: 1px solid color-mix(in srgb, var(--wp--preset--color--base) 30%, transparent);
	border-radius: 999px;
	background: color-mix(in srgb, var(--wp--preset--color--base) 8%, transparent);
}

.pz-lang__item {
	margin: 0;
}

.pz-lang__link {
	display: block;
	padding: 0.25rem 0.7rem;
	border-radius: 999px;
	font-size: 0.75rem;
	font-weight: 700;
	letter-spacing: 0.08em;
	line-height: 1.4;
	text-decoration: none;
	color: color-mix(in srgb, var(--wp--preset--color--base) 80%, transparent);
	transition: background-color var(--pz-transition), color var(--pz-transition);
}

.pz-lang__link:hover {
	background: color-mix(in srgb, var(--wp--preset--color--base) 18%, transparent);
	color: var(--wp--preset--color--base);
}

.pz-lang__link.is-active {
	background: var(--wp--preset--color--base);
	color: var(--wp--preset--color--primary);
	cursor: default;
}

/* abbr porta il nome esteso della lingua nel title: niente sottolineatura
   tratteggiata, che qui sembrerebbe un errore di battitura. */
.pz-lang abbr {
	text-decoration: none;
	border: 0;
	cursor: inherit;
}

/* Il selettore che WPML aggiunge da sé in coda alla pagina resta nascosto
   anche se qualcuno riattiva l'opzione: in testata ce n'è già uno. */
.wpml-ls-statics-footer {
	display: none !important;
}

/* ------------------------------------------------------------ Contenuto --- */

.pz-main {
	min-block-size: 50vh;
}

/* Come nell'originale: titolo di pagina in blu chiaro, leggero, maiuscolo
   ("LO STUDIO"); il nome dell'avvocato invece resta in tondo. */
.pz-page-title {
	color: var(--wp--preset--color--accent);
	text-transform: uppercase;
	letter-spacing: 0.02em;
	font-weight: 300;
}

.pz-main :where(p, li) {
	text-wrap: pretty;
}

.pz-main :where(h1, h2, h3, h4) {
	text-wrap: balance;
}

/* Testo riservato ai lettori di schermo: presente nell'albero di accessibilità,
   invisibile a schermo. display:none lo toglierebbe anche agli screen reader. */
.screen-reader-text {
	position: absolute;
	inline-size: 1px;
	block-size: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip-path: inset(50%);
	white-space: nowrap;
	border: 0;
}

/* Home: la veduta di Venezia a tutta pagina con il logo bianco al centro. */
.pz-home .pz-main,
.pz-home {
	padding-block: 0;
}

.pz-home__cover {
	container-type: inline-size;
	container-name: pz-home;
}

.pz-home__logo {
	margin-block: 0;
}

.pz-home__logo img {
	inline-size: min(420px, 74cqi);
	block-size: auto;
	/* Niente ombra sfocata: come nell'originale il logo sta sulla foto pulito.
	   L'alone del drop-shadow faceva sembrare sgranate le lettere. */
}

@supports not (inline-size: 1cqi) {
	.pz-home__logo img {
		inline-size: min(420px, 74vw);
	}
}

/* ------------------------------------------------- Layout con indice --- */

/* Di base impilato: sicuro ovunque. L'affiancamento arriva con lo spazio. */
.pz-layout-indice {
	container-type: inline-size;
	container-name: pz-indice;
	flex-wrap: wrap;
}

.pz-layout-indice__aside {
	font-size: 0.9375rem;
}

.pz-layout-indice__aside ul {
	list-style: none;
	margin: 0;
	padding: 0;
	border-block-start: 2px solid var(--wp--preset--color--primary);
}

.pz-layout-indice__aside li {
	border-block-end: 1px solid var(--wp--preset--color--border);
}

.pz-layout-indice__aside a {
	display: block;
	padding-block: 0.65rem;
	padding-inline: 0.15rem;
	text-decoration: none;
	color: var(--wp--preset--color--contrast);
	transition: color var(--pz-transition), padding-inline-start var(--pz-transition);
}

.pz-layout-indice__aside a:hover {
	color: var(--wp--preset--color--primary);
	padding-inline-start: 0.5rem;
}

@supports (container-type: inline-size) {
	@container pz-indice (min-width: 46rem) {
		.pz-layout-indice__aside {
			position: sticky;
			inset-block-start: 1.5rem;
			align-self: start;
		}
	}

	/* Su telefono l'indice impilato sopra al testo erano otto righe piene —
	   mezzo schermo — prima della prima parola della pagina. Diventa una fila
	   di etichette da far scorrere con il dito: stesse voci, stessi
	   collegamenti, una riga sola. */
	@container pz-indice (max-width: 45.99rem) {

		.pz-layout-indice__aside ul {
			display: flex;
			gap: 0.5rem;
			overflow-x: auto;
			overscroll-behavior-x: contain;
			scroll-snap-type: x proximity;
			scrollbar-width: none;
			margin-inline: calc(var(--wp--preset--spacing--20) * -1);
			padding: 0.9rem var(--wp--preset--spacing--20) 0.2rem;
			border-block-start: 0;
			-webkit-mask-image: linear-gradient(to right, #000 88%, transparent);
			mask-image: linear-gradient(to right, #000 88%, transparent);
		}

		.pz-layout-indice__aside ul::-webkit-scrollbar { display: none; }

		.pz-layout-indice__aside li {
			flex: 0 0 auto;
			border: 0;
			scroll-snap-align: start;
		}

		.pz-layout-indice__aside a {
			padding: 0.45rem 0.9rem;
			border: 1px solid var(--wp--preset--color--border);
			border-radius: 999px;
			font-size: 0.875rem;
			line-height: 1.3;
			white-space: nowrap;
		}

		.pz-layout-indice__aside a:hover {
			padding-inline-start: 0.9rem;
			border-color: var(--wp--preset--color--primary);
		}
	}
}

/* -------------------------------------------------------- Aree attività --- */

.pz-area {
	container-type: inline-size;
	container-name: pz-area;
	scroll-margin-block-start: 5rem;
	padding-block: var(--wp--preset--spacing--40);
	border-block-start: 1px solid var(--wp--preset--color--border);
}

.pz-area:first-of-type {
	border-block-start: 0;
}

.pz-area__title {
	text-transform: uppercase;
	letter-spacing: 0.03em;
}

/* ------------------------------------------------------ Professionisti --- */

/* La griglia la fa il blocco stesso (layout "grid" del ciclo di WordPress):
   facendola a mano restavano i margini che WordPress mette fra gli elementi
   della lista, e le schede di una stessa riga partivano sfalsate. */
.pz-team {
	container-type: inline-size;
	container-name: pz-team;
	gap: var(--wp--preset--spacing--40);
}

ul.pz-team > li {
	display: flex;
	margin-block-start: 0;
}

ul.pz-team > li > .pz-card {
	inline-size: 100%;
}

.pz-card {
	position: relative;
	display: flex;
	flex-direction: column;
	gap: 0.75rem;
	border: 1px solid var(--wp--preset--color--border);
	border-radius: 3px;
	overflow: clip;
	background: var(--wp--preset--color--base);
	box-shadow: var(--wp--preset--shadow--card);
	transition: box-shadow var(--pz-transition), transform var(--pz-transition);
}

.pz-card:hover,
.pz-card:focus-within {
	box-shadow: var(--wp--preset--shadow--card-hover);
	transform: translateY(-2px);
}

.pz-card img {
	inline-size: 100%;
	block-size: auto;
	aspect-ratio: 7 / 5;
	object-fit: cover;
	display: block;
}

.pz-card__body {
	display: flex;
	flex-direction: column;
	gap: 0.5rem;
	padding: 0 var(--wp--preset--spacing--20) var(--wp--preset--spacing--20);
}

.pz-card__name {
	margin: 0;
	font-size: var(--wp--preset--font-size--large);
	font-weight: 600;
	color: var(--wp--preset--color--primary);
}

.pz-card__name a {
	text-decoration: none;
	color: inherit;
}

/* Rende cliccabile tutta la scheda mantenendo un solo link nel DOM. */
.pz-card__name a::after {
	content: "";
	position: absolute;
	inset: 0;
}

.pz-card__excerpt {
	margin: 0;
	font-size: 0.9375rem;
	color: var(--wp--preset--color--contrast-soft);
}

/* Scheda singola: come l'originale, nessuna fotografia in testa — il volto
   è già nella striscia di apertura, ripeterlo qui faceva doppione. */
.pz-professionista__nome {
	color: var(--wp--preset--color--accent);
	font-weight: 300;
	text-transform: none;
	letter-spacing: -0.01em;
	font-size: clamp(1.75rem, 1.2rem + 1.6vw, 2.4rem);
}

/* Riquadri in coda alla scheda: curriculum, LinkedIn, e-mail. Affiancati,
   ciascuno con la propria icona, come i "feature box" dell'originale. */
.pz-risorse {
	display: flex;
	flex-wrap: wrap;
	gap: var(--wp--preset--spacing--20);
	margin-block-start: var(--wp--preset--spacing--40);
	padding-block-start: var(--wp--preset--spacing--30);
	border-block-start: 1px solid var(--wp--preset--color--border);
}

.pz-risorsa {
	display: flex;
	align-items: center;
	gap: 0.75rem;
	flex: 1 1 15rem;
	max-inline-size: 22rem;
	padding: 0.85rem 1.1rem;
	text-decoration: none;
	color: var(--wp--preset--color--contrast);
	background: var(--wp--preset--color--surface);
	border: 1px solid var(--wp--preset--color--border);
	border-radius: 3px;
	transition: border-color var(--pz-transition), background var(--pz-transition), transform var(--pz-transition);
}

.pz-risorsa:hover {
	border-color: var(--wp--preset--color--accent);
	background: var(--wp--preset--color--base);
	transform: translateY(-1px);
}

.pz-risorsa__icona {
	flex: 0 0 auto;
	color: var(--wp--preset--color--accent);
}

.pz-risorsa__testo {
	display: flex;
	flex-direction: column;
	line-height: 1.35;
	font-weight: 600;
	min-inline-size: 0;
}

.pz-risorsa__testo small {
	font-weight: 400;
	font-size: 0.8125rem;
	color: var(--wp--preset--color--contrast-soft);
	overflow-wrap: anywhere;
}

.pz-back a {
	text-decoration: none;
	font-size: 0.9375rem;
}

/* ------------------------------------------------------- Stili blocchi --- */

.is-style-pz-eyebrow {
	font-size: var(--wp--preset--font-size--small) !important;
	font-weight: 700 !important;
	text-transform: uppercase;
	letter-spacing: 0.1em;
	color: var(--wp--preset--color--secondary) !important;
}

.is-style-pz-card {
	border: 1px solid var(--wp--preset--color--border);
	border-radius: 3px;
	padding: var(--wp--preset--spacing--30);
	background: var(--wp--preset--color--surface);
}

.is-style-pz-checklist {
	list-style: none;
	padding-inline-start: 0;
}

.is-style-pz-checklist li {
	position: relative;
	padding-inline-start: 1.6rem;
	margin-block-end: 0.6rem;
}

.is-style-pz-checklist li::before {
	content: "";
	position: absolute;
	inset-inline-start: 0;
	inset-block-start: 0.55em;
	inline-size: 0.5rem;
	block-size: 0.5rem;
	border-radius: 50%;
	background: var(--wp--preset--color--secondary);
}

/* -------------------------------------------------------------- Footer --- */

/* WordPress inserisce uno stacco fra i blocchi di primo livello: sulla home,
   dove sopra c'è la fotografia a tutta pagina, quello stacco si vedeva come
   una striscia bianca fra la foto e il footer. */
.wp-site-blocks > footer,
.wp-site-blocks > .wp-block-template-part:last-child {
	margin-block-start: 0;
}

.pz-footer {
	--pz-footer-linea: color-mix(in srgb, var(--wp--preset--color--base) 18%, transparent);
}

.pz-footer a {
	text-decoration: none;
	text-underline-offset: 3px;
	text-decoration-thickness: 1px;
}

.pz-footer a:hover {
	text-decoration: underline;
}

.pz-footer__title {
	font-size: clamp(1.1rem, 0.9rem + 0.6vw, 1.35rem) !important;
	letter-spacing: 0.22em !important;
	opacity: 0.95;
}

.pz-footer__title a {
	display: inline-block;
	padding-block-end: 0.5rem;
	border-block-end: 1px solid var(--pz-footer-linea);
}

.pz-footer__title a:hover {
	border-block-end-color: var(--wp--preset--color--base);
	text-decoration: none;
}

/* Tre colonne di pari larghezza, separate da una linea sottile. Sotto ai
   44rem diventano una sola colonna: meglio impilate che strizzate. */
.pz-footer__grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(13rem, 100%), 1fr));
	gap: var(--wp--preset--spacing--30);
	text-align: center;
	align-items: start;
}

.pz-footer__col {
	padding-inline: var(--wp--preset--spacing--20);
}

.pz-footer__col + .pz-footer__col {
	border-inline-start: 1px solid var(--pz-footer-linea);
}

/* Il bordo verticale non ha senso quando le colonne sono impilate. */
@media (max-width: 43.99rem) {
	.pz-footer__col + .pz-footer__col {
		border-inline-start: 0;
		border-block-start: 1px solid var(--pz-footer-linea);
		padding-block-start: var(--wp--preset--spacing--20);
	}
}

.pz-footer__col > * {
	margin-block: 0;
}

.pz-footer__label {
	margin-block-end: 0.55rem !important;
	font-size: 0.75rem !important;
	text-transform: uppercase;
	letter-spacing: 0.14em;
	font-weight: 700;
	opacity: 0.6;
}

.pz-footer__value {
	line-height: 1.65;
	font-size: 0.9375rem;
	text-wrap: pretty;
}

.pz-footer__value--mail a {
	overflow-wrap: anywhere;
}

.pz-footer__rule {
	border-color: var(--pz-footer-linea);
	opacity: 1;
}

.pz-footer__legal {
	text-wrap: balance;
	line-height: 1.7;
	margin-block-end: 0;
	opacity: 0.9;
}

.pz-footer__sep {
	opacity: 0.4;
	margin-inline: 0.35em;
}

/* Lo stesso blu secondario del sito, schiarito quanto basta per leggersi sul
   blu del piè di pagina: in tinta piena il contrasto era 2,2 a 1, sotto la
   soglia minima di leggibilità (4,5 a 1). Così è circa 6 a 1. */
.pz-footer__credits {
	color: color-mix(in srgb, var(--wp--preset--color--secondary) 55%, #fff);
	font-size: 0.8125rem !important;
}

/* ---------------------------------------------------------------- Form --- */

.pz-form {
	container-type: inline-size;
	container-name: pz-form;
	max-inline-size: 46rem;
	margin-block-start: var(--wp--preset--spacing--30);
	padding: var(--wp--preset--spacing--30);
	background: var(--wp--preset--color--surface);
	border: 1px solid var(--wp--preset--color--border);
	border-radius: 4px;
}

.pz-form__fieldset {
	border: 0;
	padding: 0;
	margin: 0;
	min-inline-size: 0; /* senza questo il fieldset non si restringe mai */
}

/* Due campi per riga quando c'è spazio, uno solo quando non c'è. La misura
   è del contenitore, non dello schermo: il form resta corretto anche in una
   colonna stretta. */
.pz-form__griglia {
	display: grid;
	gap: 1.1rem 1.25rem;
	grid-template-columns: repeat(auto-fit, minmax(min(15rem, 100%), 1fr));
}

.pz-form__row {
	display: flex;
	flex-direction: column;
	gap: 0.3rem;
	min-inline-size: 0;
}

.pz-form__row--full {
	grid-column: 1 / -1;
}

.pz-form label {
	font-size: 0.875rem;
	font-weight: 600;
	color: var(--wp--preset--color--primary);
	letter-spacing: 0.01em;
}

.pz-form__req {
	color: #a8071a;
	font-weight: 700;
}

.pz-form__opt {
	font-weight: 400;
	font-size: 0.8125rem;
	color: var(--wp--preset--color--contrast-soft);
}

.pz-form :where(input[type="text"], input[type="email"], input[type="tel"], textarea) {
	font: inherit;
	font-size: 1rem; /* sotto 1rem iOS ingrandisce la pagina al focus */
	/* Senza questo il padding si somma alla larghezza e i campi sbordano
	   dalla propria colonna, finendo per toccarsi. */
	box-sizing: border-box;
	inline-size: 100%;
	max-inline-size: 100%;
	min-block-size: 48px;
	padding: 0.7rem 0.85rem;
	color: var(--wp--preset--color--contrast);
	background: var(--wp--preset--color--base);
	border: 1px solid #9a9aa2;
	border-radius: 3px;
	transition: border-color var(--pz-transition), box-shadow var(--pz-transition);
}

.pz-form textarea {
	min-block-size: 9rem;
	resize: vertical;
	line-height: 1.6;
}

.pz-form :where(input, textarea):hover {
	border-color: var(--wp--preset--color--contrast-soft);
}

.pz-form :where(input, textarea):focus {
	border-color: var(--wp--preset--color--primary);
	box-shadow: 0 0 0 3px color-mix(in srgb, var(--wp--preset--color--primary) 15%, transparent);
	outline: none;
}

.pz-form :where(input, textarea):focus-visible {
	outline: 3px solid var(--pz-focus);
	outline-offset: 1px;
}

/* L'errore compare quando si esce dal campo, non mentre si sta scrivendo. */
.pz-form :where(input, textarea):user-invalid {
	border-color: #a8071a;
	box-shadow: 0 0 0 3px rgba(168, 7, 26, 0.12);
}

.pz-form :where(input, textarea):user-invalid ~ .pz-form__error {
	display: block;
}

.pz-form__error {
	display: none;
	font-size: 0.8125rem;
	font-weight: 500;
	color: #a8071a;
}

/* Il colore da solo non basta: accanto all'errore compare anche un segno. */
.pz-form__error::before {
	content: "▲ ";
	font-size: 0.75em;
}

.pz-form__hint {
	font-size: 0.8125rem;
	color: var(--wp--preset--color--contrast-soft);
	line-height: 1.5;
}

.pz-form__row--consent {
	flex-direction: row;
	align-items: flex-start;
	gap: 0.65rem;
	margin-block-start: 1.25rem;
	padding-block-start: 1.25rem;
	border-block-start: 1px solid var(--wp--preset--color--border);
}

.pz-form__row--consent input[type="checkbox"] {
	inline-size: 1.25rem;
	block-size: 1.25rem;
	margin-block-start: 0.15rem;
	flex: 0 0 auto;
	accent-color: var(--wp--preset--color--primary);
}

.pz-form__row--consent label {
	font-weight: 400;
	font-size: 0.9375rem;
	line-height: 1.55;
	color: var(--wp--preset--color--contrast);
	text-align: initial;
}

.pz-form__pie {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 0.75rem 1.5rem;
	margin-block-start: 1.5rem;
}

.pz-form__invia {
	min-block-size: 48px;
	cursor: pointer;
}

.pz-form__required {
	font-size: 0.8125rem;
	color: var(--wp--preset--color--contrast-soft);
	margin: 0;
	text-align: initial;
}

.pz-form__notice {
	padding: 0.9rem 1.1rem;
	margin-block-end: 1.5rem;
	border-inline-start: 4px solid;
	border-radius: 3px;
	font-size: 0.9375rem;
	text-align: initial;
}

.pz-form__notice--success {
	border-color: #1a7f37;
	background: #eaf6ec;
	color: #10471f;
}

.pz-form__notice--error {
	border-color: #a8071a;
	background: #fdeded;
	color: #7a0512;
}

/* Trappola anti-bot: fuori dalla vista ma non display:none, che i bot leggono. */
.pz-form__trap {
	position: absolute;
	inline-size: 1px;
	block-size: 1px;
	overflow: hidden;
	clip-path: inset(50%);
	white-space: nowrap;
}

@media (pointer: coarse) {
	.pz-form :where(input[type="text"], input[type="email"], input[type="tel"], textarea) {
		min-block-size: 52px;
	}
}

/* ---------------------------------------------------------- Mappa embed --- */

.pz-mappa {
	position: relative;
	aspect-ratio: 16 / 9;
	margin-block-start: var(--wp--preset--spacing--40);
	border: 1px solid var(--wp--preset--color--border);
	border-radius: 3px;
	overflow: clip;
}

.pz-mappa iframe {
	position: absolute;
	inset: 0;
	inline-size: 100%;
	block-size: 100%;
	border: 0;
}

/* Finché la mappa non viene aperta, al suo posto c'è un riquadro della
   stessa misura: un reticolo leggero di vie, il segno della sede, due righe
   e due scelte. La pagina non si sposta quando la mappa arriva. */
/* Il riquadro sta nel flusso, non sopra: se il testo non entra nella misura
   della mappa — su un telefono stretto, con il carattere ingrandito — la
   cornice si allunga invece di tagliarlo. */
.pz-mappa:not(.is-aperta) {
	display: grid;
	overflow: visible;
}

.pz-mappa__velo {
	display: flex;
	border-radius: inherit;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 0.85rem;
	padding: 1.25rem;
	text-align: center;
	background-color: var(--wp--preset--color--surface, #f4f6f9);
	background-image:
		linear-gradient(color-mix(in srgb, var(--wp--preset--color--primary) 6%, transparent) 1px, transparent 1px),
		linear-gradient(90deg, color-mix(in srgb, var(--wp--preset--color--primary) 6%, transparent) 1px, transparent 1px);
	background-size: 2.5rem 2.5rem;
	background-position: center;
}

.pz-mappa__segno {
	display: grid;
	place-items: center;
	inline-size: 2.75rem;
	block-size: 2.75rem;
	border-radius: 50%;
	background: #fff;
	color: var(--wp--preset--color--primary);
	box-shadow: 0 6px 18px -8px rgb(0 41 85 / 0.45);
}

.pz-mappa__segno svg {
	inline-size: 1.4rem;
	block-size: 1.4rem;
}

.pz-mappa .pz-mappa__luogo {
	margin: 0;
	text-align: center;
	font-size: 1rem;
	font-weight: 600;
	line-height: 1.4;
	color: var(--wp--preset--color--primary);
}

.pz-mappa__luogo span {
	display: block;
	font-weight: 400;
	color: var(--wp--preset--color--contrast);
}

.pz-mappa .pz-mappa__testo {
	max-inline-size: 34rem;
	text-align: center;
	margin: 0;
	font-size: 0.875rem;
	line-height: 1.55;
	color: var(--wp--preset--color--contrast-soft, #5c5b62);
	text-wrap: pretty;
}

.pz-mappa__scelte {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: 0.5rem 1.25rem;
}

.pz-mappa__mostra {
	appearance: none;
	min-block-size: 2.75rem;
	padding: 0.55rem 1.35rem;
	border: 1px solid var(--wp--preset--color--primary);
	border-radius: 999px;
	background: var(--wp--preset--color--primary);
	color: #fff;
	font-family: inherit;
	font-size: 0.9375rem;
	font-weight: 600;
	line-height: 1.2;
	cursor: pointer;
	transition: background-color var(--pz-transition);
}

.pz-mappa__mostra:hover {
	background: color-mix(in srgb, var(--wp--preset--color--primary) 86%, #fff);
}

.pz-mappa__apri {
	font-size: 0.9375rem;
	font-weight: 600;
	color: var(--wp--preset--color--primary);
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 3px;
}

.pz-mappa__mostra:focus-visible,
.pz-mappa__apri:focus-visible {
	outline: 3px solid var(--pz-focus);
	outline-offset: 2px;
}

/* Su telefono il 16:9 è troppo basso per il riquadro con il testo. */
/* Su telefono il 16:9 è una striscia di due dita: la mappa, chiusa o
   aperta, prende una proporzione più alta. */
@media (max-width: 35.99rem) {
	.pz-mappa {
		aspect-ratio: 4 / 3;
	}
}

/* ------------------------------------------------------------- Novità --- */

/* L'elenco riusa la scheda dei professionisti: stessa cornice, stessa ombra,
   stesso comportamento al passaggio del mouse. Cambiano solo la proporzione
   dell'immagine — più larga, da fotografia di cronaca — e la riga della data. */
.pz-novita {
	container-type: inline-size;
	container-name: pz-novita;
	gap: var(--wp--preset--spacing--40);
}

ul.pz-novita > li {
	display: flex;
	margin-block-start: 0;
}

ul.pz-novita > li > .pz-card {
	inline-size: 100%;
}

.pz-card--novita img {
	aspect-ratio: 16 / 9;
}

/* Una novità senza immagine non deve lasciare un vuoto in cima alla scheda. */
.pz-card--novita .wp-block-post-featured-image:empty {
	display: none;
}

.pz-card--novita .pz-card__body {
	padding-block-start: var(--wp--preset--spacing--20);
}

.pz-card__data,
.pz-novita__data {
	margin: 0;
	font-size: 0.8125rem;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--wp--preset--color--contrast-soft);
}

.pz-card--novita .pz-card__name {
	font-size: 1.0625rem;
	line-height: 1.35;
}

.pz-paginazione {
	gap: 0.75rem;
	font-size: 0.9375rem;
}

.pz-paginazione a,
.pz-paginazione .current {
	text-decoration: none;
	padding: 0.3em 0.7em;
	border: 1px solid var(--wp--preset--color--border);
	border-radius: 3px;
	color: var(--wp--preset--color--primary);
}

.pz-paginazione .current {
	background: var(--wp--preset--color--primary);
	border-color: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--base);
}

.pz-paginazione a:hover {
	background: var(--wp--preset--color--surface);
}

/* La novità aperta: data in cima, poi titolo e immagine a tutta colonna. */
.pz-novita__titolo {
	color: var(--wp--preset--color--accent);
	font-weight: 300;
}

/* L'immagine di apertura: larga quanto il testo ma non alta quanto mezza
   schermata — a 1150 px un 16:9 pieno spingerebbe il testo sotto la piega. */
.pz-novita__immagine img {
	inline-size: 100%;
	block-size: auto;
	max-block-size: 30rem;
	object-fit: cover;
	border-radius: 3px;
}

/* ------------------------------------------------------------ Allegati --- */

.pz-allegati {
	margin-block-start: var(--wp--preset--spacing--50);
	padding-block-start: var(--wp--preset--spacing--30);
	border-block-start: 1px solid var(--wp--preset--color--border);
}

.pz-allegati__titolo {
	margin: 0 0 var(--wp--preset--spacing--20);
	font-size: 0.8125rem;
	font-weight: 600;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--wp--preset--color--contrast-soft);
}

.pz-allegati__elenco {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	gap: var(--wp--preset--spacing--10);
	grid-template-columns: repeat(auto-fill, minmax(min(100%, 19rem), 1fr));
}

.pz-allegato__link {
	display: flex;
	align-items: center;
	gap: 0.75rem;
	padding: 0.7rem 0.9rem;
	border: 1px solid var(--wp--preset--color--border);
	border-radius: 3px;
	background: var(--wp--preset--color--surface);
	text-decoration: none;
	color: var(--wp--preset--color--contrast);
	transition: border-color var(--pz-transition), background var(--pz-transition);
}

.pz-allegato__link:hover,
.pz-allegato__link:focus-visible {
	border-color: var(--wp--preset--color--primary);
	background: var(--wp--preset--color--base);
}

.pz-allegato__icona {
	flex: 0 0 auto;
	display: flex;
	color: var(--wp--preset--color--primary);
}

.pz-allegato__svg {
	inline-size: 24px;
	block-size: 24px;
}

.pz-allegato__testo {
	display: flex;
	flex-direction: column;
	gap: 0.1rem;
	min-inline-size: 0;
}

.pz-allegato__nome {
	font-size: 0.9375rem;
	line-height: 1.3;
	overflow-wrap: anywhere;
}

.pz-allegato__dati {
	font-size: 0.75rem;
	letter-spacing: 0.06em;
	color: var(--wp--preset--color--contrast-soft);
}

@media print {
	.pz-header,
	.pz-footer,
	.pz-form,
	.pz-mappa {
		display: none;
	}

	.pz-main {
		padding: 0;
	}

	a[href^="http"]::after {
		content: " (" attr(href) ")";
		font-size: 0.85em;
		word-break: break-all;
	}
}

/* ------------------------------------------------ Striscia di apertura --- */

/* La banda fotografica sopra al titolo delle pagine interne. Due o più scatti
   sovrapposti che si alternano in dissolvenza, come nell'originale. */
.pz-banner-wrap {
	margin-block: 0;
}

.pz-banner {
	position: relative;
	inline-size: 100%;
	/* La proporzione è quella vera delle immagini (1180x480): il contenitore
	   combacia con lo scatto, quindi nessun volto viene tagliato. */
	aspect-ratio: 1180 / 480;
	overflow: clip;
	background-color: var(--wp--preset--color--primary);
}

.pz-banner__img {
	position: absolute;
	inset: 0;
	inline-size: 100%;
	block-size: 100%;
	object-fit: cover;
	object-position: center;
	opacity: 0;
	transition: opacity 650ms ease-in-out;
	will-change: opacity;
}

.pz-banner__img.is-active {
	opacity: 1;
}

/* Senza JavaScript, o con animazioni ridotte, resta visibile il primo scatto. */
@media (prefers-reduced-motion: reduce) {
	.pz-banner__img {
		transition: none;
	}
}

.pz-banner__img:first-child {
	opacity: 1;
}

.pz-banner__img:first-child:not(.is-active) {
	opacity: 0;
}

/* Elenco dei recapiti: etichetta e valore sulla stessa riga, senza pallini. */
.pz-recapiti {
	list-style: none;
	padding-inline-start: 0;
}

.pz-recapiti li {
	padding-block: 0.35rem;
	border-block-end: 1px solid var(--wp--preset--color--border);
	overflow-wrap: anywhere;
}

.pz-recapiti li:last-child {
	border-block-end: 0;
}

.pz-recapiti strong {
	color: var(--wp--preset--color--primary);
	font-weight: 600;
}

/* --------------------------------------------- Impaginazione dei testi --- */

/* La riga di lettura. Sulla gabbia da 1150 px un capoverso arrivava a 120
   battute: troppe, l'occhio perde la riga quando torna a capo. Il testo
   corrente si ferma a 70 battute e resta allineato a sinistra con il titolo,
   lasciando aria a destra come in una pagina stampata. Solo i blocchi di
   testo si restringono: griglie, moduli, mappe e schede tengono tutta la
   larghezza. WordPress centra i figli dei contenitori "constrained" con un
   !important, e con un !important va rimesso il margine a sinistra. */
.pz-main .wp-block-post-content > :is(p, ul, ol, blockquote, h2, h3, h4, h5, h6),
.pz-main .pz-area > :is(p, ul, ol, blockquote, h3, h4, h5, h6) {
	max-inline-size: 70ch;
	margin-inline-start: 0 !important;
	margin-inline-end: auto !important;
}

/* Allineato a sinistra, senza giustificazione: con la riga a misura il
   margine destro irregolare si legge meglio dei buchi fra le parole, e
   nessuna parola va più spezzata in due. */
.pz-main :where(p, li) {
	text-align: start;
	hyphens: manual;
}

.pz-main .has-text-align-center {
	text-align: center;
}

/* Da scrivania il corpo sale di un punto: sono pagine da leggere per
   intero, non da scorrere. */
@media (min-width: 62rem) {
	.pz-main .wp-block-post-content {
		font-size: 1.0625rem;
	}
}

/* Il ritmo dei titoli: più aria sopra che sotto, così ogni titolo si lega
   al testo che introduce e si stacca da quello che chiude. */
.pz-main .wp-block-post-content > h2 {
	margin-block-start: clamp(2.25rem, 1.8rem + 1.5vw, 3rem);
}

.pz-main .wp-block-post-content > h3 {
	margin-block-start: clamp(1.75rem, 1.5rem + 1vw, 2.25rem);
}

.pz-main .wp-block-post-content > h4 {
	margin-block-start: 1.75rem;
}

.pz-main .wp-block-post-content > :is(h2, h3, h4) + * {
	margin-block-start: 0.75rem;
}

/* Titolo subito seguito da un sottotitolo: restano vicini, ma non attaccati. */
.pz-main .wp-block-post-content > :is(h2, h3, h4) + :is(h3, h4) {
	margin-block-start: 1rem;
}

.pz-main .wp-block-post-content > :first-child {
	margin-block-start: 0;
}

/* Elenchi: il segno si allinea al testo che precede invece di sporgere nel
   margine, e le voci lunghe respirano. */
.pz-main .wp-block-post-content :where(ul, ol):not([class*="pz-"]):not(.is-style-pz-checklist) {
	padding-inline-start: 1.25rem;
}

.pz-main .wp-block-post-content :where(ul, ol) > li + li {
	margin-block-start: 0.4rem;
}

.pz-main .wp-block-post-content li::marker {
	color: var(--wp--preset--color--accent);
}

/* ======================================================= Avviso cookie === */

/* Una scheda che appoggia sull'angolo in basso a sinistra, non una fascia
   che taglia la pagina: si legge, si sceglie, sparisce, e nel frattempo il
   contenuto resta tutto visibile. Fondo chiaro e dettagli nel blu della
   testata: è una voce del sito, non l'insegna di un servizio esterno. */
.pz-cookie {
	--pz-cookie-blu: var(--wp--preset--color--primary, #002955);
	--pz-cookie-testo: #2f2e33;
	--pz-cookie-tenue: #5c5b62;
	--pz-cookie-filo: #e3e5ea;

	position: fixed;
	inset-block-end: 1.25rem;
	inset-inline-start: 1.25rem;
	z-index: 60;
	inline-size: min(26.5rem, 100vw - 2.5rem);
	padding: 1.35rem 1.35rem 1.25rem;
	border: 1px solid var(--pz-cookie-filo);
	border-radius: 14px;
	background: #fff;
	color: var(--pz-cookie-testo);
	box-shadow:
		0 1px 2px rgb(0 41 85 / 0.06),
		0 12px 32px -8px rgb(0 41 85 / 0.28);
	font-size: 0.9375rem;
	line-height: 1.6;
	animation: pz-cookie-entra 360ms cubic-bezier(0.2, 0.8, 0.2, 1) both;
}

.pz-cookie[hidden] { display: none; }

@keyframes pz-cookie-entra {
	from { opacity: 0; transform: translateY(12px); }
	to   { opacity: 1; transform: none; }
}

.pz-cookie__testa {
	display: flex;
	align-items: center;
	gap: 0.7rem;
	margin-block-end: 0.6rem;
	padding-inline-end: 2rem;
}

/* Il segno: un cerchio blu con il biscotto disegnato a filo. */
.pz-cookie__segno {
	display: grid;
	place-items: center;
	flex: 0 0 auto;
	inline-size: 2.25rem;
	block-size: 2.25rem;
	border-radius: 50%;
	background: color-mix(in srgb, var(--pz-cookie-blu) 9%, #fff);
	color: var(--pz-cookie-blu);
}

.pz-cookie__segno svg {
	inline-size: 1.25rem;
	block-size: 1.25rem;
}

.pz-cookie__titolo {
	margin: 0;
	font-size: 1rem;
	font-weight: 600;
	line-height: 1.3;
	color: var(--pz-cookie-blu);
}

.pz-cookie__testo {
	margin: 0;
	color: var(--pz-cookie-tenue);
	text-align: initial;
	hyphens: manual;
}

.pz-cookie__testo a {
	color: var(--pz-cookie-blu);
	font-weight: 600;
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 3px;
	white-space: nowrap;
}

/* Chiudere con la X vale come proseguire con i soli cookie necessari, come
   indicano le linee guida del Garante: si esce senza dare alcun consenso. */
.pz-cookie__chiudi {
	appearance: none;
	position: absolute;
	inset-block-start: 0.85rem;
	inset-inline-end: 0.85rem;
	display: grid;
	place-items: center;
	inline-size: 2rem;
	block-size: 2rem;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: transparent;
	color: var(--pz-cookie-tenue);
	cursor: pointer;
	transition: background-color var(--pz-transition), color var(--pz-transition);
}

.pz-cookie__chiudi:hover {
	background: #f1f2f5;
	color: var(--pz-cookie-testo);
}

.pz-cookie__chiudi svg {
	inline-size: 1rem;
	block-size: 1rem;
}

.pz-cookie__scelte {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(9rem, 1fr));
	gap: 0.6rem;
	margin-block-start: 1.1rem;
}

/* Le due scelte hanno la stessa forma, la stessa misura e lo stesso colore:
   accettare non deve risultare più facile né più invitante che rifiutare,
   altrimenti il consenso non è libero. */
.pz-cookie__bottone {
	appearance: none;
	min-block-size: 2.75rem;
	padding: 0.55rem 1rem;
	border: 1px solid var(--pz-cookie-blu);
	border-radius: 999px;
	background: var(--pz-cookie-blu);
	color: #fff;
	font-family: inherit;
	font-size: 0.9375rem;
	font-weight: 600;
	line-height: 1.2;
	cursor: pointer;
	transition: background-color var(--pz-transition), transform var(--pz-transition);
}

.pz-cookie__bottone:hover {
	background: color-mix(in srgb, var(--pz-cookie-blu) 86%, #fff);
}

.pz-cookie__bottone:active { transform: translateY(1px); }

.pz-cookie__bottone:focus-visible,
.pz-cookie__chiudi:focus-visible {
	outline: 3px solid var(--pz-focus);
	outline-offset: 2px;
}

/* Su telefono la scheda si allarga fino ai bordi, sempre staccata di poco:
   resta una scheda, non diventa una fascia. */
@media (max-width: 35.99rem) {

	.pz-cookie {
		inset-block-end: 0.75rem;
		inset-inline: 0.75rem;
		inline-size: auto;
		padding: 1.15rem 1.1rem 1.1rem;
	}
}

@media (prefers-reduced-motion: reduce) {
	.pz-cookie { animation: none; }
}

@media print {
	.pz-cookie { display: none; }
}

/* Il pulsante che riapre l'avviso, in coda all'informativa sui cookie. */
.pz-cookie-riapri {
	appearance: none;
	display: inline-flex;
	align-items: center;
	gap: 0.55rem;
	min-block-size: 2.75rem;
	padding: 0.55rem 1.25rem;
	border: 1px solid var(--wp--preset--color--primary, #002955);
	border-radius: 999px;
	background: transparent;
	color: var(--wp--preset--color--primary, #002955);
	font-family: inherit;
	font-size: 0.9375rem;
	font-weight: 600;
	line-height: 1.2;
	cursor: pointer;
	transition: background-color var(--pz-transition), color var(--pz-transition);
}

.pz-cookie-riapri:hover {
	background: var(--wp--preset--color--primary, #002955);
	color: #fff;
}

.pz-cookie-riapri svg {
	inline-size: 1.1rem;
	block-size: 1.1rem;
}