/* =============================================================
   BIO LOGHI — Formazione + Collaborazioni
   Pattern originale 2 colonne, tokenizzato sul DS
   ============================================================= */

.bg-bio-loghi {
	display: flex;
	flex-direction: row;
	gap: var(--gap-cols);
	background: var(--bg);
	padding-block: var(--pad-section);
}

/* Colonne 50/50 */
.bg-bio-loghi__col {
	flex: 0 0 calc(50% - var(--gap-cols) / 2);
	width: calc(50% - var(--gap-cols) / 2);
	display: flex;
	flex-direction: column;
	gap: var(--rhythm-l);
}

/* Titolo colonna — h2 operativo DS (TYPE_SCALE .h2-ops Manrope) */
.bg-bio-loghi__title {
	font-family: var(--f-sans);
	font-size: clamp(1.5rem, 2.8vw, 2.2rem);
	font-weight: 500;
	line-height: 1.15;
	letter-spacing: var(--track-tight);
	color: var(--text);
	margin: 0;
	padding: 0;
}

/* Riga loghi — gap orizzontale ampio, verticale piccolo su wrap */
.bg-bio-loghi__row {
	display: flex;
	flex-direction: row;
	align-items: center;
	flex-wrap: wrap;
	row-gap: var(--gap-figure);
	column-gap: var(--gap-cols);
}

/* Loghi */
.bg-bio-loghi__item {
	display: flex;
	align-items: center;
}

/* MOTION — piano claude/motion/prompt/06-bio.md, grado Pieno.
   I loghi in pagina sono 7 (2 formazione + 5 collaborazioni): sotto la soglia
   di 8, quindi NESSUN layer ambient (niente deriva, niente marquee). Resta il
   solo ingresso a cascata, che calcola reveal.js sugli .bg-bio-loghi__item.

   Nessuno stato di hover: i loghi stanno a piena opacità e non reagiscono al
   passaggio del mouse (scelta di Brando, 2026-08-01). Non sono elementi
   interattivi — non portano da nessuna parte — e un hover su un marchio non
   cliccabile promette un'azione che non esiste. */
.bg-bio-loghi__item img {
	display: block;
	width: auto;
	max-height: 48px;
	max-width: 160px;
	object-fit: contain;
}

/* SVG senza intrinsic sizing: forzo height esplicito */
.bg-bio-loghi__item img[src$=".svg"] {
	height: 48px;
}

/* Panini Cultura SVG quadrato (56×56): override per parità visiva — più grande
   per compensare l'area minore rispetto ai loghi orizzontali */
.bg-bio-loghi__item img[src*="panini-cultura"] {
	height: 96px;
	width: 96px;
	max-height: 96px;
	max-width: 96px;
}

/* Accessibilità: questo foglio non dichiara più nessuna transizione propria —
   le traslazioni dell'ingresso le annulla il blocco reduced-motion di
   reveal.css, che copre .reveal e i suoi tre pesi. */

/* Mobile */
@media (max-width: 768px) {
	.bg-bio-loghi {
		flex-direction: column;
		gap: var(--gap-section);
	}

	.bg-bio-loghi__col {
		flex: 0 0 100%;
		width: 100%;
	}

	.bg-bio-loghi__row {
		gap: var(--gap-block);
	}

	.bg-bio-loghi__item img {
		max-height: 40px;
		max-width: 140px;
	}
}