/*
 * Griglie al computer (kit desktop-griglie-8-10, CEO 8/10: «da pc incolonnare le sezioni a due colonne
 * è spreco di spazio, si può arrivare a quattro colonne»).
 *
 * Solo da 1200 px: telefono e tablet restano come sono (nessuna regola sotto 1200).
 * Si carica dopo i fogli delle pagine (inc/desktop-griglie.php) e tocca solo le pagine nuove:
 * /per-le-aziende/ (.tbp-az), servizi e carrello (#tbp-car, anche le pagine di vacanze-mestieri-8-10),
 * Comuni ed enti (.tbp-ep), /il-progetto/ (#tbp-il-progetto), /faq/ (.tbp-faq-pagina), /hobbisti-tobepolo/ (#tbp-hobbisti).
 *
 * Regole:
 * - contenuto largo 1280 px su tutte le pagine (prima 1116-1200, diverso da pagina a pagina);
 * - righe di schede piene: il numero di colonne è quello che divide le schede, altrimenti l'ultima riga va al centro;
 * - testi lunghi entro 65 caratteri per riga.
 */

@media (min-width: 1200px) {

	/* ---------- Larghezza comune ----------
	 * 1280 px di contenuto dove c'è posto; mai sotto la bolla di AI Colombo (fissa in basso a destra, 113 px + 16 px dal bordo):
	 * il contenuto resta 141 px dentro ogni lato. 1440 px: 1160 come oggi; 1512 (MacBook Pro 14): 1230; da 1562: 1280. */
	:root { --tbp-griglie-larga: clamp(1160px, calc(100vw - 282px), 1280px); }
	html body .tbp-az { max-width: calc(var(--tbp-griglie-larga) + 64px); }                    /* padding 32 */
	html body #tbp-car.tbp-car { max-width: calc(var(--tbp-griglie-larga) + 48px); }           /* padding 24 */
	.tbp-ep .tbp-ep-wrap { max-width: calc(var(--tbp-griglie-larga) + 64px); }                 /* padding 32 */
	#tbp-il-progetto { --pr-max: max(1200px, var(--tbp-griglie-larga)); }                    /* era 1200: mai più stretta */
	html body .tbp-info-page.tbp-faq-pagina > .container { max-width: var(--tbp-griglie-larga); }
	html body #tbp-hobbisti.tbp-volti-pagina { width: min(calc(var(--tbp-griglie-larga) + 48px), 100%); }   /* padding 24 */

	/* ---------- Per le aziende ---------- */
	/* «Ci pensiamo noi»: 5 voci su una riga (prima 3 + 2), icona sopra il testo. */
	html body .tbp-az .tbp-az__noi-lista { grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 32px 24px; }
	html body .tbp-az .tbp-az__noi-lista li { flex-direction: column; gap: 12px; }
	/* Righe di schede alla stessa altezza, prezzo in fondo (le offerte lo fanno già). */
	html body .tbp-az .tbp-az__offerte > li { height: 100%; }

	/* ---------- Servizi e carrello (Comuni, Artigiani e Hobbisti, vacanze) ---------- */
	/* Percorsi dei Comuni: 3 colonne, l'ultima riga al centro se non è piena (5 = 3 + 2 centrate). */
	html body #tbp-car ul.tbp-car__percorsi-lista { grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 16px; }
	html body #tbp-car ul.tbp-car__percorsi-lista > li { grid-column: span 2; }
	html body #tbp-car ul.tbp-car__percorsi-lista > li:nth-child(3n + 1):nth-last-child(2) { grid-column: 2 / span 2; }
	html body #tbp-car ul.tbp-car__percorsi-lista > li:nth-child(3n + 1):last-child { grid-column: 3 / span 2; }

	/* Schede con prezzo accanto al riepilogo (colonna di 752-872 px): 3 colonne larghe come i pacchetti (240-280 px).
	 * 6 voci = 2 righe piene; 8 voci = 3 + 3 + 2 al centro; 5 = 3 + 2 al centro.
	 * 4 voci (programmi Territorio, se ne sceglie uno) restano 2 x 2: 4 in fila stringerebbe prezzi e bottoni. */
	html body #tbp-car ul.tbp-car__voci.tbp-car__voci--multi:not(.tbp-car__voci--n1):not(.tbp-car__voci--n2):not(.tbp-car__voci--n4) {
		grid-template-columns: repeat(6, minmax(0, 1fr));
	}
	html body #tbp-car ul.tbp-car__voci--multi:not(.tbp-car__voci--n1):not(.tbp-car__voci--n2):not(.tbp-car__voci--n4) > li { grid-column: span 2; }
	html body #tbp-car ul.tbp-car__voci--multi:not(.tbp-car__voci--n1):not(.tbp-car__voci--n2):not(.tbp-car__voci--n4) > li:nth-child(3n + 1):nth-last-child(2) { grid-column: 2 / span 2; }
	html body #tbp-car ul.tbp-car__voci--multi:not(.tbp-car__voci--n1):not(.tbp-car__voci--n2):not(.tbp-car__voci--n4) > li:nth-child(3n + 1):last-child { grid-column: 3 / span 2; }

	/* «Pronti per lavorare con la PA» e domande: righe entro 65 caratteri. */
	html body #tbp-car .tbp-car__info :is(p, dd, details > div) { max-width: 65ch; }

	/* ---------- Comuni ed enti ---------- */
	/* Raccolta: 3 enti (uno largo) stanno su una riga da 4 colonne invece di 2 + 1 da solo. Vale anche per 7. */
	.tbp-ep .tbp-ep-griglia:has(> .tbp-ep-tessera--larga:first-child):is(:has(> :nth-child(3):last-child), :has(> :nth-child(7):last-child)) {
		grid-template-columns: repeat(4, minmax(0, 1fr));
	}
	/* Scheda del Comune: tradizioni in 3 colonne come «Cosa si impara qui» (3 voci = una riga, prima 2 + 1). */
	.tbp-ep .tbp-ep-trad { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 28px 20px; }
	/* Foto e titoli allineati in riga anche se le didascalie hanno lunghezze diverse. */
	.tbp-ep .tbp-ep-trad > .tbp-ep-trad__voce { grid-row: span 2; grid-template-rows: subgrid; row-gap: 14px; }
	.tbp-ep .tbp-ep-trad__voce figure img { height: 180px !important; }
	/* 2 o 4 tradizioni: 2 colonne come prima (righe piene). */
	.tbp-ep .tbp-ep-trad:has(> :nth-child(2):last-child),
	.tbp-ep .tbp-ep-trad:has(> :nth-child(4):last-child) { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.tbp-ep .tbp-ep-trad:has(> :nth-child(2):last-child) .tbp-ep-trad__voce figure img,
	.tbp-ep .tbp-ep-trad:has(> :nth-child(4):last-child) .tbp-ep-trad__voce figure img { height: 220px !important; }
	.tbp-ep .tbp-ep-apertura :is(.tbp-ep-intro, .tbp-ep-racconto p) { max-width: 65ch; }

	/* ---------- Hobbisti ToBePolo ---------- */
	/* Testo della pagina: titolo della sezione a sinistra (1/3), testo a destra (2/3) entro 65 caratteri,
	 * come le domande frequenti di /per-le-aziende/. Prima una colonna di 760 px con mezza pagina vuota. */
	html body #tbp-hobbisti .tbp-volti-pagina__testo { max-width: none; }
	html body #tbp-hobbisti .tbp-guide { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 2fr); column-gap: 48px; }
	html body #tbp-hobbisti .tbp-guide > * { grid-column: 2; max-width: 65ch; }
	html body #tbp-hobbisti .tbp-guide > section { display: contents; }
	html body #tbp-hobbisti .tbp-guide > section > * { grid-column: 2; max-width: 65ch; }
	html body #tbp-hobbisti .tbp-guide > section > h2 { grid-column: 1; margin: 36px 0 0 !important; }
	html body #tbp-hobbisti .tbp-guide > section > h2 + * { margin-top: 38px; }
	/* Stato vuoto: bottone largo quanto il suo testo (prima 1116 px). */
	html body #tbp-hobbisti .tbp-empty .tbp-dir-card__cta { display: inline-flex !important; width: auto !important; min-width: 0 !important; padding-inline: 24px !important; }
}