/*
Theme Name: Caffè Napoli
Theme URI: 
Author: Elicasy
Author URI: 
Description: Caffè Napoli Theme
Requires at least: 7.0
Tested up to: 7.0
Requires PHP: 8.2
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: caffe-napoli
Tags:
*/

/**
 * Il padding sta dentro la larghezza dichiarata.
 *
 * Il riferimento lo dà per scontato con un reset globale; WordPress no, lo
 * imposta solo su alcuni blocchi. Senza, ogni elemento con `width: 100%` e
 * un padding laterale misura più del suo contenitore: su schermo stretto la
 * foto della sezione Menù allargava la colonna della griglia di 40px e il
 * testo accanto finiva tagliato fuori dallo schermo.
 *
 * Del reset del riferimento prendo solo questa riga: `margin: 0; padding: 0`
 * su tutto azzererebbe anche le spaziature che il core assegna ai blocchi.
 */
*,
*::before,
*::after {
	box-sizing: border-box;
}

/**
 * Base tipografica.
 *
 * Colori, famiglia e dimensioni stanno in theme.json. Qui resta solo la
 * resa del testo, che theme.json non sa esprimere.
 *
 * -webkit-font-smoothing: antialiased è nel riferimento e cambia molto:
 * su macOS il valore predefinito (subpixel-antialiased) ispessisce le
 * aste, quindi lo stesso font-weight appare più pesante. Senza questa
 * riga i pesi combaciano sulla carta ma non a schermo.
 */
body {
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	text-rendering: optimizeLegibility;
}

/* Coerente con il riferimento, ed evita che le immagini inline lascino lo
   spazio sotto la linea di base. */
img {
	display: block;
	max-width: 100%;
}

/**
 * Testo per le sole tecnologie assistive.
 *
 * Serve ai titoli che danno struttura a una sezione senza comparire nel
 * disegno. Il nome della classe è quello di WordPress, così compone con i
 * selettori `:not(.screen-reader-text)` che core usa nei suoi blocchi.
 *
 * `clip-path` e non `display: none`: quest'ultimo lo toglierebbe anche agli
 * screen reader, che è l'opposto di quel che serve.
 */
.screen-reader-text {
	position: absolute;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	border: 0;
	overflow: hidden;
	clip-path: inset( 50% );
	white-space: nowrap;
}


/**
 * Sezioni a tutta larghezza affiancate.
 *
 * Ogni sezione gestisce il proprio ritmo verticale con il padding, ma il core
 * inserisce comunque un margine fra i blocchi di primo livello: fra una
 * sezione e l'altra restava una striscia del fondo pagina.
 *
 * La regola è ristretta ai blocchi `alignfull` di proposito: azzerare il
 * margine su tutti i figli toglierebbe lo spazio anche fra i paragrafi di un
 * articolo, dove invece serve.
 */
.entry-content > .alignfull {
	margin-block-start: 0;
}