/* ==========================================================================
   PARALLELO DI NATALE
   Struttura: 1. Token  2. Base  3. Componenti  4. Sezioni (desktop)  5. Mobile
   Prefisso classi: pn-  (BEM: blocco__elemento--variante)

   SCALA PROPORZIONALE
   Tutte le misure sono quelle dell'XD espresse in "u":
     desktop (≥ 992px)  1u = 100vw / 1920   → artboard desktop 1920
     mobile  (< 992px)  1u = 100vw / 430    → artboard mobile 430 (max 1.6px)
   Esempio: un testo da 22px in XD = calc(22 * var(--u)).
   In questo modo testi, a capo e distanze restano identici alle grafiche
   a qualsiasi larghezza dello schermo.
   ========================================================================== */

/* 1. TOKEN ================================================================ */
:root {
	--u: calc(100vw / 1920);

	/* Colori */
	--pn-cream: #F6F0E5;
	--pn-blue: #25519D;
	--pn-ink: #121211;
	--pn-grey: #707070;
	--pn-white: #FFFFFF;

	/* Font */
	--pn-font: "Bebas Neue Pro", "Bebas Neue", "Oswald", sans-serif;
	--pn-font-ui: "Inter", system-ui, sans-serif; /* pulsanti */
	--pn-fw-regular: 500; /* Middle */
	--pn-fw-bold: 700;
	--pn-ls: 0.02em;      /* 0.44px su 22px */

	/* Linee */
	--pn-line: 1px solid var(--pn-grey);
	--pn-line-dotted: 1px dotted var(--pn-grey);
}

@media (max-width: 991px) {
	:root { --u: min(calc(100vw / 430), 1.6px); }
}

/* 2. BASE ================================================================= */
body {
	font-family: var(--pn-font);
	font-weight: var(--pn-fw-regular);
	font-size: calc(22 * var(--u));
	line-height: calc(28 * var(--u));
	letter-spacing: var(--pn-ls);
	color: var(--pn-ink);
	background-color: var(--pn-cream);
}

body h1, body h2, body h3, body h4 {
	font-family: var(--pn-font);
	font-weight: var(--pn-fw-bold);
	letter-spacing: 0;
	text-transform: uppercase;
}

body strong, body b { font-weight: var(--pn-fw-bold); }

.pn-page a:focus-visible,
.pn-page button:focus-visible {
	outline: 2px solid var(--pn-blue) !important;
	outline-offset: 3px;
}

::selection { color: var(--pn-white); background: var(--pn-blue); }

/* 3. COMPONENTI =========================================================== */

.pn-section {
	width: 100%;
	padding-inline: calc(140 * var(--u));
}
.pn-container {
	width: 100%;
	max-width: none;
	margin-inline: auto;
}
.pn-section--white { background-color: var(--pn-white); }
.pn-section--cream { background-color: var(--pn-cream); }

/* Titoli di sezione */
.pn-title {
	font-size: calc(60 * var(--u));
	line-height: calc(72 * var(--u));
	color: var(--pn-blue);
	margin-bottom: calc(30 * var(--u));
}
.pn-title--center {
	align-self: stretch;
	width: 100%;
	text-align: center;
	font-size: calc(40 * var(--u));
	line-height: calc(48 * var(--u));
	margin-bottom: calc(50 * var(--u));
}

.pn-text p { margin: 0; }

/* CTA (XD desktop: quadrato 47×49 + 5 + etichetta alta 49, testo Inter 24/29)
   L'etichetta è il pulsante, il quadrato con la freccia è il suo ::before. */
.pn-cta.brxe-button {
	--cta-h: calc(49 * var(--u));
	--cta-icon: calc(47 * var(--u));
	--cta-gap: calc(5 * var(--u));
	position: relative;
	display: inline-flex;
	align-items: center;
	min-height: 0;
	height: var(--cta-h);
	margin-left: calc(var(--cta-icon) + var(--cta-gap));
	padding: 0 calc(20 * var(--u));
	border: 1px solid var(--pn-blue);
	border-radius: 0;
	background-color: var(--pn-white);
	font-family: var(--pn-font-ui);
	font-weight: 400;
	font-size: calc(24 * var(--u));
	line-height: calc(29 * var(--u));
	letter-spacing: 0;
	text-transform: uppercase;
	white-space: nowrap;
	color: var(--pn-blue);
	transition: background-color .25s ease, color .25s ease;
}
.pn-cta.brxe-button::before {
	content: "";
	position: absolute;
	top: -1px;
	bottom: -1px;
	right: calc(100% + 1px + var(--cta-gap));
	width: var(--cta-icon);
	background-color: var(--pn-blue);
	/* freccia ↳ 22×24 a 13/12px dal bordo, tratto bianco 1.5 */
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 22 24' fill='none' stroke='%23fff' stroke-width='1.5'%3E%3Cpath d='M1.5 0v17.5h19'/%3E%3Cpath d='M14.5 11.5l6 6-6 6'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: calc(13 * var(--u)) calc(12 * var(--u));
	background-size: calc(22 * var(--u)) calc(24 * var(--u));
	transition: transform .25s ease;
}
.pn-cta.brxe-button:hover { background-color: var(--pn-blue); color: var(--pn-white); }
.pn-cta.brxe-button:hover::before { transform: translateX(-3px); }

/* 4. SEZIONI – DESKTOP (valori XD 1920) =================================== */

/* --- Hero: 1920 × 1142, illustrazione 1780 × 1001 a x0 y141 --- */
.pn-hero {
	position: relative;
	display: grid;
	grid-template-columns: auto 1fr;
	align-items: start;
	height: calc(1142 * var(--u));
	padding: 0 calc(140 * var(--u));
	/* !important: Bricks stampa lo sfondo con selettore ID e size "cover" */
	background-size: calc(1780 * var(--u)) auto !important;
	background-position: 0 calc(141 * var(--u)) !important;
	background-repeat: no-repeat !important;
}
.pn-hero__logo {
	display: block;
	width: calc(168.7 * var(--u));
	height: calc(169.8 * var(--u));
}
.pn-hero__content {
	justify-self: end;
	align-items: flex-end;
	text-align: right;
	padding-top: calc(42 * var(--u));
}
.pn-hero__title {
	font-size: calc(140 * var(--u));
	line-height: calc(168 * var(--u));
	color: var(--pn-ink);
}
.pn-hero__date {
	margin: calc(-11 * var(--u)) 0 0;
	font-size: calc(70 * var(--u));
	line-height: calc(84 * var(--u));
	font-weight: var(--pn-fw-bold);
	letter-spacing: 0;
	text-transform: uppercase;
}
.pn-hero__subtitle {
	margin: 0;
	font-size: calc(50 * var(--u));
	line-height: calc(60 * var(--u));
	letter-spacing: 0;
}
.pn-hero__content .pn-cta { margin-top: calc(50 * var(--u)); }

/* --- Storia ---
   Griglia 968 | 536 | resto. La polaroid (536 × 1217) è ancorata alla fascia
   (1920 × 800): inizia 375 sopra e finisce 42 sotto, come nell'XD. */
.pn-storia {
	margin-top: calc(-16 * var(--u)); /* il titolo è a y1126, l'illustrazione finisce a y1142 */
	padding: 0;
}
.pn-storia__grid {
	display: grid;
	grid-template-columns: calc(968 * var(--u)) calc(536 * var(--u)) 1fr;
	align-items: start;
}
.pn-storia__intro {
	grid-column: 1;
	grid-row: 1;
	padding: 0 calc(54 * var(--u)) calc(50 * var(--u)) calc(140 * var(--u));
}
.pn-storia__intro .pn-title { white-space: nowrap; } /* a capo forzato come da XD */
.pn-storia__intro .pn-text,
.pn-storia__outro .pn-text { width: calc(674 * var(--u)); }
.pn-storia__band {
	grid-column: 1 / -1;
	grid-row: 2;
	width: 100%;
	height: calc(800 * var(--u));
	object-fit: cover;
	object-position: 0 0;
	display: block;
}
.pn-storia__polaroid {
	grid-column: 2;
	grid-row: 2;
	position: relative;
	z-index: 1;
	width: 100%;
	height: calc(1217 * var(--u));
	margin-top: calc(-375 * var(--u));
	display: block;
}
.pn-storia__photos { display: none; }
.pn-storia__outro {
	grid-column: 1;
	grid-row: 3;
	padding: calc(8 * var(--u)) calc(54 * var(--u)) 0 calc(140 * var(--u));
	gap: calc(40 * var(--u));
}
/* Il quadrato della CTA è allineato al testo (x140), come la CTA della hero al bordo destro */
.pn-storia__outro .pn-cta { margin-left: calc(var(--cta-icon) + var(--cta-gap)); }

/* --- Programma --- */
.pn-programma {
	padding-top: calc(100 * var(--u));
	padding-bottom: calc(123 * var(--u));
}
.pn-programma__grid {
	display: grid;
	grid-template-columns: repeat(3, calc(476 * var(--u)));
	justify-content: space-between;
	row-gap: calc(60 * var(--u));
	align-items: start;
}
.pn-day { width: 100%; }
.pn-day__header {
	background-color: var(--pn-blue);
	color: var(--pn-white);
	padding: calc(20 * var(--u));
}
.pn-day__title {
	font-size: calc(50 * var(--u));
	line-height: calc(57 * var(--u));
	font-weight: var(--pn-fw-regular) !important;
	color: inherit;
}
.pn-day__title strong { font-weight: var(--pn-fw-bold); }
.pn-day__subtitle { display: none; } /* campo facoltativo: nell'XD desktop non c'è */
.pn-day__list {
	width: 100%;
	padding: 0 calc(20 * var(--u));
	background-color: var(--pn-white);
}
.pn-event {
	width: 100%;
	padding: calc(20 * var(--u)) 0 calc(20 * var(--u) - 1px);
	border-bottom: var(--pn-line-dotted);
	text-transform: uppercase;
}
.pn-event:last-child { border-bottom: 0; padding-bottom: calc(20 * var(--u)); }
.pn-event__time {
	display: block;
	font-size: calc(20 * var(--u));
	line-height: calc(24 * var(--u));
	font-weight: var(--pn-fw-bold);
	letter-spacing: 0;
}
.pn-event__name {
	display: block;
	margin-top: calc(7 * var(--u));
	font-size: calc(22 * var(--u));
	line-height: calc(26 * var(--u));
}
/* Nota: dentro la card dell'ultimo giorno, 27 sotto la card */
.pn-programma__note { display: none; }
.pn-day:last-child .pn-programma__note {
	display: block;
	margin-top: calc(27 * var(--u));
	padding: calc(15 * var(--u)) calc(20 * var(--u));
	background-color: var(--pn-white);
	font-size: calc(17 * var(--u));
	line-height: calc(21 * var(--u));
	text-transform: uppercase;
}

/* --- Come raggiungerci --- */
.pn-route { padding-bottom: calc(56 * var(--u)); }
.pn-route__grid {
	display: grid;
	grid-template-columns: calc(674 * var(--u)) calc(912 * var(--u));
	justify-content: space-between;
	align-items: start;
}
.pn-route__item {
	width: 100%;
	padding: calc(20 * var(--u)) 0;
	border-bottom: var(--pn-line);
	font-size: calc(20 * var(--u));
	line-height: calc(25 * var(--u));
	text-transform: uppercase;
}
.pn-route__item:first-child { padding-top: 0; }
.pn-route__title {
	display: block;
	line-height: calc(24 * var(--u));
	font-weight: var(--pn-fw-bold);
	letter-spacing: 0;
}
.pn-route__text { display: block; margin-top: calc(8 * var(--u)); }
.pn-route__map {
	width: 100%;
	height: calc(494 * var(--u)) !important; /* Bricks imposta un'altezza propria */
}

/* Riquadro del marker (Bricks infobox): titolo, indirizzo, link a Google Maps */
.pn-route__map .infoBox {
	padding: 16px 18px 14px !important;
	background: var(--pn-white);
	box-shadow: 0 6px 24px rgba(18, 18, 17, .18);
	font-family: var(--pn-font);
	letter-spacing: 0.02em;
	color: var(--pn-ink);
}
.pn-route__map .infoBox .title {
	margin: 0 24px 4px 0;
	font-size: 20px;
	line-height: 1.15;
	color: var(--pn-blue);
	text-transform: uppercase;
}
.pn-route__map .infoBox .subtitle {
	margin: 0 0 12px;
	font-size: 15px;
	line-height: 1.3;
	text-transform: uppercase;
}
.pn-route__map .infoBox .content {
	margin: 0;
	padding: 0;
	list-style: none;
}
.pn-map-link {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-family: var(--pn-font-ui);
	font-size: 13px;
	line-height: 1;
	letter-spacing: 0;
	text-transform: uppercase;
	color: var(--pn-blue);
	text-decoration: none;
}
.pn-map-link::after { content: "↗"; font-size: 14px; }
.pn-map-link:hover { text-decoration: underline; }

/* --- Sponsor --- */
.pn-sponsors {
	padding-block: calc(64 * var(--u));
	overflow: hidden;
}
.pn-sponsors__grid {
	display: grid;
	grid-template-columns: repeat(6, calc(250 * var(--u)));
	justify-content: space-between;
}
.pn-sponsor {
	width: calc(250 * var(--u));
	height: calc(150 * var(--u));
	border: var(--pn-line);
	display: flex;
	align-items: center;
	justify-content: center;
	padding: calc(20 * var(--u));
	background-color: var(--pn-white);
}
.pn-sponsor img {
	max-width: 100%;
	max-height: 100%;
	width: auto;
	height: auto;
	object-fit: contain;
}

/* --- Footer --- */
.pn-footer {
	padding: calc(46 * var(--u)) calc(140 * var(--u)) calc(41 * var(--u));
	background-color: var(--pn-cream);
	text-align: center;
	align-items: center;
}
.pn-footer__logo {
	width: calc(403 * var(--u));
	height: calc(95 * var(--u));
}
.pn-footer__legal {
	margin-top: calc(44 * var(--u));
	font-size: calc(16 * var(--u));
	line-height: calc(19 * var(--u));
	text-transform: uppercase;
}
.pn-footer__legal p { margin: 0; }
.pn-footer__legal a { color: inherit; text-decoration: none; }
.pn-footer__legal a:hover { color: var(--pn-blue); }
.pn-footer__powered {
	margin-top: calc(21 * var(--u));
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: center;
	gap: calc(8.3 * var(--u));
	font-size: calc(14 * var(--u));
	line-height: calc(17 * var(--u));
	letter-spacing: 0;
}
.pn-footer__powered > span {
	width: calc(50 * var(--u)); /* riquadro testo XD: 50 × 17, simbolo 8.3 dopo */
	text-align: left;
	white-space: nowrap;
}
.pn-footer__powered img {
	width: calc(23.78 * var(--u));
	height: calc(20 * var(--u));
	display: block;
}

/* 5. MOBILE (< 992px, valori XD 430) ====================================== */
@media (max-width: 991px) {
	.pn-section { padding-inline: calc(36 * var(--u)); }

	.pn-title {
		font-size: calc(40 * var(--u));
		line-height: calc(48 * var(--u));
		margin-bottom: calc(30 * var(--u));
	}

	/* CTA: quadrato 39×40 + 5 + etichetta alta 40, testo Inter 16/20 */
	.pn-cta.brxe-button {
		--cta-h: calc(40 * var(--u));
		--cta-icon: calc(39 * var(--u));
		font-size: calc(16 * var(--u));
		line-height: calc(20 * var(--u));
	}
	.pn-cta.brxe-button::before {
		background-position: center;
		background-size: calc(18 * var(--u)) calc(19.6 * var(--u));
	}

	/* Hero 430 × 900 */
	.pn-hero {
		display: flex;
		flex-direction: column;
		align-items: center;
		height: calc(900 * var(--u));
		padding: 0 calc(36 * var(--u));
		background-size: 100% auto !important;
		background-position: center top !important;
	}
	.pn-hero__logo {
		width: calc(107.1 * var(--u));
		height: calc(107.8 * var(--u));
		margin-inline: auto;
	}
	.pn-hero__content {
		align-self: center;
		align-items: center;
		text-align: center;
		padding-top: calc(73 * var(--u));
	}
	.pn-hero__title { font-size: calc(55 * var(--u)); line-height: calc(66 * var(--u)); }
	.pn-hero__date { margin-top: calc(-6 * var(--u)); font-size: calc(35 * var(--u)); line-height: calc(42 * var(--u)); }
	.pn-hero__subtitle { margin-top: calc(18.6 * var(--u)); font-size: calc(25 * var(--u)); line-height: calc(30 * var(--u)); }
	.pn-hero__content .pn-cta { margin-top: calc(43 * var(--u)); }

	/* Storia */
	.pn-storia { margin-top: 0; padding-top: calc(53 * var(--u)); }
	.pn-storia__grid { grid-template-columns: 1fr; }
	.pn-storia__intro,
	.pn-storia__band,
	.pn-storia__photos,
	.pn-storia__outro { grid-column: 1; grid-row: auto; }
	.pn-storia__intro { padding: 0 calc(36 * var(--u)); }
	.pn-storia__intro .pn-title { white-space: nowrap; }
	.pn-storia__intro .pn-text,
	.pn-storia__outro .pn-text { width: calc(358 * var(--u)); }
	.pn-storia__intro .pn-text p + p { margin-top: calc(28 * var(--u)); }
	.pn-storia__polaroid { display: none; }
	.pn-storia__band {
		height: calc(242 * var(--u));
		margin-top: calc(45 * var(--u));
	}
	/* Colonna bianca 358 a x36, foto 344 × 252, pausa tra le foto 29 */
	.pn-storia__photos {
		display: flex;
		flex-direction: column;
		position: relative;
		z-index: 1;
		width: calc(358 * var(--u));
		margin: calc(-28 * var(--u)) calc(36 * var(--u)) 0;
		gap: calc(7 * var(--u));
		padding: calc(7 * var(--u));
		background-color: var(--pn-white);
	}
	.pn-storia__photo {
		width: calc(344 * var(--u));
		height: calc(252 * var(--u));
		object-fit: cover;
		display: block;
	}
	.pn-storia__outro {
		padding: calc(40 * var(--u)) calc(36 * var(--u)) 0;
		gap: calc(30.6 * var(--u));
	}
	.pn-storia__outro .pn-cta { margin-left: calc(var(--cta-icon) + var(--cta-gap)); }

	/* Programma: giorno sopra la card, titolo della giornata in barra blu */
	.pn-programma {
		padding-top: calc(81 * var(--u));
		padding-bottom: calc(60 * var(--u));
	}
	.pn-programma__grid { grid-template-columns: 1fr; row-gap: calc(60 * var(--u)); }
	/* 20 tra il giorno e la card, come la distanza titolo → barra nell'XD mobile */
	.pn-day__header { background: none; color: var(--pn-ink); padding: 0; margin-bottom: calc(20 * var(--u)); }
	.pn-day__title { font-size: calc(40 * var(--u)); line-height: calc(48 * var(--u)); }
	.pn-day__subtitle:empty { display: none !important; }
	.pn-day__subtitle {
		display: block;
		width: 100%;
		margin-top: calc(20 * var(--u));
		padding: calc(10 * var(--u)) calc(20 * var(--u)) calc(9 * var(--u));
		background-color: var(--pn-blue);
		color: var(--pn-white);
		font-size: calc(22 * var(--u));
		line-height: calc(26 * var(--u));
		font-weight: var(--pn-fw-bold);
		text-transform: uppercase;
	}

	/* Come raggiungerci (non presente nell'XD mobile: impilato) */
	.pn-route__grid { grid-template-columns: 1fr; row-gap: calc(40 * var(--u)); }
	.pn-route__map { height: calc(300 * var(--u)) !important; }

	/* Sponsor: carosello 250 × 150, gap 20, logo attivo sempre al centro */
	.pn-sponsors { padding-inline: 0; }
	.pn-sponsors__grid {
		display: flex;
		flex-direction: row;
		flex-wrap: nowrap;
		gap: calc(20 * var(--u));
		overflow-x: auto;
		overscroll-behavior-x: contain;
		scroll-snap-type: x mandatory;
		padding-inline: calc(50% - 125 * var(--u));
		scroll-padding-inline: calc(50% - 125 * var(--u));
		scrollbar-width: none;
	}
	.pn-sponsors__grid::-webkit-scrollbar { display: none; }
	.pn-sponsor {
		flex: 0 0 calc(250 * var(--u));
		scroll-snap-align: center;
		scroll-snap-stop: always;
	}

	/* Footer */
	.pn-footer { padding: calc(41 * var(--u)) calc(36 * var(--u)) calc(15 * var(--u)); }
	.pn-footer__logo { width: calc(286 * var(--u)); height: calc(67.4 * var(--u)); }
	.pn-footer__legal {
		margin-top: calc(27 * var(--u));
		font-size: calc(16 * var(--u));
		line-height: calc(23 * var(--u));
	}
}

/* 6. DESKTOP PICCOLO (992–1279px: iPad orizzontale, portatili piccoli) =====
   Layout identico al desktop, ma i testi non scendono sotto una soglia
   leggibile (in scala pura a 1024px il corpo sarebbe 11.7px). */
@media (min-width: 992px) and (max-width: 1279px) {
	body,
	.pn-text { font-size: max(calc(22 * var(--u)), 15px); line-height: 1.32; }

	.pn-title { font-size: max(calc(60 * var(--u)), 34px); line-height: 1.2; }
	.pn-title--center { font-size: max(calc(40 * var(--u)), 26px); }

	.pn-cta.brxe-button {
		--cta-h: max(calc(49 * var(--u)), 38px);
		--cta-icon: max(calc(47 * var(--u)), 36px);
		font-size: max(calc(24 * var(--u)), 15px);
		line-height: 1.2;
		padding-inline: max(calc(20 * var(--u)), 14px);
	}
	.pn-cta.brxe-button::before {
		background-position: center;
		background-size: 40% auto;
	}

	.pn-day__header { padding: max(calc(20 * var(--u)), 14px); }
	.pn-day__title { font-size: max(calc(50 * var(--u)), 28px); line-height: 1.14; }
	.pn-day__list { padding-inline: max(calc(20 * var(--u)), 14px); }
	.pn-event { padding-block: max(calc(20 * var(--u)), 13px); }
	.pn-event__time { font-size: max(calc(20 * var(--u)), 14px); line-height: 1.2; }
	.pn-event__name { font-size: max(calc(22 * var(--u)), 15px); line-height: 1.2; margin-top: 4px; }
	.pn-day:last-child .pn-programma__note {
		font-size: max(calc(17 * var(--u)), 12px);
		line-height: 1.25;
		padding: max(calc(15 * var(--u)), 10px) max(calc(20 * var(--u)), 14px);
	}

	.pn-route__item { font-size: max(calc(20 * var(--u)), 14px); line-height: 1.25; }
	.pn-route__title { line-height: 1.2; }

	.pn-sponsor { font-size: max(calc(22 * var(--u)), 14px); }

	.pn-footer__legal { font-size: max(calc(16 * var(--u)), 12px); line-height: 1.3; }
	.pn-footer__powered { font-size: max(calc(14 * var(--u)), 11px); line-height: 1.2; gap: 8px; }
	.pn-footer__powered > span { width: auto; }
	.pn-footer__powered img { width: 22px; height: 18.5px; }
}

/* 7. TABLET VERTICALE (768–991px: iPad mini / iPad in verticale) ===========
   Struttura del mobile, ingrandita (1u = 1.2px) e con colonne fluide. */
@media (min-width: 768px) and (max-width: 991px) {
	:root { --u: 1.2px; --pn-gutter-t: 8vw; }

	body,
	.pn-text { font-size: 20px; line-height: 1.35; }

	.pn-section { padding-inline: var(--pn-gutter-t); }

	/* Hero: illustrazione verticale ancorata in basso, testo sopra */
	.pn-hero {
		height: 150vw;
		padding-inline: var(--pn-gutter-t);
		background-position: center bottom !important;
	}

	/* Storia */
	.pn-storia__intro,
	.pn-storia__outro { padding-inline: var(--pn-gutter-t); }
	.pn-storia__intro .pn-text,
	.pn-storia__outro .pn-text { width: auto; max-width: 620px; }
	.pn-storia__intro .pn-text p + p { margin-top: 1.35em; }
	.pn-storia__band { height: auto; aspect-ratio: 430 / 242; }
	.pn-storia__photos {
		width: min(560px, calc(100% - 2 * var(--pn-gutter-t)));
		margin: -40px auto 0;
		gap: 10px;
		padding: 10px;
	}
	.pn-storia__photo { width: 100%; height: auto; aspect-ratio: 344 / 252; }
	.pn-storia__outro { padding-top: 48px; }

	/* Programma: 2 colonne */
	.pn-programma__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		column-gap: 32px;
		row-gap: 56px;
	}
	/* card come nel desktop: giorno nella testata blu */
	.pn-day__header { background-color: var(--pn-blue); color: var(--pn-white); padding: 18px 20px; margin-bottom: 0; }
	.pn-day__title { font-size: 40px; line-height: 1.14; margin: 0; }
	.pn-day__subtitle { display: none !important; }
	.pn-event { padding-block: 18px 17px; }
	.pn-event__time { font-size: 17px; line-height: 1.2; }
	.pn-event__name { font-size: 19px; line-height: 1.25; margin-top: 4px; }
	.pn-day:last-child .pn-programma__note { font-size: 14px; line-height: 1.3; padding: 12px 20px; }

	/* Come raggiungerci */
	.pn-route__item { font-size: 18px; line-height: 1.3; }
	.pn-route__map { height: 380px !important; }

	/* Sponsor: griglia a 3 colonne (niente carosello) */
	.pn-sponsors { padding-inline: var(--pn-gutter-t); }
	.pn-sponsors__grid {
		display: grid;
		grid-template-columns: repeat(3, minmax(0, 1fr));
		gap: 24px;
		overflow: visible;
		padding-inline: 0;
		scroll-snap-type: none;
	}
	.pn-sponsor {
		width: auto;
		height: auto;
		aspect-ratio: 250 / 150;
		font-size: 18px;
	}

	/* Footer */
	.pn-footer { padding: 48px var(--pn-gutter-t) 28px; }
	.pn-footer__logo { width: 340px; height: auto; aspect-ratio: 403 / 95; }
	.pn-footer__legal { margin-top: 32px; font-size: 14px; line-height: 1.5; max-width: 620px; }
	.pn-footer__powered { margin-top: 20px; font-size: 13px; gap: 8px; }
	.pn-footer__powered > span { width: auto; }
	.pn-footer__powered img { width: 22px; height: 18.5px; }
}

/* 8. SPONSOR: SLIDER OLTRE I 6 LOGHI (desktop e tablet) ===================
   Fino a 6 loghi: griglia. Dal 7° in poi: riga scorrevole con frecce
   (le frecce le aggiunge assets/js/parallelo.js). Su mobile resta il carosello. */
@media (min-width: 768px) {
	.pn-sponsors { position: relative; }

	.pn-sponsors__grid:has(> .pn-sponsor:nth-child(7)) {
		--sp-gap: calc(28 * var(--u));
		--sp-item: calc(250 * var(--u)); /* 6 loghi visibili, come la griglia XD */
		width: 100%; /* la sezione Bricks centra i figli: senza, la riga si restringe */
		display: flex;
		flex-direction: row; /* il blocco Bricks è in colonna di default */
		flex-wrap: nowrap;
		gap: var(--sp-gap);
		overflow-x: auto;
		overscroll-behavior-x: contain;
		scroll-snap-type: x mandatory;
		scroll-behavior: smooth;
		scrollbar-width: none;
	}
	.pn-sponsors__grid:has(> .pn-sponsor:nth-child(7))::-webkit-scrollbar { display: none; }
	.pn-sponsors__grid:has(> .pn-sponsor:nth-child(7)) > .pn-sponsor {
		flex: 0 0 var(--sp-item);
		width: var(--sp-item);
		min-width: 0;
		height: calc(var(--sp-item) * 0.6); /* 250 × 150 */
		aspect-ratio: auto;
		align-self: flex-start;
		scroll-snap-align: start;
	}

	/* Frecce: quadrati blu come la CTA, centrati nei margini laterali */
	.pn-sponsors__nav {
		position: absolute;
		top: 50%;
		width: calc(47 * var(--u));
		height: calc(49 * var(--u));
		min-width: 36px;
		min-height: 38px;
		padding: 0;
		border: 0;
		border-radius: 0;
		background-color: var(--pn-blue);
		background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='1.5'%3E%3Cpath d='M9 5l7 7-7 7'/%3E%3C/svg%3E");
		background-repeat: no-repeat;
		background-position: center;
		background-size: 45%;
		cursor: pointer;
		transform: translate(-50%, -50%);
		transition: opacity .2s ease, background-color .2s ease;
	}
	.pn-sponsors__nav--prev { left: calc(70 * var(--u)); transform: translate(-50%, -50%) scaleX(-1); }
	.pn-sponsors__nav--next { left: calc(100% - 70 * var(--u)); }
	.pn-sponsors__nav:hover { background-color: var(--pn-ink); }
	.pn-sponsors__nav:disabled { opacity: .25; cursor: default; background-color: var(--pn-blue); }
	.pn-sponsors__nav:focus-visible { outline: 2px solid var(--pn-blue); outline-offset: 3px; }
}
@media (min-width: 768px) and (max-width: 991px) {
	.pn-sponsors__grid:has(> .pn-sponsor:nth-child(7)) {
		--sp-gap: 24px;
		--sp-item: calc((100vw - 2 * var(--pn-gutter-t) - 2 * 24px) / 3); /* 3 loghi visibili */
	}
	.pn-sponsors__nav { width: 40px; height: 40px; min-width: 0; min-height: 0; }
	.pn-sponsors__nav--prev { left: calc(var(--pn-gutter-t) / 2); }
	.pn-sponsors__nav--next { left: calc(100% - var(--pn-gutter-t) / 2); }
}
@media (max-width: 767px) {
	.pn-sponsors__nav { display: none; }
}
