/* Slider isolati: conservano i colori Lions senza cambiare le gallerie storiche. */
.lions-hero { position: relative; margin: 0 0 32px; background: #003259; color: #fff; }
.lions-hero-swiper { display: block; --swiper-theme-color: #ffcf03; }
.lions-hero-swiper:not(.lions-slider-ready) swiper-slide:not(:first-child) { display: none; }
.lions-hero-swiper swiper-slide { height: auto; }
.lions-hero-slide { display: grid; grid-template-columns: 1fr; grid-template-rows: 250px 1fr; height: 100%; }
/* Il ritaglio riempie la colonna senza imporre alla slide l’altezza naturale della foto. */
.lions-hero-image { display: block; position: relative; overflow: hidden; min-width: 0; height: 250px; background: #004b80; }
.lions-hero-image img { position: absolute; inset: 0; display: block; width: 100%; height: 100%; max-width: none; max-height: none; margin: 0; object-fit: cover; object-position: center; }
.lions-hero-copy { display: flex; align-items: center; justify-content: center; min-width: 0; min-height: 300px; padding: 28px 48px 64px; text-align: center; background: linear-gradient(#006abc, #003259); }
.lions-hero .lions-hero-copy > a,
.lions-hero .lions-hero-copy > a:hover,
.lions-hero .lions-hero-copy > a:focus,
.lions-hero .lions-hero-copy > a:active,
.lions-hero .lions-hero-copy > a:visited { display: block; color: #fff; text-decoration: none; max-width: 580px; }
.lions-hero-copy h2, .lions-hero-copy p, .lions-hero-copy time { color: inherit; }
.lions-hero-copy h2 { font-family: 'Oswald', sans-serif; font-size: clamp(26px, 3.1vw, 44px); line-height: 1.2; text-transform: uppercase; margin: 0 0 18px; overflow-wrap: anywhere; }
.lions-hero-copy p { font-family: 'Merriweather', serif; line-height: 1.6; font-size: 16px; margin: 0 0 28px; }
.lions-hero-copy time { display: block; font-size: 14px; }
.lions-hero-copy time i { color: #ffcf03; margin-right: 5px; }
.lions-hero a:focus-visible { outline: 3px solid #ffcf03; outline-offset: 3px; }
.lions-years-swiper { display: block; width: 100%; padding: 20px 0; --swiper-theme-color: #005daa; }
.lions-years-swiper swiper-slide { width: 128px; }
.lions-years-swiper swiper-slide a { display: flex; align-items: center; justify-content: center; min-height: 44px; padding: 10px 8px; color: #005daa; background: #fff; border: 1px solid #005daa; border-radius: 3px; text-decoration: none; font-weight: 700; }
.lions-years-swiper swiper-slide a:hover { background: #e7f2fb; }
.lions-years-swiper swiper-slide a[aria-current="page"] { color: #003259; background: #ffcf03; border-color: #ffcf03; }
.lions-years-swiper swiper-slide a:focus-visible { outline: 2px solid #005daa; outline-offset: 2px; }
@media (min-width: 768px) {
  .lions-hero-slide { grid-template-columns: 1fr 1fr; grid-template-rows: 1fr; min-height: 500px; }
  .lions-hero-image { height: auto; min-height: 500px; }
  .lions-hero-copy { padding: 48px 52px 68px; }
}
/* Evita il bordo sull'intera slide: il focus da tastiera evidenzia il titolo. */
.lions-hero a:focus,
.lions-hero a:focus-visible { outline: 0; }
.lions-hero a:focus-visible h2 { text-decoration: underline 3px #ffcf03; text-underline-offset: 6px; }

/* Il selettore degli anni parte aperto e usa uno spazio verticale più compatto. */
.filter-eventi.anni-sociali { margin-top: 0; margin-bottom: 24px; }
.filter-eventi.anni-sociali .panel-group,
.filter-eventi.anni-sociali .panel,
.filter-eventi.anni-sociali .panel-collapse { margin-top: 0; margin-bottom: 0; }
.filter-eventi.anni-sociali .nav-filter { padding-top: 0; padding-bottom: 0; }
.filter-eventi.anni-sociali .lions-years-swiper { padding-top: 8px; padding-bottom: 8px; }
/* Anni compatti, con spazio laterale riservato ai pulsanti di navigazione. */
.lions-years-swiper,
.filter-eventi.anni-sociali .lions-years-swiper { padding-top: 5px; padding-bottom: 5px; }
.lions-hero a:focus-visible h2 { text-decoration: none; }

/* Le slide fuori campo non devono estendere la pagina orizzontalmente. */
.lions-years-swiper { overflow: hidden; }
/* Riduce i 50 px ereditati dal tema senza modificare la larghezza della fascia. */
body.single-anno-sociale .filter-eventi.anni-sociali .panel .panel-collapse > .container {
  padding-top: 10px;
  padding-bottom: 10px;
}
