/* La Cucina di Chiara — variante "Diario" (25-09-2026)
   Pagina bianca e ariosa, titoli spaziati in maiuscolo, sezioni in un
   romano da tipografia antica, una sola nota di colore: il rosso mattone
   dei link. Tutti i valori passano dai token qui sotto. */

:root {
	--carta: #ffffff;
	--pannello: #f6f4f1;
	--inchiostro: #1f1d1b;
	--testo: #4f4a45;
	--tenue: #6b645e;
	--filo: #e4dfd8;
	--accento: #8c3b24;
	--accento-scuro: #6e2c19;

	--f-sezione: "IM Fell Double Pica", Georgia, "Times New Roman", serif;
	--f-titolo: "Jost", "Futura", "Helvetica Neue", Arial, sans-serif;
	--f-testo: "Lato", "Helvetica Neue", Arial, sans-serif;

	--larghezza: 1170px;
	--colonna: 300px;
	--respiro: clamp(1.25rem, 4vw, 2.5rem);
	--spazio-sezione: clamp(3rem, 7vw, 5.5rem);

	--raggio-campo: 2px;
	--ombra-menu: 0 12px 28px rgba(31, 29, 27, .12);
}

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

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

body.lcdc-diario {
	margin: 0;
	background: var(--carta);
	color: var(--testo);
	font: 400 1rem/1.7 var(--f-testo);
}

/* spazio per la barra di anteprima, solo quando c'e' */
body.lcdc-diario:has(.d-anteprima) { padding-bottom: 4.5rem; }

.lcdc-diario img { max-width: 100%; height: auto; display: block; }

.lcdc-diario a { color: var(--accento); text-underline-offset: .18em; }
.lcdc-diario a:hover { color: var(--accento-scuro); }
.lcdc-diario a:focus-visible,
.lcdc-diario summary:focus-visible,
.lcdc-diario button:focus-visible,
.lcdc-diario input:focus-visible {
	outline: 2px solid var(--accento);
	outline-offset: 3px;
}

.d-nascosto {
	position: absolute !important;
	width: 1px; height: 1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
}

.d-salta {
	position: absolute;
	left: 1rem; top: -4rem;
	background: var(--inchiostro);
	color: var(--carta) !important;
	padding: .6rem 1rem;
	z-index: 20;
}
.d-salta:focus { top: 1rem; }

/* ---------- testata ---------- */

.d-testata {
	border-bottom: 1px solid var(--filo);
	background: var(--carta);
}

.d-testata-riga {
	max-width: var(--larghezza);
	margin: 0 auto;
	padding: clamp(1.6rem, 5vw, 3rem) var(--respiro) clamp(1rem, 3vw, 1.6rem);
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 1rem;
}

.d-marchio { margin: 0; text-align: center; }
.d-marchio a { text-decoration: none; color: var(--inchiostro); display: inline-block; }

.d-marchio-nome {
	display: block;
	font: 400 clamp(2.1rem, 7vw, 3.6rem)/1 var(--f-sezione);
	letter-spacing: .01em;
}

.d-marchio-sotto {
	display: block;
	margin-top: .7rem;
	font: 500 .75rem/1.3 var(--f-titolo);
	letter-spacing: .32em;
	text-transform: uppercase;
	color: var(--tenue);
}

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

.d-menu a {
	display: block;
	padding: .75rem .9rem;
	font: 500 .78rem/1.2 var(--f-titolo);
	letter-spacing: .16em;
	text-transform: uppercase;
	color: var(--inchiostro);
	text-decoration: none;
	white-space: nowrap;
}

.d-menu a:hover,
.d-menu a[aria-current="page"] { color: var(--accento); }
.d-menu a[aria-current="page"] { text-decoration: underline; text-decoration-thickness: 1px; }

.d-menu-largo {
	border-top: 1px solid var(--filo);
}

.d-menu-largo .d-menu {
	max-width: var(--larghezza);
	margin: 0 auto;
	padding: .2rem var(--respiro);
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
}

.d-menu-mobile { display: none; }

@media (max-width: 900px) {
	.d-testata-riga { justify-content: space-between; text-align: left; }
	.d-marchio { text-align: left; }
	.d-menu-largo { display: none; }

	.d-menu-mobile { display: block; position: relative; }

	.d-menu-mobile summary {
		list-style: none;
		cursor: pointer;
		min-height: 44px;
		min-width: 44px;
		padding: .7rem .2rem .7rem 1rem;
		font: 500 .78rem/1.2 var(--f-titolo);
		letter-spacing: .18em;
		text-transform: uppercase;
		color: var(--inchiostro);
		display: flex;
		align-items: center;
		gap: .55rem;
	}
	.d-menu-mobile summary::-webkit-details-marker { display: none; }
	.d-menu-mobile summary::after {
		content: "";
		width: 16px; height: 9px;
		border-top: 1px solid currentColor;
		border-bottom: 1px solid currentColor;
	}
	.d-menu-mobile[open] summary::after { height: 0; border-bottom: 0; }

	.d-menu-mobile nav {
		position: absolute;
		right: 0;
		top: calc(100% + .4rem);
		z-index: 10;
		min-width: 15rem;
		background: var(--carta);
		border: 1px solid var(--filo);
		box-shadow: var(--ombra-menu);
		padding: .4rem 0;
	}
	.d-menu-mobile .d-menu a { padding: .85rem 1.2rem; }
}

@media (max-width: 420px) {
	.d-marchio-sotto { letter-spacing: .22em; }
}

/* ---------- striscia di foto ---------- */

.d-striscia {
	display: flex;
	height: clamp(150px, 26vw, 330px);
	overflow: hidden;
}

.d-striscia > span { flex: 1 1 0; min-width: 0; }
.d-striscia > span:nth-child(2) { flex-grow: 2; }
.d-striscia img { width: 100%; height: 100%; object-fit: cover; }

@media (max-width: 560px) {
	.d-striscia > span:nth-child(4) { display: none; }
	.d-striscia > span:nth-child(2) { flex-grow: 1.4; }
}

/* ---------- impaginazione ---------- */

.d-pagina {
	max-width: var(--larghezza);
	margin: 0 auto;
	padding: 0 var(--respiro);
}

.d-sezione {
	margin: 0 0 2.2rem;
	text-align: center;
	font: 400 clamp(2.1rem, 5.5vw, 3rem)/1.05 var(--f-sezione);
	color: var(--inchiostro);
}

.d-sezione span {
	display: block;
	margin-top: .6rem;
	font: 500 .75rem/1.4 var(--f-titolo);
	letter-spacing: .28em;
	text-transform: uppercase;
	color: var(--tenue);
}

/* ---------- ultime quattro in fila ---------- */

.d-fila { padding-top: var(--spazio-sezione); }

.d-fila-griglia {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 2.2rem 1.9rem;
}

.d-fila-foto { display: block; aspect-ratio: 4 / 3; overflow: hidden; background: var(--pannello); }
.d-fila-foto img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s ease; }
.d-fila li:hover .d-fila-foto img { transform: scale(1.03); }

.d-fila-titolo {
	margin: 0;
	padding-top: .9rem;
	margin-top: .9rem;
	border-top: 1px solid var(--filo);
	font: 500 .84rem/1.45 var(--f-titolo);
	letter-spacing: .12em;
	text-transform: uppercase;
}
.d-fila-titolo a { color: var(--inchiostro); text-decoration: none; }
.d-fila-titolo a:hover { color: var(--accento); }

@media (max-width: 1000px) {
	.d-fila-griglia { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 440px) {
	.d-fila-griglia { gap: 1.8rem 1rem; }
	.d-fila-titolo { font-size: .76rem; letter-spacing: .08em; }
}

/* ---------- corpo: diario + colonna ---------- */

.d-corpo {
	display: grid;
	grid-template-columns: minmax(0, 1fr) var(--colonna);
	gap: clamp(3rem, 6vw, 4.5rem);
	padding: var(--spazio-sezione) 0;
	align-items: start;
}

@media (max-width: 960px) {
	.d-corpo { grid-template-columns: minmax(0, 1fr); }
}

.d-vuoto { text-align: center; }

.d-voce {
	display: grid;
	grid-template-columns: minmax(0, 250px) minmax(0, 1fr);
	gap: 1.9rem;
	padding-bottom: 2.6rem;
	margin-bottom: 2.6rem;
	border-bottom: 1px solid var(--filo);
}

.d-voce-foto { display: block; aspect-ratio: 3 / 4; overflow: hidden; background: var(--pannello); }
.d-voce-foto img { width: 100%; height: 100%; object-fit: cover; }

.d-foto-vuota { display: block; width: 100%; height: 100%; min-height: 8rem; background: var(--pannello); }

.d-meta {
	margin: 0 0 .8rem;
	padding-bottom: .35rem;
	border-bottom: 1px solid var(--filo);
	font: 500 .72rem/1.6 var(--f-titolo);
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--tenue);
}
.d-meta a { display: inline-block; padding: .35rem 0; color: var(--tenue); text-decoration: none; }
.d-meta a:hover { color: var(--accento); }
.d-meta-sep {
	display: inline-block;
	width: 1px; height: .9em;
	margin: 0 .8rem;
	vertical-align: -.1em;
	background: var(--filo);
}

.d-voce-titolo {
	margin: 0 0 .9rem;
	font: 500 clamp(1.05rem, 2.4vw, 1.3rem)/1.35 var(--f-titolo);
	letter-spacing: .1em;
	text-transform: uppercase;
}
.d-voce-titolo a { color: var(--inchiostro); text-decoration: none; }
.d-voce-titolo a:hover { color: var(--accento); }

.d-voce-estratto { margin: 0 0 1.1rem; font-weight: 300; font-size: 1.02rem; color: var(--testo); }

.d-leggi {
	display: inline-block;
	padding: .35rem 0;
	font: 500 .75rem/1.4 var(--f-titolo);
	letter-spacing: .18em;
	text-transform: uppercase;
	text-decoration: none;
	border-bottom: 1px solid currentColor;
}

@media (max-width: 700px) {
	.d-voce { grid-template-columns: minmax(0, 1fr); gap: 1.2rem; }
	.d-voce-foto { aspect-ratio: 4 / 3; }
}

.d-pagine {
	display: flex;
	justify-content: space-between;
	gap: 1rem;
	flex-wrap: wrap;
}
.d-pagine a {
	display: inline-block;
	padding: .8rem 0;
	font: 500 .78rem/1.3 var(--f-titolo);
	letter-spacing: .2em;
	text-transform: uppercase;
	color: var(--tenue);
	text-decoration: none;
}
.d-pagine a:hover { color: var(--accento); }
.d-pagine-su a::before { content: "\2190\00a0\00a0"; }
.d-pagine-giu { margin-left: auto; }
.d-pagine-giu a::after { content: "\00a0\00a0\2192"; }

/* ---------- colonna laterale ---------- */

.d-colonna { display: grid; gap: 2.4rem; }

.d-box-titolo {
	margin: 0 0 1rem;
	padding-bottom: .7rem;
	border-bottom: 1px solid var(--filo);
	font: 500 .8rem/1.3 var(--f-titolo);
	letter-spacing: .2em;
	text-transform: uppercase;
	color: var(--inchiostro);
}

.d-chi p { margin: 0 0 .9rem; font-size: .95rem; }

.d-cerca { background: var(--pannello); padding: 1.6rem 1.4rem; }
.d-cerca .d-box-titolo { border-bottom-color: var(--filo); }
.d-cerca form { display: grid; gap: .7rem; }
.d-cerca input {
	width: 100%;
	min-height: 44px;
	padding: .6rem .8rem;
	border: 1px solid var(--filo);
	border-radius: var(--raggio-campo);
	background: var(--carta);
	font: 400 1rem/1.3 var(--f-testo);
	color: var(--inchiostro);
}
.d-cerca input::placeholder { color: var(--tenue); }
.d-cerca button {
	min-height: 44px;
	border: 0;
	border-radius: var(--raggio-campo);
	background: var(--inchiostro);
	color: var(--carta);
	font: 500 .78rem/1 var(--f-titolo);
	letter-spacing: .2em;
	text-transform: uppercase;
	cursor: pointer;
}
.d-cerca button:hover { background: var(--accento-scuro); }

.d-tessere { list-style: none; margin: 0 0 1.6rem; padding: 0; display: grid; gap: 1.2rem; }
.d-tessere a { display: block; text-decoration: none; color: var(--inchiostro); }
.d-tessere img { width: 100%; aspect-ratio: 16 / 10; object-fit: cover; }
.d-tessera-nome {
	display: block;
	margin-top: .6rem;
	font: 400 1.45rem/1.15 var(--f-sezione);
}
.d-tessera-conta {
	display: block;
	font: 500 .72rem/1.5 var(--f-titolo);
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--tenue);
}
.d-tessere a:hover .d-tessera-nome { color: var(--accento); }

.d-elenco-cat { list-style: none; margin: 0; padding: 0; }
.d-elenco-cat li {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	gap: 1rem;
	border-bottom: 1px solid var(--filo);
}
.d-elenco-cat a { display: block; padding: .55rem 0; color: var(--inchiostro); text-decoration: none; font-size: .95rem; }
.d-elenco-cat a:hover { color: var(--accento); }
.d-elenco-cat span { font: 500 .75rem/1 var(--f-titolo); color: var(--tenue); letter-spacing: .08em; }

@media (min-width: 600px) and (max-width: 960px) {
	.d-colonna { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 2.4rem 2rem; }
	.d-categorie { grid-column: 1 / -1; }
	.d-tessere { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

/* ---------- ricetta singola ---------- */

.d-articolo-testa { margin-bottom: 2rem; }

.d-articolo-titolo {
	margin: 0;
	font: 500 clamp(1.45rem, 4.2vw, 2.1rem)/1.3 var(--f-titolo);
	letter-spacing: .08em;
	text-transform: uppercase;
	color: var(--inchiostro);
	overflow-wrap: break-word;
}

.d-articolo-foto { margin: 0 0 2rem; }

.d-testo { font-size: 1.04rem; color: var(--testo); overflow-wrap: break-word; }
.d-testo > * { max-width: 100%; }
.d-testo p { margin: 0 0 1.15em; }
.d-testo h2,
.d-testo h3,
.d-testo h4 {
	margin: 2em 0 .7em;
	font: 500 1rem/1.4 var(--f-titolo);
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--inchiostro);
}
.d-testo ul,
.d-testo ol { padding-left: 1.3em; margin: 0 0 1.2em; }
.d-testo li { margin-bottom: .35em; }
.d-testo strong, .d-testo b { color: var(--inchiostro); font-weight: 700; }
.d-testo img { margin: 1.6em auto; }
.d-testo .alignleft,
.d-testo .alignright,
.d-testo .aligncenter,
.d-testo .alignnone { float: none; margin-left: auto; margin-right: auto; }
.d-testo figure { margin: 1.6em 0; max-width: 100% !important; }
.d-testo figcaption, .d-testo .wp-caption-text { font-size: .85rem; color: var(--tenue); text-align: center; }
.d-testo iframe { max-width: 100%; }

.d-vicine {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 1.5rem;
	margin: 3rem 0;
	padding-top: 1.6rem;
	border-top: 1px solid var(--filo);
}
.d-vicina { display: block; color: var(--inchiostro) !important; text-decoration: none; font: 400 1.2rem/1.3 var(--f-sezione); }
.d-vicina span {
	display: block;
	margin-bottom: .4rem;
	font: 500 .72rem/1.3 var(--f-titolo);
	letter-spacing: .16em;
	text-transform: uppercase;
	color: var(--tenue);
}
.d-vicina:hover { color: var(--accento) !important; }
.d-vicina-dopo { text-align: right; grid-column: 2; }

@media (max-width: 560px) {
	.d-vicine { grid-template-columns: minmax(0, 1fr); }
	.d-vicina-dopo { text-align: left; grid-column: 1; }
}

/* commenti: il modulo del tema, rimesso in riga con il resto */
.lcdc-diario #comments,
.lcdc-diario #respond { margin-top: 2.5rem; }
.lcdc-diario #reply-title,
.lcdc-diario .comments-title {
	font: 500 .85rem/1.3 var(--f-titolo);
	letter-spacing: .18em;
	text-transform: uppercase;
	color: var(--inchiostro);
}
.lcdc-diario #respond input[type="text"],
.lcdc-diario #respond input[type="email"],
.lcdc-diario #respond input[type="url"],
.lcdc-diario #respond textarea {
	width: 100%;
	min-height: 44px;
	padding: .6rem .8rem;
	border: 1px solid var(--filo);
	border-radius: var(--raggio-campo);
	font: 400 1rem/1.4 var(--f-testo);
	color: var(--inchiostro);
}
.lcdc-diario #respond label { display: block; font-size: .9rem; margin-bottom: .3rem; }
.lcdc-diario #respond .comment-form-cookies-consent label { display: inline; }
.lcdc-diario #respond input[type="submit"] {
	min-height: 44px;
	padding: 0 1.6rem;
	border: 0;
	border-radius: var(--raggio-campo);
	background: var(--inchiostro);
	color: var(--carta);
	font: 500 .78rem/1 var(--f-titolo);
	letter-spacing: .2em;
	text-transform: uppercase;
	cursor: pointer;
}
.lcdc-diario .comment-list { list-style: none; padding: 0; }

/* ---------- piede ---------- */

.d-piede {
	position: relative;
	margin-top: 2rem;
	background: var(--pannello);
	padding: 5rem var(--respiro) 2.5rem;
	clip-path: polygon(0 3.2rem, 100% 0, 100% 100%, 0 100%);
}

.d-piede-dentro {
	max-width: var(--larghezza);
	margin: 0 auto;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: baseline;
	gap: 1rem 2rem;
}

.d-piede-marchio { margin: 0; font: 400 1.6rem/1.2 var(--f-sezione); color: var(--inchiostro); }
.d-piede-marchio span {
	margin-left: .6rem;
	font: 500 .72rem/1 var(--f-titolo);
	letter-spacing: .24em;
	text-transform: uppercase;
	color: var(--tenue);
}
.d-piede-note {
	margin: 0;
	font: 500 .72rem/1.5 var(--f-titolo);
	letter-spacing: .16em;
	text-transform: uppercase;
	color: var(--tenue);
}

/* ---------- barra di anteprima ---------- */

.d-anteprima {
	position: fixed;
	left: 0; right: 0; bottom: 0;
	z-index: 30;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: .2rem 1.4rem;
	padding: .55rem var(--respiro);
	background: var(--inchiostro);
	color: var(--carta);
	font: 400 .8rem/1.4 var(--f-testo);
}
.d-anteprima a {
	display: inline-block;
	padding: .45rem 0;
	color: var(--carta) !important;
	font: 500 .72rem/1.3 var(--f-titolo);
	letter-spacing: .14em;
	text-transform: uppercase;
}

@media (max-width: 520px) {
	.d-anteprima > span { flex-basis: 100%; text-align: center; font-size: .75rem; }
	body.lcdc-diario:has(.d-anteprima) { padding-bottom: 6rem; }
}

@media (prefers-reduced-motion: reduce) {
	.d-fila-foto img { transition: none; }
}