/* Sezione 06 — banda «Scopri un posto ricco di storia»: foto aerea del centro
   storico di Andria a tutta larghezza, velo grigio, titolo bianco centrato. */

.banda-storia{
  /* L'originale usava padding in percentuale: 13% e 15% della larghezza.
     A 1440px valgono 187,195px e 216px, cioe' i valori calcolati sul sito
     vivo; in percentuale la fascia resta proporzionata anche fra 768 e 1440. */
  padding:13% 0 15%;
  background-image:url('/assets/img/2023-07-Composizione-1_01254.webp');
  background-size:cover;
  /* La foto e' 4:3: coperta su una fascia larga 1440 diventa 1440x1080 e viene
     alzata di 634px. Restano 446px di foto; negli ultimi 54,8px la trama si
     ripete e riaffiora il bordo alto dell'immagine. Succede anche
     sull'originale — la giuntura e' visibile nello screenshot di riferimento a
     446px dall'inizio della fascia — quindi si conserva. */
  background-position:0 -634px;
  background-repeat:repeat;
}

/* velo grigio sopra la foto: era .elementor-background-overlay */
.banda-storia__velo{
  position:absolute;
  inset:0;
  background-color:var(--testo-tenue);   /* #7a7a7a = rgb(122,122,122) */
  opacity:.33;
}

.banda-storia__contenuto{
  position:relative;
  z-index:1;
}

/* .titolo di base.css porta gia' 58px / 69,6px / -2,32px in Forum:
   qui cambiano solo lo stacco dall'alto e il colore. */
.banda-storia__titolo{
  margin-top:28px;
  color:var(--bianco);
}

/* --------------------------------------------------------------- stretti */
@media (max-width:1024px){
  /* l'originale riportava lo sfondo a filo in alto sotto i 1024 */
  .banda-storia{
    background-image:url('/assets/img/2023-07-Composizione-1_01254-1536x1152.webp');
    background-position:0 0;
  }
}

@media (max-width:768px){
  .banda-storia{
    background-image:url('/assets/img/2023-07-Composizione-1_01254-1024x768.webp');
    padding:50px 0 90px;
  }
  /* il tema scendeva a 45px sui titoli di questo livello (-.04em = -1,8px) */
  .banda-storia__titolo{
    font-size:45px;
    line-height:54px;
    letter-spacing:-1.8px;
  }
}
