/* Layout specifico della home */
.home-page {
  min-height: 100vh;
  padding-top: 0;
  background: var(--colore-bianco);
}

/* Sezione 1: immagine principale della home */
.home-hero {
  position: relative;
  z-index: 1;
  width: 100%;
  aspect-ratio: 1920 / 800;
  overflow: hidden;
}

/* Immagine elastica, centrata e senza deformazioni */
.immagine_sfondo_sezione_1 {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center center;
}

/* Logo sopra l'immagine, proporzionato al frame Figma */
.logo_judo {
  position: absolute;
  top: 50%;
  left: 3.0208vw;
  z-index: 2;
  width: 20.8333vw;
  aspect-ratio: 1 / 1;
  height: auto;
  transform: translateY(-50%);
  object-fit: contain;
}

/* Blocco titolo sotto la prima immagine */
.testo_sezione_1 {
  position: relative;
  width: 100%;
  height: 14.5833vw;
  overflow: hidden;
}

/* Sfondo scuro del titolo */
.sfondo_titolo_sezione_1 {
  position: absolute;
  inset: 0;
  background: var(--colore-grigio-primario);
}

/* Titolo principale della sezione */
.titolo_sezione_1 {
  position: absolute;
  top: 3.0729vw;
  left: 3.0208vw;
  width: calc(100% - 6.0417vw);
  color: var(--colore-bianco);
  font-size: 3.6458vw;
  line-height: 1.05;
  text-align: left;
}

/* Sottotitolo della sezione */
.sottotitolo_sezione_1 {
  position: absolute;
  top: 7.6563vw;
  left: 3.0208vw;
  width: 51.1979vw;
  margin: 0;
  color: var(--colore-bianco);
  font-family: var(--font-titoli);
  font-size: 2.0833vw;
  line-height: 1.15;
  text-align: left;
}

/* Sezione 2 attaccata alla sezione precedente */
.sezione_2 {
  --distanza-sinistra-sezioni: 3.0208vw;
  --larghezza-immagine-sezione-2: 30.625vw;
  --spazio-da-immagine-sezione-2: 4.4271vw;
  --spazio-testo-immagine-sezione-2: 2.2917vw;
  position: relative;
  min-height: 56.25vw;
  overflow: hidden;
}

/* Immagine destra della seconda sezione */
.immagine_sezione_2 {
  position: absolute;
  top: 0;
  right: 0;
  width: var(--larghezza-immagine-sezione-2);
  aspect-ratio: 588 / 1080;
  height: auto;
  object-fit: cover;
  object-position: center center;
}

/* Blocco titolo della seconda sezione */
.testo_sezione_2 {
  position: relative;
  width: min(
    42.2396vw,
    calc(
      100% - var(--distanza-sinistra-sezioni) -
        var(--larghezza-immagine-sezione-2) -
        var(--spazio-da-immagine-sezione-2)
    )
  );
  height: 4.6875vw;
  margin-top: 5vw;
  margin-left: var(--distanza-sinistra-sezioni);
  overflow: hidden;
}

/* Sfondo scuro del secondo titolo */
.sfondo_titolo_sezione_2 {
  position: absolute;
  inset: 0;
  background: var(--colore-grigio-primario);
}

/* Titolo della seconda sezione */
.titolo_sezione_2 {
  position: absolute;
  top: 0;
  left: 1.0417vw;
  width: calc(100% - 2.0833vw);
  color: var(--colore-bianco);
  font-size: 2.8646vw;
  line-height: 4.6875vw;
  text-align: left;
}

/* Linea divisoria della seconda sezione */
.linea_sezione_2 {
  width: min(
    61.9271vw,
    calc(
      100% - var(--distanza-sinistra-sezioni) -
        var(--larghezza-immagine-sezione-2) -
        var(--spazio-da-immagine-sezione-2)
    )
  );
  height: 0.2083vw;
  margin-top: 1.25vw;
  margin-left: var(--distanza-sinistra-sezioni);
  background: var(--colore-grigio-scuro);
}

/* Testo descrittivo sotto la linea */
.descrizione_sezione_2 {
  width: min(
    64.0625vw,
    calc(
      100% - var(--distanza-sinistra-sezioni) -
        var(--larghezza-immagine-sezione-2) -
        var(--spazio-testo-immagine-sezione-2)
    )
  );
  min-height: 27.2396vw;
  margin-top: 1.0417vw;
  margin-left: var(--distanza-sinistra-sezioni);
  color: var(--colore-testo-grigio);
  font-family: var(--font-testo);
  font-size: 2.0833vw;
  font-weight: 400;
  line-height: 1.14;
  text-align: left;
}

/* Paragrafi del testo descrittivo */
.descrizione_sezione_2 p {
  margin: 0;
}

.descrizione_sezione_2 p + p {
  margin-top: 2.0833vw;
}

/* Pulsante che porta alla pagina Storia */
.pulsante_storia_sezione_2 {
  display: inline-flex;
  align-items: center;
  gap: 1.25vw; /* distanza testo-freccia */

  min-height: 2.2917vw;
  padding-right: 0.2083vw;

  margin-top: 2.6563vw;
  margin-left: var(--distanza-sinistra-sezioni);

  color: var(--colore-nero);
  font-family: var(--font-testo);
  text-decoration: none;
}

/* Linea verticale */
.linea_verticale_pulsante {
  width: 0.1042vw;
  height: 1.5104vw;
  background: var(--colore-nero);
  flex-shrink: 0;
}

/* Testo */
.testo_pulsante {
  position: static;
  width: auto;

  font-size: 1.6667vw;
  line-height: 2.2917vw;
  white-space: nowrap;
}

/* Freccia */
.freccia_pulsante {
  position: static;

  width: 0.7813vw;
  height: 1.4583vw;

  display: flex;
  align-items: center;
  justify-content: center;

  flex-shrink: 0;
}

.freccia_pulsante img {
  width: 100%;
  height: 100%;
  display: block;
}

/* Sezione 3 */
.sezione_3 {
  --distanza-sinistra-sezioni: 3.0208vw;
  position: relative;
  min-height: 56.25vw;
  margin-bottom: 1.9792vw;
  overflow: hidden;
}

/* Titolo sezione 3 */
.titolo_sezione_3 {
  position: relative;
  width: min(42.2396vw, calc(100% - var(--distanza-sinistra-sezioni)));
  height: 4.6875vw;
  margin-top: 5vw;
  margin-left: var(--distanza-sinistra-sezioni);
  color: var(--colore-grigio-scuro);
  font-size: 2.8646vw;
  line-height: 4.6875vw;
  overflow: hidden;
}

/* Testo riempitivo zona notizie (nessuna notizia) */

.pannello_notizie_sezione_3 {
  width: min(85.1042vw, 100%);
  height: auto;
  margin: 5vw auto 0;

  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;

  gap: 1.5vw;

  overflow: visible;
}

.testo_riempitivo_sezione_3 {
  margin: 0;

  font-family: var(--font-display);
  font-style: italic;
  color: var(--colore-grigio-scuro);

  font-size: 2.8646vw;
  line-height: 1.2;

  text-align: center;
}

.pulsante_news_sezione_3 {
  display: inline-flex;
  align-items: center;
  gap: 1.25vw; /* distanza testo-freccia */

  min-height: 2.2917vw;
  padding-right: 0.2083vw;

  margin-top: 2.6563vw;
  margin-left: var(--distanza-sinistra-sezioni);

  color: var(--colore-nero);
  font-family: var(--font-testo);
  text-decoration: none;
}

/* ====================================================== */
/* TESTO NEWS ASSENTI */
/* ====================================================== */

.testo_notizie_assenti {
  display: none;

  width: 48vw;

  height: 2.39vw;

  position: absolute;

  top: 50%;

  left: 50%;

  transform: translate(-50%, -50%);

  color: var(--colore-grigio-scuro);

  font-family: var(--font-display);

  font-style: italic;

  font-weight: 600;

  font-size: 1.875vw;

  text-align: center;

}

/* ====================================================== */
/* NOTIZIA PICCOLA */
/* ====================================================== */

.notizia_piccola {
  width: 92.96vw;

  height: 16.04vw;

  position: relative;

  margin-bottom: 2vw;

  box-shadow: -1.042vw 1.042vw 0.208vw var(--colore-ombra-forte);

  overflow: visible;

  z-index: 10;

  cursor: pointer;

  transform: scale(1);

  transition: transform 0.12s ease;
}

.notizia_piccola.pressione {
  transform: scale(0.97);
}

/* ====================================================== */
/* SFONDO NEWS PICCOLA */
/* ====================================================== */

.sfondo_notizia_piccola {
  width: 100%;

  height: 100%;

  background: var(--colore-grigio-chiaro);

  position: absolute;

  top: 0vw;

  z-index: 1;

  pointer-events: none;
}

/* ====================================================== */
/* IMMAGINE NEWS PICCOLA */
/* ====================================================== */

.immagine_notizia_piccola {
  width: 24.688vw;

  height: 16.042vw;

  background-repeat: no-repeat;

  background-position: center center;

  background-size: cover;

  position: absolute;

  top: 0vw;

  left: 0vw;

  overflow: hidden;

  z-index: 2;

  pointer-events: none;
}

/* ====================================================== */
/* DATA NEWS PICCOLA */
/* ====================================================== */

.data_notizia_piccola {
  width: 13.854vw;

  color: var(--colore-grigio-primario);

  position: absolute;

  top: 0.8vw;

  left: 25.625vw;

  font-family: var(--font-testo);

  font-weight: normal;

  font-size: 0.938vw;


  text-align: left;

  z-index: 3;

  pointer-events: none;
}

/* ====================================================== */
/* TITOLO NEWS PICCOLA */
/* ====================================================== */

.titolo_notizia_piccola {
  width: 56.4vw;

  height: 2.39vw;

  color: var(--colore-grigio-primario);

  position: absolute;

  top: 2.292vw;

  left: 25.625vw;

  font-family: var(--font-titoli);

  font-weight: normal;

  font-size: 1.25vw;

  line-height: normal;


  text-align: left;

  z-index: 4;

  pointer-events: none;

  white-space: normal;

  overflow: hidden;

  overflow-wrap: anywhere;

  word-break: normal;
}

/* ====================================================== */
/* TESTO NEWS PICCOLA */
/* ====================================================== */

.testo_notizia_piccola {
  width: 66.14583vw;

  height: 9.21875vw;

  color: var(--colore-grigio-primario);

  position: absolute;

  top: 5.208vw;

  left: 25.625vw;

  font-family: var(--font-testo);

  font-weight: normal;

  font-size: 0.938vw;

  line-height: normal;


  text-align: left;

  z-index: 4;

  pointer-events: none;

  white-space: normal;

  overflow-wrap: anywhere;

  word-break: normal;

  overflow: hidden;
}

/* ====================================================== */
/* NEWS PICCOLA SENZA IMMAGINE */
/* ====================================================== */

.notizia_piccola.senza_immagine .immagine_notizia_piccola {
  display: none;
}

.notizia_piccola.senza_immagine .data_notizia_piccola {
  left: 0.93vw;

  width: 87.479vw;
}

.notizia_piccola.senza_immagine .titolo_notizia_piccola {
  left: 0.93vw;

  width: 80.088vw;
}

.notizia_piccola.senza_immagine .testo_notizia_piccola {
  left: 0.93vw;

  width: 89.0625vw;
}

/* ====================================================== */
/* EVIDENZIAZIONE RICERCA */
/* ====================================================== */

.evidenzia_ricerca {
  background: var(--colore-evidenziatore);

  color: inherit;

  padding: 0;
}

/* ====================================================== */
/* NOTIZIA FOCUS */
/* ====================================================== */

.notizia_grande {
  width: 100%;

  height: 100vh;

  background-repeat: no-repeat;

  background-position: center center;

  background-size: cover;

  opacity: 0;

  position: fixed;

  top: 0;

  left: 0;

  overflow-y: auto;

  overflow-x: hidden;

  z-index: 100;

  pointer-events: none;

  transition: opacity 0.18s ease;
}

.notizia_grande.aperta {
  opacity: 1;

  pointer-events: auto;
}

.notizia_grande:not(.aperta) * {
  pointer-events: none;
}

/* ====================================================== */
/* SCROLLBAR */
/* ====================================================== */

.notizia_grande {
  scrollbar-width: auto;
}

.notizia_grande::-webkit-scrollbar {
  width: 0.55vw;
}

.notizia_grande::-webkit-scrollbar-track {
  background: var(--colore-ombra-media);
}

.notizia_grande::-webkit-scrollbar-thumb {
  background: var(--colore-scrollbar);

  border-radius: 1vw;
}

.notizia_grande::-webkit-scrollbar-thumb:hover {
  background: var(--colore-scrollbar-hover);
}

/* ====================================================== */
/* OFFUSCAMENTO */
/* ====================================================== */

.offuscamento_background {
  width: 100%;

  height: 100vh;

  background: var(--colore-overlay-modale);

  position: fixed;

  top: 0;

  left: 0;

  z-index: 1;

  pointer-events: auto;
}

/* ====================================================== */
/* NOTIZIA GRANDE */
/* ====================================================== */

.notizia {
  width: 92.96vw;

  height: 94.42vw;

  background-repeat: no-repeat;

  background-position: center center;

  background-size: cover;


  position: relative;

  top: 6.25vw;

  left: 3.48vw;

  margin-bottom: 12.5vw;

  overflow: hidden;

  z-index: 2;

  flex-shrink: 0;
}

/* ====================================================== */
/* SFONDO NOTIZIA GRANDE */
/* ====================================================== */

.sfondo_notizia {
  width: 100%;

  height: 100%;

  background: var(--colore-bianco);


  position: absolute;

  top: 0;

  left: 0;

  box-shadow: -1.04vw 1.04vw 0.2vw var(--colore-ombra-forte);

  z-index: 1;

  pointer-events: none;
}

/* ====================================================== */
/* IMMAGINE NOTIZIA GRANDE */
/* ====================================================== */

.immagine_notizia {
  width: 100%;

  height: 60.41vw;

  background-repeat: no-repeat;

  background-position: center center;

  background-size: cover;


  position: absolute;

  top: 0;

  left: 0;

  overflow: hidden;

  z-index: 2;

  pointer-events: none;
}

/* ====================================================== */
/* DATA NOTIZIA GRANDE */
/* ====================================================== */

.data_notizia {
  width: 13.85vw;

  height: 3.125vw;

  color: var(--colore-grigio-primario);

  position: absolute;

  top: 61.35vw;

  left: 2.44vw;

  font-family: var(--font-testo);

  font-weight: normal;

  font-size: 1.875vw;


  text-align: left;

  z-index: 3;

  pointer-events: none;
}

/* ====================================================== */
/* TITOLO NOTIZIA GRANDE */
/* ====================================================== */

.titolo_notizia {
  width: 93.9vw;

  height: 3.75vw;

  color: var(--colore-grigio-primario);

  position: absolute;

  top: 64.11vw;

  left: 2.44vw;

  font-family: var(--font-titoli);

  font-weight: normal;

  font-size: 2.5vw;

  line-height: normal;


  text-align: left;

  z-index: 4;

  pointer-events: none;
}

/* ====================================================== */
/* TESTO NOTIZIA GRANDE */
/* ====================================================== */

.testo_notizia {
  width: 88.02vw;

  height: auto;

  color: var(--colore-grigio-primario);

  position: absolute;

  top: 68.43vw;

  left: 2.81vw;

  font-family: var(--font-testo);

  font-weight: normal;

  font-size: 1.87vw;

  line-height: normal;


  text-align: left;

  z-index: 4;

  pointer-events: none;

  white-space: normal;

  overflow-wrap: anywhere;

  word-break: normal;
}

/* ====================================================== */
/* NOTIZIA SENZA IMMAGINE - FOCUS */
/* ====================================================== */

.notizia.notizia_senza_immagine {
  height: auto;
}

.notizia.notizia_senza_immagine .immagine_notizia {
  display: none;
}

.notizia.notizia_senza_immagine .data_notizia {
  top: 2.44vw;
}

.notizia.notizia_senza_immagine .titolo_notizia {
  top: 5.2vw;
}

.notizia.notizia_senza_immagine .testo_notizia {
  top: 9.5vw;
}

.notizia.notizia_senza_immagine .pulsante_scorri_destra,
.notizia.notizia_senza_immagine .pulsante_scorri_sinistra {
  top: 50%;
  transform: translateY(-50%);
}

/* ====================================================== */
/* PULSANTE ESCI */
/* ====================================================== */

.pulsante_esci {
  width: 3.64vw;

  height: 3.64vw;

  background-repeat: no-repeat;

  background-position: center center;

  background-size: cover;


  position: absolute;

  top: 0.9375vw;

  right: 0.9375vw;

  overflow: hidden;

  z-index: 20;

  cursor: pointer;

  transition: transform 0.1s ease;
}

.pulsante_esci:active {
  transform: scale(0.9);
}

.sfondo_pulsante_esci {
  width: 3.64vw;

  height: 3.64vw;

  background: var(--colore-overlay-modale);


  position: absolute;

  top: 0;

  left: 0;

  border-radius: 50%;

  pointer-events: none;
}

.icona_pulsante_esci {
  width: 1.82vw;

  height: 1.82vw;

  background: url("../assets/home/icona_pulsante_esci.svg");

  background-repeat: no-repeat;

  background-position: center center;

  background-size: cover;


  position: absolute;

  top: 0.93vw;

  left: 0.93vw;

  overflow: hidden;

  pointer-events: none;
}

/* ====================================================== */
/* PULSANTE DESTRA */
/* ====================================================== */

.pulsante_scorri_destra {
  width: 3.64vw;

  height: 3.64vw;

  background-repeat: no-repeat;

  background-position: center center;

  background-size: cover;


  position: absolute;

  top: 28.6458vw;

  right: 0.9375vw;

  overflow: hidden;

  z-index: 20;

  cursor: pointer;
}

.sfondo_pulsante_scorri_destra {
  width: 3.64vw;

  height: 3.64vw;

  background: var(--colore-overlay-modale);

  position: absolute;

  top: 0;

  left: 0;

  border-radius: 50%;

  pointer-events: none;
}

.icona_pulsante_scorri_destra {
  width: 1.82vw;

  height: 1.82vw;

  background: url("../assets/home/icona_pulsante_scorri_destra.svg");

  background-repeat: no-repeat;

  background-position: center center;

  background-size: cover;


  position: absolute;

  top: 0.93vw;

  left: 0.93vw;

  overflow: hidden;

  pointer-events: none;
}

/* ====================================================== */
/* PULSANTE SINISTRA */
/* ====================================================== */

.pulsante_scorri_sinistra {
  width: 3.64vw;

  height: 3.64vw;

  background-repeat: no-repeat;

  background-position: center center;

  background-size: cover;


  position: absolute;

  top: 28.6458vw;

  left: 0.9375vw;

  overflow: hidden;

  z-index: 20;

  cursor: pointer;
}

.sfondo_pulsante_scorri_sinistra {
  width: 3.64vw;

  height: 3.64vw;

  background: var(--colore-overlay-modale);

  position: absolute;

  top: 0;

  left: 0;

  border-radius: 50%;

  pointer-events: none;
}

.icona_pulsante_scorri_sinistra {
  width: 1.82vw;

  height: 1.82vw;

  background: url("../assets/home/icona_pulsante_scorri_sinistra.svg");

  background-repeat: no-repeat;

  background-position: center center;

  background-size: cover;


  position: absolute;

  top: 0.93vw;

  left: 0.93vw;

  overflow: hidden;

  pointer-events: none;
}