/* =====================================================================
   STILE "NUOVO" (18 ottobre 2026) – alternativa allo stile classico.
   Si accende in Impostazioni → Stile del sito, oppure in prova con ?tema=leggero.
   Si carica dopo site.css e vale solo con la classe .tema-leggero su <html>.
   Stessa struttura, aspetto diverso:
   - fondo bianco neutro, testo quasi nero: contrasto netto;
   - niente barra in alto (bandiera e lingua stanno nella testata);
   - niente lime; il blu resta, con viola e magenta accesi nelle sfumature;
   - i blocchi colorati diventano pannelli scuri "notte" con sfumature, staccati dai bordi;
   - caratteri meno pesanti ma più grandi; niente ombre a timbro né etichette storte.
   ===================================================================== */
@font-face {
  font-family: "Space Grotesk"; font-style: normal; font-weight: 300 700; font-display: swap;
  src: url(../fonts/space-grotesk-variable.ttf) format("truetype");
}
html.tema-leggero {
  --font: "Space Grotesk", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  --header-h: 60px;
  --blue: #040A73;
  --notte: #0D0B2B;
  --ink: #0D0B2B;
  --viola: #7C3AED;
  --fucsia: #DB2777;
  --elettrico: #3D3BF3;
  --text: #24233A;
  --muted: #5D5C70;
  --line: #E4E3EA;
  --bg: #FFFFFF;
  --bg-alt: #F3F3F6;
  --card-bg: #F3F3F6;
  --blue-soft: #EDEDF3;
  --lime: #FFFFFF;          /* il lime non c'è più: dove serviva un colore chiaro su fondo scuro ora c'è il bianco */
  --lime-soft: #F3F3F6;
  --radius: 20px;
  --radius-sm: 12px;
  --r-btn: 999px;
  --pannello: 28px;
  --shadow-pop: none;
  --shadow-pop-lg: none;
  --ombra: 0 18px 40px rgba(13, 11, 43, .12);
  --riga: linear-gradient(90deg, var(--elettrico) 0%, var(--viola) 50%, var(--fucsia) 100%);
  --g1: radial-gradient(55% 75% at 0% 0%, rgba(124, 58, 237, .6) 0%, transparent 62%),
        radial-gradient(55% 75% at 100% 100%, rgba(219, 39, 119, .5) 0%, transparent 62%),
        radial-gradient(40% 50% at 85% 10%, rgba(61, 59, 243, .45) 0%, transparent 65%),
        var(--notte);
}
.tema-leggero body { background: var(--bg); color: var(--text); font-family: var(--font); font-size: 1.0625rem; line-height: 1.55; }
.tema-leggero button, .tema-leggero input, .tema-leggero select, .tema-leggero textarea { font-family: var(--font); }

/* ---------- caratteri: grandi, scuri, meno grassetto ---------- */
.tema-leggero h1, .tema-leggero h2, .tema-leggero h3, .tema-leggero .display, .tema-leggero .h2,
.tema-leggero .hero-title, .tema-leggero .card-title, .tema-leggero .row-title, .tema-leggero .stat-num { font-weight: 500; letter-spacing: -.04em; color: var(--ink); }
.tema-leggero h3, .tema-leggero .card-title, .tema-leggero .row-title { font-weight: 600; letter-spacing: -.02em; }
.tema-leggero .display { font-size: clamp(2.6rem, 8vw, 5rem); line-height: .98; }
.tema-leggero .h2 { font-size: clamp(2rem, 5vw, 3.2rem); line-height: 1.02; }
.tema-leggero .eyebrow { opacity: 1; color: var(--viola); font-weight: 600; letter-spacing: .02em; }
.tema-leggero .card-cta { text-transform: none; letter-spacing: 0; font-size: .95rem; font-weight: 600; }
.tema-leggero .lead { font-weight: 400; color: var(--muted); }
.tema-leggero .prose a, .tema-leggero main p a:not(.btn) { color: var(--viola); text-decoration-thickness: 1.5px; }
.tema-leggero ::selection { background: var(--viola); color: #fff; }
.tema-leggero :focus-visible { outline-color: var(--viola); }

/* titoli di sezione: niente evidenziatore, una riga sfumata corta sotto */
.tema-leggero .sec-head .h2, .tema-leggero .split-text > .h2, .tema-leggero .stats-text .h2 { display: block; background: none; padding: 0; }
.tema-leggero .sec-head .h2::after, .tema-leggero .split-text > .h2::after, .tema-leggero .tx-head .h2::after,
.tema-leggero .tone-blue .sec-head .h2::after, .tema-leggero .tone-blue .split-text > .h2::after {
  content: ""; display: block; width: 56px; height: 5px; border-radius: 5px; background: var(--riga); margin-top: 16px; }
.tema-leggero .tone-lime .sec-head .h2, .tema-leggero .tone-lime .split-text > .h2 { background: none; }

/* ---------- testata: bianca, pulita; bandiera e lingua piccole a destra ---------- */
.tema-leggero .site-header { background: rgba(255, 255, 255, .9); -webkit-backdrop-filter: saturate(1.5) blur(14px); backdrop-filter: saturate(1.5) blur(14px); border-bottom: 1px solid var(--line); }
.tema-leggero .site-header.is-scrolled { box-shadow: 0 8px 30px rgba(13, 11, 43, .08); }
.tema-leggero .brand { color: var(--blue); }
.tema-leggero .hd-pride { display: inline-flex; align-items: center; gap: 8px; height: 40px; padding: 0 12px 0 8px; border-radius: 999px; border: 1px solid var(--line); color: var(--ink); font-size: .85rem; font-weight: 600; text-decoration: none; white-space: nowrap; }
.tema-leggero .hd-pride:hover { border-color: var(--ink); }
.tema-leggero .hd-flag { width: 26px; height: 17px; border-radius: 3px; display: block; }
.tema-leggero .hd-lang { display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; border-radius: 999px; border: 1px solid var(--line); color: var(--ink); font-size: .82rem; font-weight: 700; text-decoration: none; }
.tema-leggero .hd-lang:hover { border-color: var(--ink); }
@media (max-width: 599px) { .tema-leggero .hd-pride-text { display: none; } .tema-leggero .hd-pride { padding: 0 7px; } }
.tema-leggero .nav-toggle { background: var(--ink); color: #fff; }
.tema-leggero .nav { background: var(--notte); }
.tema-leggero .nav-list > li > a:hover, .tema-leggero .sub-toggle:hover { background: var(--bg-alt); }
.tema-leggero .nav-list > li.nav-evid > a { color: #fff; }
@media (min-width: 1200px) {
  .tema-leggero .nav { background: none; }
  .tema-leggero .nav-list > li > a, .tema-leggero .sub-toggle { color: var(--ink); font-weight: 500; }
  .tema-leggero .nav-list > li.nav-evid > a { background: var(--riga); color: #fff; }
  .tema-leggero .nav-list > li.nav-evid > a:hover { background: var(--ink); }
}

/* ---------- pulsanti: pillole nette ---------- */
.tema-leggero .btn { border-width: 1.5px; border-radius: 999px; font-weight: 600; box-shadow: none; transform: none; letter-spacing: -.005em; }
.tema-leggero .btn-lime, .tema-leggero .btn-primary { background: var(--ink); color: #fff; border-color: var(--ink); }
.tema-leggero .btn-lime:hover, .tema-leggero .btn-primary:hover { background: var(--riga); border-color: transparent; color: #fff; transform: none; box-shadow: 0 10px 26px rgba(124, 58, 237, .35); }
.tema-leggero .btn-lime:active { transform: none; box-shadow: none; }
.tema-leggero .btn-outline { border-color: var(--ink); color: var(--ink); background: transparent; }
.tema-leggero .btn-outline:hover { box-shadow: none; transform: none; background: var(--ink); color: #fff; }
.tema-leggero .btn-donate { box-shadow: none; }
/* su fondo scuro o su foto: pulsante bianco */
.tema-leggero .slider .btn-lime, .tema-leggero .hero .btn-lime, .tema-leggero .page-head.has-image .btn-lime,
.tema-leggero .site-footer .btn-lime, .tema-leggero .tone-blue .btn-lime, .tema-leggero .sec-valori .btn-lime { background: #fff; color: var(--ink); border-color: #fff; box-shadow: none; }
.tema-leggero .slider .btn-lime:hover, .tema-leggero .hero .btn-lime:hover, .tema-leggero .site-footer .btn-lime:hover,
.tema-leggero .tone-blue .btn-lime:hover, .tema-leggero .sec-valori .btn-lime:hover { background: var(--riga); color: #fff; border-color: transparent; }
.tema-leggero .tone-blue .btn-outline, .tema-leggero .sec-valori .btn-outline { border-color: #fff; color: #fff; }
.tema-leggero .tone-blue .btn-outline:hover, .tema-leggero .sec-valori .btn-outline:hover { background: #fff; color: var(--ink); }
.tema-leggero .wa-float { box-shadow: 0 10px 26px rgba(0, 0, 0, .2); }

/* ---------- riquadri: grigio chiarissimo, angoli morbidi ---------- */
.tema-leggero .card, .tema-leggero .act-row, .tema-leggero .project-card, .tema-leggero .campaign, .tema-leggero .contact-card,
.tema-leggero .steps li, .tema-leggero .faq details, .tema-leggero .toc, .tema-leggero .donate-box, .tema-leggero .factbox, .tema-leggero .docs a, .tema-leggero .eu-box { border: 0; border-radius: var(--radius); background: var(--card-bg); box-shadow: none; }
.tema-leggero .tone-alt .card, .tema-leggero .tone-alt .act-row, .tema-leggero .tone-alt .steps li, .tema-leggero .tone-alt .faq details { background: #fff; }
.tema-leggero .card:hover, .tema-leggero .act-row:hover, .tema-leggero .cards-colori .card:hover,
.tema-leggero .tone-blue .card:hover, .tema-leggero .tone-lime .card:hover { transform: translateY(-3px); box-shadow: var(--ombra); }
.tema-leggero .pj-card:hover, .tema-leggero .sch-grid-foto .sch:hover { transform: translateY(-4px); box-shadow: var(--ombra); }
.tema-leggero .tile-num, .tema-leggero .card:nth-child(even) .tile-num { transform: none; border: 0; box-shadow: none; background: var(--ink); color: #fff; }
.tema-leggero .tile-ico, .tema-leggero .tone-lime .tile-ico { background: var(--ink); color: #fff; }
.tema-leggero .fatto { border: 0; box-shadow: none; background: var(--card-bg); }
.tema-leggero .split-img img, .tema-leggero .split-img .ph-photo, .tema-leggero .tone-alt .split-img img { box-shadow: none; border-radius: var(--radius); }
.tema-leggero .settori-tabs [role="tab"]:hover { transform: none; box-shadow: none; border-color: var(--ink); }
.tema-leggero .settori-tabs [aria-selected="true"] { box-shadow: none; transform: none; background: var(--ink); color: #fff; }
.tema-leggero .gt-tabs [aria-selected="true"] { background: var(--ink); color: #fff; box-shadow: none; transform: none; }
.tema-leggero .docs a:hover { background: var(--ink); color: #fff; }

/* date: blocchetto scuro, dritto */
.tema-leggero .datebox, .tema-leggero .row-date { background: var(--ink); color: #fff; border: 0; box-shadow: none; transform: none; }
.tema-leggero .datebox *, .tema-leggero .row-date * { color: #fff; }
.tema-leggero .is-past .datebox, .tema-leggero .is-past .row-date { background: var(--bg-alt); }
.tema-leggero .is-past .datebox *, .tema-leggero .is-past .row-date * { color: var(--muted); }

/* numeri: chiari con la cifra sfumata, alternati a quadrati scuri */
.tema-leggero .stats li, .tema-leggero .stats li:nth-child(even) { transform: none; border: 0; box-shadow: none; }
.tema-leggero .stats li { background: var(--card-bg); color: var(--ink); }
.tema-leggero .stats li .stat-num { background: var(--riga); -webkit-background-clip: text; background-clip: text; color: transparent; }
.tema-leggero .stats li:nth-child(even) { background: var(--g1); color: #fff; }
.tema-leggero .stats li:nth-child(even) .stat-num { background: none; color: #fff; }

/* etichette: pillole sobrie; il viola solo per "posti" e "iscrizioni aperte" */
.tema-leggero .badge { border: 0; border-radius: 999px; font-weight: 600; background: var(--bg-alt); color: var(--ink); }
.tema-leggero .badge-lime, .tema-leggero .pj-tags .badge-corso { background: var(--viola); color: #fff; }
.tema-leggero .badge-dark, .tema-leggero .badge-partner, .tema-leggero .pj-tags .badge-partner { background: var(--ink); color: #fff; }
.tema-leggero .pj-tags .badge { box-shadow: 0 2px 10px rgba(13, 11, 43, .2); }
.tema-leggero .pj-tags .badge:not(.badge-corso):not(.badge-partner):not(.badge-attivazione) { background: #fff; color: var(--ink); }

/* ---------- blocchi colorati: pannelli scuri staccati dai bordi ---------- */
.tema-leggero .section.tone-blue, .tema-leggero .section.sec-valori { background: var(--g1); color: rgba(255, 255, 255, .88); margin: 12px; border-radius: var(--pannello); }
@media (min-width: 900px) { .tema-leggero .section.tone-blue, .tema-leggero .section.sec-valori { margin: 16px 20px; } }
.tema-leggero .tone-blue h2, .tema-leggero .tone-blue h3, .tema-leggero .tone-blue .h2, .tema-leggero .tone-blue .sec-head .h2,
.tema-leggero .sec-valori h2, .tema-leggero .sec-valori .h2 { color: #fff; }
.tema-leggero .tone-blue .card h3, .tema-leggero .tone-blue .card .card-title { color: var(--ink); }
.tema-leggero .tone-blue a:not(.btn), .tema-leggero .sec-valori a:not(.btn) { color: #fff; }
.tema-leggero .tone-blue .card a:not(.btn) { color: var(--ink); }
.tema-leggero .tone-blue .muted, .tema-leggero .tone-blue .eyebrow { color: rgba(255, 255, 255, .7); }
.tema-leggero .tone-blue .card { background: rgba(255, 255, 255, .96); }
.tema-leggero .tone-blue .lead, .tema-leggero .sec-valori .lead, .tema-leggero .sec-valori .prose { color: rgba(255, 255, 255, .85); }
.tema-leggero .sec-valori .fluido { background: radial-gradient(circle at 50% 50%, rgba(219, 39, 119, .55) 0%, transparent 65%); }
.tema-leggero .tone-blue :focus-visible, .tema-leggero .sec-valori :focus-visible { outline-color: #fff; }
/* "giallo-lime" diventa bianco/grigio chiaro */
.tema-leggero .tone-lime { background: var(--bg-alt); }
.tema-leggero .tone-alt { background: var(--bg-alt); }

/* ---------- testate delle pagine: bianche, titolo grande ---------- */
.tema-leggero .page-head { background: var(--bg); color: var(--text); border-bottom: 1px solid var(--line); }
.tema-leggero .page-head h1 { color: var(--ink); }
.tema-leggero .page-head h1::after { content: ""; display: block; width: 64px; height: 6px; border-radius: 6px; background: var(--riga); margin-top: 18px; }
.tema-leggero .page-head .lead { color: var(--muted); }
.tema-leggero .page-coordinamento .page-head, .tema-leggero .page-adulti .page-head { background: var(--bg); }
.tema-leggero .page-coordinamento .page-head h1, .tema-leggero .page-adulti .page-head h1 { color: var(--ink); }
/* con la foto: pannello arrotondato staccato dai bordi, velo scuro neutro solo dove c'è il testo */
.tema-leggero .page-head.has-image { margin: 12px; border-radius: var(--pannello); overflow: hidden; border-bottom: 0; color: #fff; }
@media (min-width: 900px) { .tema-leggero .page-head.has-image { margin: 16px 20px; } }
.tema-leggero .page-head.has-image h1, .tema-leggero .page-head.has-image .lead { color: #fff; }
.tema-leggero .page-head.has-image .page-head-img::after {
  background: linear-gradient(100deg, rgba(13, 11, 43, .88) 0%, rgba(13, 11, 43, .6) 42%, rgba(13, 11, 43, .1) 78%, rgba(124, 58, 237, .12) 100%); }
.tema-leggero .page-head.has-image :focus-visible { outline-color: #fff; }

/* ---------- home: slide in un pannello arrotondato, striscia scura sottile ---------- */
.tema-leggero .sec-slider { padding: 12px 12px 0; }
@media (min-width: 900px) { .tema-leggero .sec-slider { padding: 16px 20px 0; } }
.tema-leggero .sec-slider .slider { border-radius: var(--pannello); overflow: hidden; }
.tema-leggero .slide-media::after { background: linear-gradient(180deg, rgba(13, 11, 43, .25) 0%, rgba(13, 11, 43, .45) 45%, rgba(13, 11, 43, .78) 100%); animation: none; }
.tema-leggero .hero-title, .tema-leggero .slide .hero-title { color: #fff; font-weight: 500; letter-spacing: -.045em; }
.tema-leggero .hero-title::after, .tema-leggero .slide .hero-title::after { background: var(--riga); height: 6px; width: 64px; }
.tema-leggero .slider :focus-visible, .tema-leggero .hero :focus-visible { outline-color: #fff; }
.tema-leggero .ph, .tema-leggero .slide-ph { background: var(--g1); }
.tema-leggero .sec-ticker { padding: 12px 12px 0; }
@media (min-width: 900px) { .tema-leggero .sec-ticker { padding: 12px 20px 0; } }
.tema-leggero .ticker { background: var(--notte); color: #fff; border: 0; transform: none; margin: 0; border-radius: 999px; }
.tema-leggero .ticker li { color: #fff; font-weight: 500; }
.tema-leggero .ticker li::after, .tema-leggero .ticker .sep { color: var(--fucsia); }
.tema-leggero .brand-anima { background: linear-gradient(110deg, var(--blue) 0%, var(--elettrico) 30%, var(--viola) 55%, var(--fucsia) 75%, var(--blue) 100%); background-size: 300% 100%; }

/* ---------- piè di pagina: pannello scuro staccato dai bordi ---------- */
.tema-leggero .site-footer { background: var(--g1); margin: 12px; border-radius: var(--pannello); }
@media (min-width: 900px) { .tema-leggero .site-footer { margin: 20px; } }
.tema-leggero .site-footer::after { display: none; }
.tema-leggero .f-brand .brand { color: #fff; }
.tema-leggero .site-footer a:not(.btn) { color: #fff; }
.tema-leggero .site-footer :focus-visible { outline-color: #fff; }

/* varie */
.tema-leggero dialog.lightbox button { background: #fff; color: var(--ink); box-shadow: none; }
.tema-leggero .slide-eyebrow { font-weight: 600; letter-spacing: .04em; text-transform: none; }
.tema-leggero .chip { border-radius: 999px; }

/* ---------- testata "a pillola" che galleggia (come i siti di riferimento) ---------- */
.tema-leggero .site-header { top: 0; background: transparent; border-bottom: 0; -webkit-backdrop-filter: none; backdrop-filter: none; padding: 10px 12px 0; pointer-events: none; }
.tema-leggero .site-header.is-scrolled { box-shadow: none; }
.tema-leggero .header-inner { pointer-events: auto; max-width: calc(var(--wrap) + 24px); margin: 0 auto; padding: 0 8px 0 22px; height: var(--header-h);
  background: rgba(244, 244, 247, .97);
  border: 1px solid rgba(13, 11, 43, .06); border-radius: 999px; }
/* la sfocatura solo su computer: sul telefono creerebbe problemi al menu che si apre */
@media (min-width: 1200px) { .tema-leggero .header-inner { background: rgba(244, 244, 247, .86); -webkit-backdrop-filter: saturate(1.6) blur(16px); backdrop-filter: saturate(1.6) blur(16px); } }
.tema-leggero .site-header.is-scrolled .header-inner { box-shadow: 0 10px 30px rgba(13, 11, 43, .14); background: #fff; }
@media (min-width: 900px) { .tema-leggero .site-header { padding: 14px 20px 0; } }
.tema-leggero .site-header .logo { height: 24px; }
.tema-leggero .hd-pride, .tema-leggero .hd-lang { border-color: transparent; background: #fff; }
.tema-leggero .btn-donate { min-height: 42px; padding: .5em 1.1em; }
.tema-leggero .nav-toggle { width: 44px; height: 44px; }
/* il menu del telefono si apre sotto la pillola */
.tema-leggero .nav { inset: calc(var(--header-h) + 18px) 12px auto 12px; max-height: calc(100vh - var(--header-h) - 40px); border-radius: 24px; }
@media (min-width: 1200px) { .tema-leggero .nav { inset: auto; max-height: none; border-radius: 0; } .tema-leggero .nav-list > li > a, .tema-leggero .sub-toggle { font-size: .98rem; } }
/* la pagina parte sotto la pillola */
.tema-leggero main { margin-top: 10px; }
/* numeri chiari dentro un blocco grigio: fondo bianco per staccarli */
.tema-leggero .tone-alt .stats li:nth-child(odd), .tema-leggero .tone-lime .stats li:nth-child(odd) { background: #fff; }
.tema-leggero .site-footer h2, .tema-leggero .site-footer h3, .tema-leggero .site-footer h4, .tema-leggero .site-footer .f-title { color: rgba(255, 255, 255, .62); }
.tema-leggero .site-footer, .tema-leggero .site-footer p, .tema-leggero .site-footer li { color: rgba(255, 255, 255, .88); }
/* testata sul telefono: tutto più compatto, "Dona" solo con il cuore */
@media (max-width: 599px) {
  .tema-leggero .site-header { padding: 8px 8px 0; }
  .tema-leggero .header-inner { padding: 0 6px 0 14px; gap: 6px; }
  .tema-leggero .header-actions { gap: 4px; }
  .tema-leggero .site-header .logo { height: 21px; }
  .tema-leggero .hd-pride { height: 36px; padding: 0 6px; }
  .tema-leggero .hd-flag { width: 22px; height: 15px; }
  .tema-leggero .hd-lang { width: 36px; height: 36px; }
  .tema-leggero .btn-donate { min-height: 40px; width: 40px; padding: 0; }
  .tema-leggero .btn-donate span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .tema-leggero .nav-toggle { width: 40px; height: 40px; }
}
/* menu del telefono: fondo notte, voci bianche */
@media (max-width: 1199px) {
  .tema-leggero .nav a:not(.tb-lang), .tema-leggero .nav .sub-toggle, .tema-leggero .nav .tb-socials a { color: #fff; }
  .tema-leggero .nav-list > li > a:hover, .tema-leggero .nav .sub-toggle:hover { background: rgba(255, 255, 255, .08); }
}
.tema-leggero .btn-outline-light { color: #fff; border-color: #fff; background: transparent; }
.tema-leggero .btn-outline-light:hover { background: #fff; color: var(--ink); }

/* =====================================================================
   RITOCCO 18/10 sera: meno grigio, più colore, forme più caratterizzate.
   Una sola palette presa dal logo, usata dappertutto a rotazione:
   C1 blu → elettrico · C2 elettrico → viola · C3 viola → magenta · C4 blu → viola → magenta
   ===================================================================== */
html.tema-leggero {
  --c1: linear-gradient(135deg, #040A73 0%, #3D3BF3 100%);
  --c2: linear-gradient(135deg, #3D3BF3 0%, #7C3AED 100%);
  --c3: linear-gradient(135deg, #7C3AED 0%, #DB2777 100%);
  --c4: linear-gradient(135deg, #040A73 0%, #7C3AED 55%, #DB2777 100%);
  --card-bg: #fff;
  --bg-alt: #fff;
  --bordo: #E3E1EF;
  /* pannelli: partono dal blu del logo (non dal nero) e si accendono di elettrico, viola e magenta */
  --g1: radial-gradient(60% 80% at 0% 0%, rgba(61, 59, 243, .85) 0%, transparent 62%),
        radial-gradient(50% 70% at 100% 0%, rgba(124, 58, 237, .7) 0%, transparent 60%),
        radial-gradient(60% 80% at 100% 100%, rgba(219, 39, 119, .75) 0%, transparent 62%),
        #040A73;
}
.tema-leggero .tone-alt, .tema-leggero .tone-lime { background: #fff; }

/* ---------- riquadri bianchi con bordo sottile, non più grigi ---------- */
.tema-leggero .card, .tema-leggero .act-row, .tema-leggero .project-card, .tema-leggero .campaign, .tema-leggero .contact-card,
.tema-leggero .steps li, .tema-leggero .faq details, .tema-leggero .toc, .tema-leggero .donate-box, .tema-leggero .factbox,
.tema-leggero .docs a, .tema-leggero .eu-box, .tema-leggero .fatto, .tema-leggero .pj-card, .tema-leggero .sch {
  background: #fff; border: 1.5px solid var(--bordo); }
.tema-leggero .card:hover, .tema-leggero .act-row:hover, .tema-leggero .pj-card:hover, .tema-leggero .sch:hover { border-color: transparent; }

/* righe colorate in cima ai riquadri senza icona, a rotazione */
.tema-leggero .card.no-img:not(.has-ico) { position: relative; overflow: hidden; padding-top: 8px; }
.tema-leggero .card.no-img:not(.has-ico)::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 6px; background: var(--c1); }
.tema-leggero .grid > .card.no-img:nth-child(4n+2)::before { background: var(--c2); }
.tema-leggero .grid > .card.no-img:nth-child(4n+3)::before { background: var(--c3); }
.tema-leggero .grid > .card.no-img:nth-child(4n+4)::before { background: var(--c4); }
.tema-leggero .tile-num, .tema-leggero .card:nth-child(even) .tile-num { background: var(--c3); color: #fff; border-radius: 999px; }

/* ---------- schede con icona ("Da dove vuoi iniziare", Erasmus+ Desk…): tessere colorate ---------- */
.tema-leggero .card.has-ico { background: var(--c1); border: 0; color: rgba(255, 255, 255, .9); border-radius: 28px 28px 28px 8px; padding: 24px; min-height: 230px; }
.tema-leggero .grid > .card.has-ico:nth-child(4n+2) { background: var(--c2); }
.tema-leggero .grid > .card.has-ico:nth-child(4n+3) { background: var(--c3); }
.tema-leggero .grid > .card.has-ico:nth-child(4n+4) { background: var(--c4); }
.tema-leggero .card.has-ico .card-title, .tema-leggero .card.has-ico .card-title a,
.tema-leggero .tone-blue .card.has-ico .card-title, .tema-leggero .tone-blue .card.has-ico .card-title a { color: #fff; font-size: 1.35rem; }
.tema-leggero .card.has-ico .card-text { color: rgba(255, 255, 255, .88); }
.tema-leggero .card.has-ico .tile-ico { background: rgba(255, 255, 255, .16); color: #fff; width: 56px; height: 56px; border-radius: 18px; border: 1.5px solid rgba(255, 255, 255, .35); }
.tema-leggero .card.has-ico .card-cta { width: 44px; height: 44px; border-radius: 999px; background: #fff; color: var(--blue); justify-content: center; align-self: flex-end; }
.tema-leggero .card.has-ico:hover { transform: translateY(-5px) rotate(-.6deg); box-shadow: 0 22px 44px rgba(61, 59, 243, .3); }
.tema-leggero .card.has-ico :focus-visible { outline-color: #fff; }

/* ---------- date delle attività: blocchetti colorati a rotazione ---------- */
.tema-leggero .datebox, .tema-leggero .row-date { background: var(--c1); border-radius: 16px 16px 16px 4px; }
.tema-leggero .act-row:nth-child(4n+2) .row-date, .tema-leggero .card:nth-child(4n+2) .datebox { background: var(--c2); }
.tema-leggero .act-row:nth-child(4n+3) .row-date, .tema-leggero .card:nth-child(4n+3) .datebox { background: var(--c3); }
.tema-leggero .act-row:nth-child(4n+4) .row-date, .tema-leggero .card:nth-child(4n+4) .datebox { background: var(--c4); }

/* ---------- numeri e impatto: forma ad arco (come le porte e le finestre dei paesi) ---------- */
.tema-leggero .stats li, .tema-leggero .impatto li { border-radius: 160px 160px 24px 24px; padding: 48px 24px 26px; text-align: center; align-items: center; border: 1.5px solid var(--bordo); background: #fff; }
.tema-leggero .stats li .stat-num, .tema-leggero .impatto li .stat-num { background: var(--c4); -webkit-background-clip: text; background-clip: text; color: transparent; font-size: clamp(2.6rem, 6vw, 3.8rem); }
.tema-leggero .stats li:nth-child(even), .tema-leggero .impatto li:nth-child(even) { border: 0; color: #fff; }
.tema-leggero .stats li:nth-child(4n+2), .tema-leggero .impatto li:nth-child(4n+2) { background: var(--c2); }
.tema-leggero .stats li:nth-child(4n+4), .tema-leggero .impatto li:nth-child(4n+4) { background: var(--c3); }
.tema-leggero .stats li:nth-child(even) .stat-num, .tema-leggero .impatto li:nth-child(even) .stat-num { background: none; color: #fff; -webkit-background-clip: border-box; background-clip: border-box; }
.tema-leggero .impatto li:nth-child(even) *, .tema-leggero .stats li:nth-child(even) * { color: #fff; }
.tema-leggero .tone-alt .stats li:nth-child(odd), .tema-leggero .tone-lime .stats li:nth-child(odd) { background: #fff; }

/* ---------- etichette nei colori della palette ---------- */
.tema-leggero .badge { background: #fff; color: var(--ink); box-shadow: inset 0 0 0 1.5px var(--bordo); }
.tema-leggero .badge-lime, .tema-leggero .pj-tags .badge-corso { background: var(--c3); color: #fff; box-shadow: none; }
.tema-leggero .badge-free { background: #E9E8FF; color: #2B29B8; box-shadow: none; }
.tema-leggero .badge-price { background: #FCE4F0; color: #9D1452; box-shadow: none; }
.tema-leggero .badge-dark, .tema-leggero .badge-partner, .tema-leggero .pj-tags .badge-partner { background: var(--blue); color: #fff; box-shadow: none; }

/* ---------- testata: la pillola ha il bordo sfumato come il logo ---------- */
.tema-leggero .header-inner { border: 1.5px solid transparent; background: linear-gradient(#fff, #fff) padding-box, var(--c4) border-box; }
@media (min-width: 1200px) { .tema-leggero .header-inner { background: linear-gradient(rgba(255, 255, 255, .9), rgba(255, 255, 255, .9)) padding-box, var(--c4) border-box; } }
.tema-leggero .site-header.is-scrolled .header-inner { background: linear-gradient(#fff, #fff) padding-box, var(--c4) border-box; }
.tema-leggero .btn-donate, .tema-leggero .nav-toggle { background: var(--c4); border-color: transparent; color: #fff; }
.tema-leggero .btn-donate:hover { background: var(--blue); }
.tema-leggero .hd-pride, .tema-leggero .hd-lang { background: #F4F3FA; }

/* ---------- slide: più colore sulla foto ---------- */
.tema-leggero .slide-media::after { background:
  linear-gradient(180deg, rgba(4, 10, 115, .05) 0%, rgba(4, 10, 115, .45) 60%, rgba(4, 10, 115, .8) 100%),
  linear-gradient(120deg, rgba(61, 59, 243, .45) 0%, transparent 45%, rgba(219, 39, 119, .45) 100%); }
.tema-leggero .slider-dots .dot.is-active { background: var(--c3); border-color: transparent; }
.tema-leggero .slide-eyebrow { background: var(--c3); }
/* la striscia scorre con la stessa sfumatura del logo */
.tema-leggero .ticker { background: linear-gradient(110deg, #040A73 0%, #3D3BF3 30%, #7C3AED 55%, #DB2777 80%, #040A73 100%); background-size: 300% 100%; animation: logo-scorre 14s ease-in-out infinite alternate; }
.tema-leggero .ticker li::after, .tema-leggero .ticker .sep { color: #fff; }
@media (prefers-reduced-motion: reduce) { .tema-leggero .ticker { animation: none; } }

/* titoli di sezione: la riga sotto con la sfumatura completa */
.tema-leggero .sec-head .h2::after, .tema-leggero .split-text > .h2::after, .tema-leggero .tx-head .h2::after, .tema-leggero .page-head h1::after { background: var(--c4); width: 72px; }

/* =====================================================================
   RITOCCO 18/10 notte (dopo la bozza): niente archi né pillola nel menu.
   Menu su barra bianca a tutta larghezza, slide a tutta larghezza subito sotto,
   numeri come schede, niente riga sfumata sotto i titoli.
   ===================================================================== */
/* testata: barra bianca piena */
.tema-leggero .site-header { padding: 0; background: #fff; border-bottom: 1px solid var(--line); pointer-events: auto; }
.tema-leggero .header-inner, .tema-leggero .site-header.is-scrolled .header-inner,
.tema-leggero .header-inner:is(*) { max-width: var(--wrap); padding: 0 var(--gutter); border: 0; border-radius: 0; background: none; box-shadow: none; -webkit-backdrop-filter: none; backdrop-filter: none; }
@media (min-width: 1200px) { .tema-leggero .header-inner { background: none; } }
.tema-leggero .site-header.is-scrolled { box-shadow: 0 6px 24px rgba(13, 11, 43, .08); }
.tema-leggero main { margin-top: 0; }
.tema-leggero .nav { inset: var(--header-h) 0 0 0; max-height: none; border-radius: 0; }
@media (min-width: 1200px) { .tema-leggero .nav { inset: auto; } }
@media (max-width: 599px) { .tema-leggero .site-header { padding: 0; } .tema-leggero .header-inner { padding: 0 12px; } }

/* slide e striscia a tutta larghezza, attaccate al menu */
.tema-leggero .sec-slider, .tema-leggero .sec-ticker { padding: 0; }
@media (min-width: 900px) { .tema-leggero .sec-slider, .tema-leggero .sec-ticker { padding: 0; } }
.tema-leggero .sec-slider .slider { border-radius: 0; }
.tema-leggero .ticker { border-radius: 0; }

/* numeri: schede, non archi */
.tema-leggero .stats li, .tema-leggero .impatto li { border-radius: var(--radius); padding: 26px 24px; text-align: left; align-items: flex-start; }

/* tessere colorate: angoli tutti uguali */
.tema-leggero .card.has-ico { border-radius: 24px; }
.tema-leggero .datebox, .tema-leggero .row-date { border-radius: 14px; }

/* niente riga sfumata sotto i titoli */
.tema-leggero .sec-head .h2::after, .tema-leggero .split-text > .h2::after, .tema-leggero .tx-head .h2::after,
.tema-leggero .tone-blue .sec-head .h2::after, .tema-leggero .tone-blue .split-text > .h2::after,
.tema-leggero .page-head h1::after, .tema-leggero .hero-title::after, .tema-leggero .slide .hero-title::after { content: none; display: none; }

/* ---------- piè di pagina più leggero (18/10): tre colonne, reti in una riga, dati legali in piccolo ---------- */
.tema-leggero .site-footer.f2 { padding: 56px 0 28px; font-size: .95rem; }
.tema-leggero .f2-top { display: grid; gap: 32px; }
@media (min-width: 900px) { .tema-leggero .f2-top { grid-template-columns: 1.4fr 1fr 1.1fr; gap: 56px; } }
.tema-leggero .f2-brand .brand { color: #fff; margin-bottom: 14px; }
.tema-leggero .f2-brand .logo { height: 34px; }
.tema-leggero .f2-brand p { max-width: 34ch; margin: 0 0 18px; font-size: 1.05rem; line-height: 1.45; }
.tema-leggero .f2 .f-title { color: rgba(255, 255, 255, .6); font-size: .78rem; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; margin: 0 0 14px; }
.tema-leggero .f2-links, .tema-leggero .f2-contacts, .tema-leggero .f2-legal-links { list-style: none; margin: 0; padding: 0; }
.tema-leggero .f2-links { columns: 2; column-gap: 24px; }
.tema-leggero .f2-links li, .tema-leggero .f2-contacts li { margin: 0 0 9px; break-inside: avoid; }
.tema-leggero .f2 a:not(.btn) { color: #fff; text-decoration: none; }
.tema-leggero .f2 a:not(.btn):hover { text-decoration: underline; text-underline-offset: 3px; }
.tema-leggero .f2-muted { color: rgba(255, 255, 255, .62); font-size: .88rem; }
.tema-leggero .f2-net { border-top: 1px solid rgba(255, 255, 255, .16); margin-top: 40px; padding-top: 26px; }
.tema-leggero .f2-net .f-net-list { gap: 20px 36px; align-items: center; }
.tema-leggero .f2-net .f-net-logo { min-height: 46px; align-items: center; }
.tema-leggero .f2-net .f-net-label { color: rgba(255, 255, 255, .6); font-size: .62rem; font-weight: 600; }
.tema-leggero .f2-bottom { border-top: 1px solid rgba(255, 255, 255, .16); margin-top: 26px; padding-top: 20px; display: flex; flex-wrap: wrap; align-items: center; gap: 10px 24px; }
.tema-leggero .f2-pride { display: inline-flex; align-items: center; gap: 10px; font-weight: 600; }
.tema-leggero .f2-legal-links { display: flex; flex-wrap: wrap; gap: 6px 20px; font-size: .88rem; }
.tema-leggero .f2-legal { flex-basis: 100%; margin: 4px 0 0; font-size: .74rem; line-height: 1.6; color: rgba(255, 255, 255, .55); }

/* =====================================================================
   REVISIONE HOME 18/10 (dopo la prova): la pillola torna e galleggia SOPRA la foto,
   barra in alto di nuovo presente ma leggera, sezioni separate, valori con foto,
   campagna a fascia, loghi del piè di pagina più grandi e centrati.
   ===================================================================== */
html.tema-leggero { --hd-off: calc(var(--header-h) + 10px); }
@media (min-width: 900px) { html.tema-leggero { --hd-off: calc(var(--header-h) + 14px); } }

/* barra in alto: sottile, senza grassetto */
.tema-leggero .topbar { font-size: .8rem; }
.tema-leggero .topbar-inner, .tema-leggero .topbar .topbar-inner { min-height: 32px; }
.tema-leggero .tb-pride { font-weight: 500; gap: 10px; }
.tema-leggero .tb-flag { width: calc(var(--gutter) + max(0px, (100vw - var(--wrap)) / 2) + 30px); }
.tema-leggero a.tb-pride:hover .tb-flag { width: calc(var(--gutter) + max(0px, (100vw - var(--wrap)) / 2) + 44px); }
.tema-leggero .tb-hours { display: none; }
.tema-leggero .tb-socials .ico { width: 15px; height: 15px; }
.tema-leggero .tb-langs { font-weight: 600; }

/* menu a pillola che galleggia */
.tema-leggero .site-header, .tema-leggero .site-header.is-scrolled { background: transparent; border-bottom: 0; box-shadow: none; padding: 10px 12px 0; pointer-events: none; }
@media (min-width: 900px) { .tema-leggero .site-header, .tema-leggero .site-header.is-scrolled { padding: 14px 20px 0; } }
.tema-leggero .site-header .header-inner, .tema-leggero .site-header.is-scrolled .header-inner { pointer-events: auto; max-width: calc(var(--wrap) + 24px); margin: 0 auto; padding: 0 8px 0 22px; height: var(--header-h);
  border: 1.5px solid transparent; border-radius: 999px; background: linear-gradient(#fff, #fff) padding-box, var(--c4) border-box; box-shadow: 0 8px 26px rgba(13, 11, 43, .12); }
@media (max-width: 599px) { .tema-leggero .site-header, .tema-leggero .site-header.is-scrolled { padding: 8px 8px 0; } .tema-leggero .site-header .header-inner, .tema-leggero .site-header.is-scrolled .header-inner { padding: 0 6px 0 14px; } }
.tema-leggero .nav { inset: calc(var(--hd-off) + 8px) 12px auto 12px; max-height: calc(100vh - var(--hd-off) - 24px); border-radius: 24px; }
@media (min-width: 1200px) { .tema-leggero .nav { inset: auto; max-height: none; border-radius: 0; } }

/* la foto della slide (e delle testate con foto) parte da sotto la pillola */
.tema-leggero main > .sec-slider:first-child, .tema-leggero main > .page-head.has-image:first-child { margin-top: calc(-1 * var(--hd-off)); }
.tema-leggero main > .page-head.has-image:first-child { margin-left: 0; margin-right: 0; border-radius: 0; }
.tema-leggero main > .page-head.has-image:first-child .wrap { padding-top: calc(96px + var(--hd-off)); }
.tema-leggero .slide-content { padding-top: calc(80px + var(--hd-off)); }

/* sezioni bianche una dopo l'altra: una riga sottile e più aria tra l'una e l'altra */
.tema-leggero main > .section:not(.tone-blue):not(.sec-valori):not(.sec-slider):not(.sec-ticker)
  + .section:not(.tone-blue):not(.sec-valori):not(.sec-fatti):not(.sec-gallery) { padding-top: 0; }
.tema-leggero main > .section:not(.tone-blue):not(.sec-valori):not(.sec-slider):not(.sec-ticker)
  + .section:not(.tone-blue):not(.sec-valori):not(.sec-fatti):not(.sec-gallery) > .wrap::before {
  content: ""; display: block; height: 1px; background: var(--line); margin-bottom: 56px; }
@media (min-width: 900px) {
  .tema-leggero main > .section:not(.tone-blue):not(.sec-valori):not(.sec-slider):not(.sec-ticker)
    + .section:not(.tone-blue):not(.sec-valori):not(.sec-fatti):not(.sec-gallery) > .wrap::before { margin-bottom: 80px; }
}
.tema-leggero .sec-slider + .sec-ticker + .section { padding-top: 64px; }

/* "Qui puoi essere chi sei": più compatto, con la foto */
.tema-leggero .section.sec-valori { padding: 48px 0; }
@media (min-width: 900px) { .tema-leggero .section.sec-valori { padding: 64px 0; } }
.tema-leggero .valori-grid { display: grid; gap: 28px; align-items: center; }
@media (min-width: 900px) { .tema-leggero .valori-grid { grid-template-columns: 5fr 7fr; gap: 56px; } }
.tema-leggero .valori-foto img { display: block; width: 100%; height: 100%; max-height: 440px; object-fit: cover; border-radius: 22px; }
.tema-leggero .sec-valori .valori-titolo { font-size: clamp(2rem, 5vw, 3.2rem); max-width: none; }
.tema-leggero .sec-valori .lead { margin: 16px 0 20px; font-size: 1.02rem; }
.tema-leggero .principi li { padding: 6px 13px; font-size: .9rem; font-weight: 500; }
.tema-leggero .principi li.forte { background: #fff; color: var(--blue); }

/* campagna in corso: una fascia orizzontale con il logo */
.tema-leggero .camp-banner { display: flex; flex-wrap: wrap; align-items: center; gap: 20px 36px; padding: 22px 28px; border-radius: 24px; background: var(--g1); color: #fff; }
.tema-leggero .camp-logo { flex: none; background: #fff; border-radius: 16px; padding: 10px 16px; line-height: 0; }
.tema-leggero .camp-logo img { height: 64px; width: auto; max-width: 200px; object-fit: contain; }
.tema-leggero .camp-text { flex: 1 1 260px; min-width: 0; }
.tema-leggero .camp-title { color: #fff; font-size: clamp(1.3rem, 2.6vw, 1.9rem); margin: 10px 0 4px; }
.tema-leggero .camp-goal { margin: 0; color: rgba(255, 255, 255, .8); font-size: .95rem; }
.tema-leggero .camp-banner .btn-lime { background: #fff; color: var(--ink); border-color: #fff; }
.tema-leggero .camp-banner .btn-lime:hover { background: var(--c3); color: #fff; border-color: transparent; }
.tema-leggero .camp-banner .badge-lime { background: rgba(255, 255, 255, .16); color: #fff; }
.tema-leggero .camp-banner :focus-visible { outline-color: #fff; }

/* Erasmus+ Desk e tessere con icona: icone più grandi, su un quadrato bianco */
.tema-leggero .card.has-ico .tile-ico { width: 64px; height: 64px; border-radius: 20px; }
.tema-leggero .card.has-ico .tile-ico .ico { width: 30px; height: 30px; }
.tema-leggero .tone-blue .card.has-ico .tile-ico { background: #fff; border: 0; color: var(--viola); }

/* loghi delle reti: più grandi, tutti centrati sulla stessa riga */
.tema-leggero .f2-net .f-net-list { justify-content: center; align-items: center; gap: 24px 48px; }
.tema-leggero .f2-net .f-net-list li { display: flex; justify-content: center; }
.tema-leggero .f2-net .f-net-list a { align-items: center; text-align: center; }
.tema-leggero .f2-net .f-net-logo { min-height: 56px; justify-content: center; }

/* =====================================================================
   REVISIONE 2 (18/10 notte): pillola senza bordo colorato, barra in alto come due piccole
   pillole sopra la foto (spariscono scorrendo), piè di pagina a tutta larghezza,
   "Qui puoi essere chi sei" chiara e compatta, "Cosa facciamo" con temi e attività.
   ===================================================================== */
html.tema-leggero { --tb-h: 44px; }
@media (max-width: 599px) { html.tema-leggero { --tb-h: 40px; } }

/* menu: pillola bianca, niente linea sfumata */
.tema-leggero .site-header .header-inner, .tema-leggero .site-header.is-scrolled .header-inner {
  border: 1px solid rgba(13, 11, 43, .07); background: #fff; box-shadow: 0 8px 28px rgba(13, 11, 43, .12); }

/* barra in alto: due pillole piccole che galleggiano sopra la foto */
.tema-leggero .topbar { position: absolute; top: 0; left: 0; right: 0; z-index: 60; background: none; animation: none; pointer-events: none; font-size: .78rem; overflow: visible; }
.tema-leggero .topbar .topbar-inner { min-height: var(--tb-h); padding-top: 8px; display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.tema-leggero .tb-pride, .tema-leggero .topbar-links { pointer-events: auto; display: inline-flex; align-items: center; gap: 8px; height: 30px; padding: 0 12px 0 6px;
  background: rgba(255, 255, 255, .9); color: var(--ink); border-radius: 999px; box-shadow: 0 4px 14px rgba(13, 11, 43, .12); font-weight: 500; text-decoration: none; }
.tema-leggero .topbar-links { padding: 0 4px 0 10px; gap: 10px; }
.tema-leggero .tb-flag, .tema-leggero a.tb-pride:hover .tb-flag { width: 24px; height: 16px; margin: 0; clip-path: none; border-radius: 999px; overflow: hidden; align-self: center; background: none; }
.tema-leggero .tb-flag svg { display: block; width: 100%; height: 100%; }
.tema-leggero .tb-pride-text { color: var(--ink); }
.tema-leggero a.tb-pride:hover .tb-pride-text { text-decoration: underline; text-decoration-color: var(--viola); }
.tema-leggero .tb-socials { display: flex; gap: 2px; margin: 0; padding: 0; list-style: none; }
.tema-leggero .tb-socials a { color: var(--ink); display: inline-flex; padding: 4px; }
.tema-leggero .tb-langs { display: inline-flex; gap: 2px; background: #EEEDF5; border-radius: 999px; padding: 2px; font-weight: 600; font-size: .72rem; }
.tema-leggero .tb-langs > * { padding: 2px 8px; border-radius: 999px; color: var(--muted); text-decoration: none; }
.tema-leggero .tb-langs .is-on { background: var(--ink); color: #fff; }
.tema-leggero .tb-langs a:hover { color: var(--ink); }
@media (max-width: 599px) { .tema-leggero .tb-socials { display: none; } .tema-leggero .topbar-links { padding: 0 3px; } }

/* la pillola del menu sta sotto le pillole piccole; scorrendo resta in alto da sola */
.tema-leggero .site-header { margin-top: var(--tb-h); }
.tema-leggero main > .sec-slider:first-child, .tema-leggero main > .page-head.has-image:first-child { margin-top: calc(-1 * (var(--hd-off) + var(--tb-h))); }
.tema-leggero main > .page-head.has-image:first-child .wrap { padding-top: calc(80px + var(--hd-off) + var(--tb-h)); }
.tema-leggero .slide-content { padding-top: calc(64px + var(--hd-off) + var(--tb-h)); }
/* senza foto in testata: un po' d'aria sotto la pillola */
.tema-leggero main > .page-head:not(.has-image):first-child { padding-top: 40px; }

/* piè di pagina a tutta larghezza */
.tema-leggero .site-footer, .tema-leggero .site-footer.f2 { margin: 0; border-radius: 0; }
/* logo dell'Università più grande (come quello di Giovani Senza Frontiere) */
.tema-leggero .f2-net a[title^="Università"] img { width: 250px; height: auto; max-width: 70vw; }

/* "Da dove vuoi iniziare": tre tessere grandi */
.tema-leggero .sec-cards .cols-3 > .card.has-ico { min-height: 250px; }
.tema-leggero .sec-cards .cols-3 > .card.has-ico .card-title { font-size: 1.6rem; }

/* "Cosa facciamo": testo e tipi di attività a sinistra, temi a destra */
.tema-leggero .cf-grid { display: grid; gap: 36px; }
@media (min-width: 900px) { .tema-leggero .cf-grid { grid-template-columns: 5fr 6fr; gap: 64px; align-items: start; } }
.tema-leggero .cf-intro .prose { font-size: 1.08rem; margin: 18px 0 6px; }
.tema-leggero .cf-label { font-size: .78rem; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: var(--muted); margin: 24px 0 12px; }
.tema-leggero .cf-temi .cf-label { margin-top: 6px; }
.tema-leggero .cf-tipi { list-style: none; margin: 0 0 24px; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.tema-leggero .cf-tipi a, .tema-leggero .cf-tipi li:not(:has(a)) { display: inline-block; padding: 7px 14px; border-radius: 999px; border: 1.5px solid var(--bordo); color: var(--ink); text-decoration: none; font-weight: 500; font-size: .92rem; }
.tema-leggero .cf-tipi a:hover { background: var(--ink); border-color: var(--ink); color: #fff; }
.tema-leggero .cf-temi-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.tema-leggero .cf-tema { display: flex; gap: 16px; align-items: flex-start; padding: 16px 18px; border: 1.5px solid var(--bordo); border-radius: 18px; background: #fff; transition: border-color .15s, box-shadow .15s; }
.tema-leggero .cf-tema:hover { border-color: transparent; box-shadow: var(--ombra); }
.tema-leggero .cf-num { flex: none; width: 36px; height: 36px; border-radius: 12px; display: inline-flex; align-items: center; justify-content: center; color: #fff; font-weight: 600; background: var(--c1); }
.tema-leggero .cf-tema:nth-child(4n+2) .cf-num { background: var(--c2); }
.tema-leggero .cf-tema:nth-child(4n+3) .cf-num { background: var(--c3); }
.tema-leggero .cf-tema:nth-child(4n+4) .cf-num { background: var(--c4); }
.tema-leggero .cf-tema-titolo { font-size: 1.08rem; margin: 6px 0 4px; letter-spacing: -.015em; }
.tema-leggero .cf-tema-titolo a { color: var(--ink); text-decoration: none; }
.tema-leggero .cf-tema-titolo a:hover { color: var(--viola); }
.tema-leggero .cf-tema p { margin: 0; color: var(--muted); font-size: .95rem; line-height: 1.45; }

/* "Qui puoi essere chi sei": riquadro chiaro e compatto con bordo sfumato, niente blocco scuro */
.tema-leggero .section.sec-valori { background: transparent; color: var(--text); margin: 0; border-radius: 0; padding: 24px 0 56px; }
.tema-leggero .sec-valori .fluido { display: none; }
.tema-leggero .sec-valori .wrap { position: relative; display: grid; gap: 8px 48px; padding: 32px 28px; border: 2px solid transparent; border-radius: 28px;
  background: linear-gradient(#fff, #fff) padding-box, var(--c4) border-box; }
@media (min-width: 900px) {
  .tema-leggero .sec-valori .wrap { grid-template-columns: 1.1fr 1fr; padding: 40px 44px; max-width: calc(var(--wrap) - 32px); }
  .tema-leggero .sec-valori .principi { grid-column: 2; grid-row: 1 / span 3; align-self: center; }
}
.tema-leggero .sec-valori h2, .tema-leggero .sec-valori .h2, .tema-leggero .sec-valori .valori-titolo { color: var(--ink); font-size: clamp(1.8rem, 4vw, 2.6rem); margin: 0; }
.tema-leggero .sec-valori .lead, .tema-leggero .sec-valori .prose { color: var(--muted); font-size: .98rem; margin: 10px 0 14px; }
.tema-leggero .sec-valori a:not(.btn) { color: var(--viola); }
.tema-leggero .sec-valori .principi { margin: 0; }
.tema-leggero .sec-valori .principi li { background: #F3F2F9; color: var(--ink); }
.tema-leggero .sec-valori .principi li.forte { background: var(--c3); color: #fff; }
.tema-leggero .sec-valori .btn-lime { background: var(--ink); color: #fff; border-color: var(--ink); }
.tema-leggero .sec-valori :focus-visible { outline-color: var(--viola); }

/* =====================================================================
   SPAZI UGUALI DAPPERTUTTO (18/10): una sola misura tra un blocco e l'altro.
   --sp = spazio sopra e sotto ogni sezione (56 px telefono, 88 px computer).
   Due sezioni bianche di fila: spazio, riga sottile, spazio. I pannelli colorati stanno a 12–20 px dai bordi.
   ===================================================================== */
html.tema-leggero { --sp: 56px; --sp-head: 28px; }
@media (min-width: 900px) { html.tema-leggero { --sp: 88px; --sp-head: 36px; } }

.tema-leggero main > .section.section:where(:not(.sec-slider, .sec-ticker, .sec-foto, .sec-hero, .sec-fatti, .sec-toc)) { padding-top: var(--sp); padding-bottom: var(--sp); }
/* bianca dopo bianca: niente doppio spazio, una riga a metà */
.tema-leggero main > .section:not(.tone-blue):not(.sec-valori):not(.sec-slider):not(.sec-ticker)
  + .section.section:not(.tone-blue):not(.sec-valori):not(.sec-fatti):not(.sec-gallery) { padding-top: 0; }
.tema-leggero main > .section:not(.tone-blue):not(.sec-valori):not(.sec-slider):not(.sec-ticker)
  + .section:not(.tone-blue):not(.sec-valori):not(.sec-fatti):not(.sec-gallery) > .wrap::before { margin-bottom: var(--sp); }
/* dopo la striscia che scorre */
.tema-leggero main > .sec-ticker + .section.section { padding-top: var(--sp); }
/* pannelli colorati e riquadro dei valori */
.tema-leggero main > .section.section.tone-blue { margin: 0 12px; padding-top: calc(var(--sp) * .8); padding-bottom: calc(var(--sp) * .8); }
@media (min-width: 900px) { .tema-leggero main > .section.section.tone-blue { margin: 0 20px; } }
.tema-leggero main > .section.section.sec-valori { padding-top: var(--sp); padding-bottom: var(--sp); }
.tema-leggero main > .section.tone-blue + .section.section.sec-valori { padding-top: var(--sp); }
/* dopo un riquadro (valori) o un pannello: lo stesso spazio, senza raddoppiarlo */
.tema-leggero main > .section.sec-valori + .section.section { padding-top: 0; }
/* titolo della sezione → contenuto */
.tema-leggero .sec-head { margin-bottom: var(--sp-head); }
.tema-leggero .sec-foot { margin-top: var(--sp-head); margin-bottom: 0; }
/* ultimo blocco → piè di pagina */
.tema-leggero main > .section:last-child { margin-bottom: 0; }

/* ---------- "Chi siamo e cosa facciamo": testo e foto affiancati, i temi in una riga sotto ---------- */
.tema-leggero .cf-top { display: grid; gap: 28px; align-items: center; }
@media (min-width: 900px) { .tema-leggero .cf-top.has-foto { grid-template-columns: 1fr 1fr; gap: 56px; } }
.tema-leggero .cf-intro .prose { font-size: 1.08rem; margin: 16px 0 0; }
.tema-leggero .cf-intro .prose p { margin: 0 0 .8em; }
.tema-leggero .cf-label { margin: 22px 0 10px; }
.tema-leggero .cf-tipi { margin-bottom: 22px; }
.tema-leggero .cf-intro .btn-row { margin: 0; }
.tema-leggero .cf-foto img { display: block; width: 100%; aspect-ratio: 4 / 3; height: auto; object-fit: cover; border-radius: 24px; }
.tema-leggero .cf-label-temi { margin-top: var(--sp-head); }
.tema-leggero .cf-temi-list { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 12px; }
.tema-leggero .cf-tema { display: flex; flex-direction: column; gap: 6px; padding: 18px; }
.tema-leggero .cf-tema-titolo { margin: 8px 0 2px; font-size: 1.02rem; line-height: 1.25; }
.tema-leggero .cf-tema p { font-size: .9rem; }

/* ---------- Erasmus+ Desk: foto di sfondo sotto la sfumatura ---------- */
.tema-leggero .section.tone-blue { position: relative; overflow: hidden; isolation: isolate; }
.tema-leggero .sec-bg { position: absolute; inset: 0; z-index: -1; }
.tema-leggero .sec-bg img { width: 100%; height: 100%; object-fit: cover; display: block; }
.tema-leggero .sec-bg::after { content: ""; position: absolute; inset: 0;
  background: linear-gradient(115deg, rgba(4, 10, 115, .94) 0%, rgba(4, 10, 115, .82) 35%, rgba(61, 59, 243, .62) 65%, rgba(219, 39, 119, .55) 100%); }
.tema-leggero .section.tone-blue:has(.sec-bg) { background: #040A73; }
.tema-leggero.tema-leggero .is-home #inizia { padding-bottom: var(--sp); }

/* =====================================================================
   REVISIONE 4 (18/10): "Chi siamo e cosa facciamo" come pannello colorato con foto,
   campagna come scheda curata, pillole in alto allineate al menu.
   ===================================================================== */
/* ---------- pannello "Chi siamo e cosa facciamo" ---------- */
.tema-leggero .cf-pannello .cf-intro { max-width: 760px; }
.tema-leggero .cf-pannello .h2 { color: #fff; }
.tema-leggero .cf-pannello .prose { color: rgba(255, 255, 255, .9); font-size: 1.1rem; }
.tema-leggero .cf-pannello .prose strong { color: #fff; }
.tema-leggero .cf-temi-list { list-style: none; margin: var(--sp-head) 0 0; padding: 0; display: grid; gap: 12px; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); }
.tema-leggero .cf-tema { display: flex; flex-direction: column; justify-content: space-between; gap: 22px; min-height: 150px; padding: 20px; border-radius: 22px; border: 1.5px solid var(--bordo); background: #fff; }
.tema-leggero .cf-pannello .cf-tema { background: rgba(255, 255, 255, .1); border-color: rgba(255, 255, 255, .28); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); color: #fff; transition: background .2s, transform .2s; }
.tema-leggero .cf-pannello .cf-tema:hover { background: rgba(255, 255, 255, .2); transform: translateY(-3px); box-shadow: none; }
.tema-leggero .cf-ico { width: 46px; height: 46px; border-radius: 14px; display: inline-flex; align-items: center; justify-content: center; background: #fff; color: var(--viola); }
.tema-leggero .cf-ico .ico { width: 24px; height: 24px; }
.tema-leggero .cf-tema:nth-child(3n+2) .cf-ico { color: var(--elettrico); }
.tema-leggero .cf-tema:nth-child(3n+3) .cf-ico { color: var(--fucsia); }
.tema-leggero .cf-tema-titolo { font-size: clamp(1.15rem, 1.6vw, 1.35rem); line-height: 1.15; margin: 0; letter-spacing: -.025em; }
.tema-leggero .cf-pannello .cf-tema-titolo, .tema-leggero .cf-pannello .cf-tema-titolo a { color: #fff; }
.tema-leggero .cf-pannello .cf-tema-titolo a::after { content: ""; position: absolute; inset: 0; }
.tema-leggero .cf-pannello .cf-tema { position: relative; }
.tema-leggero .cf-bottom { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 20px; margin-top: var(--sp-head); padding-top: var(--sp-head); border-top: 1px solid rgba(255, 255, 255, .2); }
.tema-leggero .cf-bottom .cf-label { margin: 0; flex-basis: 100%; }
.tema-leggero .cf-pannello .cf-label { color: rgba(255, 255, 255, .7); }
.tema-leggero .cf-bottom .cf-tipi { margin: 0; flex: 1 1 520px; }
.tema-leggero .cf-pannello .cf-tipi a, .tema-leggero .cf-pannello .cf-tipi span { display: inline-block; padding: 7px 14px; border-radius: 999px; border: 1.5px solid rgba(255, 255, 255, .45); color: #fff; text-decoration: none; font-weight: 500; font-size: .92rem; }
.tema-leggero .cf-pannello .cf-tipi a:hover { background: #fff; color: var(--ink); border-color: #fff; }
.tema-leggero .cf-bottom .btn-row { margin: 0; }
.tema-leggero .cf-pannello .btn-lime { background: #fff; color: var(--ink); border-color: #fff; }

/* ---------- campagna: scheda in due parti ---------- */
.tema-leggero .camp-card { display: grid; border-radius: 26px; overflow: hidden; border: 1.5px solid var(--bordo); background: #fff; }
@media (min-width: 760px) { .tema-leggero .camp-card { grid-template-columns: minmax(240px, 1fr) 2fr; } }
.tema-leggero .camp-side { background: var(--c3); color: #fff; padding: 24px; display: flex; flex-direction: column; justify-content: space-between; gap: 18px; }
.tema-leggero .camp-kicker { display: inline-flex; align-items: center; gap: 8px; font-weight: 600; font-size: .85rem; letter-spacing: .04em; text-transform: uppercase; }
.tema-leggero .camp-kicker .ico { width: 18px; height: 18px; }
.tema-leggero .camp-side .camp-logo { align-self: flex-start; background: #fff; border-radius: 18px; padding: 12px 18px; line-height: 0; box-shadow: 0 10px 24px rgba(13, 11, 43, .2); }
.tema-leggero .camp-side .camp-logo img { height: 84px; width: auto; max-width: 220px; object-fit: contain; }
.tema-leggero .camp-main { padding: 26px 28px; display: flex; flex-direction: column; align-items: flex-start; gap: 10px; }
.tema-leggero .camp-main .camp-title { color: var(--ink); font-size: clamp(1.4rem, 2.6vw, 2rem); margin: 0; }
.tema-leggero .camp-desc { margin: 0; color: var(--muted); max-width: 62ch; }
.tema-leggero .camp-meta { list-style: none; margin: 4px 0 8px; padding: 0; display: flex; flex-wrap: wrap; gap: 6px 20px; font-size: .9rem; color: var(--ink); }
.tema-leggero .camp-meta li { display: inline-flex; align-items: center; gap: 6px; }
.tema-leggero .camp-meta .ico { width: 16px; height: 16px; color: var(--viola); }

/* ---------- pillole in alto: stessa larghezza e stessi margini del menu ---------- */
.tema-leggero .topbar { padding: 0 12px; }
@media (min-width: 900px) { .tema-leggero .topbar { padding: 0 20px; } }
.tema-leggero .topbar .topbar-inner { max-width: calc(var(--wrap) + 24px); margin: 0 auto; padding-left: 0; padding-right: 0; }
.tema-leggero .tb-pride, .tema-leggero .topbar-links { height: 32px; background: #fff; box-shadow: 0 4px 16px rgba(13, 11, 43, .14); border: 1px solid rgba(13, 11, 43, .06); }

/* =====================================================================
   MENU (18/10): al passaggio compare una pillola trasparente con la sfumatura (animata);
   la voce della sezione in cui sei resta accesa. "Dona ora" e il pulsante del menu
   hanno la sfumatura che scorre piano, come il logo.
   ===================================================================== */
@keyframes sfuma-scorre { from { background-position: 0% 50%; } to { background-position: 100% 50%; } }
html.tema-leggero {
  --pill-soft: linear-gradient(90deg, rgba(61, 59, 243, .10), rgba(124, 58, 237, .14), rgba(219, 39, 119, .10), rgba(61, 59, 243, .10));
  --c-move: linear-gradient(110deg, #040A73 0%, #3D3BF3 25%, #7C3AED 50%, #DB2777 75%, #040A73 100%);
}
@media (min-width: 1200px) {
  .tema-leggero .nav-list > li > a, .tema-leggero .nav-list > li > .sub-toggle {
    position: relative; border-radius: 999px; padding: 9px 14px; background: transparent; background-size: 250% 100%;
    transition: background-color .35s ease, color .25s ease, box-shadow .35s ease, transform .25s ease; }
  .tema-leggero .nav-list > li > a:hover, .tema-leggero .nav-list > li > .sub-toggle:hover,
  .tema-leggero .nav-list > li.has-sub:hover > .sub-toggle, .tema-leggero .nav-list > li > .sub-toggle[aria-expanded="true"] {
    background-image: var(--pill-soft); box-shadow: inset 0 0 0 1.5px rgba(124, 58, 237, .28); color: var(--ink);
    animation: sfuma-scorre 4s ease-in-out infinite alternate; }
  /* la sezione in cui ti trovi resta accesa */
  .tema-leggero .nav-list > li.is-active > .sub-toggle, .tema-leggero .nav-list > li > a[aria-current="page"] {
    background-image: var(--pill-soft); box-shadow: inset 0 0 0 1.5px rgba(124, 58, 237, .45); color: var(--ink); font-weight: 600; }
  /* il sottomenu si apre scivolando */
  .tema-leggero .has-sub .sub { border-radius: 18px; border: 1px solid rgba(13, 11, 43, .06); box-shadow: 0 18px 40px rgba(13, 11, 43, .14); transition: opacity .25s ease, transform .25s ease, visibility .25s; transform: translateY(6px); }
  .tema-leggero .has-sub .sub a { border-radius: 12px; transition: background .2s, color .2s, padding-left .2s; }
  .tema-leggero .has-sub .sub a:hover, .tema-leggero .has-sub .sub a[aria-current="page"] { background: var(--pill-soft); color: var(--ink); padding-left: 18px; }
  .tema-leggero .has-sub .sub a[aria-current="page"] { font-weight: 600; }
}
/* "Dona ora" e il pulsante del menu: sfumatura in movimento */
.tema-leggero .btn-donate, .tema-leggero .nav-toggle { background: var(--c-move); background-size: 300% 100%; animation: sfuma-scorre 8s ease-in-out infinite alternate;
  transition: transform .25s ease, box-shadow .3s ease; border-color: transparent; }
.tema-leggero .btn-donate:hover, .tema-leggero .nav-toggle:hover { background: var(--c-move); background-size: 300% 100%; transform: translateY(-1px); box-shadow: 0 10px 24px rgba(124, 58, 237, .35); animation-duration: 2.5s; }
/* anche i pulsanti scuri principali, al passaggio, prendono la sfumatura che scorre */
.tema-leggero .btn-lime:hover, .tema-leggero .btn-primary:hover { background: var(--c-move); background-size: 300% 100%; animation: sfuma-scorre 2.5s ease-in-out infinite alternate; }
/* le tessere colorate: la sfumatura si muove piano */
.tema-leggero .card.has-ico { background-size: 160% 160%; animation: sfuma-muovi 18s ease-in-out infinite alternate; }
@media (prefers-reduced-motion: reduce) {
  .tema-leggero .btn-donate, .tema-leggero .nav-toggle, .tema-leggero .btn-lime:hover, .tema-leggero .card.has-ico,
  .tema-leggero .nav-list > li > a:hover, .tema-leggero .nav-list > li > .sub-toggle:hover { animation: none; }
}
@media (min-width: 1200px) {
  .tema-leggero .has-sub:hover .sub, .tema-leggero .has-sub:has(.sub :focus-visible) .sub, .tema-leggero .has-sub .sub.is-open { transform: none; }
}

/* =====================================================================
   REVISIONE 5 (18/10): "Naqah in breve" a tutta larghezza come Erasmus+ Desk; la campagna è una sezione vera.
   ===================================================================== */
.tema-leggero main > .section.section.tone-blue.is-full { margin-left: 0; margin-right: 0; border-radius: 0; padding-top: var(--sp); padding-bottom: var(--sp); }
@media (min-width: 900px) {
  .tema-leggero .grid.cols-5 { grid-template-columns: repeat(5, minmax(0, 1fr)); }
}
@media (min-width: 640px) and (max-width: 899px) { .tema-leggero .grid.cols-5 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.tema-leggero .grid.cols-5 > .card.has-ico { min-height: 260px; padding: 22px; }
.tema-leggero .grid.cols-5 > .card.has-ico .card-title { font-size: 1.3rem; line-height: 1.15; }
.tema-leggero .grid.cols-5 > .card.has-ico .card-text { font-size: .95rem; }
/* tessere senza link: niente freccia, ma stessa altezza */
.tema-leggero .card.has-ico .card-body { display: flex; flex-direction: column; height: 100%; }
/* testo d'apertura delle sezioni nei pannelli: un po' più grande */
.tema-leggero .tone-blue .sec-head .prose, .tema-leggero .tone-blue .sec-head p { font-size: 1.1rem; max-width: 70ch; color: rgba(255, 255, 255, .9); }
/* pulsante in fondo ai pannelli: più grande */
.tema-leggero .tone-blue .sec-foot .btn, .tema-leggero .tone-blue .sec-foot a.btn { min-height: 52px; padding: .8em 1.6em; font-size: 1.02rem; }
/* campagna dentro la sua sezione */
.tema-leggero .sec-campaigns .sec-head + .camp-card, .tema-leggero .sec-campaigns .camp-card { margin-top: 0; }
/* cinque tessere in fila: margini interni minori, testo proporzionato; sotto i 1100 px tre per riga */
@media (min-width: 900px) and (max-width: 1099px) { .tema-leggero .grid.cols-5 { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.tema-leggero .grid.cols-5 { gap: 14px; }
.tema-leggero .grid.cols-5 > .card.has-ico { padding: 20px 18px; min-height: 250px; }
.tema-leggero .grid.cols-5 > .card.has-ico .tile-ico { width: 52px; height: 52px; border-radius: 16px; margin-bottom: 12px; }
.tema-leggero .grid.cols-5 > .card.has-ico .tile-ico .ico { width: 26px; height: 26px; }
.tema-leggero .grid.cols-5 > .card.has-ico .card-title { font-size: 1.2rem; hyphens: manual; }
.tema-leggero .grid.cols-5 > .card.has-ico .card-text { font-size: .9rem; line-height: 1.4; }
/* "Naqah in breve": sfumatura inversa rispetto a Erasmus+ Desk (magenta → viola → blu), così i due blocchi si distinguono */
.tema-leggero .section.tone-blue.is-full:has(.sec-bg) { background: #6B1048; }
.tema-leggero .is-full .sec-bg::after {
  background: linear-gradient(115deg, rgba(122, 16, 72, .95) 0%, rgba(176, 30, 110, .82) 35%, rgba(124, 58, 237, .62) 68%, rgba(61, 59, 243, .5) 100%); }
/* le tessere partono dal blu, per staccarsi dal fondo magenta */
.tema-leggero .is-full .grid > .card.has-ico:nth-child(4n+1) { background: var(--c1); }
.tema-leggero .is-full .grid > .card.has-ico:nth-child(4n+2) { background: var(--c2); }
.tema-leggero .is-full .grid > .card.has-ico:nth-child(4n+3) { background: linear-gradient(135deg, #3D3BF3 0%, #040A73 100%); }
.tema-leggero .is-full .grid > .card.has-ico:nth-child(4n+4) { background: linear-gradient(135deg, #7C3AED 0%, #040A73 100%); }
.tema-leggero .is-full .grid > .card.has-ico:nth-child(5) { background: linear-gradient(135deg, #040A73 0%, #7C3AED 100%); }
.tema-leggero .is-full .tile-ico { background: #fff; color: var(--fucsia); border: 0; }
.tema-leggero .is-full .sec-bg::after {
  background: linear-gradient(115deg, rgba(122, 16, 72, .92) 0%, rgba(176, 30, 110, .74) 32%, rgba(124, 58, 237, .45) 66%, rgba(61, 59, 243, .3) 100%); }
.tema-leggero .is-full .sec-head .prose, .tema-leggero .is-full .sec-head p { max-width: 58ch; }

/* =====================================================================
   PAGINE INTERNE (18/10): stesso linguaggio della home.
   ===================================================================== */
/* ---------- testata delle pagine senza foto: fascia con la sfumatura che si muove, sotto la pillola ---------- */
.tema-leggero main > .page-head.page-head:not(.has-image):first-child {
  margin-top: calc(-1 * (var(--hd-off) + var(--tb-h)));
  padding: calc(var(--hd-off) + var(--tb-h) + 48px) 0 52px;
  background: linear-gradient(115deg, #7A1048 0%, #B01E6E 22%, #7C3AED 48%, #3D3BF3 74%, #040A73 100%);
  background-size: 220% 220%; animation: sfuma-muovi 24s ease-in-out infinite alternate;
  color: #fff; border-bottom: 0; }
@media (min-width: 900px) { .tema-leggero main > .page-head.page-head:not(.has-image):first-child { padding-bottom: 72px; } }
.tema-leggero .page-head:not(.has-image) h1 { color: #fff; }
.tema-leggero .page-head:not(.has-image) .lead { color: rgba(255, 255, 255, .92); max-width: 56ch; }
.tema-leggero .page-head:not(.has-image) :focus-visible { outline-color: #fff; }
.tema-leggero .page-head:not(.has-image) .crumbs, .tema-leggero .page-head:not(.has-image) .crumbs a { color: rgba(255, 255, 255, .8); }
@media (prefers-reduced-motion: reduce) { .tema-leggero main > .page-head.page-head { animation: none; } }

/* ---------- indice "In questa pagina": una riga di pillole, senza riquadro ---------- */
.tema-leggero main > .section.sec-toc { padding: 28px 0 0; }
.tema-leggero .toc { border: 0; box-shadow: none; padding: 0; background: none; }
.tema-leggero .toc-title { color: var(--muted); font-weight: 600; }
.tema-leggero .toc a { background: #fff; border: 1.5px solid var(--bordo); color: var(--ink); font-weight: 500; font-size: .88rem; padding: 6px 13px; transition: background .2s, color .2s, border-color .2s; }
.tema-leggero .toc a::before { color: var(--viola); font-weight: 700; }
.tema-leggero .toc a:hover { background: var(--ink); border-color: var(--ink); color: #fff; }
.tema-leggero .toc a:hover::before { color: #fff; }

/* ---------- righe di separazione sfumate ---------- */
.tema-leggero main > .section:not(.tone-blue):not(.sec-valori):not(.sec-slider):not(.sec-ticker)
  + .section:not(.tone-blue):not(.sec-valori):not(.sec-fatti):not(.sec-gallery) > .wrap::before {
  height: 2px; border-radius: 2px; background: linear-gradient(90deg, #3D3BF3 0%, #7C3AED 50%, #DB2777 100%); opacity: .55; }

/* ---------- testo + foto: due colonne, la foto resta ferma mentre scorri il testo ---------- */
@media (min-width: 900px) {
  .tema-leggero .wrap.split { grid-template-columns: 1fr 1fr; gap: 56px; align-items: start; }
  .tema-leggero .split-img { position: sticky; top: calc(var(--hd-off) + 24px); }
}
.tema-leggero .split-img img { aspect-ratio: 4 / 3; border-radius: 24px; border: 0; box-shadow: none; }
.tema-leggero .split-text .prose, .tema-leggero .tx-body .prose { font-size: 1.04rem; line-height: 1.65; }
.tema-leggero .tx-grid .tx-head .h2 { display: block; }
@media (min-width: 900px) { .tema-leggero .tx-grid .tx-head { position: sticky; top: calc(var(--hd-off) + 24px); align-self: start; } }
/* "Leggi il testo completo" */
.tema-leggero .tx-more > summary { border: 1.5px solid var(--ink); color: var(--ink); background: #fff; border-radius: 999px; padding: 9px 18px; font-weight: 600; }
.tema-leggero .tx-more > summary:hover { background: var(--ink); color: #fff; }

/* ---------- foto grande: dentro la pagina, arrotondata, meno invadente ---------- */
.tema-leggero main > .section.sec-foto { padding: 0 0 var(--sp); }
.tema-leggero .foto-grande { max-width: var(--wrap); margin: 0 auto; padding: 0 var(--gutter); }
.tema-leggero .foto-grande img { height: clamp(240px, 48vh, 500px); border-radius: 24px; }
.tema-leggero .foto-grande figcaption { padding-left: 0; padding-right: 0; }
/* senza foto: non si mostra (il riquadro resta nel pannello) */
.tema-leggero main > .section.sec-foto:has(.foto-grande-vuota) { display: none; }

/* ---------- invito finale (sezioni "lime"): riquadro con la sfumatura che si muove ---------- */
.tema-leggero main > .section.tone-lime.sec-text > .wrap { max-width: calc(var(--wrap) - 32px); padding: 40px; border-radius: 28px; color: #fff;
  background: linear-gradient(115deg, #040A73 0%, #3D3BF3 30%, #7C3AED 60%, #DB2777 100%); background-size: 200% 200%; animation: sfuma-muovi 20s ease-in-out infinite alternate; }
.tema-leggero main > .section.tone-lime.sec-text > .wrap::before { display: none; }
.tema-leggero .tone-lime.sec-text h2, .tema-leggero .tone-lime.sec-text .h2 { color: #fff; }
.tema-leggero .tone-lime.sec-text .prose, .tema-leggero .tone-lime.sec-text .prose * { color: rgba(255, 255, 255, .92); }
.tema-leggero .tone-lime.sec-text .btn-lime { background: #fff; color: var(--ink); border-color: #fff; }
.tema-leggero .tone-lime.sec-text .btn-outline { border-color: #fff; color: #fff; }
.tema-leggero .tone-lime.sec-text :focus-visible { outline-color: #fff; }

/* ---------- persone: schede con foto o iniziali colorate ---------- */
.tema-leggero .people { grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 14px; }
.tema-leggero .person { background: #fff; border: 1.5px solid var(--bordo); border-radius: 22px; padding: 24px 18px; transition: transform .2s, box-shadow .2s; }
.tema-leggero .person:hover { transform: translateY(-3px); box-shadow: var(--ombra); }
.tema-leggero .avatar { width: 96px; height: 96px; background: var(--c1); }
.tema-leggero .person:nth-child(4n+2) .avatar { background: var(--c2); }
.tema-leggero .person:nth-child(4n+3) .avatar { background: var(--c3); }
.tema-leggero .person:nth-child(4n+4) .avatar { background: var(--c4); }
.tema-leggero .avatar span { color: #fff; font-weight: 600; font-size: 2.4rem; }
.tema-leggero .person-name { color: var(--ink); }
.tema-leggero .person-role { color: var(--viola); font-weight: 600; }
.tema-leggero .tone-blue .person { background: rgba(255, 255, 255, .1); border-color: rgba(255, 255, 255, .25); }
.tema-leggero .tone-blue .person-name, .tema-leggero .tone-blue .person-role { color: #fff; }
.tema-leggero .tone-blue .person-line { color: rgba(255, 255, 255, .8); }
.tema-leggero .tone-blue .avatar { background: #fff; }
.tema-leggero .tone-blue .avatar span { color: var(--viola); }

/* ---------- loghi: riquadri bianchi uguali ---------- */
.tema-leggero .logos { grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 14px; }
.tema-leggero .logo-box { height: 124px; align-items: center; justify-content: center; padding: 18px; border: 1.5px solid var(--bordo); border-radius: 20px; background: #fff; transition: transform .2s, box-shadow .2s; }
.tema-leggero .logo-box img { object-position: center; }
.tema-leggero .logo-link:hover .logo-box { transform: translateY(-3px); box-shadow: var(--ombra); border-color: transparent; }
.tema-leggero .logo-name, .tema-leggero .logo-word { color: var(--ink); text-align: center; }
.tema-leggero .logo-word { font-size: 1.15rem; font-weight: 600; }
.tema-leggero .logo-item small { text-align: center; }
.tema-leggero .tone-blue .logo-box img { filter: none; }

/* ---------- documenti ---------- */
.tema-leggero .docs a { border: 1.5px solid var(--bordo); border-radius: 16px; background: #fff; color: var(--ink); font-weight: 500; transition: background .2s, color .2s, border-color .2s; }
.tema-leggero .docs a .ico:first-child { color: var(--viola); }
.tema-leggero .docs a:hover { background: var(--ink); border-color: var(--ink); color: #fff; }
.tema-leggero .docs a:hover .ico { color: #fff; }

/* ---------- passaggi numerati ---------- */
.tema-leggero .steps li { border: 1.5px solid var(--bordo); border-radius: 22px; background: #fff; }
.tema-leggero .steps li::before { background: var(--c3); color: #fff; font-weight: 600; border-radius: 14px; }
.tema-leggero .steps li:nth-child(4n+1)::before { background: var(--c1); }
.tema-leggero .steps li:nth-child(4n+2)::before { background: var(--c2); }
.tema-leggero .steps li:nth-child(4n+4)::before { background: var(--c4); }

/* ---------- linea del tempo: linea sfumata, anni come etichette colorate ---------- */
.tema-leggero .timeline { border-left: 0; position: relative; padding-left: 40px; gap: 26px; }
.tema-leggero .timeline::before { content: ""; position: absolute; left: 7px; top: 8px; bottom: 8px; width: 3px; border-radius: 3px; background: linear-gradient(180deg, #3D3BF3 0%, #7C3AED 50%, #DB2777 100%); }
.tema-leggero .timeline li::before { left: -40px; top: 6px; width: 17px; height: 17px; background: #fff; border: 3px solid var(--viola); box-shadow: none; }
.tema-leggero .tl-when { display: inline-block; font-weight: 600; font-size: .95rem; color: #fff; background: var(--c2); padding: 3px 12px; border-radius: 999px; margin-bottom: 8px; }
.tema-leggero .timeline li:nth-child(3n+2) .tl-when { background: var(--c3); }
.tema-leggero .timeline li:nth-child(3n+3) .tl-when { background: var(--c1); }
.tema-leggero .tone-blue .timeline li::before { background: transparent; border-color: #fff; }

/* ---------- ambiti di lavoro: progetti come etichette, non come tabella ---------- */
.tema-leggero .ambito, .tema-leggero .ambito:nth-child(4n+1) { position: relative; overflow: hidden; background: #fff; border: 1.5px solid var(--bordo); border-radius: 24px; padding: 30px 28px 26px; }
.tema-leggero .ambito::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 6px; background: var(--c1); }
.tema-leggero .ambito:nth-child(4n+2)::before { background: var(--c2); }
.tema-leggero .ambito:nth-child(4n+3)::before { background: var(--c3); }
.tema-leggero .ambito:nth-child(4n+4)::before { background: var(--c4); }
@media (min-width: 900px) { .tema-leggero .ambito { grid-template-columns: 3fr 2fr; gap: 40px; } }
.tema-leggero .ambito-titolo { color: var(--ink); }
.tema-leggero .ambito-label { color: var(--muted); font-weight: 600; text-transform: uppercase; letter-spacing: .08em; font-size: .75rem; }
.tema-leggero .ambito-progetti ul { display: flex; flex-wrap: wrap; gap: 8px; }
.tema-leggero .ambito-progetti a { display: inline-flex; padding: 7px 14px; border-radius: 999px; background: #F3F2F9; color: var(--ink); font-size: .9rem; }
.tema-leggero .ambito-progetti a span { display: none; }
.tema-leggero .ambito-progetti a:hover { background: var(--ink); color: #fff; }
.tema-leggero .ambito-progetti a strong { font-weight: 600; }

/* ---------- riquadri con icona nelle pagine interne: tessere colorate più piccole ---------- */
.tema-leggero main > .section:not(.is-full) .grid.cols-3 > .card.has-ico, .tema-leggero main > .section .grid.cols-4 > .card.has-ico { min-height: 200px; }
.tema-leggero main > .section > .wrap::before { grid-column: 1 / -1; width: 100%; }
.tema-leggero main > .section > .wrap::before { order: -10; }
/* schede (Educazione non formale, Hosting…): icona su quadrato sfumato, riga colorata in alto */
.tema-leggero .card.sch:not(.sch-foto) { position: relative; overflow: hidden; padding-top: 8px; }
.tema-leggero .card.sch:not(.sch-foto)::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 6px; background: var(--c1); }
.tema-leggero .sch-grid > .sch:nth-child(4n+2)::before { background: var(--c2); }
.tema-leggero .sch-grid > .sch:nth-child(4n+3)::before { background: var(--c3); }
.tema-leggero .sch-grid > .sch:nth-child(4n+4)::before { background: var(--c4); }
.tema-leggero .sch .tile-ico { width: 52px; height: 52px; border-radius: 16px; background: var(--c1); color: #fff; }
.tema-leggero .sch-grid > .sch:nth-child(4n+2) .tile-ico { background: var(--c2); }
.tema-leggero .sch-grid > .sch:nth-child(4n+3) .tile-ico { background: var(--c3); }
.tema-leggero .sch-grid > .sch:nth-child(4n+4) .tile-ico { background: var(--c4); }
.tema-leggero .sch .tile-ico .ico { width: 26px; height: 26px; }
.tema-leggero .sch .card-title { font-size: 1.3rem; }
.tema-leggero .sch-sub { color: var(--viola); font-weight: 600; }
/* indice sul telefono: una sola riga che scorre di lato */
@media (max-width: 699px) {
  .tema-leggero .toc ol { flex-wrap: nowrap; overflow-x: auto; padding-bottom: 6px; margin: 0 calc(-1 * var(--gutter)); padding-left: var(--gutter); padding-right: var(--gutter); scrollbar-width: none; }
  .tema-leggero .toc ol::-webkit-scrollbar { display: none; }
  .tema-leggero .toc li { flex: none; }
}

/* =====================================================================
   REVISIONE GENERALE 19/10: testate con foto, caratteri più grandi,
   etichette leggibili, pulsanti pieni, date passate leggibili, passaggi su una riga.
   ===================================================================== */
/* ---------- testate con foto: la foto si vede, con la sfumatura magenta → viola → blu sul lato del testo ---------- */
.tema-leggero .page-head.has-image { min-height: clamp(380px, 58vh, 560px); }
.tema-leggero .page-head.has-image .page-head-img::after {
  background: linear-gradient(100deg, rgba(122, 16, 72, .9) 0%, rgba(150, 30, 120, .72) 30%, rgba(124, 58, 237, .45) 60%, rgba(61, 59, 243, .12) 100%),
              linear-gradient(0deg, rgba(13, 11, 43, .35) 0%, transparent 45%); }
.tema-leggero .page-head.has-image h1 { font-size: clamp(2.4rem, 6vw, 4.4rem); }
.tema-leggero .page-head.has-image .lead { font-size: clamp(1.1rem, 2vw, 1.35rem); color: #fff; max-width: 52ch; }

/* ---------- caratteri più grandi ---------- */
.tema-leggero body { font-size: 1.125rem; }
.tema-leggero .card-text, .tema-leggero .sch .card-text, .tema-leggero .steps p, .tema-leggero .person-line, .tema-leggero .faq-a { font-size: 1.02rem; line-height: 1.55; }
.tema-leggero .card-title { font-size: 1.25rem; }
.tema-leggero .sec-head .prose, .tema-leggero .sec-head > p { font-size: 1.1rem; max-width: 70ch; }

/* ---------- domande frequenti: più larghe e più leggibili ---------- */
.tema-leggero .sec-faq .wrap.narrow { max-width: var(--wrap); }
.tema-leggero .faq details { border: 1.5px solid var(--bordo); border-radius: 18px; background: #fff; box-shadow: none; }
.tema-leggero .faq details[open] { box-shadow: var(--ombra); border-color: transparent; }
.tema-leggero .faq summary { font-weight: 600; font-size: 1.1rem; color: var(--ink); padding: 18px 22px; }
.tema-leggero .faq details[open] summary { background: none; border-bottom: 1px solid var(--line); }
.tema-leggero .faq-a { padding: 14px 22px 18px; }
.tema-leggero .faq-cerca { border: 1.5px solid var(--bordo); border-radius: 999px; padding: 12px 20px; }

/* ---------- passaggi numerati: tutti su una riga (su computer) ---------- */
@media (min-width: 900px) { .tema-leggero .steps { grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); } }
.tema-leggero .steps li { padding: 22px 20px; }
.tema-leggero .steps .card-title { font-size: 1.15rem; margin-top: 12px; }

/* ---------- schede progetto: etichette leggibili sopra la foto, pulsante pieno e sfumato ---------- */
.tema-leggero .pj-tags .badge, .tema-leggero .pj-tags .badge:not(.badge-corso):not(.badge-partner):not(.badge-attivazione) { background: var(--ink); color: #fff; box-shadow: 0 2px 10px rgba(13, 11, 43, .25); }
.tema-leggero .pj-tags .badge-corso { background: var(--c3); }
.tema-leggero .pj-tags .badge-attivazione { background: #fff; color: var(--ink); }
.tema-leggero .pj-tags .badge-partner { background: var(--elettrico); }
.tema-leggero .pj-btn { background: var(--c-move); background-size: 300% 100%; color: #fff; border: 0; border-radius: 999px; animation: sfuma-scorre 8s ease-in-out infinite alternate; }
.tema-leggero .pj-card:hover .pj-btn, .tema-leggero .pj-btn:hover { color: #fff; animation-duration: 2.5s; box-shadow: 0 8px 22px rgba(124, 58, 237, .35); }

/* ---------- attività passate: data su fondo chiaro, testo scuro ---------- */
.tema-leggero .is-past .datebox, .tema-leggero .is-past .row-date, .tema-leggero .card.is-past-card .datebox,
.tema-leggero .is-past .card:nth-child(n) .datebox, .tema-leggero .is-past .act-row:nth-child(n) .row-date { background: #F1F0F7; }
.tema-leggero .is-past .datebox *, .tema-leggero .is-past .row-date *, .tema-leggero .card.is-past-card .datebox * { color: var(--ink); }
/* "Scopri di più" delle schede: pulsante come gli altri, la scheda si apre sul posto (niente finestra) */
.tema-leggero .sch-more > summary { display: inline-flex; align-items: center; gap: .5em; list-style: none; cursor: pointer; margin-top: 12px; padding: 9px 18px; border-radius: 999px;
  border: 1.5px solid var(--ink); color: var(--ink); font-weight: 600; background: #fff; transition: background .2s, color .2s; }
.tema-leggero .sch-more > summary::-webkit-details-marker { display: none; }
.tema-leggero .sch-more > summary:hover { background: var(--ink); color: #fff; }
.tema-leggero .sch-more[open] > summary .ico { transform: rotate(90deg); }
.tema-leggero .sch-more .sch-dett { margin-top: 16px; padding-top: 16px; border-top: 1px solid var(--line); }
.tema-leggero .sch-more .sch-dett .lead { display: none; }
.tema-leggero .sch-more .sch-dett .prose { font-size: 1rem; }

/* ---------- dati in evidenza ("fatti"): una barra informativa sottile, non più quadrati ---------- */
.tema-leggero .fatti { display: flex; flex-wrap: wrap; gap: 0; margin: 0 0 var(--sp-head); border: 1.5px solid var(--bordo); border-radius: 22px; background: #fff; overflow: hidden; }
.tema-leggero .fatto { flex: 1 1 200px; border: 0; border-radius: 0; box-shadow: none; background: none; padding: 18px 22px; position: relative; }
.tema-leggero .fatto + .fatto::before { content: ""; position: absolute; left: 0; top: 18px; bottom: 18px; width: 1.5px; background: linear-gradient(180deg, #3D3BF3, #DB2777); opacity: .45; }
.tema-leggero .fatto b { color: var(--ink); font-weight: 600; font-size: 1.15rem; }
.tema-leggero .fatto span { font-size: .95rem; }
.tema-leggero main > .section.section.sec-fatti { padding-top: var(--sp); padding-bottom: var(--sp); }

/* ---------- Dona: testo a sinistra, modi per donare a destra (niente vuoto sulla destra) ---------- */
@media (min-width: 900px) {
  .tema-leggero .sec-donate .wrap:not(.split) > div { display: grid; grid-template-columns: 1fr 1fr; gap: 56px; align-items: start; }
}
.tema-leggero .donate-box { max-width: none; border: 1.5px solid var(--bordo); border-radius: 22px; padding: 24px; background: #fff; }
.tema-leggero .donate-ways { gap: 14px; }
.tema-leggero .copy-btn { border-radius: 999px; border: 1.5px solid var(--ink); background: #fff; color: var(--ink); font-weight: 600; padding: 3px 12px; }
.tema-leggero .copy-btn:hover { background: var(--ink); color: #fff; }

/* ---------- Progetti: ricerca e filtri su una sola riga ---------- */
.tema-leggero .pj-filters { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 10px; padding: 0; background: none; border-radius: 0; margin-bottom: 14px; }
.tema-leggero .pj-f { flex: 1 1 140px; min-width: 0; }
.tema-leggero .pj-f:first-child { flex: 2 1 240px; }
.tema-leggero .pj-f span { font-size: .78rem; font-weight: 600; color: var(--muted); text-transform: uppercase; letter-spacing: .06em; }
.tema-leggero .pj-f input, .tema-leggero .pj-f select { width: 100%; border: 1.5px solid var(--bordo); border-radius: 999px; padding: 10px 16px; background: #fff; font: inherit; font-size: .98rem; }
.tema-leggero .pj-f input:focus, .tema-leggero .pj-f select:focus { border-color: var(--viola); outline: none; box-shadow: 0 0 0 3px rgba(124, 58, 237, .18); }
/* attività: date sempre leggibili (sfumatura + testo bianco), anche per quelle passate */
.tema-leggero .card.is-past-card .datebox.datebox, .tema-leggero .is-past .card .datebox.datebox, .tema-leggero .is-past .act-row .row-date.row-date { background: var(--c4); transform: none; }
.tema-leggero .card.is-past-card .datebox.datebox *, .tema-leggero .is-past .card .datebox.datebox *, .tema-leggero .is-past .act-row .row-date.row-date * { color: #fff; }
/* "In corso e in arrivo" in evidenza, "Archivio" più sobrio */
.tema-leggero .sec-activities h2.group-title { font-size: clamp(1.6rem, 3vw, 2.2rem); font-weight: 600; letter-spacing: -.03em; color: var(--ink); display: flex; align-items: center; gap: 12px; margin: 8px 0 20px; }
.tema-leggero .sec-activities h2.group-title::before { content: ""; width: 14px; height: 14px; border-radius: 50%; background: var(--c3); box-shadow: 0 0 0 6px rgba(219, 39, 119, .15); flex: none; }
.tema-leggero .sec-activities h3.group-title { font-size: 1.3rem; font-weight: 600; color: var(--muted); margin-top: var(--sp); padding-top: var(--sp-head); border-top: 2px solid; border-image: linear-gradient(90deg, #3D3BF3, #7C3AED, #DB2777) 1; }

/* =====================================================================
   PULSANTI TUTTI UGUALI (19/10): principali pieni con la sfumatura che scorre,
   secondari con il bordo sfumato che al passaggio si riempie. Ovunque, anche su foto e fondi scuri.
   ===================================================================== */
html.tema-leggero :is(main, .site-footer, .site-header) :is(.btn.btn-lime.btn-lime, .btn.btn-primary.btn-primary, .btn.btn-donate.btn-donate, .btn.btn-blue.btn-blue, .pj-btn.pj-btn.pj-btn) {
  background: var(--c-move); background-size: 300% 100%; color: #fff; border: 1.5px solid transparent; border-radius: 999px;
  animation: sfuma-scorre 8s ease-in-out infinite alternate; box-shadow: 0 6px 18px rgba(124, 58, 237, .25); transform: none; }
html.tema-leggero :is(main, .site-footer, .site-header) :is(.btn.btn-lime.btn-lime, .btn.btn-primary.btn-primary, .btn.btn-donate.btn-donate, .btn.btn-blue.btn-blue, .pj-btn.pj-btn.pj-btn):hover {
  background: var(--c-move); background-size: 300% 100%; color: #fff; animation-duration: 2.5s; transform: translateY(-1px); box-shadow: 0 10px 26px rgba(124, 58, 237, .4); }
/* su foto e fondi scuri: un filo bianco intorno, così il pulsante si stacca */
html.tema-leggero :is(.slider, .hero, .page-head, .tone-blue, .site-footer, .camp-card, .tone-lime.sec-text, .sec-bg ~ .wrap) .btn.btn-lime.btn-lime {
  box-shadow: 0 0 0 1.5px rgba(255, 255, 255, .7), 0 8px 22px rgba(0, 0, 0, .25); }

/* secondari: bordo sfumato, testo scuro */
html.tema-leggero main :is(.btn.btn-outline.btn-outline, .sch-more > summary, .tx-more > summary, .copy-btn.copy-btn) {
  border: 1.5px solid transparent; border-radius: 999px; color: var(--ink); box-shadow: none; transform: none;
  background: linear-gradient(#fff, #fff) padding-box, linear-gradient(110deg, #3D3BF3, #7C3AED, #DB2777) border-box; }
html.tema-leggero main :is(.btn.btn-outline.btn-outline, .sch-more > summary, .tx-more > summary, .copy-btn.copy-btn):hover,
html.tema-leggero main .btn.btn-outline.btn-outline[aria-expanded="true"] {
  background: var(--c-move) border-box; background-size: 300% 100%; color: #fff; animation: sfuma-scorre 2.5s ease-in-out infinite alternate; }
/* secondari su foto e fondi scuri: bordo bianco */
html.tema-leggero :is(.slider, .hero, .page-head, .tone-blue, .site-footer, .tone-lime.sec-text) :is(.btn.btn-outline.btn-outline, .btn.btn-outline-light.btn-outline-light) {
  background: transparent; border: 1.5px solid #fff; color: #fff; }
html.tema-leggero :is(.slider, .hero, .page-head, .tone-blue, .site-footer, .tone-lime.sec-text) :is(.btn.btn-outline.btn-outline, .btn.btn-outline-light.btn-outline-light):hover {
  background: #fff; color: var(--ink); animation: none; }
@media (prefers-reduced-motion: reduce) {
  html.tema-leggero :is(main, .site-footer, .site-header) :is(.btn, .pj-btn, summary) { animation: none !important; }
}

/* =====================================================================
   CARATTERI PIÙ GRANDI IN TUTTO IL SITO (19/10): tutto cresce di circa il 6%,
   e i testi piccoli (etichette, date, note) non scendono sotto i 14 px.
   ===================================================================== */
html.tema-leggero { font-size: 106.25%; }
.tema-leggero :is(.badge, .chip, .small, small, .fonte, .periodo, .card-meta, .row-meta, .meta, .tl-when, .f-net-label, .person-role, .person-line, .sch-sub, .sch-durata, .cf-label, .toc a) { font-size: max(.88rem, 14px); }
.tema-leggero .nav-list > li > a, .tema-leggero .nav-list > li > .sub-toggle { font-size: 1rem; }
.tema-leggero .site-footer.f2 { font-size: 1rem; }

/* ---------- barre con i dati: icona su quadrato sfumato ---------- */
.tema-leggero .fatto.has-ico { display: grid; grid-template-columns: auto 1fr; column-gap: 14px; align-items: center; }
.tema-leggero .fatto-ico { grid-row: 1 / span 2; width: 44px; height: 44px; border-radius: 14px; display: inline-flex; align-items: center; justify-content: center; color: #fff; background: var(--c1); }
.tema-leggero .fatto:nth-child(4n+2) .fatto-ico { background: var(--c2); }
.tema-leggero .fatto:nth-child(4n+3) .fatto-ico { background: var(--c3); }
.tema-leggero .fatto:nth-child(4n+4) .fatto-ico { background: var(--c4); }
.tema-leggero .fatto-ico .ico { width: 22px; height: 22px; }
.tema-leggero .fatto.has-ico span { margin-top: 2px; }

/* =====================================================================
   SPAZI: correzioni dopo la misura su tutte le pagine (19/10)
   ===================================================================== */
/* l'ultimo elemento di ogni blocco non aggiunge margine sotto */
.tema-leggero main > .section > .wrap > :last-child, .tema-leggero main > .section .sec-head:last-child,
.tema-leggero main > .section .prose > :last-child, .tema-leggero main > .section .split-text > :last-child,
.tema-leggero main > .section .tx-body > :last-child, .tema-leggero main > .section .fatti-testo .prose > :last-child { margin-bottom: 0; }
/* foto + testo: la riga di separazione non deve aggiungere lo spazio della griglia */
.tema-leggero .wrap.split { row-gap: 0; }
.tema-leggero .wrap.split > .split-img { margin-top: 28px; }
@media (min-width: 900px) { .tema-leggero .wrap.split > .split-img { margin-top: 0; } }
/* inviti finali (riquadro sfumato): stesso spazio degli altri blocchi */
.tema-leggero main > .section.section.tone-lime.sec-text { padding-top: 0; }
/* un pannello blu in fondo alla pagina non tocca il piè di pagina */
.tema-leggero main > .section.tone-blue:last-child { margin-bottom: var(--sp); }
/* testata → primo blocco */
.tema-leggero main > .page-head + .section.section:not(.sec-toc) { padding-top: var(--sp); }
/* riga di separazione disegnata dalla sezione (non dentro il contenuto): stessa distanza per ogni tipo di blocco */
.tema-leggero main > .section:not(.tone-blue):not(.sec-valori):not(.sec-slider):not(.sec-ticker)
  + .section:not(.tone-blue):not(.sec-valori):not(.sec-fatti):not(.sec-gallery) > .wrap::before { content: none; display: none; }
.tema-leggero main > .section:not(.tone-blue):not(.sec-valori):not(.sec-slider):not(.sec-ticker)
  + .section.section:not(.tone-blue):not(.sec-valori):not(.sec-fatti):not(.sec-gallery):not(.tone-lime.sec-text) { position: relative; padding-top: var(--sp); }
.tema-leggero main > .section:not(.tone-blue):not(.sec-valori):not(.sec-slider):not(.sec-ticker)
  + .section.section:not(.tone-blue):not(.sec-valori):not(.sec-fatti):not(.sec-gallery):not(.tone-lime.sec-text)::before {
  content: ""; position: absolute; top: -1px; height: 2px; border-radius: 2px;
  left: max(var(--gutter), calc((100% - var(--wrap)) / 2 + var(--gutter))); right: max(var(--gutter), calc((100% - var(--wrap)) / 2 + var(--gutter)));
  background: linear-gradient(90deg, #3D3BF3 0%, #7C3AED 50%, #DB2777 100%); opacity: .55; }
.tema-leggero main > .section.tone-blue + .section.section.tone-lime.sec-text { padding-top: var(--sp); }

/* ---------- menu: la stessa pillola con il bordo sfumato dei pulsanti (al passaggio e sulla voce attiva) ---------- */
@media (min-width: 1200px) {
  .tema-leggero .nav-list > li > a:hover, .tema-leggero .nav-list > li > .sub-toggle:hover,
  .tema-leggero .nav-list > li.has-sub:hover > .sub-toggle, .tema-leggero .nav-list > li > .sub-toggle[aria-expanded="true"],
  .tema-leggero .nav-list > li.is-active > .sub-toggle, .tema-leggero .nav-list > li > a[aria-current="page"] {
    animation: none; box-shadow: none; color: var(--ink);
    border: 1.5px solid transparent;
    background: linear-gradient(#fff, #fff) padding-box, linear-gradient(110deg, #3D3BF3, #7C3AED, #DB2777) border-box; }
  .tema-leggero .nav-list > li > a, .tema-leggero .nav-list > li > .sub-toggle { border: 1.5px solid transparent; }
  .tema-leggero .nav-list > li.is-active > .sub-toggle, .tema-leggero .nav-list > li > a[aria-current="page"] { font-weight: 600; }
  /* la voce in evidenza (Erasmus+ Desk) resta piena */
  .tema-leggero .nav-list > li.nav-evid > a, .tema-leggero .nav-list > li.nav-evid > a:hover { background: var(--c-move); background-size: 300% 100%; color: #fff; border-color: transparent; }
}

/* =====================================================================
   REVISIONE GENERALE (19/10): correzioni dal controllo automatico
   ===================================================================== */
/* numeri 01, 02… nei riquadri: sempre su sfumatura, testo bianco */
.tema-leggero .grid > .card .tile-num.tile-num { background: var(--c1); color: #fff; }
.tema-leggero .grid > .card:nth-child(4n+2) .tile-num.tile-num { background: var(--c2); }
.tema-leggero .grid > .card:nth-child(4n+3) .tile-num.tile-num { background: var(--c3); }
.tema-leggero .grid > .card:nth-child(4n+4) .tile-num.tile-num { background: var(--c4); }
.tema-leggero .tone-blue .grid > .card .tile-num.tile-num { background: #fff; color: var(--viola); }
/* testate con foto: se la foto non arriva, il testo bianco resta leggibile */
.tema-leggero .page-head.has-image { background-color: #4A1660; }
/* testi piccoli: mai sotto i 14 px */
.tema-leggero :is(.f-title, .f2-legal, .pj-eyebrow, .ambito-label, .eyebrow, .cb-label, dt, .datebox .m, .row-date .m, .sch-tags span) { font-size: max(.85rem, 14px); }
.tema-leggero .f-net-label, .tema-leggero .f2-net .f-net-label { font-size: 13px; }
.tema-leggero .f2-legal { line-height: 1.6; }

/* ---------- video (progetti e attività): anteprima con la foto, il video parte solo con play ---------- */
.video-grid { display: grid; gap: 16px; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); }
.video-card { margin: 0; }
.video-card figcaption { margin-top: 10px; font-weight: 600; }
.act-video { margin-top: 32px; }
.tema-leggero .video { border-radius: 20px; background: linear-gradient(115deg, #7A1048 0%, #7C3AED 55%, #3D3BF3 100%); }
.tema-leggero .video-poster { opacity: .45; }
.tema-leggero .video-play { background: var(--c-move); background-size: 300% 100%; color: #fff; font-weight: 600; box-shadow: 0 0 0 1.5px rgba(255, 255, 255, .7), 0 8px 22px rgba(0, 0, 0, .25);
  animation: sfuma-scorre 8s ease-in-out infinite alternate; transition: transform .2s; }
.tema-leggero .video-play:hover { transform: scale(1.04); animation-duration: 2.5s; }
.tema-leggero .video-card figcaption { color: var(--ink); }
/* striscia di video: un video solo resta largo ma non enorme */
.video-grid.is-single { grid-template-columns: minmax(0, 820px); }
.tema-leggero .sec-videos .video-card figcaption { font-size: 1.05rem; }
/* la nota sui cookie del video: piccola, in fondo al riquadro, non sopra il pulsante */
.tema-leggero .video .video-note { position: absolute; left: 16px; right: 16px; bottom: 12px; font-size: 13px; line-height: 1.35; color: rgba(255, 255, 255, .85); text-shadow: 0 1px 4px rgba(0, 0, 0, .5); }

/* ---------- video che si apre sopra la pagina (dalle slide) ---------- */
.video-dialog { width: min(1100px, 94vw); max-width: none; padding: 0; border: 0; border-radius: 22px; background: #000; overflow: visible; }
.video-dialog::backdrop { background: rgba(13, 11, 43, .82); -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px); }
.video-dialog-frame { aspect-ratio: 16 / 9; border-radius: 22px; overflow: hidden; }
.video-dialog-frame iframe { width: 100%; height: 100%; border: 0; display: block; }
.video-dialog-close { position: absolute; top: -52px; right: 0; width: 44px; height: 44px; border-radius: 50%; border: 0; background: #fff; color: #0D0B2B; font-size: 1.8rem; line-height: 1; cursor: pointer; }
.slide-video-btn .play-ico { font-size: .9em; }

/* pulsanti del banner dei cookie: stesso stile degli altri */
html.tema-leggero .consenso .btn.btn-lime { background: var(--c-move); background-size: 300% 100%; color: #fff; border: 1.5px solid transparent; border-radius: 999px; animation: sfuma-scorre 8s ease-in-out infinite alternate; }
html.tema-leggero .consenso .btn.btn-outline { border: 1.5px solid transparent; border-radius: 999px; color: var(--ink); background: linear-gradient(#fff, #fff) padding-box, linear-gradient(110deg, #3D3BF3, #7C3AED, #DB2777) border-box; }
html.tema-leggero .consenso .btn.btn-outline:hover { background: var(--c-move) border-box; color: #fff; }

/* =====================================================================
   MOVIMENTO (19/10): le foto grandi si avvicinano piano; i blocchi entrano con una dissolvenza;
   le foto accanto ai testi si muovono al passaggio. Tutto fermo con "riduci movimento".
   ===================================================================== */
@keyframes avvicina { from { transform: scale(1) translate(0, 0); } to { transform: scale(1.09) translate(-1.2%, -1%); } }
.tema-leggero .slide-media img, .tema-leggero .page-head-img img, .tema-leggero .sec-bg img {
  animation: avvicina 26s ease-in-out infinite alternate; transform-origin: 60% 40%; will-change: transform; }
.tema-leggero .split-img, .tema-leggero .cf-foto, .tema-leggero .foto-grande { overflow: hidden; border-radius: 24px; }
.tema-leggero .foto-grande { padding: 0; margin: 0 auto; max-width: calc(var(--wrap) - 2 * var(--gutter)); }
@media (max-width: 1211px) { .tema-leggero .foto-grande { margin: 0 var(--gutter); } }
.tema-leggero .split-img img, .tema-leggero .cf-foto img, .tema-leggero .foto-grande img, .tema-leggero .pj-card .card-media img, .tema-leggero .act-card .card-media img {
  transition: transform 1.2s cubic-bezier(.2, .7, .2, 1); }
.tema-leggero .split-img:hover img, .tema-leggero .cf-foto:hover img, .tema-leggero .foto-grande:hover img,
.tema-leggero .pj-card:hover .card-media img, .tema-leggero .act-card:hover .card-media img { transform: scale(1.05); }
.tema-leggero .pj-card .card-media, .tema-leggero .act-card .card-media { overflow: hidden; }
/* entrata dei blocchi */
.js-reveal .rv { opacity: 0; transform: translateY(26px); transition: opacity .8s ease, transform .8s cubic-bezier(.2, .7, .2, 1); transition-delay: var(--rv-ritardo, 0ms); }
.js-reveal .rv.is-in { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) {
  .tema-leggero .slide-media img, .tema-leggero .page-head-img img, .tema-leggero .sec-bg img { animation: none; }
  .js-reveal .rv { opacity: 1; transform: none; transition: none; }
}

/* =====================================================================
   INTERLINEA E SPAZIATURA (19/10): righe un po' più vicine, lettere leggermente più strette
   ===================================================================== */
.tema-leggero body { line-height: 1.45; letter-spacing: -.012em; }
.tema-leggero :is(.prose, .split-text .prose, .tx-body .prose, .card-text, .faq-a, .steps p, .person-line, .lead, .sec-head .prose, .cf-intro .prose, .camp-desc, .tl-body, .ambito-testo p, .sch-aperta, .sch-dett .prose) {
  line-height: 1.45; letter-spacing: -.012em; }
.tema-leggero .prose p, .tema-leggero .prose li { margin-bottom: .7em; }
.tema-leggero .prose ul, .tema-leggero .prose ol { margin-bottom: .9em; }
.tema-leggero .page-head .lead { line-height: 1.38; }
.tema-leggero :is(.btn, .badge, .chip, .nav-list a, .sub-toggle) { letter-spacing: -.005em; }

/* ---------- taglio delle foto (19/10): inquadratura un po' più in alto, dove di solito ci sono i volti ---------- */
.tema-leggero :is(.page-head-img img, .slide-media img, .sec-bg img, .split-img img, .cf-foto img, .card-media img, .pj-card .card-media img, .foto-grande img, .gallery img, .valori-foto img) {
  object-position: 50% 32%; }
/* paesaggi del territorio: inquadratura centrata (il cielo conta) */
.tema-leggero .page-territorio :is(.page-head-img img, .gallery img, .foto-grande img, .card-media img) { object-position: 50% 50%; }

/* =====================================================================
   REVISIONE GENERALE 20/10: tutto a tutta larghezza, niente bordi né righine, tutto omogeneo
   ===================================================================== */
/* testi: titolo sopra, testo sotto su tutta la larghezza; i testi lunghi su due colonne */
.tema-leggero .wrap.narrow { max-width: var(--wrap); }
.tema-leggero :is(.prose, .sec-head .prose, .sec-head > p, .split-text .prose, .tx-body .prose, .fatti-testo .prose) { max-width: none; }
@media (min-width: 1000px) {
  .tema-leggero .wrap.narrow > .tx-grid { display: block; }
  .tema-leggero .tx-grid .tx-head { position: static; }
  .tema-leggero .tx-grid .tx-body { margin-top: 20px; }
  .tema-leggero .tx-grid .prose:has(> :nth-child(3)) { column-count: 2; column-gap: 56px; }
  .tema-leggero .tx-grid .prose > * { break-inside: avoid-column; }
  .tema-leggero .sec-head .prose:has(> :nth-child(3)) { column-count: 2; column-gap: 56px; }
}
/* linea del tempo a tutta larghezza: due colonne, ogni tappa con la sua riga sfumata */
.tema-leggero .timeline { max-width: none; padding-left: 0; gap: 22px 56px; }
.tema-leggero .timeline::before { display: none; }
.tema-leggero .timeline li { padding: 4px 0 4px 26px; border-left: 3px solid transparent; border-image: linear-gradient(180deg, #3D3BF3, #DB2777) 1; break-inside: avoid; }
.tema-leggero .timeline li::before { left: -10px; top: 6px; }
@media (min-width: 1000px) { .tema-leggero .timeline { grid-template-columns: 1fr 1fr; } }
/* persone e loghi: riempiono tutta la riga */
.tema-leggero .people { grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 16px; }
.tema-leggero .logos { grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 16px; }
/* domande frequenti a tutta larghezza, su due colonne */
.tema-leggero .sec-faq .wrap.narrow, .tema-leggero .sec-faq .wrap { max-width: var(--wrap); }
@media (min-width: 1000px) { .tema-leggero .faq { grid-template-columns: 1fr 1fr; gap: 14px 18px; align-items: start; } }

/* niente bordi né righine colorate: le schede si staccano con un'ombra leggera */
html.tema-leggero :is(.card, .act-row, .pj-card, .sch, .person, .docs a, .steps li, .faq details, .ambito, .cf-tema, .donate-box, .camp-card, .contact-card, .project-card, .campaign, .factbox, .eu-box) {
  border: 0 !important; box-shadow: 0 6px 26px rgba(13, 11, 43, .07); }
html.tema-leggero .tone-blue :is(.card, .person, .sch, .cf-tema) { box-shadow: none; }
html.tema-leggero .logo-box { border: 0 !important; box-shadow: none; background: transparent; }
html.tema-leggero :is(.card.no-img:not(.has-ico), .ambito, .card.sch:not(.sch-foto))::before { display: none !important; }
html.tema-leggero .card.no-img:not(.has-ico) { padding-top: 0; }
html.tema-leggero .toc a { border: 0; background: #F3F2F9; }
html.tema-leggero .toc a:hover { background: var(--ink); }
/* indice: più spazio prima della riga che lo separa dal testo */
.tema-leggero main > .section.section.sec-toc { padding-bottom: var(--sp-head); }

/* passaggi: con 6 passaggi, tre sopra e tre sotto; con 4, una riga */
@media (min-width: 900px) {
  .tema-leggero .steps:has(> li:nth-child(6)) { grid-template-columns: repeat(3, 1fr); }
  .tema-leggero .steps:has(> li:nth-child(4):last-child) { grid-template-columns: repeat(4, 1fr); }
}

/* schede: "Scopri di più" si apre a tutta riga, con i dettagli in largo (niente colonna stretta) */
.tema-leggero .sch-grid > .sch:has(.sch-more[open]) { grid-column: 1 / -1; }
@media (min-width: 900px) {
  .tema-leggero .sch:has(.sch-more[open]) .sch-dett .prose { column-count: 2; column-gap: 48px; }
  .tema-leggero .sch.sch-foto:has(.sch-more[open]) { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 3fr); align-items: stretch; }
  .tema-leggero .sch.sch-foto:has(.sch-more[open]) .card-media { aspect-ratio: auto; height: 100%; }
  .tema-leggero .sch.sch-foto:has(.sch-more[open]) .card-media img { height: 100%; }
}

/* barra con i dati: più importante, su sfumatura in movimento */
html.tema-leggero .fatti { background: var(--c-move); background-size: 220% 220%; animation: sfuma-muovi 22s ease-in-out infinite alternate; border: 0; box-shadow: 0 14px 36px rgba(124, 58, 237, .25); }
html.tema-leggero .fatto { padding: 22px 24px; }
html.tema-leggero .fatto b { color: #fff; font-size: 1.25rem; }
html.tema-leggero .fatto span { color: rgba(255, 255, 255, .86); }
html.tema-leggero .fatto + .fatto::before { background: rgba(255, 255, 255, .35); opacity: 1; }
html.tema-leggero .fatto-ico, html.tema-leggero .fatto:nth-child(n) .fatto-ico { background: #fff; color: var(--viola); width: 48px; height: 48px; }

/* Progetti: la barra dei filtri è una pillola a cavallo tra la foto della testata e la pagina */
html.tema-leggero main > .page-head + .section.sec-projects.sec-projects { padding-top: 0; }
.tema-leggero main > .page-head + .section.sec-projects .pj-filters {
  position: relative; z-index: 3; margin-top: -46px; margin-bottom: 26px; padding: 16px 20px; background: #fff; border-radius: 28px; box-shadow: 0 16px 40px rgba(13, 11, 43, .16); }
.tema-leggero main > .page-head + .section.sec-projects .sec-head { margin-top: 0; }
@media (max-width: 899px) { .tema-leggero main > .page-head + .section.sec-projects .pj-filters { margin-top: -30px; } }

/* schede dentro un pannello colorato (es. "Con i giovani e con gli adulti", "Due modi di esserci"): grandi, chiare */
.tema-leggero .tone-blue .sch { background: rgba(255, 255, 255, .97); padding: 28px; border-radius: 24px; }
.tema-leggero .tone-blue .sch .card-title { font-size: clamp(1.4rem, 2.2vw, 1.8rem); }
.tema-leggero .tone-blue .sch .tile-ico { width: 64px; height: 64px; border-radius: 20px; }
.tema-leggero .tone-blue .sch .tile-ico .ico { width: 32px; height: 32px; }
.tema-leggero .tone-blue .sch .sch-aperta { font-size: 1.04rem; }
/* testi nei pannelli con foto di sfondo */
/* solo i testi sul fondo colorato, non quelli dentro le schede bianche */
.tema-leggero .tone-blue:has(.sec-bg) :is(.sec-head, .split-text, .tx-grid) .prose,
.tema-leggero .tone-blue:has(.sec-bg) :is(.sec-head, .split-text, .tx-grid) .prose * { color: rgba(255, 255, 255, .94); }
.tema-leggero .tone-blue:has(.sec-bg) :is(.sec-head, .split-text, .tx-grid) .prose a { color: #fff; text-decoration: underline; }
/* nei pannelli anche due paragrafi vanno su due colonne, così le righe non sono troppo lunghe */
@media (min-width: 1000px) { .tema-leggero .tone-blue:has(.sec-bg) .tx-grid .prose:has(> :nth-child(2)) { column-count: 2; column-gap: 56px; } }
/* schede aperte (Cosa ti chiediamo / cosa ti garantiamo, Quando è utile…): più aria e liste leggibili */
.tema-leggero .sch .sch-aperta ul { padding-left: 1.1em; margin: .4em 0 0; }
.tema-leggero .sch .sch-aperta li { margin-bottom: .45em; }
.tema-leggero .sch-grid.cols-2 > .sch { padding: 30px; }

/* Hosting, "A chi ci rivolgiamo": linguette grandi */
.tema-leggero .settori-tabs [role="tab"] { padding: 18px 22px; border-radius: 20px; font-size: 1.08rem; }
.tema-leggero .settori-tabs [role="tab"] small, .tema-leggero .settori-tabs [role="tab"] span { font-size: .85rem; }

/* ---------- Testi lunghi su foto di sfondo (20/10): sfumatura più uniforme, così si legge anche a destra;
   due pannelli di fila si distinguono con la sfumatura inversa ---------- */
.tema-leggero :is(.sec-text, .sec-team, .sec-faq, .sec-stats, .sec-steps, .sec-schede, .sec-settori).tone-blue .sec-bg::after {
  background: linear-gradient(115deg, rgba(4, 10, 115, .93) 0%, rgba(20, 16, 130, .86) 45%, rgba(70, 30, 160, .8) 75%, rgba(150, 30, 120, .78) 100%); }
.tema-leggero .section.tone-blue:has(.sec-bg) + .section.tone-blue:has(.sec-bg) .sec-bg::after {
  background: linear-gradient(115deg, rgba(110, 14, 70, .93) 0%, rgba(120, 30, 120, .86) 45%, rgba(70, 30, 170, .8) 75%, rgba(30, 30, 160, .78) 100%); }
.tema-leggero .section.tone-blue:has(.sec-bg) + .section.tone-blue:has(.sec-bg) { background: #5A0F45; }
.tema-leggero .tone-blue:has(.sec-bg) :is(.sec-head, .split-text, .tx-grid) .prose { text-shadow: 0 1px 2px rgba(0, 0, 0, .18); }

/* ---------- "Fatti" con testo (20/10): testo a sinistra, quattro tessere colorate a destra (2 + 2),
   così il blocco usa tutta la larghezza e i dati si vedono subito ---------- */
@media (min-width: 600px) {
  html.tema-leggero .sec-fatti .wrap:has(.fatti-testo) > .fatti { display: grid; grid-template-columns: 1fr 1fr; gap: 14px;
    background: none; animation: none; box-shadow: none; border-radius: 0; overflow: visible; }
  html.tema-leggero .sec-fatti .wrap:has(.fatti-testo) .fatto { display: flex; flex-direction: column; align-items: flex-start; gap: 4px;
    min-height: 150px; padding: 22px; border-radius: 24px; background: var(--c1); box-shadow: 0 14px 30px rgba(13, 11, 43, .14); }
  html.tema-leggero .sec-fatti .wrap:has(.fatti-testo) .fatto:nth-child(4n+2) { background: var(--c2); }
  html.tema-leggero .sec-fatti .wrap:has(.fatti-testo) .fatto:nth-child(4n+3) { background: var(--c3); }
  html.tema-leggero .sec-fatti .wrap:has(.fatti-testo) .fatto:nth-child(4n+4) { background: var(--c4); }
  html.tema-leggero .sec-fatti .wrap:has(.fatti-testo) .fatto + .fatto::before { content: none; }
  html.tema-leggero .sec-fatti .wrap:has(.fatti-testo) .fatto-ico { margin-bottom: 10px; }
  html.tema-leggero .sec-fatti .wrap:has(.fatti-testo) .fatto b { font-size: 1.3rem; line-height: 1.15; }
}
@media (min-width: 960px) {
  html.tema-leggero .sec-fatti .wrap:has(.fatti-testo) { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr);
    column-gap: clamp(32px, 5vw, 72px); align-items: center; }
  html.tema-leggero .sec-fatti .wrap:has(.fatti-testo)::before { grid-column: 1 / -1; }
  html.tema-leggero .sec-fatti .wrap:has(.fatti-testo) > .fatti { grid-column: 2; grid-row: 1 / span 2; margin: 0; }
  html.tema-leggero .sec-fatti .wrap:has(.fatti-testo) > .fatti-testo { grid-column: 1; grid-row: 1; margin: 0; align-self: end; }
  html.tema-leggero .sec-fatti .wrap:has(.fatti-testo) > .sec-foot { grid-column: 1; grid-row: 2; align-self: start; margin-top: 22px; }
  html.tema-leggero .sec-fatti .wrap:has(.fatti-testo) .fatti-testo .prose { columns: auto; font-size: 1.12rem; }
  html.tema-leggero .sec-fatti .wrap:has(.fatti-testo):not(:has(.sec-foot)) > .fatti-testo { align-self: center; grid-row: 1 / span 2; }
}

/* ---------- "Fatti" con foto (partner): la foto occupa la colonna destra, le tessere le si appoggiano sopra ---------- */
html.tema-leggero .fatti-foto { margin: 0 0 18px; border-radius: 28px; overflow: hidden; aspect-ratio: 4 / 3; box-shadow: 0 22px 50px rgba(13, 11, 43, .2); }
html.tema-leggero .fatti-foto img { width: 100%; height: 100%; object-fit: cover; display: block; }
html.tema-leggero .sec-fatti .wrap:has(.fatti-foto) > .fatti:has(> .fatto:only-child) { grid-template-columns: minmax(0, 300px); }
@media (min-width: 960px) {
  html.tema-leggero .sec-fatti .wrap:has(.fatti-foto) { align-items: center; }
  html.tema-leggero .sec-fatti .wrap:has(.fatti-foto) > .fatti-foto { grid-column: 2; grid-row: 1 / span 2; margin: 0 0 56px 40px; aspect-ratio: 5 / 4; }
  html.tema-leggero .sec-fatti .wrap:has(.fatti-foto) > .fatti { grid-row: 1 / span 2; align-self: end; position: relative; z-index: 2; }
  html.tema-leggero .sec-fatti .wrap:has(.fatti-foto) > .fatti:has(> .fatto:only-child) .fatto { min-height: 0; }
}

/* =====================================================================
   DONA (20/10): 5x1000 come pannello colorato, bonifico come "carta" scura ben leggibile
   ===================================================================== */
html.tema-leggero .sec-cinque .wrap.cinque { background: var(--c-move); background-size: 220% 220%; animation: sfuma-muovi 22s ease-in-out infinite alternate;
  color: #fff; border-radius: 32px; padding: clamp(28px, 4vw, 56px); gap: clamp(28px, 4vw, 64px); align-items: center;
  box-shadow: 0 24px 60px rgba(124, 58, 237, .28); }
html.tema-leggero .sec-cinque .cinque > div:not(.cinque-box) :is(h2, .h2, p, li, strong, .prose, .prose *) { color: #fff; }
html.tema-leggero .sec-cinque .cinque-steps { counter-reset: passo; list-style: none; padding: 0; margin: 22px 0 26px; gap: 12px; }
html.tema-leggero .sec-cinque .cinque-steps li { counter-increment: passo; position: relative; padding: 14px 18px 14px 62px; border-radius: 18px; background: rgba(255, 255, 255, .14); }
html.tema-leggero .sec-cinque .cinque-steps li::before { content: counter(passo); position: absolute; left: 16px; top: 50%; transform: translateY(-50%);
  width: 32px; height: 32px; border-radius: 10px; background: #fff; color: var(--viola); font-weight: 700; display: flex; align-items: center; justify-content: center; }
html.tema-leggero .sec-cinque .cinque-box { border: 0; border-radius: 20px; box-shadow: 0 24px 50px rgba(13, 11, 43, .3); transform: rotate(-2deg); padding: 26px; font-size: .95rem; }
html.tema-leggero .sec-cinque .cb-cf i { border-color: #C9C6E0; color: var(--viola); border-radius: 4px; }
html.tema-leggero .sec-cinque .cb-sign { color: var(--viola); }
html.tema-leggero .sec-cinque .btn-row .btn.btn-outline { background: rgba(255, 255, 255, .12); border-color: rgba(255, 255, 255, .7); color: #fff; }
html.tema-leggero .sec-cinque .btn-row .btn.btn-outline:hover { background: #fff; color: var(--ink); }
html.tema-leggero .sec-cinque .btn-row .btn.copy-btn.copy-btn { background: #fff; color: var(--ink); border: 0; animation: none; }

html.tema-leggero .sec-donate .donate-box { background: var(--g1); color: #fff; border: 0 !important; border-radius: 28px; padding: clamp(24px, 3vw, 36px);
  box-shadow: 0 24px 50px rgba(13, 11, 43, .25); position: relative; overflow: hidden; }
html.tema-leggero .sec-donate .donate-box::after { content: ""; position: absolute; right: -60px; top: -60px; width: 220px; height: 220px; border-radius: 50%;
  background: radial-gradient(circle, rgba(219, 39, 119, .55), transparent 70%); pointer-events: none; }
html.tema-leggero .sec-donate .donate-box .card-title { color: #fff; font-size: 1.5rem; margin-bottom: 18px; }
html.tema-leggero .sec-donate .copylist { gap: 16px; }
html.tema-leggero .sec-donate .copylist dt { color: rgba(255, 255, 255, .65); }
html.tema-leggero .sec-donate .copylist dd { color: #fff; font-size: 1.1rem; }
html.tema-leggero .sec-donate .copylist code { font-size: clamp(1rem, 1.6vw, 1.3rem); letter-spacing: .04em; color: #fff; font-weight: 600; }
html.tema-leggero .sec-donate .copy-btn { background: rgba(255, 255, 255, .14); border-color: rgba(255, 255, 255, .6); color: #fff; }
html.tema-leggero .sec-donate .copy-btn:hover { background: #fff; color: var(--ink); }
html.tema-leggero .sec-donate .donate-ways > .btn { align-self: flex-start; }
@media (min-width: 900px) { html.tema-leggero .sec-donate .wrap:not(.split) > div { align-items: center; } }

/* ---------- Modulo di richiesta (Hosting, Partner): testo e promesse a sinistra, modulo in una scheda a destra ---------- */
.rq { display: grid; gap: 28px; scroll-margin-top: calc(var(--header-h, 80px) + 16px); }
@media (min-width: 1000px) { .rq { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 56px; align-items: start; } .rq-intro { position: sticky; top: calc(var(--header-h, 80px) + 24px); } }
.rq-promesse { list-style: none; margin: 22px 0 0; padding: 0; display: grid; gap: 12px; }
.rq-promesse li { display: flex; align-items: center; gap: 12px; font-weight: 600; }
.rq-promesse .ico { width: 40px; height: 40px; padding: 9px; border-radius: 12px; color: #fff; background: var(--c1); flex: none; }
.rq-promesse li:nth-child(2) .ico { background: var(--c2); }
.rq-promesse li:nth-child(3) .ico { background: var(--c3); }
.rq-box { background: #fff; border-radius: 28px; padding: clamp(22px, 3vw, 36px); box-shadow: 0 18px 50px rgba(13, 11, 43, .1); }
.rq-wide { grid-column: 1 / -1; }
html.tema-leggero .rq .reg-f { color: var(--ink); font-weight: 600; }
html.tema-leggero .rq .reg-f :is(input, select, textarea) { border: 1.5px solid #DDDAEC; border-radius: 14px; background: #FAFAFE; }
html.tema-leggero .rq .reg-f :is(input, select, textarea):focus { border-color: var(--viola); outline: 3px solid rgba(124, 58, 237, .2); background: #fff; }
html.tema-leggero .rq .reg-check input { accent-color: var(--viola); }
html.tema-leggero .rq .reg-done h3::before { content: "✓"; display: inline-flex; align-items: center; justify-content: center; width: 34px; height: 34px; border-radius: 50%; background: var(--c1); color: #fff; margin-right: 10px; }
/* 5x1000 sul telefono: il pannello resta dentro i margini e il riquadro del codice si stringe */
html.tema-leggero .sec-cinque .wrap.cinque { grid-template-columns: minmax(0, 1fr); }
@media (min-width: 900px) { html.tema-leggero .sec-cinque .wrap.cinque { grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); } }
@media (max-width: 899px) {
  html.tema-leggero .sec-cinque .wrap.cinque { width: auto; margin-left: 16px; margin-right: 16px; padding: 26px 20px; }
  html.tema-leggero .sec-cinque .cinque-box { transform: none; padding: 18px; min-width: 0; }
  html.tema-leggero .sec-cinque .cb-cf { flex-wrap: wrap; }
  html.tema-leggero .sec-cinque .cb-cf i { width: 1.45em; height: 1.75em; font-size: .9rem; }
  html.tema-leggero .sec-cinque .cinque-steps li { padding-left: 56px; }
}

/* ---------- Mappa con le indicazioni accanto (Territorio, Casa Naqah) ---------- */
@media (min-width: 1000px) {
  html.tema-leggero .map-wrap.has-body { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); column-gap: 56px; align-items: start; }
  html.tema-leggero .map-wrap.has-body::before { grid-column: 1 / -1; }
  html.tema-leggero .map-wrap.has-body > .sec-head { grid-column: 1; grid-row: 1 / span 2; margin: 0; }
  html.tema-leggero .map-wrap.has-body > .map { grid-column: 2; grid-row: 1; margin: 0; }
  html.tema-leggero .map-wrap.has-body > .sec-foot { grid-column: 2; grid-row: 2; }
}
html.tema-leggero .map-wrap.has-body .sec-head .prose ul { padding-left: 1.1em; }
html.tema-leggero .map-wrap.has-body .sec-head .prose li { margin-bottom: .55em; }

/* ---------- "A chi ci rivolgiamo" in evidenza: pannello colorato con foto, linguette grandi, scheda aperta bianca ---------- */
html.tema-leggero .tone-blue .settori-tabs { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 12px; }
html.tema-leggero .tone-blue .settori-tabs [role="tab"] { background: rgba(255, 255, 255, .12); color: #fff; border: 1.5px solid rgba(255, 255, 255, .35); padding: 22px 24px; text-align: left; backdrop-filter: blur(6px); }
html.tema-leggero .tone-blue .settori-tabs [role="tab"] b { font-size: 1.3rem; }
html.tema-leggero .tone-blue .settori-tabs [role="tab"] small { color: rgba(255, 255, 255, .75); }
html.tema-leggero .tone-blue .settori-tabs [role="tab"]:hover { background: rgba(255, 255, 255, .22); border-color: #fff; }
html.tema-leggero .tone-blue .settori-tabs [aria-selected="true"] { background: #fff; color: var(--ink); border-color: #fff; }
html.tema-leggero .tone-blue .settori-tabs [aria-selected="true"] small { color: var(--viola); }
html.tema-leggero .tone-blue .settore-pan { background: #fff; color: var(--ink); border-radius: 24px; padding: clamp(22px, 3vw, 36px); margin-top: 14px; }
html.tema-leggero .tone-blue .settore-pan :is(h3, p, li, strong, .prose, .prose *) { color: var(--ink); }
html.tema-leggero .tone-blue .settori-vuoto { color: rgba(255, 255, 255, .8); }

/* ---------- Schede "a contrasto" (sì / no): la prima colorata, la seconda chiara; spunte e croci al posto dei pallini ---------- */
html.tema-leggero .sch-contrasto > .sch { border-radius: 28px; padding: 6px; }
html.tema-leggero .sch-contrasto > .sch:first-child { background: var(--c-move); background-size: 220% 220%; animation: sfuma-muovi 22s ease-in-out infinite alternate; box-shadow: 0 20px 44px rgba(124, 58, 237, .25); }
html.tema-leggero .sch-contrasto > .sch:first-child :is(.card-title, .prose, .prose *, p, li) { color: #fff; }
html.tema-leggero .sch-contrasto > .sch:first-child .tile-ico { background: #fff; color: var(--viola); }
html.tema-leggero .sch-contrasto > .sch:nth-child(2) { background: #fff; }
html.tema-leggero .sch-contrasto .sch-aperta ul { list-style: none; padding-left: 0; }
html.tema-leggero .sch-contrasto .sch-aperta li { position: relative; padding-left: 34px; margin-bottom: .7em; }
html.tema-leggero .sch-contrasto .sch-aperta li::before { position: absolute; left: 0; top: .05em; width: 22px; height: 22px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: .8rem; font-weight: 700; }
html.tema-leggero .sch-contrasto > .sch:first-child .sch-aperta li::before { content: "✓"; background: #fff; color: var(--viola); }
html.tema-leggero .sch-contrasto > .sch:nth-child(2) .sch-aperta li::before { content: "✕"; background: #F1EEF8; color: var(--fucsia); }
html.tema-leggero .sch-contrasto .card-title { font-size: 1.5rem; }
/* due pannelli colorati di fila: un respiro tra l'uno e l'altro */
html.tema-leggero main > .section.tone-blue + .section.tone-blue { margin-top: 24px; }
