/*
 * Tema Centrale - foglio di stile.
 * Palette presa dalla foto della facciata di sera: giallo caldo
 * dell'intonaco, blu profondo del cielo, luce delle lanterne.
 */

/* ---------------------------------------------------------------- 1. Basi */

:root {
	--notte:        #14233c;
	--notte-chiara: #1e3153;
	--notte-velo:   rgba(14, 24, 43, .62);

	--ocra:         #c8912f;
	--ocra-chiara:  #e0b458;
	--ocra-scura:   #9a6e1f;

	--crema:        #fbf7f0;
	--crema-scura:  #f2ebe0;
	--carta:        #ffffff;

	--inchiostro:   #23262b;
	--grigio:       #5f646c;
	--bordo:        #e2dad0;

	--font-titoli:  "Cormorant Garamond", Georgia, "Times New Roman", serif;
	--font-testo:   "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;

	--larghezza:    1160px;
	--larghezza-testo: 68ch;
	--gutter:       20px;
	--raggio:       4px;
	--ombra:        0 1px 2px rgba(20, 35, 60, .06), 0 8px 24px rgba(20, 35, 60, .07);
	--ombra-alta:   0 2px 4px rgba(20, 35, 60, .08), 0 18px 44px rgba(20, 35, 60, .14);
}

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

html {
	-webkit-text-size-adjust: 100%;
	scroll-behavior: smooth;
}

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

body {
	margin: 0;
	background: var(--crema);
	color: var(--inchiostro);
	font-family: var(--font-testo);
	font-size: 1.0625rem;
	line-height: 1.65;
	-webkit-font-smoothing: antialiased;
	overflow-wrap: break-word;
}

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

a {
	color: var(--ocra-scura);
	text-decoration-thickness: 1px;
	text-underline-offset: 2px;
}

a:hover,
a:focus {
	color: var(--notte);
}

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

h1, h2, h3, h4 {
	font-family: var(--font-titoli);
	font-weight: 600;
	line-height: 1.15;
	margin: 0 0 .5em;
	letter-spacing: -.005em;
}

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

.sr-solo-lettori {
	position: absolute;
	width: 1px; height: 1px;
	padding: 0; margin: -1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
	border: 0;
}

.salta-al-contenuto {
	position: absolute;
	left: -9999px;
	z-index: 100;
	background: var(--notte);
	color: #fff;
	padding: 12px 20px;
	border-radius: 0 0 var(--raggio) 0;
}

.salta-al-contenuto:focus {
	left: 0;
	top: 0;
	color: #fff;
}

/* ------------------------------------------------------- 2. Impalcatura */

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

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

.sezione {
	padding-block: clamp(3rem, 7vw, 5.5rem);
}

.sezione--chiara { background: var(--carta); }
.sezione--piatti { background: var(--crema-scura); }

.sezione--scura {
	background: var(--notte);
	color: #e9e4db;
}

.sezione--scura h2,
.sezione--scura h3 { color: #fff; }

.sezione--scura .occhiello { color: var(--ocra-chiara); }

.sezione__intestazione {
	max-width: 46ch;
	margin: 0 auto clamp(2rem, 4vw, 3rem);
	text-align: center;
}

.sezione__titolo {
	font-size: clamp(1.9rem, 4.4vw, 2.9rem);
	margin: 0;
}

.sezione__coda {
	margin-top: 2.5rem;
	text-align: center;
}

.occhiello {
	font-family: var(--font-testo);
	font-size: .78rem;
	font-weight: 600;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--ocra-scura);
	margin: 0 0 .7em;
}

/* ---------------------------------------------------------- 3. Testata */

.testata {
	position: sticky;
	top: 0;
	z-index: 40;
	background: rgba(251, 247, 240, .94);
	backdrop-filter: saturate(140%) blur(8px);
	border-bottom: 1px solid var(--bordo);
}

.testata__barra {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	min-height: 68px;
}

.marchio {
	display: block;
	text-decoration: none;
	color: var(--notte);
}

.marchio__nome {
	display: block;
	font-family: var(--font-titoli);
	font-size: 1.45rem;
	font-weight: 700;
	line-height: 1.05;
	letter-spacing: .01em;
}

.marchio__luogo {
	display: block;
	font-size: .7rem;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--grigio);
	margin-top: 2px;
}

.custom-logo-link img {
	max-height: 52px;
	width: auto;
}

.apri-menu {
	display: inline-flex;
	align-items: center;
	gap: 9px;
	background: none;
	border: 1px solid var(--bordo);
	border-radius: var(--raggio);
	padding: 9px 14px;
	font: inherit;
	font-size: .82rem;
	font-weight: 600;
	letter-spacing: .06em;
	text-transform: uppercase;
	color: var(--notte);
	cursor: pointer;
}

.apri-menu__barre {
	display: block;
	width: 18px;
}

.apri-menu__barre span {
	display: block;
	height: 2px;
	background: currentColor;
	border-radius: 2px;
	transition: transform .2s ease, opacity .2s ease;
}

.apri-menu__barre span + span { margin-top: 4px; }

.apri-menu[aria-expanded="true"] .apri-menu__barre span:nth-child(1) { transform: translateY(6px) rotate(45deg); }
.apri-menu[aria-expanded="true"] .apri-menu__barre span:nth-child(2) { opacity: 0; }
.apri-menu[aria-expanded="true"] .apri-menu__barre span:nth-child(3) { transform: translateY(-6px) rotate(-45deg); }

.navigazione {
	display: none;
}

.navigazione.e-aperta {
	display: block;
	position: absolute;
	left: 0;
	right: 0;
	top: 100%;
	background: var(--carta);
	border-bottom: 1px solid var(--bordo);
	box-shadow: var(--ombra);
	padding: 12px var(--gutter) 20px;
}

.navigazione__lista {
	list-style: none;
	margin: 0;
	padding: 0;
}

.navigazione__lista li { position: relative; }

.navigazione__lista a {
	display: block;
	padding: 11px 0;
	color: var(--notte);
	text-decoration: none;
	font-weight: 500;
	border-bottom: 1px solid var(--crema-scura);
}

.navigazione__lista a:hover,
.navigazione__lista .current-menu-item > a,
.navigazione__lista .current_page_item > a {
	color: var(--ocra-scura);
}

.navigazione__lista .sub-menu {
	list-style: none;
	margin: 0;
	padding: 0 0 0 16px;
}

.navigazione__azioni {
	margin-top: 16px;
}

@media (min-width: 900px) {
	.apri-menu { display: none; }

	.navigazione {
		display: flex !important;
		align-items: center;
		gap: 26px;
		position: static;
		background: none;
		border: 0;
		box-shadow: none;
		padding: 0;
	}

	.navigazione__lista {
		display: flex;
		align-items: center;
		gap: 24px;
	}

	.navigazione__lista a {
		padding: 6px 0;
		border-bottom: 2px solid transparent;
		font-size: .93rem;
	}

	.navigazione__lista a:hover,
	.navigazione__lista .current-menu-item > a,
	.navigazione__lista .current_page_item > a {
		border-bottom-color: var(--ocra);
	}

	.navigazione__lista .sub-menu {
		display: none;
		position: absolute;
		top: 100%;
		left: -14px;
		min-width: 200px;
		background: var(--carta);
		border: 1px solid var(--bordo);
		box-shadow: var(--ombra);
		padding: 6px 14px;
		border-radius: var(--raggio);
		z-index: 5;
	}

	.navigazione__lista li:hover > .sub-menu,
	.navigazione__lista li:focus-within > .sub-menu { display: block; }

	.navigazione__azioni { margin-top: 0; }
}

/* ---------------------------------------------------------- 4. Bottoni */

.bottone {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 9px;
	padding: 12px 22px;
	border: 1px solid transparent;
	border-radius: var(--raggio);
	font-family: var(--font-testo);
	font-size: .93rem;
	font-weight: 600;
	line-height: 1.2;
	letter-spacing: .01em;
	text-decoration: none;
	cursor: pointer;
	transition: background-color .18s ease, color .18s ease, border-color .18s ease, transform .18s ease;
}

.bottone:hover { transform: translateY(-1px); }

.bottone--pieno {
	background: var(--ocra);
	border-color: var(--ocra);
	color: #fff;
}

.bottone--pieno:hover,
.bottone--pieno:focus {
	background: var(--ocra-scura);
	border-color: var(--ocra-scura);
	color: #fff;
}

.bottone--vuoto {
	background: transparent;
	border-color: var(--notte);
	color: var(--notte);
}

.bottone--vuoto:hover,
.bottone--vuoto:focus {
	background: var(--notte);
	color: #fff;
}

.bottone--chiaro {
	background: rgba(255, 255, 255, .1);
	border-color: rgba(255, 255, 255, .55);
	color: #fff;
}

.bottone--chiaro:hover,
.bottone--chiaro:focus {
	background: #fff;
	border-color: #fff;
	color: var(--notte);
}

.bottone--grande {
	padding: 15px 28px;
	font-size: 1rem;
}

.bottone--piccolo {
	padding: 9px 16px;
	font-size: .85rem;
}

.bottone__icona {
	display: inline-flex;
	margin-right: -2px;
}

.bottone__icona svg { width: 18px; height: 18px; }

.collegamento-avanti {
	display: inline-flex;
	align-items: center;
	gap: 5px;
	font-size: .9rem;
	font-weight: 600;
	text-decoration: none;
	color: var(--ocra-scura);
}

.collegamento-avanti:hover { gap: 9px; }
.collegamento-avanti svg { width: 16px; height: 16px; }

.sezione--scura .collegamento-avanti,
.pie-pagina .collegamento-avanti { color: var(--ocra-chiara); }

/* -------------------------------------------------- 5. Prima schermata */

.apertura {
	position: relative;
	display: flex;
	align-items: flex-end;
	min-height: min(78vh, 680px);
	background: var(--notte);
	overflow: hidden;
	isolation: isolate;
}

.apertura--senza-foto { min-height: auto; padding-block: 5rem; }

.apertura__sfondo {
	position: absolute;
	inset: 0;
	z-index: -2;
}

.apertura__foto {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center 58%;
}

/* La facciata e' gialla e molto illuminata: senza un velo deciso nella
   meta' bassa il testo bianco non si legge. */
.apertura__velo {
	position: absolute;
	inset: 0;
	z-index: -1;
	background:
		linear-gradient(to top, rgba(8, 15, 28, .94) 0%, rgba(8, 15, 28, .86) 26%, rgba(8, 15, 28, .62) 52%, rgba(8, 15, 28, .34) 78%, rgba(8, 15, 28, .44) 100%);
}

.apertura__testo {
	color: #fff;
	padding-block: clamp(2.5rem, 6vw, 4.5rem);
	max-width: 780px;
}

.apertura__occhiello {
	color: #f0cd7e;
	font-size: .78rem;
	font-weight: 600;
	letter-spacing: .16em;
	text-transform: uppercase;
	margin: 0 0 .8em;
	text-shadow: 0 1px 10px rgba(0, 0, 0, .85), 0 0 3px rgba(0, 0, 0, .7);
}

.apertura__titolo {
	color: #fff;
	font-size: clamp(2.3rem, 6.2vw, 3.9rem);
	line-height: 1.04;
	margin: 0 0 .45em;
	text-wrap: balance;
	text-shadow: 0 2px 22px rgba(0, 0, 0, .6), 0 1px 3px rgba(0, 0, 0, .4);
}

.apertura__sommario {
	font-size: clamp(1.02rem, 2.2vw, 1.22rem);
	line-height: 1.55;
	max-width: 56ch;
	color: rgba(255, 255, 255, .94);
	margin-bottom: 1.8em;
	text-shadow: 0 1px 12px rgba(0, 0, 0, .7);
}

.apertura__bottoni {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
}

/* --------------------------------------------------- 6. Fascia informazioni */

.fascia-info {
	background: var(--carta);
	border-bottom: 1px solid var(--bordo);
}

.fascia-info__griglia {
	display: grid;
	gap: 28px;
	padding-block: 34px;
}

@media (min-width: 760px) {
	.fascia-info__griglia {
		grid-template-columns: repeat(3, 1fr);
		gap: 36px;
	}
}

.fascia-info__voce {
	display: flex;
	align-items: flex-start;
	gap: 14px;
}

.fascia-info__voce > svg {
	flex: none;
	width: 22px;
	height: 22px;
	margin-top: 3px;
	color: var(--ocra);
}

.fascia-info__etichetta {
	font-size: .74rem;
	font-weight: 600;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--grigio);
	margin: 0 0 .35em;
}

.fascia-info__valore {
	margin: 0 0 .15em;
	font-size: .98rem;
}

.fascia-info__valore--grande {
	font-size: 1.2rem;
	font-weight: 600;
}

.fascia-info__valore a {
	color: var(--notte);
	text-decoration: none;
}

.fascia-info__valore a:hover { color: var(--ocra-scura); }

/* -------------------------------------------------------- 7. Schede menù */

/* Le colonne si adattano al numero di menù: con uno solo pubblicato
   resta al centro invece di rimanere spaiato a sinistra.
   La colonna va dichiarata anche da sola (minmax(0,1fr)): senza,
   "justify-content: center" la dimensiona sul contenuto e la pagina
   sborda di lato sul telefono. */
.griglia-menu {
	display: grid;
	gap: 26px;
	grid-template-columns: minmax(0, 1fr);
	justify-content: center;
}

@media (min-width: 700px) {
	.griglia-menu {
		grid-template-columns: repeat(auto-fit, minmax(290px, 380px));
	}
}

.scheda-menu {
	display: flex;
	flex-direction: column;
	background: var(--carta);
	border: 1px solid var(--bordo);
	border-radius: var(--raggio);
	overflow: hidden;
	box-shadow: var(--ombra);
	transition: box-shadow .2s ease, transform .2s ease;
}

.scheda-menu:hover {
	box-shadow: var(--ombra-alta);
	transform: translateY(-3px);
}

.scheda-menu__foto {
	display: block;
	aspect-ratio: 4 / 3;
	overflow: hidden;
	background: var(--crema-scura);
}

.scheda-menu__foto img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center top;
}

.scheda-menu__corpo {
	display: flex;
	flex-direction: column;
	gap: .55rem;
	padding: 22px 22px 24px;
	flex: 1;
}

.scheda-menu__periodo {
	margin: 0;
	font-size: .74rem;
	font-weight: 600;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: var(--ocra-scura);
}

.scheda-menu__titolo {
	margin: 0;
	font-size: 1.6rem;
}

.scheda-menu__titolo a {
	color: var(--notte);
	text-decoration: none;
}

.scheda-menu__titolo a:hover { color: var(--ocra-scura); }

.scheda-menu__sommario {
	margin: 0;
	color: var(--grigio);
	font-size: .95rem;
}

.scheda-menu__prezzo {
	margin: .2rem 0 0;
	font-family: var(--font-titoli);
	font-size: 1.65rem;
	font-weight: 700;
	color: var(--notte);
	line-height: 1.1;
}

.scheda-menu__nota {
	display: block;
	font-family: var(--font-testo);
	font-size: .8rem;
	font-weight: 500;
	color: var(--grigio);
	margin-top: .3em;
}

.scheda-menu__corpo .collegamento-avanti { margin-top: auto; padding-top: .6rem; }

/* ------------------------------------------------------ 8. Due colonne */

.due-colonne {
	display: grid;
	gap: clamp(2rem, 5vw, 3.5rem);
	align-items: center;
}

@media (min-width: 900px) {
	.due-colonne { grid-template-columns: 1.05fr .95fr; }
}

.due-colonne .sezione__intestazione {
	margin: 0 0 1.4rem;
	text-align: left;
	max-width: none;
}

.due-colonne__foto img {
	width: 100%;
	border-radius: var(--raggio);
	box-shadow: var(--ombra-alta);
}

.due-colonne__testo .collegamento-avanti { margin-top: 1.2rem; }

/* ----------------------------------------------------------- 9. Piatti */

.griglia-piatti {
	display: grid;
	gap: 18px;
	grid-template-columns: repeat(2, 1fr);
}

@media (min-width: 820px) {
	.griglia-piatti { grid-template-columns: repeat(4, 1fr); }
}

.piatto {
	margin: 0;
	position: relative;
	border-radius: var(--raggio);
	overflow: hidden;
	background: var(--notte);
}

.piatto img {
	width: 100%;
	aspect-ratio: 1 / 1;
	object-fit: cover;
	transition: transform .5s ease, opacity .3s ease;
}

.piatto:hover img {
	transform: scale(1.05);
	opacity: .82;
}

.piatto__nome {
	position: absolute;
	left: 0; right: 0; bottom: 0;
	padding: 28px 16px 14px;
	color: #fff;
	font-family: var(--font-titoli);
	font-size: 1.1rem;
	font-weight: 600;
	background: linear-gradient(to top, rgba(10, 18, 33, .85), transparent);
}

/* ------------------------------------------------------ 10. Come arrivare */

.griglia-arrivare {
	display: grid;
	gap: 28px;
}

@media (min-width: 760px) {
	.griglia-arrivare { grid-template-columns: repeat(2, 1fr); gap: 40px; }
}

.modo-arrivo {
	background: rgba(255, 255, 255, .05);
	border: 1px solid rgba(255, 255, 255, .13);
	border-radius: var(--raggio);
	padding: 28px 26px;
}

.modo-arrivo > svg {
	width: 30px;
	height: 30px;
	color: var(--ocra-chiara);
	margin-bottom: 14px;
}

.modo-arrivo__titolo {
	font-size: 1.5rem;
	margin: 0 0 .5em;
}

.modo-arrivo p {
	margin: 0;
	color: rgba(255, 255, 255, .84);
	font-size: .98rem;
}

.richiamo-mappa {
	margin-top: 36px;
	padding-top: 30px;
	border-top: 1px solid rgba(255, 255, 255, .15);
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 18px;
}

.richiamo-mappa__indirizzo {
	margin: 0;
	font-family: var(--font-titoli);
	font-size: 1.4rem;
	color: #fff;
}

/* ---------------------------------------------------------- 11. Invito */

.sezione--invito {
	background: var(--crema-scura);
}

.invito {
	text-align: center;
	max-width: 58ch;
}

.invito__titolo {
	font-size: clamp(1.9rem, 4.6vw, 3rem);
	margin: 0 0 .4em;
}

.invito__testo {
	font-size: 1.08rem;
	color: var(--grigio);
	margin-bottom: 1.8em;
}

.invito__bottoni {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 12px;
}

/* ------------------------------------------------ 12. Pagine di contenuto */

.intestazione-pagina {
	background: var(--notte);
	color: #fff;
	padding-block: clamp(2.6rem, 6vw, 4.2rem);
	text-align: center;
}

.intestazione-pagina__titolo {
	color: #fff;
	font-size: clamp(2rem, 5.2vw, 3.2rem);
	margin: 0;
}

.intestazione-pagina__data,
.intestazione-pagina__testo {
	color: rgba(255, 255, 255, .82);
	margin: .8em auto 0;
	max-width: 58ch;
}

.intestazione-pagina .occhiello { color: var(--ocra-chiara); }

.pagina__foto {
	margin-top: -2.2rem;
	margin-bottom: 2.6rem;
}

.pagina__foto img {
	width: 100%;
	border-radius: var(--raggio);
	box-shadow: var(--ombra-alta);
}

.pagina,
.elenco-articoli,
.pagina-404 {
	padding-block: clamp(2.4rem, 5vw, 4rem);
}

.pagina .intestazione-pagina { margin-bottom: clamp(2.4rem, 5vw, 4rem); }
.pagina { padding-top: 0; }

.testo-lungo {
	max-width: var(--larghezza-testo);
	margin-inline: auto;
	font-size: 1.08rem;
}

.due-colonne .testo-lungo { margin-inline: 0; }

.testo-lungo h2 {
	font-size: clamp(1.6rem, 3.4vw, 2.1rem);
	margin-top: 1.8em;
}

.testo-lungo h3 {
	font-size: 1.4rem;
	margin-top: 1.6em;
}

.testo-lungo img,
.testo-lungo figure img {
	border-radius: var(--raggio);
	box-shadow: var(--ombra);
}

.testo-lungo figure { margin: 2rem 0; }

.testo-lungo figcaption {
	font-size: .88rem;
	color: var(--grigio);
	text-align: center;
	margin-top: .7em;
}

.testo-lungo ul,
.testo-lungo ol { padding-left: 1.3em; }

.testo-lungo li { margin-bottom: .4em; }

.testo-lungo blockquote {
	margin: 2rem 0;
	padding: .3rem 0 .3rem 1.4rem;
	border-left: 3px solid var(--ocra);
	font-family: var(--font-titoli);
	font-size: 1.3rem;
	font-style: italic;
	color: var(--notte);
}

.testo-lungo .wp-block-gallery,
.testo-lungo .wp-block-image { margin-block: 2rem; }

/* --------------------------------------------------------- 13. Un menù */

.intestazione-menu {
	background: var(--notte);
	color: #fff;
	padding-block: clamp(2.6rem, 6vw, 4.2rem);
	text-align: center;
	margin-bottom: clamp(2.4rem, 5vw, 3.6rem);
}

.intestazione-menu__periodo {
	color: var(--ocra-chiara);
	font-size: .8rem;
	font-weight: 600;
	letter-spacing: .14em;
	text-transform: uppercase;
	margin: 0 0 .9em;
}

.intestazione-menu__titolo {
	color: #fff;
	font-size: clamp(2.1rem, 5.6vw, 3.4rem);
	margin: 0;
}

.intestazione-menu__prezzo {
	font-family: var(--font-titoli);
	font-size: clamp(1.8rem, 4vw, 2.4rem);
	font-weight: 700;
	color: var(--ocra-chiara);
	margin: .5em 0 0;
}

.intestazione-menu__nota {
	display: block;
	font-family: var(--font-testo);
	font-size: .85rem;
	font-weight: 500;
	color: rgba(255, 255, 255, .78);
	margin-top: .4em;
}

.intestazione-menu__bottoni { margin-top: 1.8rem; }

.testo-menu {
	max-width: 56ch;
	margin-inline: auto;
	text-align: center;
	font-size: 1.1rem;
}

.testo-menu h2 {
	font-size: .82rem;
	font-family: var(--font-testo);
	font-weight: 700;
	letter-spacing: .18em;
	text-transform: uppercase;
	color: var(--ocra-scura);
	margin: 2.6em 0 1em;
	display: flex;
	align-items: center;
	gap: 14px;
}

.testo-menu h2::before,
.testo-menu h2::after {
	content: "";
	flex: 1;
	height: 1px;
	background: var(--bordo);
}

.testo-menu h2:first-child { margin-top: 0; }

.testo-menu ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

.testo-menu li {
	font-family: var(--font-titoli);
	font-size: 1.35rem;
	line-height: 1.4;
	padding: .35em 0;
	color: var(--notte);
}

.menu-volantino {
	max-width: 640px;
	margin: clamp(3rem, 6vw, 4.5rem) auto 0;
	text-align: center;
}

.menu-volantino__titolo {
	font-size: .76rem;
	font-weight: 600;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--grigio);
	margin-bottom: 1em;
}

.menu-volantino img {
	width: 100%;
	border: 1px solid var(--bordo);
	border-radius: var(--raggio);
	box-shadow: var(--ombra-alta);
}

.richiamo-prenota {
	max-width: 640px;
	margin: clamp(3rem, 6vw, 4.5rem) auto 0;
	padding: 32px 26px;
	background: var(--carta);
	border: 1px solid var(--bordo);
	border-radius: var(--raggio);
	text-align: center;
}

.richiamo-prenota__testo {
	font-family: var(--font-titoli);
	font-size: 1.5rem;
	color: var(--notte);
	margin-bottom: 1.2em;
}

.richiamo-prenota__bottoni {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 12px;
}

.avviso-vuoto { text-align: center; }
.avviso-vuoto p:last-child { margin-top: 1.5rem; }

/* ------------------------------------------------------- 14. Elenchi */

.elenco-articoli {
	display: grid;
	gap: 26px;
}

@media (min-width: 720px) {
	.elenco-articoli { grid-template-columns: repeat(2, 1fr); }
}

.articolo-breve {
	background: var(--carta);
	border: 1px solid var(--bordo);
	border-radius: var(--raggio);
	overflow: hidden;
}

.articolo-breve__foto img {
	width: 100%;
	aspect-ratio: 16 / 10;
	object-fit: cover;
}

.articolo-breve__corpo { padding: 22px; }

.articolo-breve__titolo { font-size: 1.5rem; margin: 0 0 .4em; }

.articolo-breve__titolo a { color: var(--notte); text-decoration: none; }
.articolo-breve__titolo a:hover { color: var(--ocra-scura); }

.articolo-breve__sommario { color: var(--grigio); font-size: .96rem; }

.navigation.pagination {
	margin-top: 3rem;
	display: flex;
	justify-content: center;
}

.nav-links {
	display: flex;
	gap: 8px;
	flex-wrap: wrap;
}

.page-numbers {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 42px;
	height: 42px;
	padding: 0 12px;
	border: 1px solid var(--bordo);
	border-radius: var(--raggio);
	background: var(--carta);
	color: var(--notte);
	text-decoration: none;
	font-size: .92rem;
	font-weight: 500;
}

.page-numbers.current,
.page-numbers:hover {
	background: var(--notte);
	border-color: var(--notte);
	color: #fff;
}

/* ------------------------------------------------------- 15. Ricerca e 404 */

.modulo-ricerca {
	display: flex;
	gap: 8px;
	max-width: 440px;
	margin: 1.6rem auto;
}

.modulo-ricerca__campo {
	flex: 1;
	padding: 11px 14px;
	border: 1px solid var(--bordo);
	border-radius: var(--raggio);
	font: inherit;
	font-size: .95rem;
	background: var(--carta);
	color: var(--inchiostro);
}

.pagina-404 { text-align: center; max-width: 60ch; }

.pagina-404__titolo { font-size: clamp(2rem, 5vw, 3rem); }

.pagina-404__testo { color: var(--grigio); }

.pagina-404__scorciatoie {
	list-style: none;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 8px 22px;
	padding: 0;
	margin: 1.6rem 0;
}

.pagina-404__telefono { margin-top: 2rem; }

/* ------------------------------------------------------ 16. Fondo pagina */

.pie-pagina {
	background: var(--notte);
	color: rgba(255, 255, 255, .82);
	padding-top: clamp(3rem, 6vw, 4.5rem);
	margin-top: auto;
}

.pie-pagina__griglia {
	display: grid;
	gap: 34px;
	padding-bottom: 3rem;
}

@media (min-width: 720px) {
	.pie-pagina__griglia { grid-template-columns: repeat(2, 1fr); }
}

@media (min-width: 1020px) {
	.pie-pagina__griglia { grid-template-columns: 1.3fr 1fr 1fr 1fr; gap: 40px; }
}

.pie-pagina__nome {
	font-family: var(--font-titoli);
	font-size: 1.8rem;
	font-weight: 700;
	color: #fff;
	margin: 0 0 .2em;
	line-height: 1.1;
}

.pie-pagina__dal {
	font-size: .78rem;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--ocra-chiara);
	margin: 0;
}

.pie-pagina__titolo {
	font-family: var(--font-testo);
	font-size: .74rem;
	font-weight: 600;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: rgba(255, 255, 255, .55);
	margin: 0 0 .9em;
}

.pie-pagina__indirizzo {
	font-style: normal;
	margin: 0 0 .7em;
	color: #fff;
}

.pie-pagina__telefono {
	font-family: var(--font-titoli);
	font-size: 1.5rem;
	margin: 0 0 .3em;
}

.pie-pagina a { color: #fff; text-decoration: none; }
.pie-pagina a:hover { color: var(--ocra-chiara); text-decoration: underline; }

.pie-pagina__orari {
	list-style: none;
	margin: 0;
	padding: 0;
}

.pie-pagina__orari li { margin-bottom: .3em; }

.pie-pagina__widget {
	padding-bottom: 2.5rem;
	border-top: 1px solid rgba(255, 255, 255, .12);
	padding-top: 2rem;
}

.pie-pagina__coda {
	border-top: 1px solid rgba(255, 255, 255, .12);
	padding-block: 22px;
	font-size: .84rem;
	color: rgba(255, 255, 255, .62);
}

.pie-pagina__coda-riga {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
}

.pie-pagina__coda p { margin: 0; }

.pie-pagina__menu {
	list-style: none;
	display: flex;
	flex-wrap: wrap;
	gap: 18px;
	margin: 0;
	padding: 0;
}

/* --------------------------------------------- 17. Barra azioni da telefono */

.barra-azioni {
	position: fixed;
	left: 0; right: 0; bottom: 0;
	z-index: 50;
	display: grid;
	grid-template-columns: 1fr 1fr;
	background: var(--carta);
	border-top: 1px solid var(--bordo);
	box-shadow: 0 -4px 18px rgba(20, 35, 60, .1);
	padding-bottom: env(safe-area-inset-bottom);
}

.barra-azioni__voce {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	padding: 14px 8px;
	font-size: .95rem;
	font-weight: 600;
	text-decoration: none;
	color: var(--notte);
}

.barra-azioni__voce--principale {
	background: var(--ocra);
	color: #fff;
}

.barra-azioni__voce svg { width: 19px; height: 19px; }

@media (min-width: 900px) {
	.barra-azioni { display: none; }
}

@media (max-width: 899px) {
	body { padding-bottom: 60px; }
}

/* ------------------------------------------------------ 18. Impalcatura */

.sito {
	display: flex;
	flex-direction: column;
	min-height: 100vh;
}

.contenuto-principale { flex: 1; }

/* ------------------------------ 19. Contenuti di WordPress e vecchio sito */

/* Le pagine scritte con il vecchio editor portavano [caption width="3264"],
   che imponeva al riquadro una larghezza fissa in pixel e faceva sbordare
   la pagina sul telefono. Qui la larghezza viene sempre riportata dentro. */
.wp-caption,
.wp-block-image,
.wp-block-gallery,
.wp-block-embed,
.testo-lungo figure,
.testo-lungo table {
	max-width: 100% !important;
	height: auto;
}

.wp-caption img,
.wp-block-image img {
	width: auto;
	max-width: 100%;
	height: auto;
}

.wp-caption-text,
.wp-element-caption {
	font-size: .88rem;
	color: var(--grigio);
	text-align: center;
	margin-top: .7em;
}

.wp-block-gallery.has-nested-images {
	display: grid;
	gap: 16px;
	grid-template-columns: repeat(2, minmax(0, 1fr));
}

.wp-block-gallery.has-nested-images figure.wp-block-image {
	margin: 0;
	width: auto !important;
	flex-basis: auto !important;
}

.wp-block-gallery.has-nested-images figure.wp-block-image img {
	width: 100%;
	aspect-ratio: 4 / 3;
	object-fit: cover;
	border-radius: var(--raggio);
}

@media (min-width: 720px) {
	.wp-block-gallery.columns-3.has-nested-images {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
}

.alignleft,
.alignright,
.aligncenter {
	float: none;
	display: block;
	margin-inline: auto;
}

.testo-lungo iframe,
.testo-lungo video,
.testo-lungo embed,
.testo-lungo object {
	max-width: 100%;
}

/* Titoli lunghi senza spazi non devono allargare il riquadro. */
.scheda-menu__corpo,
.articolo-breve__corpo,
.due-colonne__testo,
.fascia-info__voce > div {
	min-width: 0;
}

/* -------------------------------------------------------- 20. Stampa */

@media print {
	.testata, .pie-pagina, .barra-azioni, .apertura__velo, .richiamo-prenota { display: none !important; }
	body { background: #fff; color: #000; font-size: 11pt; }
	.intestazione-menu { background: none; color: #000; padding-block: 0; }
	.intestazione-menu__titolo, .intestazione-menu__prezzo { color: #000; }
	.testo-menu li { color: #000; }
	a { text-decoration: none; color: #000; }
}