/* ==========================================================================
   News — elenco articoli e singolo articolo
   E' l'unica sezione rimasta sull'impaginato di Divi: qui non la si rifa',
   la si riporta nel linguaggio del resto del sito. Colori, caratteri e
   spaziature arrivano da base.css.
   ========================================================================== */

body.page-id-393 #page-container,
body.page-id-393 #et-main-area,
body.single-post #page-container,
body.single-post #et-main-area {
	background-color: var(--buzzi-carta);
}

/* Fascia del titolo ---------------------------------------------------------
   Era nera (#1f1f1f): un colore che nel resto del sito non esiste. Il fondo
   bordeaux arriva ora dalla sezione; qui si aggiunge la trama a fiori usata
   anche nell'invito in fondo alle altre pagine, cosi' la fascia appartiene
   visibilmente alla stessa famiglia. */
body.page-id-393 .et_pb_fullwidth_header {
	background-image: var(--buzzi-trama);
	background-size: 52px 52px;
	/* Divi imposta background-repeat:no-repeat per le foto d'intestazione:
	   senza questo la trama comparirebbe una volta sola, al centro, come una
	   macchia di puntini sotto il titolo. */
	background-repeat: repeat !important;
	background-position: center !important;
	/* stesse misure di .buzzi-pagina__testata, cosi' News non sfonda */
	padding-block: clamp(2.5rem, 5vw, 4.5rem) !important;
}

/* Divi da' al contenitore min-height:100vh — uno schermo intero per un
   titolo. Le altre nostre intestazioni stanno in clamp(2.5rem, 5vw, 4.5rem):
   qui si fa lo stesso e l'altezza torna a dipendere dal contenuto. */
body.page-id-393 .et_pb_fullwidth_header.et_pb_fullscreen,
body.page-id-393 .et_pb_fullwidth_header.et_pb_fullscreen .et_pb_fullwidth_header_container {
	min-height: 0 !important;
	height: auto !important;
}

body.page-id-393 .et_pb_header_content_wrapper:last-child,
body.page-id-393 .et_pb_fullwidth_header_subhead {
	margin-bottom: 0 !important;
	padding-bottom: 0 !important;
}

/* Dentro al contenitore Divi annida .header-content-container > .header-content,
   entrambi con riempimento proprio: e' da li' che nasceva il vuoto sotto il
   sottotitolo. L'altezza della fascia deve dipendere solo dal testo. */
body.page-id-393 .header-content-container,
body.page-id-393 .header-content {
	padding: 0 !important;
	/* solo i margini verticali: quelli orizzontali sono "auto" ed e' cio' che
	   tiene il testo centrato nella fascia. */
	margin-block: 0 !important;
	margin-inline: auto !important;
	width: 100%;
	background-color: transparent !important;
}

body.page-id-393 .et_pb_fullwidth_header_container {
	min-height: 0 !important;
	height: auto !important;
	width: 100% !important;
	padding-inline: 6%;
}

/* La freccia di scorrimento in fondo alla fascia: rimandava a un'idea di
   pagina a tutto schermo che non e' piu' questa. */
body.page-id-393 .et_pb_fullwidth_header_scroll {
	display: none !important;
}

/* Il modulo di Divi chiedeva Playfair a 72px fissi: fuori dalla nostra
   tipografia e ingestibile sul telefono. */
body.page-id-393 .et_pb_fullwidth_header h1.et_pb_module_header {
	font-family: var(--buzzi-titolo) !important;
	font-weight: 400 !important;
	font-variation-settings: "opsz" 96, "SOFT" 20;
	font-size: clamp(2.4rem, 5vw, 4rem) !important;
	line-height: 1.08 !important;
	letter-spacing: -0.005em;
}

body.page-id-393 .et_pb_header_content_wrapper {
	margin: var(--sp-3) auto 0;
	max-width: 38rem;
	font-family: var(--buzzi-testo);
	font-size: 1.02rem;
	font-weight: 300;
	line-height: 1.7;
}

/* Schede degli articoli -----------------------------------------------------
   Divi le incorniciava con un filetto grigio chiaro su fondo bianco. Le
   tessere del negozio non hanno cornice: l'immagine fa da bordo. Qui si fa
   lo stesso, cosi' News e Negozio si somigliano. */
body.page-id-393 .et_pb_post {
	border: 0 !important;
	padding: 0 !important;
	margin-bottom: var(--sp-5) !important;
	background-color: transparent !important;
}

body.page-id-393 .et_pb_post .et_pb_image_container,
body.page-id-393 .et_pb_post a img {
	margin: 0 0 var(--sp-3) !important;
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 4 / 3;
	object-fit: cover;
	background-color: var(--buzzi-fondo-foto);
}

body.page-id-393 .et_pb_post h2.entry-title,
body.page-id-393 .et_pb_post h2.entry-title a {
	font-family: var(--buzzi-titolo) !important;
	font-weight: 400 !important;
	font-size: 1.35rem !important;
	line-height: 1.2 !important;
	color: var(--buzzi-inchiostro) !important;
	text-decoration: none;
	padding: 0 !important;
}

body.page-id-393 .et_pb_post h2.entry-title a:hover {
	color: var(--buzzi-marchio) !important;
}

/* La riga dei metadati: era oro/senape. Ora e' l'occhiello che usiamo
   ovunque — maiuscoletto bordeaux, spaziato. */
body.page-id-393 .et_pb_post p.post-meta,
body.page-id-393 .et_pb_post p.post-meta a {
	font-family: var(--buzzi-testo) !important;
	font-size: 0.72rem !important;
	font-weight: 700 !important;
	letter-spacing: 0.22em;
	text-transform: uppercase;
	color: var(--buzzi-marchio) !important;
	text-decoration: none;
}

body.page-id-393 .et_pb_post p.post-meta {
	margin: var(--sp-1) 0 0 !important;
}

/* Singolo articolo ---------------------------------------------------------- */

body.single-post .entry-title,
body.single-post h1,
body.single-post h2 {
	font-family: var(--buzzi-titolo) !important;
	font-weight: 400 !important;
	color: var(--buzzi-inchiostro) !important;
}

body.single-post .entry-content p {
	font-family: var(--buzzi-testo);
	font-size: 1.02rem;
	font-weight: 300;
	line-height: 1.78;
	color: #4a4442;
}