/* Fascia home "Comunicazione conclusiva incidente informatico giugno 2026"
   (templates/frontend/homepage/comunicazione_incidente.html.twig).
   Colori/font da scss/inc/_variables.scss ($blue, $azure, $black). */

.home-section-comunicazione {
  background-color: #e4ecf2;
  padding-top: 3.75rem;
  padding-bottom: 3.75rem;
}

.home-section-comunicazione .container {
  padding-top: 0;
  margin-top: 0;
}

.home-section-comunicazione .comunicazione-box {
  /* fallback: l'altezza reale viene allineata alla sezione news via JS */
  height: 30rem;
  /* scroll (non auto) + ::-webkit-scrollbar personalizzata: la barra resta
     sempre visibile anche dove il SO usa scrollbar "overlay" (macOS, ecc.) */
  overflow-y: scroll;
  background-color: #fff;
  border-left: 0.25rem solid #0061a1;
  padding: 2rem 2.5rem;
  font-family: 'Inter', sans-serif;
  color: #292929;
}

/* Chrome 121+ ignora ::-webkit-scrollbar se sono presenti scrollbar-width/color:
   le proprietà standard solo per i browser senza pseudo-elementi webkit (Firefox) */
@supports not selector(::-webkit-scrollbar) {
  .home-section-comunicazione .comunicazione-box {
    scrollbar-width: thin;
    scrollbar-color: #0061a1 #fff;
  }
}

.home-section-comunicazione .comunicazione-box:focus {
  outline: 2px solid #0061a1;
  outline-offset: 2px;
}

.home-section-comunicazione .comunicazione-box::-webkit-scrollbar {
  -webkit-appearance: none;
  width: 16px;
}

/* binario bianco e staccato da bordi alto/basso: la barra sta "dentro" il box */
.home-section-comunicazione .comunicazione-box::-webkit-scrollbar-track {
  background: #fff;
  margin: 1rem 0;
}

/* bordo trasparente + background-clip: cursore visibile da 8px, arrotondato,
   con 4px di bianco ai lati */
.home-section-comunicazione .comunicazione-box::-webkit-scrollbar-thumb {
  background-color: #0061a1;
  background-clip: padding-box;
  border: 4px solid transparent;
  border-radius: 8px;
  min-height: 2.5rem;
}

/* stesso stile della CTA "Area inquilini" (mixin primary-title: Inter 400,
   maiuscolo, $blue); corpo ridotto perché il titolo stia su una riga
   nel container desktop da 1170px */
.home-section-comunicazione .primary-title {
  font-family: 'Inter', sans-serif;
  font-size: 1.125rem;
  line-height: 1.5;
  color: #0061a1;
  font-weight: 400;
  letter-spacing: 0.42px;
  margin: 0 0 0.5rem;
  text-transform: uppercase;
}

.home-section-comunicazione .subtitle {
  font-weight: 600;
  font-style: italic;
  margin-bottom: 1.5rem;
}

.home-section-comunicazione h3 {
  font-family: 'Inter', sans-serif;
  font-size: 1.125rem;
  font-weight: 700;
  color: #0061a1;
  margin: 1.75rem 0 0.75rem;
}

.home-section-comunicazione p {
  font-size: 1rem;
  line-height: 1.6;
  font-weight: 300;
  margin: 0 0 1rem;
}

.home-section-comunicazione .subtitle,
.home-section-comunicazione .signature {
  font-weight: 600;
}

.home-section-comunicazione .signature {
  margin-top: 1.5rem;
  margin-bottom: 0;
}

.home-section-comunicazione a {
  color: #0061a1;
  text-decoration: underline;
}

/* il CSS globale forza "p a" a font-size/line-height maggiori con !important:
   il link (es. e-mail assistenza) deve restare della dimensione del testo */
.home-section-comunicazione .comunicazione-box p a {
  font-size: inherit !important;
  line-height: inherit !important;
}

@media (max-width: 991px) {
  .home-section-comunicazione .comunicazione-box {
    height: 26rem;
    padding: 1.5rem 1.25rem;
  }
}