/* =====================================================================
   SCUOLE (page-scuole.php)
   Stessa grammatica delle altre sezioni, ma su fondo chiaro: l'inchiostro
   diventa scuro sulla pagina e resta chiaro dentro i blocchi film, dove
   sta sopra l'immagine. La base è in css/lrf.css.
   ===================================================================== */

.lrf-scuole{
	/* altezza della fascia di locandine: l'apertura parte sempre sotto */
	--muro-h: clamp(400px, 60vh, 680px);

	--paper: #E7E7E7;
	--film: var(--paper);
	--film-rgb: 231, 231, 231;

	/* inchiostro scuro su carta chiara */
	--ink: #171615;
	--ink-2: rgba(23, 22, 21, 0.72);
	--ink-3: rgba(23, 22, 21, 0.5);
	--line: rgba(23, 22, 21, 0.14);

	position: relative;
	background-color: var(--paper);
}
body{ background-color: #E7E7E7; }


/* ---------------------------------------------------------------------
   FASCIA DI LOCANDINE IN APERTURA (solo film per le scuole)
   --------------------------------------------------------------------- */
.lrf-comuro{
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	z-index: 0;
	display: flex;
	gap: 8px;
	align-items: flex-start;   /* le colonne sono alte quanto il loro contenuto */
	height: var(--muro-h);
	overflow: hidden;
	pointer-events: none;
}
/* la sfumatura verso il fondo pagina è un velo, non una maschera */
.lrf-comuro::after{
	content: "";
	position: absolute;
	inset: 0;
	z-index: 1;
	background: linear-gradient(180deg, rgba(231, 231, 231, 0) 64%, rgba(231, 231, 231, 0.42) 86%, #E7E7E7 100%);
}
.lrf-comuro__col{
	flex: 1 0 auto;
	display: flow-root;   /* tiene dentro il margine dell'ultima locandina, senza aggiungere altezza */
	height: max-content;
	width: clamp(120px, 11.5vw, 215px);
	animation: lrf-scorri var(--v, 40s) linear infinite;
	animation-delay: var(--r, 0s);
	will-change: transform;
	transform: translateZ(0);
	backface-visibility: hidden;
}
.lrf-comuro__col img{
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 2 / 3;
	object-fit: cover;
	opacity: 0.72;
	margin-bottom: 8px;
	border-radius: 4px;
	background: #dcdcdc;
}
@keyframes lrf-scorri{
	from{ transform: translate3d(0, 0, 0); }
	to{ transform: translate3d(0, -50%, 0); }
}

/* Footer e menu di sito, come nelle altre pagine interne */
.menucontinside{ width: var(--centercolwidth); max-width: var(--maxwidth); }
.contfooterhome{ position: relative; background-color: #1d1d1d; }
.contfooterhomeinside{ width: var(--centercolwidth); max-width: var(--maxwidth); }


/* ---------------------------------------------------------------------
   APERTURA
   --------------------------------------------------------------------- */
.lrf-schoolhero{
	position: relative;
	z-index: 1;
	padding: calc(var(--muro-h) + clamp(24px, 4vh, 56px)) 0 clamp(20px, 3vw, 40px);
}
.lrf-schoolhero > .lrf-wrap > *{ animation: lrf-rise 1.2s var(--ease) both; }
.lrf-schoolhero > .lrf-wrap > :nth-child(1){ animation-delay: .1s; }
.lrf-schoolhero > .lrf-wrap > :nth-child(2){ animation-delay: .2s; }
.lrf-schoolhero > .lrf-wrap > :nth-child(3){ animation-delay: .3s; }
.lrf-schoolhero > .lrf-wrap > :nth-child(4){ animation-delay: .4s; }

.lrf-schoolhero__title{
	margin: 18px 0 20px;
	font-size: clamp(2.4rem, 6vw, 5rem);
	font-weight: 700;
	line-height: 0.95;
	letter-spacing: -0.04em;
}
.lrf-schoolhero__lead{
	max-width: 900px;
	margin: 0 0 clamp(24px, 3vw, 40px);
	font-size: clamp(1.1rem, 1.7vw, 1.55rem);
	font-weight: 400;
	line-height: 1.4;
	letter-spacing: -0.015em;
	text-wrap: balance;
}
.lrf-schoolhero__text{
	columns: 2;
	column-gap: clamp(24px, 4vw, 64px);
	max-width: 980px;
	padding-top: clamp(20px, 2.5vw, 32px);
	border-top: 1px solid var(--line);
	font-size: clamp(0.92rem, 1vw, 1.02rem);
	line-height: 1.7;
	color: var(--ink-2);
}
.lrf-schoolhero__text p{ margin: 0 0 1em; }
.lrf-schoolhero__text p:last-child{ margin-bottom: 0; }
.lrf-schoolhero__text a{ color: var(--accent); text-decoration: underline; text-underline-offset: 3px; }
.lrf-schoolhero__text a:hover{ color: var(--accent-hi); }

/* etichette dell'apertura */
.lrf-tags{
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	margin: 0;
}
.lrf-tags span{
	padding: 5px 8px 4px;
	border-radius: 3px;
	background: rgba(23, 22, 21, 0.07);
	font-size: 0.58rem;
	font-weight: 600;
	letter-spacing: 0.14em;
	line-height: 1.2;
	text-transform: uppercase;
	color: var(--ink-2);
}


/* ---------------------------------------------------------------------
   TESTATA DELLA SELEZIONE
   --------------------------------------------------------------------- */
.lrf-scuole .lrf-body{ position: relative; z-index: 1; padding: clamp(40px, 5vw, 72px) 0 clamp(60px, 8vw, 110px); }
.lrf-scuole.is-nohero .lrf-body{ padding-top: clamp(130px, 19vh, 200px); }

.lrf-scuole .lrf-kicker{ margin-bottom: 0; }
.lrf-kicker__n{
	padding-left: 14px;
	margin-left: 2px;
	border-left: 1px solid var(--line);
	color: var(--ink-3);
	font-variant-numeric: tabular-nums;
}

.lrf-toolbar{
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 10px;
}

/* ricerca con la stessa cornice arrotondata delle altre sezioni */
.lrf-toolbar .lrf-search{
	flex: 1 1 200px;
	max-width: 340px;
	padding: 3px 3px 3px 14px;
	border: 0;
	border-radius: 999px;
	box-shadow: inset 0 0 0 1px var(--line);
	transition: box-shadow .3s ease;
}
.lrf-toolbar .lrf-search:focus-within{ box-shadow: inset 0 0 0 1px rgba(23, 22, 21, 0.4); }
.lrf-toolbar .lrf-search input{ height: 33px; font-size: 0.92rem; }
.lrf-toolbar .lrf-search__field{ gap: 10px; }
.lrf-toolbar .lrf-search__icon{ font-size: 17px; }
.lrf-toolbar .lrf-search__go{
	width: 33px;
	height: 33px;
	border-radius: 999px;
	font-size: 18px;
}
.lrf-scuole .lrf-chip{ background: rgba(23, 22, 21, 0.07); }
.lrf-scuole .lrf-chip:hover{ background: rgba(23, 22, 21, 0.13); }


/* ---------------------------------------------------------------------
   ELENCO FILM — blocco a piena immagine con i testi sopra
   --------------------------------------------------------------------- */
.lrf-schoollist{
	display: flex;
	flex-direction: column;
	gap: clamp(32px, 4vw, 56px);
	margin-top: clamp(28px, 3.5vw, 44px);
}

.lrf-school{
	/* dentro il blocco si torna all'inchiostro chiaro: sta sopra la foto */
	--ink: #f5f0e8;
	--ink-2: rgba(245, 240, 232, 0.76);
	--ink-3: rgba(245, 240, 232, 0.5);
	--line: rgba(245, 240, 232, 0.2);

	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	min-height: min(72vh, 660px);
	border-radius: 5px;
	overflow: hidden;
	color: var(--ink);
	background: #1b1a19;
	isolation: isolate;
}

.lrf-school__media{
	position: absolute;
	inset: 0;
	z-index: -1;
	background: center top / cover no-repeat;
}
.lrf-school__media::after{
	content: "";
	position: absolute;
	inset: 0;
	background:
		linear-gradient(0deg, rgba(8, 7, 7, 0.94) 0%, rgba(8, 7, 7, 0.82) 28%, rgba(8, 7, 7, 0.25) 62%, rgba(8, 7, 7, 0.45) 100%),
		linear-gradient(90deg, rgba(8, 7, 7, 0.6), rgba(8, 7, 7, 0) 65%);
}

.lrf-school__logo{
	position: absolute;
	top: clamp(24px, 3.2vw, 48px);
	left: clamp(24px, 3.2vw, 48px);
	display: block;
	max-width: min(240px, 45%);
	max-height: 80px;
	width: auto;
	height: auto;
	object-fit: contain;
	object-position: left top;
	filter: drop-shadow(0 6px 24px rgba(0, 0, 0, 0.6));
}

/* età consigliata */
.lrf-school__age{
	position: absolute;
	top: clamp(20px, 3.2vw, 44px);
	right: clamp(20px, 3.2vw, 44px);
	display: flex;
	align-items: center;
	gap: 8px;
	margin: 0;
	padding: 8px 14px 8px 10px;
	border-radius: 999px;
	background: rgba(12, 11, 10, 0.5);
	-webkit-backdrop-filter: blur(8px);
	backdrop-filter: blur(8px);
	box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.14);
	font-size: 0.95rem;
	font-weight: 600;
	line-height: 1;
	color: var(--ink);
}
.lrf-school__age .material-symbols-outlined{ font-size: 22px; }

.lrf-school__inner{ padding: clamp(24px, 3.2vw, 48px); }
.lrf-school__cols{
	display: grid;
	grid-template-columns: minmax(0, 1.3fr) minmax(0, 0.7fr);
	gap: clamp(24px, 3vw, 56px);
	align-items: end;
}
.lrf-school__main{
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 14px;
	max-width: 760px;
}
.lrf-school__side{
	display: flex;
	flex-direction: column;
	gap: 16px;
}

.lrf-school__title{
	margin: 0;
	font-size: clamp(1.7rem, 2.8vw, 2.5rem);
	font-weight: 600;
	line-height: 1.1;
	letter-spacing: -0.03em;
	text-wrap: balance;
	text-shadow: 0 2px 30px rgba(0, 0, 0, 0.6);
}
.lrf-school__text{
	margin: 0;
	font-size: 0.95rem;
	line-height: 1.7;
	color: var(--ink-2);
	text-shadow: 0 1px 24px rgba(0, 0, 0, 0.6);
}
.lrf-school__actions{
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin-top: 6px;
}

/* scheda tecnica */
.lrf-facts{
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	width: 100%;
	margin: 0;
	border-top: 1px solid rgba(245, 240, 232, 0.22);
}
.lrf-facts__row{
	padding: 11px 0 12px;
	border-bottom: 1px solid rgba(245, 240, 232, 0.18);
}
.lrf-facts dt{
	margin-bottom: 6px;
	font-size: 0.62rem;
	font-weight: 600;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--ink-3);
}
.lrf-facts dd{
	margin: 0;
	font-size: 0.95rem;
	font-weight: 500;
	line-height: 1.35;
	color: var(--ink);
}

.lrf-ratings{ display: flex; gap: 6px; }
.lrf-ratings img{ width: 30px; height: 30px; border-radius: 50%; object-fit: cover; }


/* ---------------------------------------------------------------------
   NIENTE RISULTATI
   --------------------------------------------------------------------- */
.lrf-empty{
	padding: clamp(40px, 6vw, 80px) 0;
	color: var(--ink-2);
}
.lrf-empty__title{
	margin: 0 0 10px;
	font-size: 1.3rem;
	font-weight: 600;
	color: var(--ink);
}
.lrf-empty a{ text-decoration: underline; text-underline-offset: 3px; }


/* ---------------------------------------------------------------------
   RESPONSIVE
   --------------------------------------------------------------------- */
@media (max-width: 1000px){
	.lrf-scuole{ --muro-h: clamp(260px, 34vh, 400px); }
	.lrf-schoolhero__text{ columns: 1; }
	.lrf-scuole .lrf-head{ flex-direction: column; align-items: flex-start; gap: 16px; }
	.lrf-toolbar{ width: 100%; }
	.lrf-toolbar .lrf-search{ max-width: none; }
	/* su telefono l'immagine è una fascia in cima, non uno sfondo stirato */
	.lrf-school{
		min-height: 0;
		padding-top: 56.25%;   /* quanto la fascia: le info partono sotto */
		background: #1b1a19;
	}
	.lrf-school__media{
		inset: 0 0 auto 0;
		height: auto;
		aspect-ratio: 16 / 9;
	}
	.lrf-school__media::after{
		background: linear-gradient(0deg, #1b1a19 0%, rgba(27, 26, 25, 0.72) 24%, rgba(27, 26, 25, 0) 62%);
	}
	.lrf-school__cols{ grid-template-columns: minmax(0, 1fr); gap: 22px; }
	.lrf-school__logo{ max-width: 55%; max-height: 62px; }
	.lrf-facts{ grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 20px; }
}
@media (max-width: 600px){
	.lrf-school{ padding-top: 56.25%; }
	.lrf-school__age{ padding: 6px 12px 6px 8px; font-size: 0.85rem; }
	.lrf-school__age .material-symbols-outlined{ font-size: 19px; }
	.lrf-facts{ grid-template-columns: minmax(0, 1fr); }
	.lrf-school__actions{ display: grid; grid-template-columns: minmax(0, 1fr); width: 100%; }
	.lrf-school__actions .lrf-btn{ justify-content: center; }
}

@media (prefers-reduced-motion: reduce){
	.lrf-schoolhero > .lrf-wrap > *{ animation: none; }
}
