/* ==========================================================================
   Calise — foglio di stile principale
   Le variabili di colore e font arrivano da Calise Options (vedi inc/assets.php).
   ========================================================================== */

:root {
	--cl-navy: #14213D;
	--cl-accent: #00876B;
	--cl-bg: #F3F5F8;
	--cl-surface: #FFFFFF;
	--cl-text: #14213D;
	--cl-muted: #4A5468;
	--cl-highlight: #A8E6D2;
	--cl-paper: #F2EDE3;
	--cl-alt: #B0103A;
	--cl-amber: #F2B705;
	--cl-navy-2: #1E2D4F;
	--cl-navy-3: #2A3B66;
	--cl-navy-deep: #0E1830;
	--cl-line: #DDE1E8;
	--cl-gutter: clamp(20px, 5vw, 96px);
	--cl-radius: 18px;
	--cl-radius-s: 10px;
	--cl-header-h: 84px;
	--cl-ease: cubic-bezier(.22, 1, .36, 1);
	--cl-ease-train: cubic-bezier(.65, 0, .2, 1);
	--cl-shadow: 0 1px 2px rgba(20, 33, 61, .06), 0 10px 30px -12px rgba(20, 33, 61, .22);
	--cl-font-head: "Archivo", "Helvetica Neue", Arial, sans-serif;
	--cl-font-body: "Archivo", "Helvetica Neue", Arial, sans-serif;
	--cl-font-mono: "IBM Plex Mono", ui-monospace, Menlo, monospace;
	--cl-font-paper: "Source Serif 4", Georgia, serif;
	--cl-body-size: 18px;
	--cl-head-weight: 800;
	--cl-h1: 76px; --cl-h2: 52px; --cl-h3: 32px; --cl-h4: 24px; --cl-h5: 20px; --cl-h6: 16px;
	--cl-lines-opacity: .04;
}

/* --------------------------------------------------------------------------
   Base
   -------------------------------------------------------------------------- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-padding-top: calc(var(--cl-header-h) + 16px); }
@media (prefers-reduced-motion: no-preference) { html { scroll-behavior: smooth; } }
body {
	margin: 0;
	background: var(--cl-bg);
	color: var(--cl-text);
	font-family: var(--cl-font-body);
	font-size: clamp(16px, calc(var(--cl-body-size) * .92), var(--cl-body-size));
	line-height: 1.6;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	text-rendering: optimizeLegibility;
	overflow-x: hidden;
}
body.cl-lock { overflow: hidden; }
[hidden] { display: none !important; }
img, svg, video, iframe { display: block; max-width: 100%; }
img { height: auto; }
a { color: inherit; text-decoration-thickness: 1px; text-underline-offset: .18em; }
a:hover { color: var(--cl-accent); }
button { font: inherit; color: inherit; cursor: pointer; }
h1, h2, h3, h4, h5, h6 {
	font-family: var(--cl-font-head);
	font-weight: var(--cl-head-weight);
	line-height: 1.08;
	letter-spacing: -.02em;
	margin: 0 0 .5em;
	color: var(--cl-navy);
	text-wrap: balance;
}
h1 { font-size: clamp(calc(var(--cl-h1) * .5), 6.2vw, var(--cl-h1)); letter-spacing: -.035em; }
h2 { font-size: clamp(calc(var(--cl-h2) * .58), 4.6vw, var(--cl-h2)); letter-spacing: -.03em; }
h3 { font-size: clamp(calc(var(--cl-h3) * .7), 2.6vw, var(--cl-h3)); }
h4 { font-size: clamp(calc(var(--cl-h4) * .82), 2vw, var(--cl-h4)); }
h5 { font-size: var(--cl-h5); }
h6 { font-size: var(--cl-h6); }
p { margin: 0 0 1em; }
:focus-visible { outline: 3px solid var(--cl-accent); outline-offset: 3px; border-radius: 4px; }
::selection { background: var(--cl-highlight); color: var(--cl-navy); }

.screen-reader-text {
	border: 0; clip: rect(1px, 1px, 1px, 1px); clip-path: inset(50%); height: 1px; margin: -1px;
	overflow: hidden; padding: 0; position: absolute !important; width: 1px; word-wrap: normal !important;
}
.cl-skip {
	position: fixed; left: 16px; top: -60px; z-index: 1000; background: var(--cl-navy); color: #fff;
	padding: 10px 18px; border-radius: 999px; text-decoration: none; transition: top .2s;
}
.cl-skip:focus { top: 16px; color: #fff; }

.cl-wrap {
	width: 100%;
	max-width: 2000px;
	margin-inline: auto;
	padding-inline: var(--cl-gutter);
}
.cl-main { position: relative; z-index: 1; display: block; outline: none; }
.cl-main > :first-child:not(.cl-hero) { padding-top: calc(var(--cl-header-h) + clamp(24px, 4vw, 56px)); }

/* --------------------------------------------------------------------------
   Sfondo: la mappa delle linee
   -------------------------------------------------------------------------- */
.cl-bglines {
	position: fixed; inset: 0; z-index: 0; pointer-events: none; overflow: hidden;
}
.cl-bglines svg { width: 100%; height: 100%; }
.cl-bglines__map { opacity: var(--cl-lines-opacity); }
.cl-bglines__gap { stroke: var(--cl-bg); }
.cl-bglines__nodes path:not(.cl-bglines__gap) { stroke: var(--cl-navy); }
.cl-bglines__nodes circle { fill: var(--cl-bg); stroke: var(--cl-navy); stroke-width: 6; }

/* --------------------------------------------------------------------------
   Evidenziatore: il rettangolo dietro le parole chiave
   Il gradiente inclinato disegna un rettangolo leggermente storto,
   che segue il testo anche quando va a capo.
   -------------------------------------------------------------------------- */
.cl-mark {
	color: var(--cl-navy);
	background-color: transparent;
	background-image: linear-gradient(-1.6deg, transparent .1em, var(--cl-highlight) .1em, var(--cl-highlight) calc(100% - .04em), transparent calc(100% - .04em));
	background-repeat: no-repeat;
	background-size: 100% 100%;
	background-position: 0 60%;
	padding: .02em .14em .04em;
	margin: 0 -.1em 0 -.04em;
	-webkit-box-decoration-break: clone;
	box-decoration-break: clone;
	border-radius: 2px;
}
.cl-mark > span { position: relative; }
.cl-js .cl-motion--full [data-cl-reveal] .cl-mark,
.cl-js .cl-motion--soft [data-cl-reveal] .cl-mark { background-size: 0% 100%; }
.cl-mark.is-on { background-size: 100% 100% !important; transition: background-size .9s var(--cl-ease-train); }

/* --------------------------------------------------------------------------
   Etichette in stile tabellone
   -------------------------------------------------------------------------- */
.cl-kicker {
	display: inline-flex; align-items: center; gap: 10px;
	margin: 0 0 18px;
	font: 500 13px/1.2 var(--cl-font-mono);
	letter-spacing: .16em;
	text-transform: uppercase;
	color: var(--cl-accent);
}
.cl-kicker::before {
	content: ""; width: 12px; height: 12px; border-radius: 50%; flex: none;
	border: 3px solid currentColor; background: var(--cl-bg);
}
.cl-kicker--light { color: var(--cl-highlight); }
.cl-kicker--light::before { background: transparent; }
.cl-flap-char { display: inline-block; min-width: .62em; text-align: center; }

/* --------------------------------------------------------------------------
   Logo con slot machine
   -------------------------------------------------------------------------- */
.cl-logo {
	display: inline-flex; flex-direction: column; text-decoration: none; color: var(--cl-navy);
	line-height: 1; user-select: none;
}
.cl-logo:hover { color: var(--cl-navy); }
.cl-logo__first { font-weight: 300; font-size: .36em; letter-spacing: 0; padding-left: .08em; margin-bottom: .02em; }
.cl-logo__last { display: inline-flex; align-items: flex-end; font-weight: 800; font-size: 1em; letter-spacing: -.045em; }
.cl-logo__cell { position: relative; display: inline-block; height: 1em; overflow: hidden; }
.cl-logo__cell--i { overflow: visible; }
.cl-logo__cell--i .cl-logo__reel { overflow: hidden; height: 1em; }
.cl-logo__reel { display: block; will-change: transform; }
.cl-logo__char { display: block; height: 1em; line-height: 1; text-align: center; white-space: nowrap; }
.cl-logo__dot {
	position: absolute; left: 50%; top: .05em; width: .22em; height: .22em; margin-left: -.11em;
	border-radius: 50%; background: var(--cl-accent);
}
.cl-logo--light { color: #fff; }
.cl-logo--light:hover { color: #fff; }
.cl-header__logo { font-size: 34px; }
.cl-logo--image img { max-height: 54px; width: auto; }

/* --------------------------------------------------------------------------
   Header
   -------------------------------------------------------------------------- */
.cl-header {
	position: absolute; top: 0; left: 0; right: 0; z-index: 60;
	transition: transform .5s var(--cl-ease), background-color .35s, box-shadow .35s;
}
.cl-header-sticky .cl-header { position: fixed; }
.admin-bar .cl-header { top: 32px; }
@media (max-width: 782px) { .admin-bar .cl-header { top: 46px; } .admin-bar.cl-header-sticky .cl-header.is-scrolled { top: 0; } }
.cl-header.is-scrolled {
	background: var(--cl-bg);
	box-shadow: 0 1px 0 rgba(20, 33, 61, .08), 0 10px 24px -18px rgba(20, 33, 61, .45);
}
.cl-header.is-hidden { transform: translateY(-110%); }
.cl-header__inner {
	display: flex; align-items: center; gap: 32px; height: var(--cl-header-h);
}
.cl-header__brand { flex: none; }
.cl-nav { margin-left: auto; }
.cl-menu { display: flex; gap: 6px; margin: 0; padding: 0; list-style: none; }
.cl-menu > li { position: relative; }
.cl-menu a {
	position: relative; display: block; padding: 10px 14px; text-decoration: none;
	font-weight: 500; font-size: 16px; color: var(--cl-navy); border-radius: 999px;
}
.cl-menu a::after {
	content: ""; position: absolute; left: 14px; right: 14px; bottom: 4px; height: 3px; border-radius: 2px;
	background: var(--cl-accent); transform: scaleX(0); transform-origin: left; transition: transform .45s var(--cl-ease-train);
}
.cl-menu a::before {
	content: ""; position: absolute; right: 10px; bottom: 2px; width: 7px; height: 7px; border-radius: 50%;
	background: var(--cl-accent); opacity: 0; transform: translateX(-30px); transition: transform .45s var(--cl-ease-train), opacity .2s;
}
.cl-menu a:hover::after, .cl-menu .current-menu-item > a::after, .cl-menu .current_page_item > a::after,
.cl-menu .current-menu-ancestor > a::after, .cl-menu .current_page_parent > a::after, .cl-menu .current-menu-parent > a::after { transform: scaleX(1); }
.cl-menu a:hover::before, .cl-menu .current-menu-item > a::before, .cl-menu .current_page_item > a::before,
.cl-menu .current_page_parent > a::before, .cl-menu .current-menu-parent > a::before { opacity: 1; transform: none; }
.cl-menu .sub-menu {
	position: absolute; top: 100%; left: 0; min-width: 220px; margin: 0; padding: 8px; list-style: none;
	background: var(--cl-surface); border-radius: var(--cl-radius-s); box-shadow: var(--cl-shadow);
	opacity: 0; visibility: hidden; transform: translateY(6px); transition: .2s;
}
.cl-menu li:hover > .sub-menu, .cl-menu li:focus-within > .sub-menu { opacity: 1; visibility: visible; transform: none; }
.cl-header__actions { display: flex; align-items: center; gap: 10px; }
.cl-iconbtn {
	display: inline-grid; place-items: center; width: 44px; height: 44px; border-radius: 50%;
	border: 1.5px solid rgba(20, 33, 61, .14); background: transparent; color: var(--cl-navy); transition: .2s;
}
.cl-iconbtn:hover { background: var(--cl-navy); color: #fff; border-color: var(--cl-navy); }
.cl-iconbtn .cl-icon { width: 20px; height: 20px; }
.cl-iconbtn--light { color: #fff; border-color: rgba(255, 255, 255, .25); }
.cl-iconbtn--light:hover { background: #fff; color: var(--cl-navy); }
.cl-burger { display: none; width: 48px; height: 48px; border-radius: 50%; border: 0; background: var(--cl-navy); color: #fff; place-items: center; position: relative; z-index: 80; }
.cl-burger__lines { position: relative; display: block; width: 20px; height: 14px; }
.cl-burger__lines span { position: absolute; left: 0; width: 100%; height: 2px; background: currentColor; border-radius: 2px; transition: transform .35s var(--cl-ease), opacity .2s, width .3s, top .3s; }
.cl-burger__lines span:nth-child(1) { top: 0; }
.cl-burger__lines span:nth-child(2) { top: 6px; }
.cl-burger__lines span:nth-child(3) { top: 12px; width: 60%; }
.cl-burger[aria-expanded="true"] { background: var(--cl-accent); }
.cl-burger[aria-expanded="true"] .cl-burger__lines span:nth-child(1) { top: 6px; transform: rotate(45deg); }
.cl-burger[aria-expanded="true"] .cl-burger__lines span:nth-child(2) { opacity: 0; }
.cl-burger[aria-expanded="true"] .cl-burger__lines span:nth-child(3) { top: 6px; width: 100%; transform: rotate(-45deg); }

.cl-header--logo-center .cl-header__inner { display: grid; grid-template-columns: 1fr auto 1fr; height: auto; padding-block: 18px 8px; row-gap: 6px; }
.cl-header--logo-center .cl-header__brand { grid-column: 2; text-align: center; }
.cl-header--logo-center .cl-header__actions { grid-column: 3; justify-self: end; grid-row: 1; }
.cl-header--logo-center .cl-nav { grid-column: 1 / -1; margin: 0; justify-self: center; }
.cl-header--minimal .cl-nav { display: none; }
.cl-header--minimal .cl-burger { display: inline-grid; }
.cl-header--minimal .cl-header__actions { margin-left: auto; }

.cl-header-transparent .cl-header:not(.is-scrolled) .cl-logo,
.cl-header-transparent .cl-header:not(.is-scrolled) .cl-menu a { color: #fff; }

/* Menu mobile: la linea della metropolitana */
.cl-mobile {
	position: fixed; inset: 0; z-index: 70; background: var(--cl-navy); color: #fff;
	overflow-y: auto; padding: calc(var(--cl-header-h) + 24px) var(--cl-gutter) 40px;
}
.cl-mobile__inner { max-width: 560px; }
.cl-mobile__menu, .cl-mobile .cl-menu { position: relative; display: block; margin: 0 0 40px; padding: 0 0 0 44px; list-style: none; }
.cl-mobile__menu::before, .cl-mobile .cl-menu::before {
	content: ""; position: absolute; left: 13px; top: 18px; bottom: 18px; width: 6px; border-radius: 3px; background: var(--cl-accent);
	transform-origin: top; transform: scaleY(var(--line, 1));
}
.cl-mobile__menu li, .cl-mobile .cl-menu li { position: relative; }
.cl-mobile__menu li::before, .cl-mobile .cl-menu li::before {
	content: ""; position: absolute; left: -40px; top: 50%; width: 24px; height: 24px; margin-top: -12px; border-radius: 50%;
	background: var(--cl-navy); border: 5px solid #fff; box-sizing: border-box;
}
.cl-mobile__menu a, .cl-mobile .cl-menu a {
	display: block; padding: 12px 0; font: 800 clamp(30px, 8vw, 46px)/1.05 var(--cl-font-head); letter-spacing: -.03em; color: #fff; text-decoration: none;
}
.cl-mobile .cl-menu a::before, .cl-mobile .cl-menu a::after { display: none; }
.cl-mobile__menu a:hover, .cl-mobile .current-menu-item > a, .cl-mobile .current_page_item > a { color: var(--cl-highlight); }

/* Ricerca */
.cl-search { position: fixed; inset: 0 0 auto; z-index: 90; background: var(--cl-navy); color: #fff; padding: 32px 0 40px; box-shadow: 0 30px 60px -20px rgba(0, 0, 0, .4); }
.cl-search__inner { display: flex; align-items: flex-end; gap: 20px; }
.cl-search__form { flex: 1; display: grid; grid-template-columns: 1fr auto; align-items: end; gap: 10px 16px; }
.cl-search__form label { grid-column: 1 / -1; margin: 0; }
.cl-search__form input {
	width: 100%; background: transparent; border: 0; border-bottom: 3px solid rgba(255, 255, 255, .3); color: #fff;
	font: 800 clamp(26px, 4vw, 48px)/1.2 var(--cl-font-head); letter-spacing: -.02em; padding: 6px 0; border-radius: 0;
}
.cl-search__form input:focus { outline: none; border-color: var(--cl-accent); }
.cl-search__form input::placeholder { color: rgba(255, 255, 255, .4); }

/* --------------------------------------------------------------------------
   Pulsanti e link
   -------------------------------------------------------------------------- */
.cl-btn {
	position: relative; display: inline-flex; align-items: center; gap: 12px;
	min-height: 52px; padding: 6px 8px 6px 26px; border-radius: 999px; border: 2px solid var(--cl-navy);
	background: var(--cl-navy); color: #fff; text-decoration: none; font-weight: 600; font-size: 16px; line-height: 1.2;
	overflow: hidden; isolation: isolate; transition: color .3s, border-color .3s, background-color .3s;
}
.cl-btn::before {
	content: ""; position: absolute; inset: 0; z-index: -1; background: var(--cl-accent);
	transform: translateX(-101%); transition: transform .55s var(--cl-ease-train);
}
.cl-btn:hover { color: #fff; border-color: var(--cl-accent); }
.cl-btn:hover::before { transform: none; }
.cl-btn__train {
	display: inline-grid; place-items: center; width: 38px; height: 38px; border-radius: 50%;
	background: #fff; color: var(--cl-navy); flex: none; overflow: hidden; transition: background .3s;
}
.cl-btn__train .cl-icon { width: 18px; height: 18px; transition: transform .5s var(--cl-ease-train); }
.cl-btn:hover .cl-btn__train .cl-icon { animation: clTrainPass .6s var(--cl-ease-train); }
@keyframes clTrainPass { 0% { transform: none; } 49% { transform: translateX(40px); } 50% { transform: translateX(-40px); } 100% { transform: none; } }
.cl-btn--ghost { background: transparent; color: var(--cl-navy); }
.cl-btn--ghost .cl-btn__train { background: var(--cl-navy); color: #fff; }
.cl-btn--ghost:hover .cl-btn__train { background: #fff; color: var(--cl-navy); }
.cl-btn--light { background: #fff; color: var(--cl-navy); border-color: #fff; }
.cl-btn--light .cl-btn__train { background: var(--cl-navy); color: #fff; }
.cl-btn--light:hover .cl-btn__train { background: #fff; color: var(--cl-accent); }
.cl-btn--small { min-height: 42px; padding: 6px 20px; font-size: 15px; }
.cl-btn--small:has(.cl-btn__train) { padding-right: 6px; }
.cl-btn--small .cl-btn__train { width: 30px; height: 30px; }
button.cl-btn { cursor: pointer; }
button.cl-btn[disabled] { opacity: .6; cursor: progress; }

.cl-link { color: var(--cl-navy); font-weight: 600; text-decoration: underline; text-decoration-color: var(--cl-accent); text-decoration-thickness: 2px; }
.cl-link--arrow { display: inline-flex; align-items: center; gap: 8px; text-decoration: none; white-space: nowrap; }
.cl-link--arrow .cl-icon { width: 20px; height: 20px; color: var(--cl-accent); transition: transform .35s var(--cl-ease); }
.cl-link--arrow:hover .cl-icon { transform: translateX(5px); }

/* --------------------------------------------------------------------------
   Sezioni
   -------------------------------------------------------------------------- */
.cl-section { position: relative; padding-block: clamp(56px, 7vw, 112px); }
.cl-section + .cl-section { padding-top: clamp(24px, 3vw, 48px); }
.cl-section--tight { padding-block: clamp(24px, 4vw, 56px) clamp(64px, 8vw, 120px); }
.cl-section__head { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; margin-bottom: clamp(32px, 4vw, 56px); flex-wrap: wrap; }
.cl-section__titles { max-width: 900px; }
.cl-section__title { margin: 0; }
.cl-admin-note { padding: 14px 18px; border: 2px dashed var(--cl-accent); border-radius: var(--cl-radius-s); color: var(--cl-muted); }
.cl-empty { color: var(--cl-muted); font-size: 1.1em; }

/* Binario separatore */
.cl-track { position: relative; height: 26px; margin-block: 24px; }
.cl-track__rail { position: absolute; left: 0; right: 0; top: 50%; height: 5px; margin-top: -2.5px; border-radius: 3px; background: var(--cl-navy); transform-origin: left; }
.cl-track__stop { position: absolute; top: 50%; left: var(--p); width: 22px; height: 22px; margin: -11px 0 0 -11px; border-radius: 50%; background: var(--cl-bg); border: 5px solid var(--cl-navy); }
.cl-track__stop:first-of-type { margin-left: 0; }
.cl-track__stop:last-of-type { margin-left: -22px; background: var(--cl-accent); border-color: var(--cl-accent); }

/* --------------------------------------------------------------------------
   Intro (hero)
   -------------------------------------------------------------------------- */
.cl-hero { position: relative; padding-top: calc(var(--cl-header-h) + clamp(28px, 5vw, 72px)); padding-bottom: clamp(24px, 3vw, 48px); }
.cl-hero__inner { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, .9fr); gap: clamp(32px, 6vw, 110px); align-items: center; }
.cl-hero__title { font-size: clamp(42px, 6.4vw, var(--cl-h1)); line-height: 1.02; margin-bottom: 28px; }
.cl-hero__lead { font-size: clamp(18px, 1.5vw, 22px); line-height: 1.55; color: var(--cl-muted); max-width: 640px; margin-bottom: 36px; }
.cl-hero__actions { display: flex; flex-wrap: wrap; gap: 14px; }
/* Mouse "scorri" al posto dei pulsanti dell'intro */
.cl-scrollhint { display: inline-flex; align-items: center; gap: 14px; margin-top: 6px; color: var(--cl-navy); text-decoration: none; font: 500 12px/1 var(--cl-font-mono); letter-spacing: .18em; text-transform: uppercase; }
.cl-scrollhint__mouse { position: relative; width: 26px; height: 42px; border: 2px solid currentColor; border-radius: 14px; box-sizing: border-box; }
.cl-scrollhint__wheel { position: absolute; left: 50%; top: 7px; width: 4px; height: 9px; margin-left: -2px; border-radius: 2px; background: var(--cl-accent); animation: cl-wheel 1.8s cubic-bezier(.6, 0, .3, 1) infinite; }
.cl-scrollhint:hover, .cl-scrollhint:focus-visible { color: var(--cl-accent); }
.cl-scrollhint:focus-visible { outline: 3px solid var(--cl-highlight); outline-offset: 6px; border-radius: 8px; }
.cl-hero__end { display: block; height: 0; scroll-margin-top: var(--cl-header-h); }
@keyframes cl-wheel { 0% { transform: translateY(0); opacity: 1; } 70% { transform: translateY(12px); opacity: 0; } 100% { transform: translateY(0); opacity: 0; } }
@media (prefers-reduced-motion: reduce) { .cl-scrollhint__wheel { animation: none; } }
.cl-hero__media { position: relative; }
.cl-hero__media .cl-doors { aspect-ratio: 4 / 5; border-radius: 28px 28px 120px 28px; }
.cl-hero__img { width: 100%; height: 100%; object-fit: cover; }
.cl-hero__placeholder {
	display: grid; place-items: center; width: 100%; height: 100%; min-height: 320px;
	background: repeating-linear-gradient(135deg, var(--cl-navy-2) 0 14px, var(--cl-navy) 14px 28px); color: #A9B4CA;
	font: 500 13px var(--cl-font-mono); letter-spacing: .14em; text-transform: uppercase;
}
.cl-hero__line { position: absolute; inset: -6% -14% -6% -24%; width: 138%; height: 112%; z-index: -1; pointer-events: none; }

/* Porte del treno che si aprono sulle immagini */
.cl-doors { position: relative; overflow: hidden; border-radius: var(--cl-radius); background: var(--cl-navy); isolation: isolate; }
.cl-doors > img { width: 100%; height: 100%; object-fit: cover; }
.cl-doors__leaf { display: none; position: absolute; top: 0; bottom: 0; width: 50.5%; z-index: 2; background: var(--cl-navy); }
.cl-doors__leaf--l { left: 0; }
.cl-doors__leaf--r { right: 0; }
.cl-doors__leaf::after {
	content: ""; position: absolute; top: 14%; bottom: 40%; width: 46%; border-radius: 14px;
	background: linear-gradient(180deg, rgba(168, 230, 210, .2), rgba(168, 230, 210, .05)); border: 3px solid var(--cl-navy-3);
}
.cl-doors__leaf--l::after { right: 14%; }
.cl-doors__leaf--r::after { left: 14%; }
.cl-doors__leaf--l { border-right: 2px solid var(--cl-accent); }
.cl-js .cl-motion--full .cl-doors__leaf { display: block; }
.cl-js .cl-motion--full .cl-doors.is-open .cl-doors__leaf { display: none; }

/* Barra "Prossima fermata" */
.cl-nextstop {
	display: flex; align-items: stretch; margin: clamp(40px, 6vw, 80px) var(--cl-gutter) 0; max-width: 1300px;
	text-decoration: none; border-radius: 14px; overflow: hidden; background: var(--cl-navy-deep); color: #fff; box-shadow: var(--cl-shadow);
}
.cl-nextstop:hover { color: #fff; }
.cl-nextstop__label {
	flex: none; display: flex; align-items: center; padding: 0 22px; background: var(--cl-accent);
	font: 500 12px/1.2 var(--cl-font-mono); letter-spacing: .16em; text-transform: uppercase;
}
.cl-nextstop__screen { position: relative; flex: 1; min-width: 0; overflow: hidden; padding: 16px 0; white-space: nowrap; }
.cl-nextstop__screen::after {
	content: ""; position: absolute; inset: 0; pointer-events: none;
	background-image: radial-gradient(rgba(0, 0, 0, .35) 1px, transparent 1.4px); background-size: 4px 4px;
}
.cl-nextstop__text {
	display: inline-block; white-space: nowrap; padding-left: 24px;
	font: 500 clamp(15px, 1.4vw, 19px)/1.3 var(--cl-font-mono); color: var(--cl-amber); letter-spacing: .06em; text-transform: uppercase;
	text-shadow: 0 0 8px rgba(242, 183, 5, .45);
}
.cl-nextstop__go { flex: none; display: grid; place-items: center; width: 64px; border-left: 1px solid rgba(255, 255, 255, .1); }
.cl-nextstop__go .cl-icon { width: 22px; height: 22px; transition: transform .35s var(--cl-ease); }
.cl-nextstop:hover .cl-nextstop__go .cl-icon { transform: translateX(4px); }

/* --------------------------------------------------------------------------
   Fermate con icone
   -------------------------------------------------------------------------- */
.cl-route__line {
	position: relative; display: grid; grid-template-columns: repeat(var(--n), minmax(0, 1fr)); gap: 32px;
	margin: 0; padding: 0; list-style: none;
}
.cl-route__rail { position: absolute; left: 0; right: 0; top: 64px; height: 8px; border-radius: 4px; background: rgba(20, 33, 61, .1); }
.cl-route__fill { position: absolute; inset: 0; border-radius: 4px; background: var(--cl-navy); transform-origin: left; }
.cl-route__train {
	position: absolute; top: 50%; left: 0; width: 46px; height: 18px; margin-top: -9px; border-radius: 9px;
	background: var(--cl-accent); box-shadow: 0 0 0 4px var(--cl-bg); opacity: 0;
}
.cl-route__stop {
	position: relative; z-index: 1; display: flex; flex-direction: column; padding: 26px 24px 28px; border-radius: 20px;
	background: var(--cl-surface); border: 1px solid var(--cl-line);
	box-shadow: 0 1px 2px rgba(20, 33, 61, .05), 0 18px 36px -24px rgba(20, 33, 61, .35);
	transition: border-color .4s, box-shadow .4s, transform .4s var(--cl-ease);
}
.cl-route__icon {
	display: grid; place-items: center; width: 76px; height: 76px; border-radius: 16px; margin-bottom: 22px;
	background: var(--cl-navy); color: #fff; transition: background-color .4s, transform .4s var(--cl-ease);
}
.cl-route__icon .cl-icon { width: 34px; height: 34px; }
.cl-route__stop.is-lit { border-color: rgba(0, 135, 107, .45); }
.cl-route__stop.is-lit .cl-route__icon { background: var(--cl-accent); }
.cl-route__stop:hover { box-shadow: 0 1px 2px rgba(20, 33, 61, .05), 0 26px 44px -24px rgba(20, 33, 61, .45); }
.cl-route__num { display: block; font: 500 12px var(--cl-font-mono); letter-spacing: .16em; color: var(--cl-accent); margin-bottom: 8px; }
.cl-route__title { font-size: clamp(20px, 1.6vw, 24px); margin-bottom: 10px; }
.cl-route__text { color: var(--cl-muted); margin: 0; }

/* --------------------------------------------------------------------------
   Bio
   -------------------------------------------------------------------------- */
.cl-bio__inner { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: clamp(32px, 7vw, 130px); align-items: center; }
.cl-bio__media { position: relative; }
.cl-bio__media .cl-doors { aspect-ratio: 4 / 5; border-radius: 120px 28px 28px 28px; }
.cl-bio__body { font-size: 1.08em; color: var(--cl-muted); max-width: 680px; }
.cl-bio__stats { display: flex; flex-wrap: wrap; gap: 14px 44px; margin: 30px 0 34px; padding: 22px 0; border-block: 1px solid var(--cl-line); }
.cl-bio__stats div { display: flex; flex-direction: column-reverse; }
.cl-bio__stats dt { font: 500 12px var(--cl-font-mono); letter-spacing: .14em; text-transform: uppercase; color: var(--cl-muted); }
.cl-bio__stats dd { margin: 0; font: 800 clamp(34px, 3.4vw, 52px)/1 var(--cl-font-head); letter-spacing: -.03em; color: var(--cl-navy); }

/* --------------------------------------------------------------------------
   Griglie e schede articolo con carta strappata
   -------------------------------------------------------------------------- */
.cl-grid { display: grid; gap: clamp(28px, 3vw, 48px) clamp(20px, 2.4vw, 40px); }
.cl-grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.cl-grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.cl-grid--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.cl-grid--list { grid-template-columns: 1fr; }

.cl-card { position: relative; }
.cl-card__link { display: block; text-decoration: none; color: inherit; }
.cl-card__link:hover { color: inherit; }
.cl-card__media { position: relative; aspect-ratio: 4 / 3; border-radius: var(--cl-radius); overflow: hidden; background: var(--cl-navy); }
.cl-card__media img { width: 100%; height: 100%; object-fit: cover; transition: transform .9s var(--cl-ease), filter .6s; }
.cl-card__link:hover .cl-card__media img { transform: scale(1.05); }
.cl-card__noimg { display: grid; place-items: center; width: 100%; height: 100%; color: rgba(255, 255, 255, .5); background: repeating-linear-gradient(135deg, var(--cl-navy-2) 0 14px, var(--cl-navy) 14px 28px); }
.cl-card__noimg .cl-icon { width: 46px; height: 46px; }

.cl-card__paper {
	position: relative; z-index: 2; margin: -64px 14px 0;
	filter: drop-shadow(0 10px 14px rgba(20, 33, 61, .2)) drop-shadow(0 1px 1px rgba(20, 33, 61, .18));
	transform: none;
	transition: transform .5s var(--cl-ease);
}
.cl-card__link:hover .cl-card__paper { transform: translateY(-6px); }
.cl-card__sheet {
	-webkit-clip-path: var(--clip); clip-path: var(--clip);
	padding: 22px 22px 26px;
	background-color: var(--cl-paper);
	background-image:
		linear-gradient(90deg, rgba(20, 33, 61, .045) 1px, transparent 1px),
		radial-gradient(circle at 20% 30%, rgba(255, 255, 255, .55), transparent 55%),
		radial-gradient(circle at 80% 90%, rgba(120, 100, 70, .07), transparent 50%);
	background-size: 100% 100%, 100% 100%, 100% 100%;
	background-position: 50% 0, 0 0, 0 0;
}
.cl-card__meta {
	display: block; margin-bottom: 10px; padding-bottom: 8px; border-bottom: 1px solid rgba(20, 33, 61, .18);
	font: 500 11.5px/1.3 var(--cl-font-mono); letter-spacing: .14em; text-transform: uppercase; color: var(--cl-muted);
}
.cl-card__title {
	font-family: var(--cl-font-paper); font-weight: 700; letter-spacing: -.01em; line-height: 1.16;
	font-size: clamp(20px, 1.6vw, 26px); margin: 0 0 14px; color: #1a1a1a;
}
.cl-card__title .cl-mark { color: #1a1a1a; }
.cl-card__excerpt { font-family: var(--cl-font-paper); color: #3a3a3a; margin: 0 0 14px; }
.cl-card__foot { display: flex; gap: 16px; font: 500 12px var(--cl-font-mono); color: var(--cl-muted); }
.cl-card__foot > span { display: inline-flex; align-items: center; gap: 6px; }
.cl-card__foot .cl-icon { width: 15px; height: 15px; }

.cl-rcard { height: 100%; }
.cl-rcard__link { display: flex; flex-direction: column; height: 100%; text-decoration: none; color: inherit; border-radius: var(--cl-radius); overflow: hidden; background: var(--cl-navy); transition: transform .5s var(--cl-ease), box-shadow .5s; }
.cl-rcard__link:hover { color: inherit; transform: translateY(-4px); box-shadow: 0 22px 40px -24px rgba(20, 33, 61, .6); }
.cl-rcard__media { aspect-ratio: 16 / 10; overflow: hidden; background: var(--cl-navy-2); }
.cl-rcard__media img { width: 100%; height: 100%; object-fit: cover; transition: transform .9s var(--cl-ease); }
.cl-rcard__link:hover .cl-rcard__media img { transform: scale(1.05); }
.cl-rcard__sign { flex: 1; display: flex; flex-direction: column; gap: 16px; padding: 0 0 20px; color: #fff; border-top: 6px solid var(--cl-navy); }
.cl-rcard__stripe { display: flex; align-items: center; gap: 10px; padding: 9px 22px; background: #fff; color: var(--cl-navy); font: 500 11.5px/1.2 var(--cl-font-mono); letter-spacing: .12em; text-transform: uppercase; }
.cl-rcard__roundel { position: relative; flex: none; width: 18px; height: 18px; border-radius: 50%; border: 4px solid var(--cl-accent); }
.cl-rcard__roundel::after { content: ""; position: absolute; left: -7px; right: -7px; top: 50%; height: 4px; margin-top: -2px; background: var(--cl-navy); }
.cl-rcard__cat { font-weight: 500; }
.cl-rcard__date { margin-left: auto; color: var(--cl-muted); white-space: nowrap; }
.cl-rcard__title { margin: 0; padding: 0 22px; color: #fff; font: 800 clamp(19px, 1.45vw, 23px)/1.22 var(--cl-font-head); letter-spacing: -.015em; text-wrap: balance; }
.cl-rcard__title .cl-mark { color: var(--cl-navy); }
.cl-rcard__foot { margin-top: auto; display: flex; align-items: center; gap: 16px; padding: 0 22px; font: 500 12px var(--cl-font-mono); color: #C9D1E0; }
.cl-rcard__foot > span { display: inline-flex; align-items: center; gap: 6px; }
.cl-rcard__foot .cl-icon { width: 15px; height: 15px; }
.cl-rcard__go { margin-left: auto; width: 38px; height: 38px; border-radius: 50%; background: #fff; color: var(--cl-navy); justify-content: center; transition: background .3s, color .3s; }
.cl-rcard__go .cl-icon { width: 22px; height: 22px; }
.cl-rcard__link:hover .cl-rcard__go { background: var(--cl-accent); color: #fff; }
.cl-card--grid .cl-card__paper { margin: 0; transform: none; filter: none; }
.cl-card--grid .cl-card__sheet { clip-path: none; background: transparent; padding: 18px 0 0; }
.cl-card--grid .cl-card__title { font-family: var(--cl-font-head); font-weight: 800; color: var(--cl-navy); }
.cl-card--list .cl-card__link { display: grid; grid-template-columns: minmax(200px, 360px) 1fr; gap: 0; align-items: center; }
.cl-card--list .cl-card__paper { margin: 0 0 0 -40px; }
.cl-card--list .cl-card__title { font-size: clamp(22px, 2vw, 32px); }

/* --------------------------------------------------------------------------
   Call to action: cartello di stazione
   -------------------------------------------------------------------------- */
.cl-cta__sign {
	position: relative; display: flex; align-items: center; justify-content: space-between; gap: 32px; flex-wrap: wrap;
	padding: clamp(36px, 5vw, 72px) clamp(28px, 6vw, 96px); border-radius: 22px;
	background: var(--cl-navy); color: #fff; overflow: hidden;
	box-shadow: inset 0 0 0 6px var(--cl-navy), inset 0 0 0 8px rgba(255, 255, 255, .85), var(--cl-shadow);
}
.cl-cta__sign::after {
	content: ""; position: absolute; right: -110px; bottom: -130px; width: 300px; height: 300px; border-radius: 50%;
	border: 26px solid var(--cl-accent); opacity: .9;
}
.cl-cta__bolt { position: absolute; width: 10px; height: 10px; border-radius: 50%; background: #A9B4CA; box-shadow: inset -2px -2px 0 rgba(0, 0, 0, .3); }
.cl-cta__bolt--tl { top: 20px; left: 20px; } .cl-cta__bolt--tr { top: 20px; right: 20px; z-index: 1; }
.cl-cta__bolt--bl { bottom: 20px; left: 20px; } .cl-cta__bolt--br { bottom: 20px; right: 20px; }
.cl-cta__text { position: relative; z-index: 1; max-width: 900px; }
.cl-cta__kicker { margin: 0 0 12px; font: 500 13px var(--cl-font-mono); letter-spacing: .16em; text-transform: uppercase; color: var(--cl-highlight); }
.cl-cta__title { color: #fff; margin: 0 0 14px; font-size: clamp(30px, 4vw, 58px); }
.cl-cta__lead { margin: 0; color: #C9D1E0; font-size: 1.1em; }
.cl-cta .cl-btn { position: relative; z-index: 1; }

/* --------------------------------------------------------------------------
   Tabellone delle partenze
   -------------------------------------------------------------------------- */
.cl-board {
	border-radius: 18px; overflow: hidden; background: #101114; color: #fff;
	box-shadow: var(--cl-shadow), inset 0 0 0 1px rgba(255, 255, 255, .06);
	font-family: var(--cl-font-mono);
	background-image: linear-gradient(180deg, #17181c, #0c0d10);
}
.cl-board__head, .cl-board__row > a, .cl-board__row > span {
	display: grid; grid-template-columns: 120px 120px minmax(0, 1fr) minmax(0, .42fr) 150px; gap: 22px; align-items: center;
	padding: 0 28px;
}
.cl-board__head {
	padding-block: 16px; background: #1d1f25; font-size: 11.5px; letter-spacing: .16em; text-transform: uppercase; color: #F2C80F;
}
.cl-board__rows { margin: 0; padding: 0; list-style: none; }
.cl-board__row { border-top: 1px solid rgba(255, 255, 255, .06); }
.cl-board__row > a, .cl-board__row > span { padding-block: 16px; text-decoration: none; color: #fff; transition: background .25s; }
.cl-board__row > a:hover { background: rgba(242, 200, 15, .06); color: #fff; }
.cl-board__date, .cl-board__time { font-size: 20px; }
.cl-board__dest { font-size: 17px; }
.cl-board__place { font-size: 14px; display: grid; gap: 6px; }
.cl-board__venue { font: 500 11.5px/1.3 var(--cl-font-mono); color: #9AA3B5; letter-spacing: .04em; text-transform: uppercase; }

/* Tessere del tabellone a palette */
.cl-sf__tiles { display: flex; flex-wrap: wrap; gap: .28em .55em; }
.cl-sf__w { display: inline-flex; gap: .1em; }
.cl-sf__t {
	position: relative; display: inline-grid; place-items: center; width: 1.08em; height: 1.46em; border-radius: .12em;
	background: linear-gradient(180deg, #2a2b30 0 49.5%, #1f2024 50.5% 100%);
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08), 0 1px 2px rgba(0, 0, 0, .6);
	perspective: 4em; overflow: hidden;
}
.cl-sf__t::before { content: ""; position: absolute; left: 0; right: 0; top: 50%; height: 1px; margin-top: -.5px; background: rgba(0, 0, 0, .55); z-index: 2; }
.cl-sf__t::after { content: ""; position: absolute; top: 50%; left: 0; right: 0; height: .22em; margin-top: -.11em; border-left: 2px solid #0a0a0c; border-right: 2px solid #0a0a0c; z-index: 3; }
.cl-sf__c {
	display: block; font: 800 1.08em/1 var(--cl-font-head); color: #F5CF1B; letter-spacing: 0;
	text-shadow: 0 0 8px rgba(242, 200, 15, .25); transform-origin: 50% 50%; backface-visibility: hidden;
}
.cl-sf__t.is-flip .cl-sf__c { animation: clFlap .09s linear; }
@keyframes clFlap { 0% { transform: rotateX(0); } 50% { transform: rotateX(-88deg); filter: brightness(.6); } 100% { transform: rotateX(0); } }
.cl-board__row--annullato .cl-board__dest .cl-sf__c { color: #ff6b6b; }
.cl-board__status > span {
	display: inline-flex; padding: 6px 12px; border-radius: 6px; font-size: 12px; font-weight: 500; letter-spacing: .1em; text-transform: uppercase;
	background: var(--cl-accent); color: #fff;
}
.cl-board__row--limitati .cl-board__status > span, .cl-board__row--rinviato .cl-board__status > span { background: var(--cl-amber); color: var(--cl-navy); }
.cl-board__row--completo .cl-board__status > span { background: #5B6B92; }
.cl-board__row--annullato .cl-board__status > span { background: var(--cl-alt); animation: clBlink 1.6s steps(1) infinite; }
@keyframes clBlink { 50% { opacity: .55; } }
.cl-board__empty { margin: 0; padding: 34px 28px; color: var(--cl-amber); text-transform: uppercase; letter-spacing: .06em; }

/* --------------------------------------------------------------------------
   Video
   -------------------------------------------------------------------------- */
.cl-videos__grid { display: grid; grid-template-columns: 1.6fr 1fr; grid-auto-rows: auto; gap: clamp(20px, 2.4vw, 36px); }
.cl-videos__grid--1 { grid-template-columns: 1fr; }
.cl-videos__grid--2 { grid-template-columns: 1fr 1fr; }
/* Home: tre video uguali e il pulsante per vederli tutti */
.cl-videos__grid--even { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.cl-videos__grid--even .cl-video--lead { grid-row: auto; }
.cl-videos__more { display: flex; justify-content: center; margin-top: clamp(28px, 3.5vw, 48px); }
.cl-video--lead { grid-row: span 2; }
.cl-videos__grid--2 .cl-video--lead, .cl-videos__grid--1 .cl-video--lead { grid-row: auto; }
.cl-videos__grid:not(.cl-videos__grid--1):not(.cl-videos__grid--2):not(.cl-videos__grid--3) { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.cl-videos__grid:not(.cl-videos__grid--1):not(.cl-videos__grid--2):not(.cl-videos__grid--3) .cl-video--lead { grid-row: auto; }
.cl-video { margin: 0; }
.cl-video__frame { position: relative; aspect-ratio: 16 / 9; border-radius: var(--cl-radius); overflow: hidden; background: var(--cl-navy); }
.cl-video__frame img { width: 100%; height: 100%; object-fit: cover; transition: transform .8s var(--cl-ease); }
.cl-video__frame iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.cl-video:hover .cl-video__frame img { transform: scale(1.04); }
.cl-video__play { position: absolute; inset: 0; border: 0; background: linear-gradient(180deg, transparent 50%, rgba(14, 24, 48, .55)); display: grid; place-items: center; }
.cl-video__play-icon {
	display: grid; place-items: center; width: 74px; height: 74px; border-radius: 50%; background: #fff; color: var(--cl-navy);
	box-shadow: 0 0 0 0 rgba(255, 255, 255, .5); transition: transform .35s var(--cl-ease), box-shadow .6s;
}
.cl-video__play:hover .cl-video__play-icon { transform: scale(1.08); box-shadow: 0 0 0 14px rgba(255, 255, 255, .18); background: var(--cl-accent); color: #fff; }
.cl-video__play-icon svg { margin-left: 4px; }
.cl-video__consent {
	position: absolute; inset: 0; z-index: 3; display: flex; flex-direction: column; justify-content: center; gap: 14px; padding: 24px;
	background: rgba(14, 24, 48, .94); color: #fff; font-size: 15px;
}
.cl-video__consent p { margin: 0; max-width: 46ch; }
.cl-video__consent-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 16px; }
.cl-video__consent .cl-link { color: #fff; }
.cl-video__consent .cl-btn { background: var(--cl-accent); border-color: var(--cl-accent); }
.cl-video figcaption { padding-top: 14px; display: flex; flex-direction: column; gap: 6px; }
.cl-video__date { font: 500 12px var(--cl-font-mono); letter-spacing: .12em; text-transform: uppercase; color: var(--cl-muted); }
.cl-video__title { font: 700 clamp(17px, 1.3vw, 21px)/1.3 var(--cl-font-head); color: var(--cl-navy); }
.cl-video--lead .cl-video__title { font-size: clamp(21px, 2vw, 30px); }

/* --------------------------------------------------------------------------
   Striscia delle testate
   -------------------------------------------------------------------------- */
.cl-press { position: relative; padding-block: 44px; border-block: 1px solid var(--cl-line); background: var(--cl-surface); }
.cl-press__label { margin: 0 0 22px; padding-inline: var(--cl-gutter); font: 500 12px var(--cl-font-mono); letter-spacing: .18em; text-transform: uppercase; color: var(--cl-muted); text-align: center; }
.cl-press__viewport { overflow: hidden; -webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); }
.cl-press__track { display: flex; width: max-content; animation: clMarquee 38s linear infinite; }
.cl-press__viewport:hover .cl-press__track { animation-play-state: paused; }
.cl-press__list { display: flex; align-items: center; margin: 0; padding: 0; list-style: none; }
.cl-press__item a, .cl-press__item > span, .cl-press__item > img { display: block; padding: 0 clamp(26px, 3vw, 54px); }
.cl-press__item a { text-decoration: none; }
.cl-press__item img { max-height: 42px; width: auto; filter: grayscale(1) contrast(1.2); opacity: .75; transition: filter .3s, opacity .3s; }
.cl-press__item:hover img { filter: none; opacity: 1; }
.cl-press__name { font: 700 clamp(22px, 2.2vw, 32px)/1 var(--cl-font-paper); color: var(--cl-navy); white-space: nowrap; letter-spacing: -.01em; }
.cl-press__item a:hover .cl-press__name { color: var(--cl-accent); }
.cl-press__sep { width: 14px; height: 14px; border-radius: 50%; border: 4px solid var(--cl-accent); flex: none; }
@keyframes clMarquee { to { transform: translateX(-50%); } }

/* --------------------------------------------------------------------------
   Newsletter: il biglietto
   -------------------------------------------------------------------------- */
.cl-nl { position: relative; z-index: 1; background: var(--cl-navy); color: #fff; padding-block: clamp(64px, 8vw, 120px); overflow: hidden; }
.cl-nl__inner { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(32px, 6vw, 110px); align-items: center; }
.cl-nl__title { color: #fff; font-size: clamp(34px, 4.6vw, 64px); }
.cl-nl__lead { color: #C9D1E0; font-size: 1.1em; max-width: 560px; }
.cl-nl__perks { margin: 26px 0 0; padding: 0; list-style: none; display: grid; gap: 12px; }
.cl-nl__perks li { display: flex; align-items: center; gap: 14px; font-weight: 500; }
.cl-nl__perks .cl-icon { width: 42px; height: 42px; padding: 10px; border-radius: 11px; background: #fff; color: var(--cl-accent); flex: none; }
.cl-nl__box { display: flex; flex-direction: column; align-items: center; gap: 20px; }
.cl-nl__box .cl-pass { width: 270px; transition: transform .4s var(--cl-ease); }
.cl-nl__box .cl-pass:hover { transform: translateY(-6px) rotate(-1.5deg); }
.cl-nl__hint { display: inline-flex; align-items: center; gap: 10px; margin: 0; font: 500 12px var(--cl-font-mono); letter-spacing: .12em; text-transform: uppercase; color: var(--cl-highlight); }
.cl-nl__dot { width: 10px; height: 10px; border-radius: 50%; background: var(--cl-highlight); animation: clPulse 1.6s ease-out infinite; }
@keyframes clPulse { 0% { box-shadow: 0 0 0 0 rgba(168, 230, 210, .6); } 100% { box-shadow: 0 0 0 12px rgba(168, 230, 210, 0); } }

/* Il banner della newsletter */
.cl-nlm { position: fixed; inset: 0; z-index: 95; display: grid; place-items: center; padding: 20px; }
.cl-nlm__backdrop { position: absolute; inset: 0; background: rgba(8, 14, 30, .72); backdrop-filter: blur(4px); }
.cl-nlm__panel {
	position: relative; width: min(980px, 100%); max-height: calc(100vh - 40px); overflow: auto; display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr);
	gap: clamp(24px, 4vw, 56px); align-items: center; padding: clamp(28px, 4vw, 56px); border-radius: 26px; background: var(--cl-navy); color: #fff;
	box-shadow: 0 40px 80px -30px rgba(0, 0, 0, .7);
}
.cl-nlm__title { color: #fff; font-size: clamp(30px, 3.6vw, 48px); margin-bottom: 14px; }
.cl-nlm__lead { color: #C9D1E0; margin: 0; }
.cl-nlm__form { background: var(--cl-surface); color: var(--cl-navy); border-radius: 20px; padding: clamp(22px, 2.6vw, 32px); }
.cl-nlm__close { position: absolute; top: 14px; right: 18px; width: 42px; height: 42px; border-radius: 50%; border: 1px solid rgba(255, 255, 255, .25); background: transparent; color: #fff; display: grid; place-items: center; cursor: pointer; }
.cl-nlm__close:hover { background: #fff; color: var(--cl-navy); }
.cl-nlm__close .cl-icon { width: 20px; height: 20px; }
.cl-nlm-open { overflow: hidden; }
@media (max-width: 760px) {
	.cl-nlm { padding: 0; align-items: end; }
	.cl-nlm__panel { grid-template-columns: 1fr; border-radius: 22px 22px 0 0; max-height: 92vh; padding: 56px 20px 24px; }
	.cl-nlm__text .cl-nl__perks { display: none; }
}

/* Il biglietto, sul modello dei titoli di viaggio campani */
.cl-pass {
	position: relative; display: grid; grid-template-columns: 20px 1fr; width: 250px; min-height: 372px; cursor: pointer; -webkit-tap-highlight-color: transparent; user-select: none;
	border-radius: 14px; overflow: hidden; background: var(--cl-accent); color: #fff;
	box-shadow: 0 30px 50px -18px rgba(0, 0, 0, .55), inset 0 0 0 1px rgba(255, 255, 255, .12);
	font-family: var(--cl-font-head); text-transform: uppercase;
}
.cl-pass__mag { background: #F4F1EA; border-right: 1px solid rgba(0, 0, 0, .12);
	background-image: repeating-linear-gradient(180deg, transparent 0 9px, rgba(20, 33, 61, .55) 9px 11px, transparent 11px 14px, rgba(20, 33, 61, .3) 14px 15px); background-size: 6px 100%; background-repeat: no-repeat; background-position: 7px 0; }
.cl-pass__body { position: relative; display: flex; flex-direction: column; padding: 0 12px 10px; min-width: 0; }
.cl-pass__validate { position: relative; margin: 0 -12px; padding: 20px 10px 7px; background: #fff; color: var(--cl-accent); font: 700 9px/1.15 var(--cl-font-mono); letter-spacing: .1em; text-align: center; }
.cl-pass__roof { position: absolute; left: 50%; top: 4px; width: 30px; height: 12px; margin-left: -15px; background: var(--cl-accent); clip-path: polygon(0 100%, 50% 0, 100% 100%, 82% 100%, 50% 34%, 18% 100%); }
.cl-pass__stamp { position: absolute; inset: 3px 6px; display: grid; place-items: center; border: 2px solid #3B4BA8; border-radius: 4px; color: #3B4BA8; font: 700 10px var(--cl-font-mono); letter-spacing: .06em; background: rgba(255, 255, 255, .9); opacity: 0; transform: rotate(-6deg); }
.cl-pass.is-stamped .cl-pass__stamp { opacity: 1; }
.cl-pass:focus-visible { outline: 3px solid var(--cl-highlight); outline-offset: 4px; }
.cl-pass__hole { position: absolute; width: 14px; height: 14px; border-radius: 50%; background: var(--cl-navy); box-shadow: inset 0 2px 3px rgba(0, 0, 0, .5); pointer-events: none; }
.cl-nl__form.is-called { animation: clCall .9s var(--cl-ease); }
@keyframes clCall { 0%, 100% { box-shadow: 0 30px 60px -20px rgba(0, 0, 0, .5); } 40% { box-shadow: 0 0 0 6px var(--cl-highlight), 0 30px 60px -20px rgba(0, 0, 0, .5); } }
.cl-pass__brand { margin-top: 10px; font-size: 44px; font-weight: 800; letter-spacing: -.02em; line-height: .9; }
.cl-pass__i { position: relative; display: inline-block; }
.cl-pass__i i { position: absolute; left: 50%; top: -9px; width: 11px; height: 11px; margin-left: -5.5px; border-radius: 50%; background: var(--cl-highlight); }
.cl-pass__band { margin: 6px -12px 0; padding: 3px 12px; background: #fff; color: var(--cl-accent); font-size: 21px; font-weight: 800; letter-spacing: .02em; line-height: 1.1; }
.cl-pass__zone { display: flex; justify-content: space-between; align-items: flex-end; margin-top: 7px; font: 500 9.5px/1.2 var(--cl-font-mono); letter-spacing: .04em; text-transform: none; }
.cl-pass__zone span:last-child { font: 800 11px var(--cl-font-head); letter-spacing: .12em; text-transform: uppercase; }
.cl-pass__code { position: relative; font-size: 92px; font-weight: 800; letter-spacing: -.05em; line-height: .86; margin-top: 4px; }
.cl-pass__map { position: absolute; right: 0; top: 14px; width: 58px; height: 58px; color: rgba(255, 255, 255, .85); }
.cl-pass__price { display: flex; justify-content: space-between; align-items: baseline; gap: 8px; margin: 8px -12px 0; padding: 5px 12px; background: rgba(255, 255, 255, .16); font-size: 15px; font-weight: 800; letter-spacing: .02em; }
.cl-pass__price strong { font-size: 18px; white-space: nowrap; }
.cl-pass__big { margin-top: auto; font-size: 34px; font-weight: 800; line-height: 1; letter-spacing: -.02em; color: rgba(255, 255, 255, .28); white-space: nowrap; }
.cl-pass__foot { margin-top: 4px; font: 500 8.5px var(--cl-font-mono); letter-spacing: .12em; opacity: .85; }

/* Titolo scritto a macchina: la firma */
.cl-typed { white-space: normal; }
.cl-typed .cl-mark { background-size: 100% 100% !important; }
.cl-typed__caret { display: inline-block; width: .085em; height: .86em; margin-left: .06em; vertical-align: -.04em; background: var(--cl-accent); border-radius: 2px; animation: clBlink 1.05s steps(1, end) infinite; }
.cl-typed.is-typing .cl-typed__caret { animation: none; opacity: 1; }
.cl-typed.is-static .cl-typed__caret { animation: none; }
@keyframes clBlink { 0%, 50% { opacity: 1; } 50.01%, 100% { opacity: 0; } }

/* --------------------------------------------------------------------------
   Moduli
   -------------------------------------------------------------------------- */
.cl-form { display: grid; gap: 18px; }
.cl-form__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.cl-field { display: grid; gap: 8px; margin: 0; border: 0; padding: 0; min-width: 0; }
.cl-field > label, .cl-field > legend { font: 500 12px var(--cl-font-mono); letter-spacing: .14em; text-transform: uppercase; color: var(--cl-muted); padding: 0; }
.cl-field > legend { margin-bottom: 10px; }
.cl-field input, .cl-field textarea, .cl-field select, .cl-searchbar input {
	width: 100%; padding: 14px 16px; border-radius: 12px; border: 2px solid var(--cl-line); background: var(--cl-surface); color: var(--cl-navy);
	font: 400 17px/1.4 var(--cl-font-body); transition: border-color .2s, box-shadow .2s;
}
.cl-field textarea { resize: vertical; min-height: 140px; }
.cl-field input:focus, .cl-field textarea:focus, .cl-searchbar input:focus { outline: none; border-color: var(--cl-accent); box-shadow: 0 0 0 4px rgba(0, 135, 107, .15); }
.cl-field input:invalid.is-touched, .cl-field textarea:invalid.is-touched { border-color: var(--cl-alt); }
.cl-field--inline { grid-template-columns: 1fr auto; align-items: end; }
.cl-field--inline label { grid-column: 1 / -1; }
.cl-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.cl-chip { position: relative; }
.cl-chip input { position: absolute; opacity: 0; inset: 0; cursor: pointer; }
.cl-chip span { display: inline-block; padding: 9px 16px; border-radius: 999px; border: 2px solid var(--cl-line); background: var(--cl-surface); font-weight: 500; font-size: 15px; transition: .2s; }
.cl-chip input:checked + span { background: var(--cl-navy); border-color: var(--cl-navy); color: #fff; }
.cl-chip input:focus-visible + span { outline: 3px solid var(--cl-accent); outline-offset: 2px; }
.cl-check { display: grid; grid-template-columns: 22px 1fr; gap: 12px; align-items: start; margin: 0; font-size: 14.5px; color: var(--cl-muted); line-height: 1.5; }
.cl-check input { width: 22px; height: 22px; margin: 1px 0 0; accent-color: var(--cl-accent); }
.cl-check a { color: var(--cl-navy); }
.cl-form__foot { display: flex; align-items: center; gap: 18px; flex-wrap: wrap; }
.cl-form__status { margin: 0; font-weight: 600; color: var(--cl-accent); }
.cl-form__status.is-error { color: var(--cl-alt); }
.cl-form__status:empty { display: none; }
.cl-hp { position: absolute !important; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.cl-searchbar { display: flex; gap: 12px; margin-top: 24px; max-width: 720px; }

/* --------------------------------------------------------------------------
   Footer
   -------------------------------------------------------------------------- */
.cl-footer { position: relative; z-index: 1; background: var(--cl-navy-deep); color: #C9D1E0; padding: 70px 0 30px; overflow: hidden; }
.cl-footer__line { position: absolute; top: 0; left: 0; width: 100%; height: 60px; color: var(--cl-accent); opacity: .7; }
.cl-footer__grid { display: grid; grid-template-columns: 1.6fr repeat(3, 1fr); gap: 48px; padding-top: 30px; }
.cl-footer--3 .cl-footer__grid { grid-template-columns: 1.6fr 1fr 1fr; }
.cl-footer .cl-logo { font-size: 44px; margin-bottom: 22px; }
.cl-footer__about { max-width: 420px; }
.cl-footer__title { margin: 0 0 18px; font: 500 12px var(--cl-font-mono); letter-spacing: .18em; text-transform: uppercase; color: var(--cl-highlight); }
.cl-footer__menu { margin: 0; padding: 0; list-style: none; display: grid; gap: 10px; }
.cl-footer__menu a { color: #fff; text-decoration: none; }
.cl-footer__menu a:hover { color: var(--cl-highlight); }
.cl-footer__bottom { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 14px 30px; margin-top: 60px; padding-top: 24px; border-top: 1px solid rgba(255, 255, 255, .1); font-size: 14px; }
.cl-footer__bottom p { margin: 0; }
.cl-footer__legal { display: flex; flex-wrap: wrap; gap: 18px; margin: 0; padding: 0; list-style: none; }
.cl-footer__legal a { color: #fff; }
.cl-footer__credits { opacity: .7; }

.cl-social { display: flex; flex-wrap: wrap; gap: 10px; margin: 22px 0 0; padding: 0; list-style: none; }
.cl-social a { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 50%; border: 1.5px solid rgba(20, 33, 61, .18); color: var(--cl-navy); transition: .25s; }
.cl-social a:hover { background: var(--cl-accent); border-color: var(--cl-accent); color: #fff; transform: translateY(-2px); }
.cl-social .cl-icon { width: 19px; height: 19px; }
.cl-social--light a { border-color: rgba(255, 255, 255, .22); color: #fff; }

/* Avviso breve */
.cl-toast {
	position: fixed; left: 50%; bottom: 28px; z-index: 300; transform: translateX(-50%); max-width: min(560px, calc(100% - 32px));
	padding: 16px 22px; border-radius: 14px; background: var(--cl-navy); color: #fff; box-shadow: var(--cl-shadow); font-weight: 500;
	display: flex; align-items: center; gap: 12px;
}
.cl-toast::before { content: ""; width: 12px; height: 12px; border-radius: 50%; background: var(--cl-accent); flex: none; }

/* --------------------------------------------------------------------------
   Banner cookie e preferenze
   -------------------------------------------------------------------------- */
.cl-consent {
	position: fixed; z-index: 400; left: 20px; bottom: 20px; width: min(460px, calc(100% - 40px));
	padding: 26px 24px 22px; border-radius: 20px; background: var(--cl-surface); color: var(--cl-navy);
	box-shadow: 0 30px 70px -20px rgba(14, 24, 48, .45), 0 0 0 1px rgba(20, 33, 61, .08);
	font-size: 15px; line-height: 1.5;
}
.cl-consent--bar { left: 0; right: 0; bottom: 0; width: auto; border-radius: 20px 20px 0 0; display: grid; grid-template-columns: 1fr auto; gap: 24px; align-items: center; padding: 22px var(--cl-gutter); }
.cl-consent__close { position: absolute; top: 12px; right: 12px; width: 40px; height: 40px; border: 0; border-radius: 50%; background: var(--cl-bg); display: grid; place-items: center; color: var(--cl-navy); }
.cl-consent__close:hover { background: var(--cl-navy); color: #fff; }
.cl-consent__close .cl-icon { width: 18px; height: 18px; }
.cl-consent__kicker { display: flex; align-items: center; gap: 8px; margin: 0 0 6px; font: 500 12px var(--cl-font-mono); letter-spacing: .16em; text-transform: uppercase; color: var(--cl-accent); }
.cl-consent__kicker .cl-icon { width: 18px; height: 18px; }
.cl-consent__title { font-size: 22px; margin: 0 0 8px; padding-right: 40px; }
.cl-consent__text { margin: 0 0 18px; color: var(--cl-muted); }
.cl-consent__text a { color: var(--cl-navy); }
.cl-consent__actions { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.cl-consent--bar .cl-consent__actions { grid-template-columns: auto auto auto; }
.cl-consent__btn {
	min-height: 48px; padding: 10px 18px; border-radius: 999px; border: 2px solid var(--cl-navy); background: var(--cl-navy); color: #fff; font-weight: 600;
	transition: background .2s, border-color .2s;
}
.cl-consent__btn:hover { background: var(--cl-accent); border-color: var(--cl-accent); }
.cl-consent__link { grid-column: 1 / -1; justify-self: center; background: none; border: 0; padding: 6px; text-decoration: underline; text-underline-offset: 4px; color: var(--cl-navy); font-weight: 500; }
.cl-consent--bar .cl-consent__link { grid-column: auto; }
.cl-prefs { position: fixed; inset: 0; z-index: 500; display: grid; place-items: center; padding: 16px; }
.cl-prefs__backdrop { position: absolute; inset: 0; background: rgba(14, 24, 48, .6); }
.cl-prefs__dialog {
	position: relative; width: min(640px, 100%); max-height: calc(100vh - 32px); overflow-y: auto; padding: 28px;
	border-radius: 22px; background: var(--cl-surface); color: var(--cl-navy); box-shadow: 0 40px 80px -20px rgba(0, 0, 0, .5);
}
.cl-prefs__head { display: flex; justify-content: space-between; align-items: center; gap: 16px; margin-bottom: 8px; }
.cl-prefs__head h2 { margin: 0; font-size: 26px; }
.cl-prefs__x { width: 42px; height: 42px; border: 0; border-radius: 50%; background: var(--cl-bg); display: grid; place-items: center; }
.cl-prefs__intro { color: var(--cl-muted); }
.cl-prefs__list { margin: 0 0 20px; padding: 0; list-style: none; }
.cl-prefs__item { padding: 16px 0; border-top: 1px solid var(--cl-line); }
.cl-prefs__item p { margin: 6px 0 0; font-size: 14.5px; color: var(--cl-muted); padding-right: 70px; }
.cl-prefs__row { display: flex; justify-content: space-between; align-items: center; gap: 16px; }
.cl-prefs__label { font-weight: 700; font-size: 17px; }
.cl-prefs__foot { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.cl-prefs__id { margin: 16px 0 0; font-size: 12.5px; color: var(--cl-muted); }
.cl-switch { position: relative; display: inline-flex; flex: none; }
.cl-switch input { position: absolute; inset: 0; opacity: 0; margin: 0; cursor: pointer; z-index: 1; }
.cl-switch input:disabled { cursor: not-allowed; }
.cl-switch__ui { width: 52px; height: 30px; border-radius: 15px; background: #C9D0DB; position: relative; transition: background .2s; }
.cl-switch__ui::after { content: ""; position: absolute; top: 4px; left: 4px; width: 22px; height: 22px; border-radius: 50%; background: #fff; transition: transform .3s var(--cl-ease); box-shadow: 0 1px 3px rgba(0, 0, 0, .2); }
.cl-switch input:checked + .cl-switch__ui { background: var(--cl-accent); }
.cl-switch input:checked + .cl-switch__ui::after { transform: translateX(22px); }
.cl-switch input:disabled + .cl-switch__ui { opacity: .55; }
.cl-switch input:focus-visible + .cl-switch__ui { outline: 3px solid var(--cl-navy); outline-offset: 2px; }

/* --------------------------------------------------------------------------
   Transizione tra le pagine: le porte del treno
   -------------------------------------------------------------------------- */
.cl-transition { display: none !important; }
.cl-transition.is-active { visibility: visible; pointer-events: all; }
.cl-transition__door { position: absolute; top: 0; bottom: 0; width: 50.2%; background: var(--cl-navy); transform: translateX(-101%); }
.cl-transition__door--r { right: 0; transform: translateX(101%); }
.cl-transition__door--l { left: 0; border-right: 3px solid var(--cl-accent); }
.cl-transition__window { position: absolute; top: 18%; bottom: 46%; width: 42%; border-radius: 24px; border: 4px solid var(--cl-navy-3); background: linear-gradient(180deg, rgba(168, 230, 210, .18), transparent); }
.cl-transition__door--l .cl-transition__window { right: 14%; }
.cl-transition__door--r .cl-transition__window { left: 14%; }
.cl-transition__sign {
	position: absolute; left: 50%; bottom: 18%; transform: translateX(-50%); padding: 12px 22px; border-radius: 10px; opacity: 0;
	background: var(--cl-navy-deep); color: var(--cl-amber); font: 500 16px var(--cl-font-mono); letter-spacing: .12em; text-transform: uppercase; white-space: nowrap;
	box-shadow: 0 0 0 2px var(--cl-navy-3);
}

/* --------------------------------------------------------------------------
   Intestazioni di pagina
   -------------------------------------------------------------------------- */
.cl-pagehead { padding-bottom: clamp(16px, 3vw, 40px); }
.cl-pagehead__title { max-width: 1200px; font-size: clamp(40px, 6vw, var(--cl-h1)); }
.cl-pagehead__lead { max-width: 760px; font-size: 1.15em; color: var(--cl-muted); }

/* Filtro per tema come linee della metro */
.cl-lines { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 26px; }
.cl-lines__item {
	display: inline-flex; align-items: center; gap: 10px; padding: 6px 16px 6px 6px; border-radius: 999px;
	background: var(--cl-surface); border: 2px solid var(--cl-line); text-decoration: none; font-weight: 600; font-size: 15px; transition: .2s;
}
.cl-lines__badge { display: grid; place-items: center; width: 30px; height: 30px; border-radius: 7px; background: var(--cl-navy); color: #fff; font: 700 14px var(--cl-font-head); }
.cl-lines__item:hover { border-color: var(--cl-navy); color: var(--cl-navy); }
.cl-lines__item.is-active { background: var(--cl-navy); border-color: var(--cl-navy); color: #fff; }
.cl-lines__item.is-active .cl-lines__badge { background: var(--cl-accent); }

/* Paginazione a fermate */
.cl-pager { position: relative; margin-top: 64px; display: flex; justify-content: center; }
.cl-pager__rail { position: absolute; top: 50%; left: 50%; width: min(520px, 90%); height: 5px; margin-top: -2.5px; transform: translateX(-50%); background: var(--cl-line); border-radius: 3px; }
.cl-pager ul { position: relative; display: flex; gap: 14px; margin: 0; padding: 0; list-style: none; }
.cl-pager a, .cl-pager span.current, .cl-pager span.dots {
	display: grid; place-items: center; min-width: 46px; height: 46px; padding: 0 6px; border-radius: 50%;
	background: var(--cl-bg); border: 4px solid var(--cl-navy); text-decoration: none; font: 700 15px var(--cl-font-head); color: var(--cl-navy);
}
.cl-pager span.current { background: var(--cl-accent); border-color: var(--cl-accent); color: #fff; }
.cl-pager span.dots { border-color: transparent; }
.cl-pager a:hover { background: var(--cl-navy); color: #fff; }
.cl-pager .cl-icon { width: 18px; height: 18px; }

/* --------------------------------------------------------------------------
   Articolo
   -------------------------------------------------------------------------- */
.cl-article__head-inner { max-width: none; }
.cl-article__title { font-size: clamp(36px, 5.4vw, var(--cl-h1)); max-width: 1200px; line-height: 1.04; }
.cl-article__dek { font: 400 clamp(19px, 1.7vw, 25px)/1.45 var(--cl-font-paper); color: var(--cl-muted); max-width: 900px; }
.cl-article__meta { display: flex; flex-wrap: wrap; gap: 10px 26px; margin: 26px 0 0; padding: 0; list-style: none; font: 500 13px var(--cl-font-mono); letter-spacing: .04em; color: var(--cl-muted); }
.cl-article__meta li { display: inline-flex; align-items: center; gap: 8px; }
.cl-article__meta .cl-icon { width: 17px; height: 17px; color: var(--cl-accent); }
.cl-article__cover { margin: clamp(32px, 4vw, 56px) auto 0; }
.cl-article__cover .cl-doors { aspect-ratio: 16 / 8; border-radius: 24px; }
.cl-article__cover figcaption { margin-top: 10px; font-size: 14px; color: var(--cl-muted); }
.cl-share { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 16px; margin: 0 0 28px; }
.cl-share__label { margin: 0; font: 500 11px var(--cl-font-mono); letter-spacing: .16em; text-transform: uppercase; color: var(--cl-muted); }
.cl-share__list { margin: 0; padding: 0; list-style: none; display: flex; flex-wrap: wrap; gap: 8px; }
.cl-share__list a, .cl-share__list button {
	display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; border: 1.5px solid var(--cl-line); background: var(--cl-surface); color: var(--cl-navy); transition: .2s;
}
.cl-share__list a:hover, .cl-share__list button:hover { background: var(--cl-navy); color: #fff; border-color: var(--cl-navy); }
.cl-share__list .cl-icon { width: 18px; height: 18px; }

/* Barra del riassunto */
.cl-aibar { margin-bottom: 40px; border-radius: 16px; background: var(--cl-navy); border: 1px solid rgba(255, 255, 255, .08); color: #fff; overflow: hidden; box-shadow: 0 18px 40px -26px rgba(14, 24, 48, .7); }
.cl-aibar__bar { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 12px; padding: 14px 16px; }
.cl-aibar__tag { margin-right: 6px; font: 500 12px var(--cl-font-mono); letter-spacing: .14em; text-transform: uppercase; color: #9AA6BF; }
.cl-aibar__tab {
	display: inline-flex; align-items: center; gap: 9px; padding: 10px 16px; border-radius: 10px; cursor: pointer;
	background: var(--cl-navy-deep); border: 1px solid rgba(255, 255, 255, .12); color: #fff;
	font: 600 15.5px/1 var(--cl-font-head); transition: background .25s, border-color .25s, color .25s;
}
.cl-aibar__tab .cl-icon { width: 19px; height: 19px; }
.cl-aibar__tab:hover { border-color: rgba(255, 255, 255, .35); }
.cl-aibar__tab.is-on { background: #fff; border-color: #fff; color: var(--cl-navy); }
.cl-aibar__tab:focus-visible { outline: 2px solid var(--cl-highlight); outline-offset: 2px; }
.cl-aibar__panel { padding: 20px 22px 22px; border-top: 1px solid rgba(255, 255, 255, .08); background: var(--cl-navy-deep); overflow: hidden; }
.cl-aibar__head { margin: 0 0 10px; font: 500 12px var(--cl-font-mono); letter-spacing: .12em; text-transform: uppercase; color: var(--cl-highlight); }
.cl-aibar__text { margin: 0 0 12px; font: 400 18px/1.65 var(--cl-font-paper); color: #fff; min-height: 1.6em; }
.cl-aibar__text.is-typing::after { content: ""; display: inline-block; width: .5em; height: 1.05em; margin-left: 2px; vertical-align: -.15em; background: var(--cl-highlight); animation: clCaret .8s steps(1) infinite; }
.cl-aibar__note { margin: 12px 0 0; font-size: 13px; color: #9AA6BF; }

/* Ascolta */
.cl-listen { display: flex; align-items: center; gap: 18px; }
.cl-listen__play { flex: none; display: grid; place-items: center; width: 58px; height: 58px; border-radius: 50%; border: 0; background: var(--cl-accent); color: #fff; cursor: pointer; transition: transform .3s var(--cl-ease), background .3s; }
.cl-listen__play:hover { transform: scale(1.06); }
.cl-listen__play .cl-icon { width: 26px; height: 26px; }
.cl-listen__i--pause, .cl-listen.is-playing .cl-listen__i--play { display: none; }
.cl-listen.is-playing .cl-listen__i--pause { display: block; }
.cl-listen.is-playing .cl-listen__play { box-shadow: 0 0 0 0 rgba(0, 135, 107, .6); animation: clPulse2 1.8s ease-out infinite; }
@keyframes clPulse2 { 100% { box-shadow: 0 0 0 16px rgba(0, 135, 107, 0); } }
.cl-listen__main { flex: 1; min-width: 0; display: grid; gap: 10px; }
.cl-listen__rail { position: relative; height: 8px; border-radius: 4px; background: rgba(255, 255, 255, .14); cursor: pointer; }
.cl-listen__rail:focus-visible { outline: 2px solid var(--cl-highlight); outline-offset: 4px; }
.cl-listen__fill { position: absolute; left: 0; top: 0; bottom: 0; width: 0; border-radius: 4px; background: var(--cl-highlight); transition: width .4s; }
.cl-listen__meta { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 14px; font: 500 12.5px var(--cl-font-mono); color: #C9D1E0; }
.cl-listen__speeds { display: inline-flex; gap: 4px; }
.cl-listen__speeds button { padding: 5px 9px; border-radius: 7px; border: 1px solid rgba(255, 255, 255, .15); background: transparent; color: #C9D1E0; font: 500 12px var(--cl-font-mono); cursor: pointer; }
.cl-listen__speeds button.is-on { background: #fff; color: var(--cl-navy); border-color: #fff; }
.is-reading { background: linear-gradient(transparent 0, rgba(168, 230, 210, .55) 0); box-shadow: -10px 0 0 rgba(168, 230, 210, .55), 10px 0 0 rgba(168, 230, 210, .55); border-radius: 4px; transition: background .3s; }

/* Parole chiave */
.cl-kw { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 240px), 1fr)); gap: 10px; margin: 0; }
.cl-kw__item { padding: 14px 16px; border-radius: 12px; background: var(--cl-navy); border: 1px solid rgba(255, 255, 255, .1); }
.cl-kw__item dt { display: inline-block; margin-bottom: 6px; padding: 2px 8px; border-radius: 4px; background: var(--cl-highlight); color: var(--cl-navy); font: 700 15px/1.3 var(--cl-font-head); }
.cl-kw__item dd { margin: 0; font-size: 14.5px; line-height: 1.5; color: #C9D1E0; }

/* Test */
.cl-quiz { display: grid; gap: 18px; }
.cl-quiz__q { margin: 0; padding: 0; border: 0; min-width: 0; }
.cl-quiz__q legend { padding: 0; margin-bottom: 10px; font: 700 17px/1.4 var(--cl-font-head); color: #fff; }
.cl-quiz__q legend span { font: 500 12px var(--cl-font-mono); color: var(--cl-highlight); margin-right: 6px; }
.cl-quiz__opts { display: grid; gap: 8px; }
.cl-quiz__opt { text-align: left; padding: 12px 14px; border-radius: 10px; border: 1px solid rgba(255, 255, 255, .14); background: var(--cl-navy); color: #fff; font: 500 15px/1.4 var(--cl-font-body); cursor: pointer; transition: border-color .2s, background .2s; }
.cl-quiz__opt:hover:not(:disabled) { border-color: var(--cl-highlight); }
.cl-quiz__opt:disabled { cursor: default; opacity: .7; }
.cl-quiz__opt.is-right { opacity: 1; background: var(--cl-accent); border-color: var(--cl-accent); }
.cl-quiz__opt.is-wrong { opacity: 1; background: rgba(176, 16, 58, .35); border-color: var(--cl-alt); }
.cl-quiz__why { margin: 10px 0 0; font-size: 14.5px; color: #C9D1E0; }
.cl-quiz__why strong { color: #fff; }
.cl-quiz__score { margin: 4px 0 0; padding: 12px 14px; border-radius: 10px; background: rgba(168, 230, 210, .14); color: var(--cl-highlight); font: 600 15px var(--cl-font-head); }
.cl-aibar__note span { font-family: var(--cl-font-mono); color: var(--cl-highlight); }
.cl-aibar__loading { display: inline-flex; gap: 6px; }
.cl-aibar__loading i { width: 9px; height: 9px; border-radius: 50%; background: var(--cl-navy); animation: clStops 1s ease-in-out infinite; }
.cl-aibar__loading i:nth-child(2) { animation-delay: .15s; } .cl-aibar__loading i:nth-child(3) { animation-delay: .3s; }
@keyframes clStops { 50% { background: var(--cl-accent); transform: translateY(-4px); } }

/* Testo lungo */
.cl-prose { font-size: clamp(17px, 1.25vw, 19.5px); line-height: 1.75; }
.cl-prose > * { margin-block: 0 1.15em; }
.cl-prose h2 { font-size: clamp(26px, 2.4vw, 36px); margin-top: 1.8em; }
.cl-prose h3 { font-size: clamp(21px, 1.8vw, 26px); margin-top: 1.6em; }
.cl-prose a { color: var(--cl-navy); text-decoration-color: var(--cl-accent); text-decoration-thickness: 2px; }
.cl-prose a:hover { background: var(--cl-highlight); }
.cl-prose blockquote, .cl-prose .wp-block-quote, .cl-prose .wp-block-pullquote {
	position: relative; margin: 2em 0; padding: 4px 0 4px 34px; border: 0;
	font: 600 clamp(21px, 2vw, 28px)/1.4 var(--cl-font-paper); color: var(--cl-navy);
}
.cl-prose blockquote::before { content: ""; position: absolute; left: 0; top: 6px; bottom: 6px; width: 6px; border-radius: 3px; background: var(--cl-accent); }
.cl-prose blockquote::after { content: ""; position: absolute; left: -7px; top: 0; width: 20px; height: 20px; border-radius: 50%; background: var(--cl-bg); border: 5px solid var(--cl-navy); box-sizing: border-box; }
.cl-prose blockquote cite { display: block; margin-top: 10px; font: 500 13px var(--cl-font-mono); font-style: normal; letter-spacing: .1em; text-transform: uppercase; color: var(--cl-muted); }
.cl-prose ul, .cl-prose ol { padding-left: 1.3em; }
.cl-prose ul li::marker { color: var(--cl-accent); }
.cl-prose li { margin-bottom: .4em; }
.cl-prose figure { margin: 2em 0; }
.cl-prose img { border-radius: 14px; }
.cl-prose figcaption, .cl-prose .wp-element-caption { margin-top: 10px; font-size: 14px; color: var(--cl-muted); }
.cl-prose hr { border: 0; height: 5px; background: var(--cl-navy); border-radius: 3px; margin: 3em 0; position: relative; overflow: visible; }
.cl-prose table, .cl-legal-table { width: 100%; border-collapse: collapse; font-size: .9em; margin: 1.6em 0; }
.cl-prose th, .cl-prose td, .cl-legal-table th, .cl-legal-table td { padding: 12px 14px; border-bottom: 1px solid var(--cl-line); text-align: left; vertical-align: top; }
.cl-prose th, .cl-legal-table th { font: 500 12px var(--cl-font-mono); letter-spacing: .1em; text-transform: uppercase; color: var(--cl-muted); background: var(--cl-surface); }
.cl-prose .alignwide { margin-inline: calc(-1 * min(14vw, 220px)); max-width: none; }
.cl-prose .alignfull { margin-inline: calc(50% - 50vw); max-width: 100vw; }
.cl-prose iframe { width: 100%; border-radius: 14px; }
.cl-prose code { font-family: var(--cl-font-mono); font-size: .88em; padding: .1em .35em; background: var(--cl-surface); border-radius: 4px; }

.cl-tags { display: flex; flex-wrap: wrap; gap: 8px; margin: 40px 0 0; padding: 0; list-style: none; }
.cl-tags a { display: inline-block; padding: 8px 14px; border-radius: 999px; background: var(--cl-surface); border: 1.5px solid var(--cl-line); text-decoration: none; font: 500 13px var(--cl-font-mono); }
.cl-tags a:hover { border-color: var(--cl-navy); }

.cl-author { display: grid; grid-template-columns: 96px 1fr; gap: 22px; margin-top: 56px; padding: 28px; border-radius: 20px; background: var(--cl-surface); border: 1px solid var(--cl-line); }
.cl-author__photo { width: 96px; height: 96px; border-radius: 50%; overflow: hidden; background: var(--cl-navy); color: #fff; display: grid; place-items: center; font: 800 32px var(--cl-font-head); }
.cl-author__photo img { width: 100%; height: 100%; object-fit: cover; }
.cl-author__text .cl-author__name { margin: 0 0 6px; font: 800 20px var(--cl-font-head); color: var(--cl-navy); }
.cl-author__text p { margin-bottom: 8px; color: var(--cl-muted); }
.cl-author__links { display: flex; gap: 22px; flex-wrap: wrap; margin-top: 12px; }

/* Barra di avanzamento: in basso, si aggancia al footer */
.cl-progress { --p: 0; --tw: 132px; position: sticky; bottom: 0; z-index: 50; padding: 10px 0; pointer-events: none; transition: background .35s, padding .35s; }
.cl-progress__inner {
	display: flex; align-items: center; gap: 20px; max-width: 1100px; padding: 10px 22px 12px; border-radius: 16px; pointer-events: auto;
	background: var(--cl-navy); color: #fff; box-shadow: 0 20px 40px -14px rgba(14, 24, 48, .55);
	transition: border-radius .35s, max-width .45s var(--cl-ease), box-shadow .35s;
}
.cl-progress__label { flex: none; display: grid; gap: 2px; min-width: 64px; font: 500 13px var(--cl-font-mono); color: #fff; }
.cl-progress__label--end { text-align: right; color: var(--cl-highlight); }
.cl-progress__k { font-size: 10px; letter-spacing: .16em; text-transform: uppercase; color: #9AA6BF; }
/* Il binario: traversine, due rotaie, il tratto percorso si accende */
.cl-progress__track { position: relative; flex: 1; height: 34px; }
.cl-progress__ties { position: absolute; left: 0; right: 0; top: 18px; height: 12px; background: repeating-linear-gradient(90deg, #5B4A3A 0 4px, transparent 4px 13px); opacity: .9; }
.cl-progress__ties::before, .cl-progress__ties::after { content: ""; position: absolute; left: 0; right: 0; height: 2px; background: #7E8AA6; border-radius: 1px; }
.cl-progress__ties::before { top: 2px; } .cl-progress__ties::after { bottom: 2px; }
.cl-progress__fill { position: absolute; left: 0; top: 20px; height: 8px; width: calc(var(--p) * (100% - var(--tw)) + var(--tw) - 6px); border-top: 2px solid var(--cl-highlight); border-bottom: 2px solid var(--cl-highlight); box-shadow: 0 0 10px rgba(168, 230, 210, .35); }
.cl-progress__stops { position: absolute; inset: 0; }
.cl-progress__track::after { content: ""; position: absolute; right: -4px; top: 15px; width: 16px; height: 16px; border-radius: 50%; background: var(--cl-navy); border: 4px solid var(--cl-accent); z-index: 1; }
.cl-progress.is-done .cl-progress__track::after { background: var(--cl-highlight); border-color: var(--cl-highlight); }
.cl-progress__stop { position: absolute; top: 17px; left: calc(var(--at) * (100% - var(--tw)) + var(--tw) - 6px); width: 14px; height: 14px; margin-left: -7px; border-radius: 50%; background: var(--cl-navy); border: 3px solid #fff; transition: background .3s, border-color .3s; }
.cl-progress__stop.is-passed { background: var(--cl-highlight); border-color: var(--cl-highlight); }
.cl-progress__train { position: absolute; left: calc(var(--p) * (100% - var(--tw))); top: calc(22px - var(--tw) * .1238); width: var(--tw); transition: left .15s linear; }
.cl-progress__train svg { display: block; width: 100%; height: auto; }
.cl-progress__train .t-body { fill: #fff; }
.cl-progress__train .t-win { fill: var(--cl-navy-2); }
.cl-progress__train .t-door { fill: none; stroke: rgba(20, 33, 61, .25); stroke-width: 1.5; }
.cl-progress__train .t-glass { fill: var(--cl-highlight); }
.cl-progress__train .t-stripe { fill: var(--cl-accent); }
.cl-progress__train .t-wheel { fill: #0B1222; }
.cl-progress__train .t-lamp { fill: #FFD54A; }
.cl-progress.is-moving .cl-progress__train svg { animation: clRide .5s steps(2) infinite; }
@keyframes clRide { 50% { transform: translateY(-.6px); } }
.cl-progress.is-docked { padding: 0; background: var(--cl-navy); }
.cl-progress.is-docked .cl-progress__inner { max-width: none; border-radius: 0; box-shadow: none; background: var(--cl-navy); padding-inline: var(--cl-gutter); }
.cl-progress.is-done .cl-progress__label--end span:last-child { color: #fff; }

/* --------------------------------------------------------------------------
   Evento singolo
   -------------------------------------------------------------------------- */
.cl-event__grid { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: clamp(32px, 6vw, 110px); align-items: start; }
.cl-event__poster .cl-doors { border-radius: 18px; box-shadow: var(--cl-shadow); }
.cl-event__poster .cl-doors img { height: auto; }
.cl-event__poster-link { display: inline-flex; align-items: center; gap: 8px; margin-top: 14px; font-size: 15px; }
.cl-event__poster-link .cl-icon { width: 18px; height: 18px; color: var(--cl-accent); }
.cl-event__poster-empty {
	display: flex; flex-direction: column; justify-content: flex-end; aspect-ratio: 3 / 4; padding: 30px; border-radius: 18px; background: var(--cl-navy); color: #fff;
	background-image: repeating-linear-gradient(0deg, transparent 0 46px, rgba(255, 255, 255, .05) 46px 48px);
}
.cl-event__poster-empty span:first-child { font: 800 clamp(90px, 12vw, 180px)/.85 var(--cl-font-head); letter-spacing: -.05em; color: var(--cl-highlight); }
.cl-event__poster-empty span:last-child { font: 500 20px var(--cl-font-mono); letter-spacing: .2em; text-transform: uppercase; }
.cl-event__title { font-size: clamp(34px, 4.6vw, 66px); }
.cl-ticketinfo { margin: 30px 0; border-radius: 18px; background: var(--cl-surface); border: 1px solid var(--cl-line); overflow: hidden; }
.cl-ticketinfo__row { display: grid; grid-template-columns: 170px 1fr; gap: 16px; padding: 16px 22px; border-top: 1px dashed var(--cl-line); }
.cl-ticketinfo__row:first-child { border-top: 0; }
.cl-ticketinfo dt { display: flex; align-items: center; gap: 10px; font: 500 12px var(--cl-font-mono); letter-spacing: .12em; text-transform: uppercase; color: var(--cl-muted); }
.cl-ticketinfo dt .cl-icon { width: 18px; height: 18px; color: var(--cl-accent); }
.cl-ticketinfo dd { margin: 0; font-weight: 600; }
.cl-ticketinfo dd > span:not(.cl-board__status) { font-weight: 400; color: var(--cl-muted); }
.cl-ticketinfo .cl-board__status > span { font-family: var(--cl-font-mono); }
.cl-event__actions { display: flex; flex-wrap: wrap; gap: 12px; }
.cl-event__body { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); gap: 40px clamp(32px, 6vw, 110px); padding-block: clamp(48px, 6vw, 96px); }
.cl-event__desc { grid-column: 1; }
.cl-event__speakers { grid-column: 2; }
.cl-event__route { grid-column: 1 / -1; }
.cl-event__h2 { font-size: clamp(24px, 2.4vw, 34px); margin-bottom: 24px; display: flex; align-items: center; gap: 14px; }
.cl-event__h2::before { content: ""; width: 18px; height: 18px; border-radius: 50%; border: 5px solid var(--cl-navy); background: var(--cl-accent); flex: none; }
.cl-event__ai-note { margin-top: 18px; font-size: 13px; color: var(--cl-muted); font-family: var(--cl-font-mono); }
.cl-speakers { margin: 0; padding: 0; list-style: none; display: grid; gap: 12px; }
.cl-speakers__item { display: grid; grid-template-columns: 56px 1fr; grid-template-rows: auto auto; column-gap: 16px; align-items: center; padding: 14px 18px; border-radius: 16px; background: var(--cl-surface); border: 1px solid var(--cl-line); }
.cl-speakers__initials { grid-row: span 2; display: grid; place-items: center; width: 56px; height: 56px; border-radius: 50%; background: var(--cl-navy); color: var(--cl-highlight); font: 800 19px var(--cl-font-head); }
.cl-speakers__name { font-weight: 700; font-size: 17px; }
.cl-speakers__role { color: var(--cl-muted); font-size: 15px; }
.cl-event__route-grid { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: clamp(24px, 4vw, 56px); align-items: stretch; }
.cl-transit { position: relative; margin: 0; padding: 0 0 0 0; list-style: none; }
.cl-transit::before { content: ""; position: absolute; left: 27px; top: 42px; bottom: 42px; width: 6px; border-radius: 3px; background: var(--cl-navy); transform-origin: top; transform: scaleY(var(--draw, 1)); }
.cl-transit__stop { position: relative; display: grid; grid-template-columns: 60px 1fr auto; align-items: center; gap: 16px; padding: 12px 0; }
.cl-transit__icon { position: relative; z-index: 1; display: grid; place-items: center; width: 60px; height: 60px; border-radius: 50%; background: var(--cl-surface); border: 5px solid var(--cl-navy); color: var(--cl-navy); }
.cl-transit__icon .cl-icon { width: 26px; height: 26px; }
.cl-transit__stop--end .cl-transit__icon { background: var(--cl-accent); border-color: var(--cl-accent); color: #fff; }
.cl-transit__body { display: flex; flex-direction: column; }
.cl-transit__body strong { font-size: 18px; }
.cl-transit__body span { color: var(--cl-muted); font-size: 15px; }
.cl-transit__walk { display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px; border-radius: 999px; background: var(--cl-surface); border: 1px solid var(--cl-line); font: 500 13px var(--cl-font-mono); white-space: nowrap; }
.cl-transit__walk .cl-icon { width: 16px; height: 16px; }
.cl-map { position: relative; min-height: 380px; border-radius: 20px; overflow: hidden; background: var(--cl-navy); }
.cl-map .leaflet-container { position: absolute; inset: 0; font-family: var(--cl-font-body); }
.cl-map__consent {
	position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 14px; padding: 28px; text-align: center; color: #fff;
	background-color: var(--cl-navy);
	background-image: linear-gradient(rgba(255, 255, 255, .05) 2px, transparent 2px), linear-gradient(90deg, rgba(255, 255, 255, .05) 2px, transparent 2px);
	background-size: 48px 48px;
}
.cl-map__consent .cl-icon { width: 44px; height: 44px; color: var(--cl-highlight); }
.cl-map__consent p { margin: 0; max-width: 40ch; color: #C9D1E0; }
.cl-map__consent .cl-btn { background: var(--cl-accent); border-color: var(--cl-accent); }
.cl-map__pin { width: 26px; height: 26px; border-radius: 50%; background: var(--cl-accent); border: 6px solid var(--cl-navy); box-shadow: 0 0 0 6px rgba(0, 135, 107, .3); }
.cl-event__directions { margin-top: 22px; }

/* --------------------------------------------------------------------------
   Pagina eventi: calendario e programma
   -------------------------------------------------------------------------- */
.cl-agenda { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: clamp(32px, 4vw, 64px); align-items: start; }
.cl-cal { padding: clamp(20px, 2.6vw, 36px); border-radius: 24px; background: var(--cl-surface); border: 1px solid var(--cl-line); box-shadow: 0 1px 2px rgba(20, 33, 61, .04); }
.cl-cal__head { display: grid; grid-template-columns: 48px 1fr 48px; align-items: center; margin-bottom: 26px; }
.cl-cal__title { margin: 0; text-align: center; font-size: clamp(24px, 2.2vw, 32px); letter-spacing: -.02em; }
.cl-cal__nav { display: grid; place-items: center; width: 48px; height: 48px; border-radius: 12px; border: 1.5px solid var(--cl-line); color: var(--cl-navy); text-decoration: none; transition: .2s; }
.cl-cal__nav:hover { background: var(--cl-navy); border-color: var(--cl-navy); color: #fff; }
.cl-cal__nav .cl-icon { width: 18px; height: 18px; }
.cl-cal__grid { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); }
.cl-cal__wd { padding: 8px 0 16px; text-align: center; font: 500 12px var(--cl-font-mono); color: var(--cl-muted); }
.cl-cal__day { position: relative; display: grid; place-items: center; aspect-ratio: 1 / .78; font-weight: 600; font-size: 17px; }
.cl-cal__day.is-past { color: #9AA3B5; }
.cl-cal__num { position: relative; z-index: 1; }
.cl-cal__day.is-today .cl-cal__num { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 50%; border: 2px solid var(--cl-navy); }
.cl-cal__link { position: relative; display: grid; place-items: center; width: 46px; height: 46px; border-radius: 50%; background: var(--cl-navy); color: #fff; text-decoration: none; transition: transform .3s var(--cl-ease), background .2s; }
.cl-cal__link:hover, .cl-cal__link:focus-visible { background: var(--cl-accent); color: #fff; transform: scale(1.08); }
.cl-cal__dot { position: absolute; bottom: -4px; left: 50%; width: 10px; height: 10px; margin-left: -5px; border-radius: 50%; background: var(--cl-accent); border: 2px solid var(--cl-surface); }
.cl-cal__tip {
	position: absolute; bottom: calc(100% + 10px); left: 50%; z-index: 5; width: max-content; max-width: 240px; padding: 8px 12px; border-radius: 8px;
	background: var(--cl-navy-deep); color: #fff; font-size: 13px; font-weight: 500; line-height: 1.35; text-align: center;
	opacity: 0; visibility: hidden; transform: translate(-50%, 6px); transition: .2s; pointer-events: none;
}
.cl-cal__link:hover .cl-cal__tip, .cl-cal__link:focus-visible .cl-cal__tip { opacity: 1; visibility: visible; transform: translate(-50%, 0); }
.cl-cal.is-loading { opacity: .5; transition: opacity .2s; }
.cl-agenda__title { font-size: clamp(26px, 2.4vw, 34px); margin: 8px 0 22px; }
.cl-agenda__empty { color: var(--cl-muted); font-size: 1.1em; }
.cl-agenda__items { margin: 0; padding: 0; list-style: none; display: grid; gap: 12px; }
.cl-agenda__item a { display: grid; grid-template-columns: 72px 1fr auto; gap: 18px; align-items: center; padding: 14px; border-radius: 18px; background: var(--cl-surface); border: 1px solid var(--cl-line); text-decoration: none; transition: border-color .2s, transform .3s var(--cl-ease); }
.cl-agenda__item a:hover { border-color: var(--cl-navy); transform: translateX(6px); color: inherit; }
.cl-agenda__date { display: flex; flex-direction: column; align-items: center; justify-content: center; height: 72px; border-radius: 12px; background: var(--cl-navy); color: #fff; }
.cl-agenda__day { font: 800 28px/1 var(--cl-font-head); }
.cl-agenda__mon { font: 500 11px var(--cl-font-mono); letter-spacing: .14em; text-transform: uppercase; color: var(--cl-highlight); margin-top: 4px; }
.cl-agenda__text { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.cl-agenda__text strong { font-size: 17px; line-height: 1.3; }
.cl-agenda__text span { font-size: 14px; color: var(--cl-muted); }
.cl-agenda__status .cl-board__status > span { font: 500 11px var(--cl-font-mono); }
.cl-pastev a { display: block; text-decoration: none; }
.cl-pastev__media { aspect-ratio: 4 / 3; border-radius: var(--cl-radius); overflow: hidden; background: var(--cl-navy); display: grid; place-items: center; color: rgba(255, 255, 255, .4); }
.cl-pastev__media img { width: 100%; height: 100%; object-fit: cover; filter: grayscale(.6); transition: filter .4s; }
.cl-pastev a:hover img { filter: none; }
.cl-pastev__media .cl-icon { width: 48px; height: 48px; }
.cl-pastev__date { margin: 14px 0 6px; font: 500 12px var(--cl-font-mono); letter-spacing: .12em; text-transform: uppercase; color: var(--cl-muted); }
.cl-pastev__title { font-size: 20px; margin: 0; }

/* --------------------------------------------------------------------------
   Chi sono, contatti, mappa, legale, ricerca, 404
   -------------------------------------------------------------------------- */
.cl-about { padding-top: calc(var(--cl-header-h) + clamp(24px, 4vw, 56px)); }
.cl-about__grid { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, .75fr); gap: clamp(32px, 6vw, 110px); align-items: start; }
/* Etichetta, titolo e testo partono alla stessa altezza della foto */
.cl-about__text { padding-top: clamp(4px, 1.2vw, 18px); }
.cl-about__media { justify-self: end; width: 100%; max-width: 460px; }
.cl-about__media .cl-doors { aspect-ratio: 4 / 5; border-radius: 28px 28px 28px 120px; }
.cl-about__body .cl-prose { max-width: 820px; margin-left: 0; margin-right: 0; }
.cl-timeline { position: relative; margin: 0; padding: 0; list-style: none; display: grid; gap: 0; }
.cl-timeline__rail { position: absolute; left: 126px; top: 10px; bottom: 10px; width: 6px; }
.cl-timeline__rail span { display: block; height: 100%; border-radius: 3px; background: var(--cl-navy); transform-origin: top; }
.cl-timeline__item { position: relative; display: grid; grid-template-columns: 96px 66px 1fr; align-items: start; padding: 18px 0; }
.cl-timeline__year { font: 500 22px var(--cl-font-mono); color: var(--cl-accent); text-align: left; padding-top: 2px; }
.cl-timeline__dot { justify-self: center; position: relative; z-index: 1; width: 26px; height: 26px; margin-top: 4px; border-radius: 50%; background: var(--cl-bg); border: 6px solid var(--cl-navy); }
.cl-timeline__item:last-child .cl-timeline__dot { background: var(--cl-accent); border-color: var(--cl-accent); }
.cl-timeline__body h3 { margin: 0 0 6px; font-size: clamp(20px, 1.8vw, 26px); }
.cl-timeline__body p { margin: 0; color: var(--cl-muted); max-width: 70ch; }
.cl-contact { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: clamp(32px, 6vw, 110px); align-items: start; }
.cl-contact__lead { font-size: clamp(19px, 1.6vw, 23px); line-height: 1.5; }
.cl-contact__list { margin: 30px 0; padding: 0; list-style: none; display: grid; gap: 14px; }
.cl-contact__list li { display: flex; align-items: center; gap: 16px; }
.cl-contact__list small { display: block; font: 500 11.5px var(--cl-font-mono); letter-spacing: .14em; text-transform: uppercase; color: var(--cl-muted); }
.cl-contact__list a { font-weight: 700; font-size: 18px; text-decoration: none; }
.cl-contact__icon { display: grid; place-items: center; width: 52px; height: 52px; border-radius: 50%; background: var(--cl-navy); color: var(--cl-highlight); flex: none; }
.cl-contact__form { padding: clamp(24px, 3vw, 44px); border-radius: 24px; background: var(--cl-surface); border: 1px solid var(--cl-line); box-shadow: 0 1px 2px rgba(20, 33, 61, .04); }
.cl-sitemap { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 40px; }
.cl-sitemap__title { display: flex; align-items: center; gap: 12px; font-size: 22px; }
.cl-sitemap__title::before { content: ""; width: 30px; height: 30px; border-radius: 7px; background: var(--cl-navy); }
.cl-sitemap ul { position: relative; margin: 0; padding: 0 0 0 30px; list-style: none; border-left: 5px solid var(--cl-navy); margin-left: 12px; }
.cl-sitemap li { position: relative; padding: 6px 0; }
.cl-sitemap li::before { content: ""; position: absolute; left: -41px; top: 13px; width: 16px; height: 16px; border-radius: 50%; background: var(--cl-bg); border: 4px solid var(--cl-navy); }
.cl-sitemap a { text-decoration: none; }
.cl-legal { display: grid; grid-template-columns: 260px minmax(0, 820px); gap: clamp(32px, 5vw, 80px); }
.cl-legal__toc { position: sticky; top: calc(var(--cl-header-h) + 24px); align-self: start; font-size: 14.5px; }
.cl-legal__toc ol { margin: 0; padding: 0; list-style: none; border-left: 3px solid var(--cl-line); }
.cl-legal__toc a { display: block; padding: 6px 0 6px 16px; margin-left: -3px; border-left: 3px solid transparent; text-decoration: none; color: var(--cl-muted); }
.cl-legal__toc a:hover, .cl-legal__toc a.is-active { color: var(--cl-navy); border-color: var(--cl-accent); }
.cl-legal-updated { font: 500 13px var(--cl-font-mono); color: var(--cl-muted); }
.cl-prose--legal { font-size: 17px; }
.cl-results { margin: 0; padding: 0; list-style: none; display: grid; gap: 4px; max-width: 980px; }
.cl-results a { display: grid; gap: 4px; padding: 20px 0; border-bottom: 1px solid var(--cl-line); text-decoration: none; }
.cl-results__type { font: 500 11.5px var(--cl-font-mono); letter-spacing: .14em; text-transform: uppercase; color: var(--cl-accent); }
.cl-results__title { font: 700 22px var(--cl-font-head); color: var(--cl-navy); }
.cl-results__excerpt { color: var(--cl-muted); }
.cl-404 { padding-top: calc(var(--cl-header-h) + 60px); }
.cl-404__inner { max-width: 1100px; }
.cl-404__board { margin-bottom: 48px; }
.cl-404__title { font-size: clamp(36px, 5vw, 68px); }
.cl-404__lead { color: var(--cl-muted); font-size: 1.15em; margin-bottom: 30px; }

/* Commenti (se attivati) */
.cl-comments-wrap { max-width: 860px; padding-bottom: 60px; }
.cl-comments-wrap .comment-list { list-style: none; padding: 0; }
.cl-comments-wrap .comment-body { padding: 20px; border-radius: 14px; background: var(--cl-surface); margin-bottom: 12px; }

/* --------------------------------------------------------------------------
   Animazioni: stato iniziale (solo con JavaScript e movimento attivo)
   -------------------------------------------------------------------------- */
.cl-js .cl-motion--full [data-cl-reveal="fade"], .cl-js .cl-motion--full [data-cl-reveal="card"],
.cl-js .cl-motion--soft [data-cl-reveal="fade"], .cl-js .cl-motion--soft [data-cl-reveal="card"],
.cl-js .cl-motion--full [data-cl-reveal="sign"] { opacity: 0; }
.cl-js .cl-motion--full [data-cl-reveal="hero"], .cl-js .cl-motion--full [data-cl-reveal="title"],
.cl-js .cl-motion--soft [data-cl-reveal="hero"], .cl-js .cl-motion--soft [data-cl-reveal="title"] { visibility: hidden; }
.cl-word { will-change: transform; }

@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after { animation-duration: .001ms !important; animation-iteration-count: 1 !important; transition-duration: .001ms !important; }
	.cl-press__track { animation: none; }
	.cl-js [data-cl-reveal] { opacity: 1 !important; visibility: visible !important; }
	.cl-js .cl-doors__leaf { display: none !important; }
	.cl-js [data-cl-reveal] .cl-mark { background-size: 100% 100% !important; }
}
.cl-motion--off .cl-press__track { animation: none; }
.cl-motion--off .cl-press__viewport { overflow-x: auto; }

/* --------------------------------------------------------------------------
   Responsive
   -------------------------------------------------------------------------- */
@media (max-width: 1280px) {
	.cl-grid--4 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
	.cl-board__head, .cl-board__row > a, .cl-board__row > span { grid-template-columns: 120px 120px minmax(0, 1fr) 130px; padding-inline: 20px; }
	.cl-board__head span:nth-child(4), .cl-board__place { display: none; }
}
@media (max-width: 1100px) {
	.cl-nav { display: none; }
	.cl-burger { display: inline-grid; }
	.cl-header__cta { display: none; }
	.cl-header__actions { margin-left: auto; }
	.cl-grid--3, .cl-grid--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.cl-route__line { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; grid-auto-rows: 1fr; }
	.cl-route__rail { display: none; }
	.cl-event__body { grid-template-columns: 1fr; }
	.cl-event__speakers { grid-column: 1; }
	.cl-legal { grid-template-columns: 1fr; }
	.cl-legal__toc { position: static; }
	.cl-footer__grid { grid-template-columns: 1fr 1fr; }
	.cl-footer__col--brand { grid-column: 1 / -1; }
}
@media (max-width: 860px) {
	:root { --cl-header-h: 72px; }
	.cl-header__logo { font-size: 28px; }
	.cl-hero__inner, .cl-bio__inner, .cl-nl__inner, .cl-event__grid, .cl-agenda, .cl-contact, .cl-about__grid, .cl-event__route-grid { grid-template-columns: 1fr; }
	.cl-hero__media { order: -1; max-width: 520px; }
	.cl-hero__media .cl-doors { aspect-ratio: 5 / 4; border-radius: 22px 22px 80px 22px; }
	.cl-bio__media { max-width: 520px; }
	.cl-about__media { order: -1; max-width: 460px; justify-self: start; }
	.cl-event__poster { max-width: 420px; }
	.cl-board__head { display: none; }
	.cl-board__row > a, .cl-board__row > span { grid-template-columns: auto auto 1fr; grid-template-areas: "date time status" "dest dest dest" "place place place"; row-gap: 6px; column-gap: 12px; }
	.cl-board__date { grid-area: date; font-size: 15px; } .cl-board__time { grid-area: time; font-size: 15px; }
	.cl-board__dest { font-size: 14px; }
	.cl-board__place { display: grid; font-size: 12px; }
	.cl-board__dest { grid-area: dest; } .cl-board__place { grid-area: place; } .cl-board__status { grid-area: status; justify-self: end; }
	.cl-videos__grid, .cl-videos__grid--2, .cl-videos__grid--even { grid-template-columns: 1fr; }
	.cl-video--lead { grid-row: auto; }
	.cl-form__grid { grid-template-columns: 1fr; }
	.cl-share { position: static; flex-direction: row; align-items: center; }
	.cl-share__label { writing-mode: horizontal-tb; transform: none; }
	.cl-share__list { flex-direction: row; flex-wrap: wrap; }
	.cl-article__cover .cl-doors { aspect-ratio: 4 / 3; }
	.cl-aibar__bar { gap: 8px; padding: 12px; }
	.cl-aibar__tab { padding: 9px 10px; gap: 7px; font-size: 14px; }
	.cl-aibar__tab .cl-icon { width: 17px; height: 17px; }
	.cl-aibar__tag { width: 100%; }
	.cl-listen { gap: 14px; }
	.cl-card--list .cl-card__link { grid-template-columns: 1fr; }
	.cl-card--list .cl-card__paper { margin: -56px 14px 0; }
	.cl-ticketinfo__row { grid-template-columns: 1fr; gap: 4px; }
	.cl-timeline__rail { left: 33px; }
	.cl-timeline__item { grid-template-columns: 66px 1fr; }
	.cl-timeline__year { grid-column: 2; grid-row: 1; text-align: left; font-size: 17px; }
	.cl-timeline__dot { grid-column: 1; grid-row: 1 / span 2; }
	.cl-timeline__body { grid-column: 2; }
	.cl-nextstop__label { padding: 0 14px; font-size: 10.5px; }
	.cl-progress { --tw: 96px; }
	.cl-progress__inner { gap: 12px; padding: 8px 14px 10px; }
	.cl-progress__label { min-width: 0; }
	.cl-progress__label:not(.cl-progress__label--end) { display: none; }
	.cl-consent--bar { grid-template-columns: 1fr; }
}
@media (max-width: 600px) {
	.cl-grid--2, .cl-grid--3, .cl-grid--4, .cl-route__line { grid-template-columns: 1fr; }
	.cl-route__line { row-gap: 16px; }
	.cl-route__stop { display: grid; grid-template-columns: 60px 1fr; column-gap: 18px; padding: 20px; }
	.cl-route__icon { grid-row: span 3; width: 60px; height: 60px; margin: 0; border-radius: 14px; }
	.cl-footer__grid { grid-template-columns: 1fr; }
	.cl-field--inline { grid-template-columns: 1fr; }
	.cl-agenda__item a { grid-template-columns: 60px 1fr; }
	.cl-agenda__status { grid-column: 2; }
	.cl-agenda__date { height: 60px; }
	.cl-cal__link { width: 38px; height: 38px; }
	.cl-cal__day.is-today .cl-cal__num { width: 34px; height: 34px; }
	.cl-consent__actions, .cl-prefs__foot { grid-template-columns: 1fr; }
	.cl-consent--bar .cl-consent__actions { grid-template-columns: 1fr; }
	.cl-author { grid-template-columns: 1fr; }
	.cl-cta__sign::after { width: 160px; height: 160px; border-width: 18px; right: -50px; top: -50px; }
	.cl-searchbar { flex-direction: column; }
}
/* ==========================================================================
   Modifiche di Roberto (ottobre 2026)
   ========================================================================== */

/* Intro "Con Trasporto" */
.cl-hero__brand { display: flex; flex-direction: column; gap: .14em; margin-bottom: 26px; }
.cl-hero__name { font-size: clamp(58px, 8.6vw, 136px); line-height: .9; letter-spacing: -.045em; }
.cl-hero__by { font: 300 clamp(24px, 2.5vw, 38px)/1.1 var(--cl-font-head); letter-spacing: -.01em; color: var(--cl-navy); }
.cl-hero__motto {
	margin: 0 0 30px;
	font: italic 400 clamp(21px, 2vw, 30px)/1.25 var(--cl-font-paper); color: var(--cl-navy);
}
.cl-hero__motto .cl-typed__caret { background: var(--cl-accent); }
.cl-hero__lead { font-family: var(--cl-font-paper); }

/* Menu con sottomenu: una diramazione della linea */
.cl-menu > .menu-item-has-children > a { padding-right: 30px; }
.cl-menu > .menu-item-has-children::after {
	content: ""; position: absolute; right: 13px; top: 50%; width: 7px; height: 7px; margin-top: -6px;
	border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: rotate(45deg); pointer-events: none; color: var(--cl-navy); transition: transform .25s;
}
.cl-menu > .menu-item-has-children:hover::after, .cl-menu > .menu-item-has-children:focus-within::after { transform: translateY(3px) rotate(225deg); }
.cl-menu .sub-menu {
	top: calc(100% + 10px); left: -6px; min-width: 260px; padding: 14px 10px 14px 38px; background: var(--cl-navy); border-radius: 16px;
	box-shadow: 0 24px 50px -18px rgba(14, 24, 48, .55);
}
.cl-menu .sub-menu::before { content: ""; position: absolute; left: 20px; top: 26px; bottom: 26px; width: 4px; border-radius: 2px; background: var(--cl-accent); }
.cl-menu .sub-menu::after { content: ""; position: absolute; left: 0; right: 0; top: -14px; height: 14px; }
.cl-menu .sub-menu li { position: relative; }
.cl-menu .sub-menu li::before { content: ""; position: absolute; left: -24px; top: 50%; width: 12px; height: 12px; margin-top: -6px; border-radius: 50%; background: var(--cl-navy); border: 3px solid #fff; box-sizing: border-box; transition: background .2s; }
.cl-menu .sub-menu a { padding: 10px 12px; border-radius: 10px; color: #fff; font-size: 15.5px; white-space: nowrap; }
.cl-menu .sub-menu a::before, .cl-menu .sub-menu a::after { display: none; }
.cl-menu .sub-menu a:hover, .cl-menu .sub-menu .current-menu-item > a { background: rgba(255, 255, 255, .08); color: var(--cl-highlight); }
.cl-menu .sub-menu li:hover::before { background: var(--cl-highlight); }
.cl-mobile__menu > li.menu-item-has-children::before { top: 36px; }
.cl-mobile__menu .sub-menu { list-style: none; margin: 0 0 10px; padding: 0; }
.cl-mobile__menu .sub-menu li::before { left: -36px; width: 16px; height: 16px; margin-top: -8px; border-width: 4px; }
.cl-mobile__menu .sub-menu a { padding: 7px 0; font: 600 clamp(19px, 5vw, 24px)/1.2 var(--cl-font-head); letter-spacing: -.01em; color: #C9D1E0; }

/* Briciole di pane */
.cl-crumbs { margin: 0 0 18px; font: 500 12px/1.4 var(--cl-font-mono); letter-spacing: .1em; text-transform: uppercase; color: var(--cl-muted); }
.cl-crumbs a { color: inherit; text-decoration: none; }
.cl-crumbs a:hover { color: var(--cl-accent); }
.cl-crumbs span { margin: 0 4px; }

/* Categoria sulla foto */
.cl-rcard__media { position: relative; }
.cl-catlabel {
	position: absolute; left: 14px; top: 14px; z-index: 2; padding: 9px 13px 8px; border-radius: 8px;
	background: #fff; color: var(--cl-navy); font: 700 13px/1 var(--cl-font-mono); letter-spacing: .12em; text-transform: uppercase; text-decoration: none;
	border-left: 5px solid var(--cl-accent); box-shadow: 0 8px 20px -8px rgba(14, 24, 48, .7);
}
a.cl-catlabel:hover { background: var(--cl-navy); color: #fff; }

/* Articolo a due colonne */
.cl-article__title { max-width: 1040px; }
.cl-article__layout { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: clamp(32px, 4.5vw, 80px); align-items: start; margin-top: clamp(28px, 3vw, 44px); padding-bottom: 60px; }
.cl-article__body { min-width: 0; max-width: 820px; }
.cl-article__cover { margin: 0 0 22px; }
.cl-article__img { position: relative; aspect-ratio: 16 / 9; border-radius: 20px; overflow: hidden; background: var(--cl-navy); }
.cl-article__img img { width: 100%; height: 100%; object-fit: cover; }
.cl-article__img .cl-catlabel { left: 18px; top: 18px; padding: 10px 15px 9px; font-size: 13px; }
.cl-article__side { position: sticky; top: calc(var(--cl-header-h) + 24px); }
.cl-side__box { margin-bottom: 20px; padding: 22px 22px 18px; border-radius: 20px; background: var(--cl-surface); border: 1px solid var(--cl-line); }
.cl-side__title { display: flex; align-items: center; gap: 10px; margin: 0 0 8px; font: 800 19px/1.2 var(--cl-font-head); letter-spacing: -.01em; }
.cl-side__dot { flex: none; width: 16px; height: 16px; border-radius: 50%; border: 4px solid var(--cl-accent); box-sizing: border-box; }
.cl-side__list { margin: 0 0 14px; padding: 0; list-style: none; }
.cl-side__list li + li { border-top: 1px solid var(--cl-line); }
.cl-side__list a { display: grid; grid-template-columns: 64px minmax(0, 1fr); gap: 14px; align-items: center; padding: 13px 0; text-decoration: none; color: var(--cl-navy); }
.cl-side__thumb { display: block; width: 64px; height: 64px; border-radius: 10px; overflow: hidden; background: var(--cl-navy); }
.cl-side__thumb img { width: 100%; height: 100%; object-fit: cover; }
.cl-side__txt small { display: block; margin-bottom: 4px; font: 500 11px var(--cl-font-mono); letter-spacing: .08em; text-transform: uppercase; color: var(--cl-accent); }
.cl-side__txt strong { display: block; font: 700 15px/1.3 var(--cl-font-head); transition: color .2s; }
.cl-side__list a:hover strong { color: var(--cl-accent); }

/* Parole chiave */
.cl-keys { margin-top: 44px; padding-top: 24px; border-top: 2px solid var(--cl-line); }
.cl-keys__label, .cl-topics__label { display: inline-flex; align-items: center; gap: 8px; margin: 0 0 12px; font: 500 12px var(--cl-font-mono); letter-spacing: .14em; text-transform: uppercase; color: var(--cl-muted); }
.cl-keys__label .cl-icon, .cl-topics__label .cl-icon { width: 18px; height: 18px; color: var(--cl-accent); }
.cl-keys .cl-tags, .cl-topics .cl-tags, .cl-side .cl-tags { margin: 0; }
.cl-tags a.is-active { background: var(--cl-navy); border-color: var(--cl-navy); color: #fff; }
.cl-tags--small a { padding: 6px 12px; font-size: 12px; }
.cl-topics { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 14px; margin-top: 20px; }
.cl-topics__label { margin: 0; }

/* Instagram */
.cl-ig__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(14px, 2vw, 28px); }
.cl-ig__post { position: relative; display: block; aspect-ratio: 4 / 5; border-radius: 20px; overflow: hidden; background: var(--cl-navy); color: #fff; text-decoration: none; }
.cl-ig__post img { width: 100%; height: 100%; object-fit: cover; transition: transform .9s var(--cl-ease); }
.cl-ig__post:hover img { transform: scale(1.04); }
.cl-ig__badge { position: absolute; top: 14px; right: 14px; display: grid; place-items: center; width: 40px; height: 40px; border-radius: 50%; background: rgba(255, 255, 255, .94); color: var(--cl-navy); }
.cl-ig__badge .cl-icon { width: 20px; height: 20px; }
.cl-ig__caption {
	position: absolute; left: 0; right: 0; bottom: 0; padding: 70px 20px 18px; font: 500 15px/1.4 var(--cl-font-body);
	background: linear-gradient(180deg, transparent, rgba(14, 24, 48, .9) 55%);
	display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden;
}
.cl-ig__caption small { display: block; margin-bottom: 6px; font: 500 11px var(--cl-font-mono); letter-spacing: .1em; text-transform: uppercase; color: var(--cl-highlight); }

/* Video */
.cl-vgrid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(22px, 2.6vw, 40px); }
a.cl-video__title { text-decoration: none; transition: color .2s; }
a.cl-video__title:hover { color: var(--cl-accent); }
.cl-pagehead__title--video { max-width: 1000px; font-size: clamp(30px, 4vw, 58px); line-height: 1.06; }
.cl-vsingle { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: clamp(32px, 4.5vw, 80px); align-items: start; padding-bottom: 40px; }
.cl-vsingle__main { min-width: 0; }
.cl-vsingle__desc { margin-top: 30px; max-width: 760px; }
.cl-vsingle__yt { margin-top: 8px; }
.cl-seek { padding: 1px 7px; border: 0; border-radius: 6px; background: var(--cl-highlight); color: var(--cl-navy); font: 600 .88em var(--cl-font-mono); cursor: pointer; transition: .2s; }
.cl-seek:hover { background: var(--cl-navy); color: #fff; }
.cl-vsingle__side { position: sticky; top: calc(var(--cl-header-h) + 24px); padding: 22px; border-radius: 20px; background: var(--cl-surface); border: 1px solid var(--cl-line); }
.cl-side__title + .cl-vlist { margin-top: 10px; }
.cl-vlist { margin: 0 0 14px; padding: 0; list-style: none; }
.cl-vlist li + li { border-top: 1px solid var(--cl-line); }
.cl-vlist a { display: grid; grid-template-columns: 112px minmax(0, 1fr); gap: 14px; align-items: center; padding: 12px 0; text-decoration: none; color: var(--cl-navy); }
.cl-vlist__thumb { display: block; aspect-ratio: 16 / 9; border-radius: 8px; overflow: hidden; background: var(--cl-navy); }
.cl-vlist__thumb img { width: 100%; height: 100%; object-fit: cover; }
.cl-vlist__txt { font: 700 14px/1.3 var(--cl-font-head); }
.cl-vlist__txt small { display: block; margin-bottom: 3px; font: 500 11px var(--cl-font-mono); letter-spacing: .08em; text-transform: uppercase; color: var(--cl-accent); }
.cl-vlist a:hover .cl-vlist__txt { color: var(--cl-accent); }

/* Pubblicazioni: libri disegnati */
.cl-book { --c: var(--cl-navy); position: relative; display: block; width: 100%; aspect-ratio: 2 / 3; container-type: inline-size; perspective: 1400px; }
.cl-book--accent { --c: var(--cl-accent); }
.cl-book--alt { --c: var(--cl-alt); }
.cl-book--amber { --c: #B98300; }
.cl-book::after { content: ""; position: absolute; top: 2.5%; bottom: 2.5%; right: -7px; width: 9px; border-radius: 0 3px 3px 0; background: repeating-linear-gradient(90deg, #fff 0 1px, #E4DED0 1px 2px); z-index: 0; }
.cl-book__face {
	position: absolute; inset: 0; z-index: 1; display: flex; flex-direction: column; padding: 13% 11% 11% 16%; overflow: hidden;
	background: var(--c); color: #fff; border-radius: 3px 10px 10px 3px; transform-origin: left center; transition: transform .7s var(--cl-ease);
	box-shadow: 0 26px 40px -20px rgba(14, 24, 48, .6), 0 4px 10px -4px rgba(14, 24, 48, .35);
}
.cl-book__face::after { content: ""; position: absolute; inset: 0; background: linear-gradient(115deg, rgba(255, 255, 255, .14), transparent 40%); pointer-events: none; }
.cl-book__face--img { padding: 0; }
.cl-book__face--img img { width: 100%; height: 100%; object-fit: cover; }
.cl-book__spine { position: absolute; left: 0; top: 0; bottom: 0; z-index: 2; width: 7%; border-radius: 3px 0 0 3px; background: linear-gradient(90deg, rgba(255, 255, 255, .22), rgba(0, 0, 0, .28) 60%, rgba(255, 255, 255, .08)); pointer-events: none; }
.cl-book__author { font: 500 5.4cqw/1.2 var(--cl-font-mono); letter-spacing: .16em; text-transform: uppercase; opacity: .82; }
.cl-book__title { margin-top: 12%; font: 800 8.6cqw/1.02 var(--cl-font-head); letter-spacing: -.02em; text-transform: uppercase; text-wrap: balance; }
.cl-book__sub { margin-top: 6%; font: italic 400 6cqw/1.3 var(--cl-font-paper); opacity: .9; }
.cl-book__line { position: relative; display: block; width: 62%; height: 2.2cqw; min-height: 4px; margin-top: auto; border-radius: 99px; background: var(--cl-highlight); }
.cl-book__line::after { content: ""; position: absolute; right: -2cqw; top: 50%; width: 6cqw; height: 6cqw; transform: translateY(-50%); border-radius: 50%; background: var(--c); border: 1.6cqw solid #fff; box-sizing: border-box; }
.cl-book__pub { margin-top: 7%; font: 500 4.4cqw/1.3 var(--cl-font-mono); letter-spacing: .1em; text-transform: uppercase; opacity: .78; }
.cl-shelf__item:hover .cl-book__face, .cl-bookfeat:hover .cl-book__face, .cl-pubsingle__cover:hover .cl-book__face { transform: rotateY(-16deg); }

.cl-subhead { display: flex; align-items: center; gap: 14px; margin: 0 0 26px; font: 500 13px var(--cl-font-mono); letter-spacing: .16em; text-transform: uppercase; color: var(--cl-muted); }
.cl-subhead::after { content: ""; flex: 1; height: 2px; background: var(--cl-line); }
.cl-bookfeat { display: grid; grid-template-columns: minmax(180px, 300px) minmax(0, 1fr); gap: clamp(28px, 5vw, 80px); align-items: center; padding: clamp(24px, 3.4vw, 52px); border-radius: 26px; background: var(--cl-surface); border: 1px solid var(--cl-line); }
.cl-bookfeat + .cl-bookfeat { margin-top: 24px; }
.cl-bookfeat__cover { display: block; padding-bottom: 16px; border-bottom: 12px solid #E6E0D2; border-radius: 0 0 4px 4px; }
.cl-bookfeat__title { margin: 10px 0 8px; font: 800 clamp(32px, 3.8vw, 58px)/1 var(--cl-font-head); letter-spacing: -.03em; }
.cl-bookfeat__title a { color: var(--cl-navy); text-decoration: none; }
.cl-bookfeat__sub { margin: 0 0 16px; font: italic 400 clamp(19px, 1.7vw, 25px)/1.35 var(--cl-font-paper); color: var(--cl-muted); }
.cl-bookfeat__meta { margin: 0 0 16px; font: 500 13px/1.6 var(--cl-font-mono); letter-spacing: .03em; color: var(--cl-muted); }
.cl-bookfeat__text { max-width: 640px; margin: 0 0 26px; }
.cl-pubrow__type { display: block; font: 500 11.5px var(--cl-font-mono); letter-spacing: .14em; text-transform: uppercase; color: var(--cl-accent); }
.cl-pubyear { display: grid; grid-template-columns: 130px minmax(0, 1fr); gap: 24px; }
.cl-pubyear + .cl-pubyear { margin-top: 10px; }
.cl-pubyear__y { position: sticky; top: calc(var(--cl-header-h) + 20px); align-self: start; padding-top: 18px; font: 800 clamp(30px, 3vw, 46px)/1 var(--cl-font-head); letter-spacing: -.03em; color: var(--cl-navy); }
.cl-pubyear__y--tbd { font-size: 15px; font-family: var(--cl-font-mono); font-weight: 500; letter-spacing: .06em; text-transform: uppercase; color: var(--cl-muted); }
.cl-publist { margin: 0; padding: 0; list-style: none; }
.cl-pubrow { display: grid; grid-template-columns: 140px minmax(0, 1fr) 46px; gap: 22px; align-items: center; padding: 24px 0; border-top: 1px solid var(--cl-line); }
.cl-pubrow__date { font: 500 12px var(--cl-font-mono); letter-spacing: .08em; text-transform: uppercase; color: var(--cl-muted); }
.cl-pubrow__title { margin: 6px 0 6px; font: 700 clamp(19px, 1.6vw, 24px)/1.25 var(--cl-font-head); letter-spacing: -.01em; }
.cl-pubrow__title a { color: var(--cl-navy); text-decoration: none; }
.cl-pubrow__title a:hover { color: var(--cl-accent); }
.cl-pubrow__meta { margin: 0; font-size: 15.5px; color: var(--cl-muted); }
.cl-pubrow__go { display: grid; place-items: center; width: 46px; height: 46px; border-radius: 50%; border: 1.5px solid var(--cl-line); color: var(--cl-navy); transition: .25s; }
.cl-pubrow__go .cl-icon { width: 22px; height: 22px; }
.cl-pubrow:hover .cl-pubrow__go { background: var(--cl-navy); border-color: var(--cl-navy); color: #fff; }
.cl-pubsingle { display: grid; grid-template-columns: minmax(200px, 380px) minmax(0, 1fr); gap: clamp(32px, 6vw, 100px); align-items: start; padding-bottom: 40px; }
.cl-pubsingle__cover { position: sticky; top: calc(var(--cl-header-h) + 30px); padding-bottom: 18px; border-bottom: 12px solid #E6E0D2; }
.cl-pubsingle__title { margin: 0 0 10px; font: 800 clamp(34px, 4.6vw, 68px)/1 var(--cl-font-head); letter-spacing: -.035em; text-wrap: balance; }
.cl-pubsingle__sub { margin: 0; font: italic 400 clamp(20px, 1.8vw, 26px)/1.35 var(--cl-font-paper); color: var(--cl-muted); }
.cl-pubsheet { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 28px; margin: 30px 0; border-top: 3px solid var(--cl-navy); }
.cl-pubsheet > div { padding: 13px 0; border-bottom: 1px solid var(--cl-line); }
.cl-pubsheet dt { font: 500 11px var(--cl-font-mono); letter-spacing: .14em; text-transform: uppercase; color: var(--cl-muted); }
.cl-pubsheet dd { margin: 4px 0 0; font-weight: 600; }
.cl-pubsingle__actions { display: flex; flex-wrap: wrap; gap: 12px; margin-bottom: 34px; }
.cl-pubsheet__wide { grid-column: 1 / -1; }
.cl-pubauthors { margin: 6px 0 0; padding: 0; list-style: none; display: grid; gap: 6px; }
.cl-pubauthors li strong { font-weight: 700; }
.cl-pubauthors li span { display: block; font-weight: 400; font-size: 14.5px; color: var(--cl-muted); }
.cl-pubauthors--plain li { font-weight: 500; }
.cl-pubrow__authors { margin: 0 0 4px; font-weight: 600; font-size: 15.5px; }
.cl-pubstores { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 10px; margin: -18px 0 34px; }
.cl-pubstores span { font: 500 11px var(--cl-font-mono); letter-spacing: .14em; text-transform: uppercase; color: var(--cl-muted); }
.cl-pubstores a { padding: 7px 14px; border: 1px solid var(--cl-line); border-radius: 999px; background: var(--cl-surface); color: var(--cl-navy); font-weight: 600; font-size: 14px; text-decoration: none; }
.cl-pubstores a:hover { border-color: var(--cl-accent); color: var(--cl-accent); }
.cl-pubsingle__text h2[lang="en"] { margin-top: 1.6em; }
.cl-pubsingle__text { max-width: 760px; }
.cl-shelf { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: clamp(22px, 3vw, 48px); padding: 0 clamp(8px, 2vw, 24px) 18px; border-bottom: 12px solid #E6E0D2; }
.cl-shelf__item { text-decoration: none; color: var(--cl-navy); }
.cl-shelf__cap { display: block; margin-top: 16px; font: 700 16px/1.3 var(--cl-font-head); }
.cl-shelf__cap small { display: block; margin-bottom: 4px; font: 500 11px var(--cl-font-mono); letter-spacing: .1em; text-transform: uppercase; color: var(--cl-accent); }

/* Perché Con Trasporto */
.cl-prose .cl-ps { font-size: .92em; color: var(--cl-muted); }

/* Footer */
.cl-footer__title--sub { margin-top: 30px; }
.cl-footer__social a { display: inline-flex; align-items: center; gap: 10px; }
.cl-footer__social .cl-icon { width: 18px; height: 18px; color: var(--cl-highlight); }

/* Torna su */
.cl-totop {
	position: fixed; right: clamp(16px, 2.4vw, 32px); bottom: clamp(16px, 2.4vw, 32px); z-index: 60;
	display: grid; place-items: center; width: 58px; height: 58px; padding: 0; border: 0; border-radius: 50%;
	background: var(--cl-navy); color: #fff; cursor: pointer; box-shadow: 0 14px 30px -12px rgba(14, 24, 48, .65);
	opacity: 0; visibility: hidden; transform: translateY(16px); transition: opacity .35s, visibility .35s, transform .45s var(--cl-ease), background .25s;
}
.cl-totop.is-visible { opacity: 1; visibility: visible; transform: none; }
.cl-totop:hover { background: var(--cl-accent); }
.cl-totop:hover .cl-totop__train .cl-icon { transform: translateY(-2px); }
.cl-totop__train .cl-icon { transition: transform .3s var(--cl-ease); }
.cl-totop__ring { position: absolute; inset: 0; width: 100%; height: 100%; transform: rotate(-90deg); }
.cl-totop__ring circle { fill: none; stroke: rgba(255, 255, 255, .14); stroke-width: 3; }
.cl-totop__ring .cl-totop__ring-p { stroke: var(--cl-highlight); stroke-dasharray: 100; stroke-dashoffset: calc(100 - var(--p, 0) * 100); stroke-linecap: round; }
.cl-totop__train { display: grid; place-items: center; overflow: hidden; width: 34px; height: 34px; }
.cl-totop__train .cl-icon { width: 24px; height: 24px; }
.cl-totop.is-going .cl-totop__train .cl-icon { animation: clTopGo .8s var(--cl-ease); }
@keyframes clTopGo {
	0% { transform: none; }
	45% { transform: translateY(-34px); opacity: 0; }
	46% { transform: translateY(34px); opacity: 0; }
	100% { transform: none; opacity: 1; }
}
.single-post .cl-totop { bottom: 92px; }
.cl-route__line { align-items: stretch; }
.cl-bio__text .cl-section__title { margin-bottom: 22px; }

@media (max-width: 1100px) {
	.cl-article__layout, .cl-vsingle { grid-template-columns: minmax(0, 1fr); }
	.cl-article__body { max-width: none; }
	.cl-article__side, .cl-vsingle__side { position: static; }
	.cl-side { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
	.cl-side__box { margin: 0; }
	.cl-vgrid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.cl-shelf { grid-template-columns: repeat(3, minmax(0, 1fr)); }
	.cl-pubyear { grid-template-columns: 1fr; gap: 0; }
	.cl-pubyear__y { position: static; padding-top: 10px; }
}
@media (max-width: 760px) {
	.cl-ig__grid { grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: 78%; overflow-x: auto; scroll-snap-type: x mandatory; padding-bottom: 8px; margin-inline: calc(var(--cl-gutter) * -1); padding-inline: var(--cl-gutter); scroll-padding-inline: var(--cl-gutter); }
	.cl-ig__post { scroll-snap-align: start; }
	.cl-side { grid-template-columns: 1fr; }
	.cl-vgrid { grid-template-columns: 1fr; }
	.cl-bookfeat { grid-template-columns: 1fr; }
	.cl-bookfeat__cover { max-width: 240px; }
	.cl-pubrow { grid-template-columns: minmax(0, 1fr) 40px; gap: 6px 16px; }
	.cl-pubrow__date { grid-column: 1 / -1; }
	.cl-pubrow__go { width: 40px; height: 40px; }
	.cl-pubsingle { grid-template-columns: 1fr; }
	.cl-pubsingle__cover { position: static; max-width: 260px; }
	.cl-pubsheet { grid-template-columns: 1fr; }
	.cl-shelf { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.cl-totop { width: 50px; height: 50px; }
	.single-post .cl-totop { bottom: 84px; }
}

@media print {
	.cl-header, .cl-footer, .cl-nl, .cl-bglines, .cl-progress, .cl-share, .cl-totop, .cl-article__side, .cl-aibar, .cl-consent, .cl-prefs, .cl-transition, .cl-related { display: none !important; }
	body { background: #fff; }
	.cl-main > :first-child:not(.cl-hero) { padding-top: 0; }
}

/* Menu mobile aperto: la testata resta sopra, con logo chiaro */
.cl-menu-open .cl-header { z-index: 75; background: transparent !important; box-shadow: none !important; backdrop-filter: none !important; transform: none !important; }
.cl-menu-open .cl-header .cl-logo { color: #fff; }
.cl-menu-open .cl-header .cl-iconbtn { color: #fff; border-color: rgba(255, 255, 255, .25); }

/* Instagram con Smash Balloon: il feed prende gli spazi e gli angoli del sito */
.cl-ig__sb #sb_instagram { padding: 0 !important; }
.cl-ig__sb #sb_instagram #sbi_images { padding: 0 !important; gap: clamp(12px, 2vw, 22px); }
.cl-ig__sb #sb_instagram .sbi_item { padding: 0 !important; }
.cl-ig__sb #sb_instagram .sbi_photo { border-radius: 14px; overflow: hidden; }

/* Video negli articoli: lettore al posto della copertina, emittente */
.cl-article__video { margin: 0 0 22px; }
.cl-article__video .cl-video { margin: 0; }
.cl-video__em { color: inherit; text-decoration: none; }
a.cl-video__em:hover { color: var(--cl-accent); text-decoration: underline; }
.cl-article__em a { color: inherit; }
.cl-lines--em { margin-top: 12px; }

/* Vecchie pagine WPBakery lette senza il plugin */
.cl-vc-row { display: flex; flex-wrap: wrap; gap: 0 clamp(20px, 3vw, 40px); margin: 0 0 1.2em; }
.cl-vc-col { flex: 1 1 calc(var(--cl-vc-w, 100%) - 40px); min-width: 0; }
.cl-vc-row .cl-vc-row { margin-bottom: 0; }
.cl-vc-img { margin: 0 0 1.2em; }
.cl-vc-img img { max-width: 100%; height: auto; border-radius: var(--cl-radius); }
.cl-vc-img.is-center { text-align: center; }
.cl-vc-img.is-right { text-align: right; }
.cl-vc-gallery { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 12px; margin: 0 0 1.2em; }
.cl-vc-gallery img { width: 100%; height: 100%; object-fit: cover; aspect-ratio: 4/3; border-radius: var(--cl-radius); }
.cl-vc-embed iframe { width: 100%; aspect-ratio: 16/9; height: auto; }
.cl-vc-toggle { border-top: 1px solid var(--cl-line); padding: 12px 0; }
.cl-vc-toggle summary { cursor: pointer; font-weight: 600; }
@media (max-width: 760px) { .cl-vc-col { flex-basis: 100%; } }

/* Notifiche push nel banner del biglietto */
.cl-push { display: grid; gap: 12px; justify-items: start; }
.cl-push__on { font-size: 17px; }
.cl-push__off { background: none; border: 0; padding: 0; cursor: pointer; font: inherit; color: var(--cl-muted); text-decoration: underline; }
.cl-push__status { margin: 0; font-weight: 600; color: var(--cl-accent); }
.cl-push__status.is-error { color: var(--cl-alt); }
.cl-push__status:empty { display: none; }
.cl-push__note { margin: 0; font-size: 14px; line-height: 1.5; color: var(--cl-muted); }
.cl-push__ios { margin: 0 0 14px; padding: 14px 16px; border-radius: 14px; background: var(--cl-bg); font-size: 15px; line-height: 1.5; }
.cl-push__ios p { margin: 0; }
.cl-push__mail { margin-top: 18px; border-top: 1px solid var(--cl-line); padding-top: 14px; }
.cl-push__mail summary { cursor: pointer; font-weight: 600; color: var(--cl-navy); }
.cl-push__mail[open] summary { margin-bottom: 14px; }
.cl-push[hidden] + .cl-push__ios[hidden] + .cl-push__mail { margin-top: 0; border-top: 0; padding-top: 0; }
.cl-nl__hint.is-ok { color: #fff; }
.cl-nl__hint.is-ok .cl-nl__dot { background: var(--cl-highlight); animation: none; }
.cl-nl__hint.is-error { color: #FFD3C9; text-transform: none; letter-spacing: 0; font: 500 14px/1.4 var(--cl-font-body, inherit); }

/* Guida iPhone: aggiungere il sito alla schermata Home */
.cl-ios { margin: 0 0 14px; }
.cl-ios__lead { margin: 0 0 14px; font-size: 16px; line-height: 1.45; }
.cl-ios__steps { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.cl-ios__steps li { display: flex; gap: 12px; align-items: flex-start; padding: 12px 14px; border-radius: 14px; background: var(--cl-bg); font-size: 15px; line-height: 1.4; }
.cl-ios__n { flex: 0 0 26px; height: 26px; border-radius: 50%; display: grid; place-items: center; background: var(--cl-accent); color: #fff; font-weight: 700; font-size: 14px; }
.cl-ios__ico { display: inline-block; vertical-align: -5px; color: #0A84FF; }
.cl-ios__arrow { margin: 14px 0 0; text-align: center; font: 600 13px var(--cl-font-mono); letter-spacing: .06em; color: var(--cl-accent); }
@media (min-width: 761px) { .cl-ios__arrow { display: none; } }
.cl-nlm.is-ios .cl-nlm__lead, .cl-nlm.is-ios .cl-nl__perks { display: none; }
