/* ==========================================================================
   HOME — «ultime schede imprese». 21/9/2026, GRIGLIA FERMA DAL 23/9/2026.
   🚨 24/9/2026 — LA GRIGLIA FERMA È BOCCIATA (voce 187, Gabriele guardando
   il vivo): «a tutta riga, metti di nuovo il carosello fluido». Torna il
   nastro, largo quanto la finestra (§2), con carte verticali e dati
   centrati (§3). Quello che segue fino a §1 è la storia del 21-23/9.


   Gabriele, 20/9: «oltre gli ultimi annunci, vorrei che anche le imprese
   avessero le ultime schede imprese». Gabriele, 23/9 (voce 182): il
   carosello degli annunci sopra diventa una scheda alla volta — e con lui
   anche QUESTO nastro sarebbe rimasto l'unico carosello della pagina, due
   fasce vicine con lo stesso componente che scorre. Qui non si scorre più:
   **griglia ferma**, sempre le 6 schede più recenti in vista, senza gesti.

   Accodato da `templates/cerca.php` SOLO se questo file esiste, DOPO
   `radar-cerca`: token e componenti condivisi (`.fascia`, `.fascia__interno`,
   `.titoletto`, `.sommario`) arrivano già vestiti da `radar.css` e
   `ossatura.css`, e qui non si ridichiara niente di quello.

   ⚠ La carta (`.imprese-riga`) è la stessa del 21/9, sorella magra della
   scheda degli annunci: stesso raggio (ma più piccolo, §3 sotto), stesso
   bordo, stessa superficie, stessa scala di testo. RIPRESA IL 23/9/2026
   (rimisura dei segnaposto, `_prove/segnaposto/RIMISURA.md`, difetto D4):
   il monogramma del 21/9 esce, torna un riquadro — ma non il muro giallo
   del 20/9. È la foto vera se c'è, sennò `radar_segnaposto()` (voce 181,
   «Foto in arrivo», con disegno e alt), compatto quanto il monogramma che
   sostituisce (§3, `.imprese-riga__foto`).
   ========================================================================== */

/* Chiara e compatta come la vetrina degli annunci, che le sta subito sopra:
   due fasce di seguito con due respiri diversi si leggono come un errore.
   Due classi (`.imprese-vetrina__fascia.fascia`) per vincere sul padding
   condiviso senza toccarlo.

   👉 23/9/2026 — QUI ADESSO C'È UNO SFONDO SUO, ED È VOLUTO. Il 21/9 non ce
   n'era uno («due strisce vestite uguali si leggono come una coppia», la
   nota che stava qui prima), perché sopra e sotto scorrevano allo stesso
   modo: due nastri uguali dovevano ALMENO avere colori diversi per non
   sembrare lo stesso componente ripetuto. Ora sopra non scorre più (è una
   scheda alla volta) e sotto non scorre più (è una griglia ferma): sono
   già due cose diverse a vedersi, ma un fondo diverso lo rende inequivocabile
   anche a chi scorre in fretta. La tinta è `color-mix()` dal marchio, non un
   nuovo colore inventato: stesso principio delle sei tinte del monogramma
   qui sotto (§ Le sei tinte). */
.imprese-vetrina__fascia.fascia {
	padding-block: clamp(28px, 4vw, 44px);
	background: color-mix(in srgb, var(--marchio) 6%, var(--fondo));
}

/* ── 1 · La testa, centrata come tutto il resto della home ───────────────── */

.imprese-vetrina__testa {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: .5rem;
	max-width: 46rem;
	margin-inline: auto;
	margin-bottom: clamp(1.25rem, 3vw, 2rem);
	text-align: center;
}

.imprese-vetrina__titolo-sezione { margin-bottom: 6px; }

.imprese-vetrina__sommario {
	margin-bottom: 0;
	font-size: 1rem;
}

.imprese-vetrina__tutti {
	margin-top: .25rem;
	font-weight: 600;
	font-size: .9375rem;
	color: var(--marchio);
	text-decoration: none;
	white-space: nowrap;
}

.imprese-vetrina__tutti:hover,
.imprese-vetrina__tutti:focus-visible { text-decoration: underline; }

.imprese-vetrina__tutti:focus-visible {
	outline: 2px solid var(--azione);
	outline-offset: 3px;
	border-radius: 3px;
}

/* ── 2 · Il nastro, a tutta riga ─────────────────────────────────────────── */

/* 🚨 24/9/2026 — BOCCIATA LA GRIGLIA FERMA (voce 187): «a tutta riga, metti
   di nuovo il carosello fluido, senza lasciare tutto quello spazio di
   margine». Il nastro è figlio diretto della sezione, fuori da `.fascia`:
   nessun padding laterale lo stringe, va da bordo a bordo della finestra.
   Il moto, il taglio (`.nastro { overflow: hidden }`) e la pista
   (`.nastro__pista`, flex senza a capo, `touch-action: pan-y`) sono di
   `ossatura.css` e `carosello-nastro.js`: qui solo misure e colore.

   Il fondo della fascia passa alla sezione intera, così titolo e nastro
   stanno sulla stessa tinta. */
.imprese-vetrina {
	background: color-mix(in srgb, var(--marchio) 6%, var(--fondo));
	padding-block-end: clamp(28px, 4vw, 44px);
}

.imprese-vetrina__fascia.fascia {
	background: none;
	padding-block-end: 0;
}

.imprese-nastro {
	width: 100%;
	/* Un filo di respiro sopra e sotto: l'ombra al passaggio del mouse non
	   deve finire tagliata da `overflow: hidden`. */
	padding-block: 6px 10px;
}

/* Lo spazio fra le carte è un margine sulla voce, non un `gap` sulla pista:
   `carosello-nastro.js` misura un giro come distanza fra la prima voce e la
   sua prima copia, e con il margine a destra di OGNI voce (anche l'ultima)
   quella distanza è sempre un multiplo esatto — il rientro non salta. */
.imprese-nastro__voce {
	width: 17.5rem;
	max-width: none;
	margin: 0 16px 0 0;
	padding: 0;
}

/* ── 3 · La carta: l'area immagine larga quanto la carta, i dati centrati ── */

.imprese-carta {
	display: flex;
	flex-direction: column;
	height: 100%;
	overflow: hidden;
	border: 1px solid var(--bordo);
	border-radius: var(--raggio-grande, 18px);
	background: var(--superficie);
	color: inherit;
	text-decoration: none;
	transition: border-color .15s ease, box-shadow .15s ease;
}

.imprese-carta:hover {
	border-color: var(--marchio);
	box-shadow: var(--ombra);
}

.imprese-carta:focus-visible {
	outline: 2px solid var(--azione);
	outline-offset: -2px;
}

@media (prefers-reduced-motion: reduce) {
	.imprese-carta { transition: none; }
}

/* 16/10: più bassa del 4:3 dell'elenco, perché qui le carte sono una fila
   sola che scorre e non una griglia da leggere; il segno resta grande. */
.imprese-carta__foto {
	display: block;
	aspect-ratio: 16 / 10;
	overflow: hidden;
	background: var(--superficie-alt);
}

.imprese-carta__img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/* Il segnaposto è quello dell'elenco (`segnaposto.css`, contesto `carta`):
   qui solo il segno più grande, perché l'area adesso è larga quanto la
   carta e un disegno da 44px ci si perdeva dentro. */
.imprese-carta__foto .segnaposto--carta {
	gap: .5rem;
}

.imprese-carta__foto .segnaposto--carta .segnaposto__disegno {
	width: 4.5rem;
	height: 4.5rem;
}

.imprese-carta__foto .segnaposto--carta .segnaposto__testo {
	font-size: .8125rem;
}

.imprese-carta__corpo {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 4px;
	padding: 14px 16px 18px;
	text-align: center;
	min-width: 0;
}

.imprese-carta__mestiere {
	font-size: .75rem;
	font-weight: 600;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: var(--marchio);
}

.imprese-carta__nome {
	max-width: 100%;
	font: 700 1.0625rem/1.25 var(--font-titolo);
	letter-spacing: -.01em;
	color: var(--testo);
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.imprese-carta__luogo {
	font-size: .9375rem;
	color: var(--testo-2);
}

/* ── 4 · Sul telefono la carta si stringe, la fila resta una fila ────────── */

@media (max-width: 40rem) {
	.imprese-nastro__voce {
		width: 15rem;
		margin-right: 12px;
	}

	.imprese-carta__foto .segnaposto--carta .segnaposto__disegno {
		width: 4rem;
		height: 4rem;
	}
}
