/* ========================================================================== 
   SETTORI SLIDESHOW - Contenitore principale
   ========================================================================== */
.settori-slideshow {
  width: 100%;
  padding: 40px 0; /* Spazio verticale attorno allo slideshow */
  font-family: "Poppins", sans-serif; /* Imposta il font principale */
  position: relative; /* Per posizionare assolutamente i bottoni */
  overflow: hidden; /* Nasconde slide che escono dal contenitore */
}

/* ========================================================================== 
   SLIDE INDIVIDUALE
   ========================================================================== */
.settori-slide {
  background-color: #333; /* Sfondo bianco per ogni slide */
  border-radius: 0; /* Nessun arrotondamento (modifica se desideri) */
  text-align: left; /* Allineamento del testo a sinistra */
  overflow: hidden; /* Nasconde eventuali elementi eccedenti */
  display: flex;
  flex-direction: column; /* Organizza il contenuto in colonna */
  height: 100%;
}

/* Immagine della slide */
.settori-slide img {
  width: 100%;
  height: 300px; /* Altezza fissa */
  object-fit: cover; /* Copre tutta l'area senza distorsioni */
  object-position: center; /* Centra l'immagine sia orizzontalmente che verticalmente */
  transition: transform 0.3s ease;
}

/* ========================================================================== 
   CONTENUTO DELLA SLIDE
   ========================================================================== */
.settori-slide-content {
  padding: 0; /* Rimuove padding interno */
  flex-grow: 1; /* Occupa lo spazio rimanente presente nella slide */
  display: flex;
  flex-direction: column;
  justify-content: space-between; /* Distribuisce lo spazio tra il titolo, testo e il link */
  text-align: left; /* Assicura allineamento sinistro */
}

/* Titolo all'interno della slide */
.settori-slide-content h3 {
  color:#ffffff;
  font-size: 1.1rem;
  margin-bottom: 10px;
  text-transform: uppercase;
  padding-top: 20px;
  line-height: 24px;
}

/* Paragrafo o testo della slide */
.settori-slide-content p {
  font-size: 0.95rem;
  color: #fff;
  flex-grow: 1; /* Rende il paragrafo flessibile per occupare lo spazio disponibile */
}

/* Link "Leggi di più" */
.settori-slide-content a.btn-read-more-settori {
  display: inline-block;
  margin-top: 15px;
  color: #14509e;
  font-weight: bold;
  text-decoration: none;
  transition: color 0.3s ease; /* Transizione per un effetto hover fluido */
  cursor: pointer;
}

/* Hover sul link "Leggi di più" */
.settori-slide-content a.btn-read-more-settori:hover {
  color: #2764b5;
  /* Colore leggermente più scuro per l'hover */
}

/* ========================================================================== 
   BOTTONI DELLO SWIPER (Frecce)
   ========================================================================== */
.swiper-button-prev,
.swiper-button-next {
  width: 27px;
  height: 44px;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 10;
  cursor: pointer;
  background-size: 27px 44px;
  background-repeat: no-repeat;
  background-position: center;
  color: #14509e;
  opacity: 1;
}

/* Sposta i bottoni fuori dal contenitore .settori-slideshow */
.settori-slideshow .swiper-button-prev {
  left: 10px !important; /* Sporge di 10px a sinistra */
}

.settori-slideshow .swiper-button-next {
  right: 10px !important; /* Sporge di 10px a destra */
}

/* ========================================================================== 
   PAGINAZIONE DELLO SWIPER (Pallini attivi)
   ========================================================================== */
.swiper-pagination-bullet-active {
  background: #0073aa; /* Colore dei pallini attivi */
}

.settori-grid-wrapper {
  display: grid;
  grid-template-columns: repeat(2, 1fr); /* 2 colonne fisse */
  gap: 30px;
  padding: 10px 0;
}
.settore-item {
  background: #fff;
  padding: 10px;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.05);
}

.settore-item img.settore-image {
  width: 100%;
  height: 360px; /* Altezza fissa */
  object-fit: cover; /* Copre tutta l'area senza distorsioni */
  object-position: center; /* Centra l'immagine sia orizzontalmente che verticalmente */
  transition: transform 0.3s ease;
}

.settore-full-content {
  display: none;
  margin-top: 10px;
}
.settore-toggle-btn {
  margin-top: 10px;
  background: #0073aa;
  color: white;
  border: none;
  padding: 10px 15px;
  cursor: pointer;
}
/* Per dispositivi piccoli (es. mobile), 1 colonna */
@media (max-width: 767px) {
  .settori-grid-wrapper {
    grid-template-columns: 1fr;
  }
}
/* Wrapper generale */
.settori-grid-wrapper {
  display: flex;
  flex-direction: column;
  gap: 40px;
}

/* Singolo settore 
.settore-item {
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    gap: 30px;
    padding: 25px;
    border: 1px solid #e0e0e0;
    background: #ffffff;
    border-radius: 0;
}*/

/* BOX */
.settore-item {
  display: flex;
  align-items: stretch; /* 🔥 fondamentale: allinea le altezze */
  gap: 30px;
  padding: 0 !important;
  border: 1px solid #444 !important;
  background: #333 !important;
  color: #fff !important;
}

/* Immagine a sinistra 
.settore-image {
  height: 100% !important;
  width: auto !important;
  object-fit: cover !important;
  flex-shrink: 0 !important;
}*/

/* IMMAGINE A SINISTRA: altezza = altezza del box */
.settore-image {
  height: 100% !important; /* 🔥 riempie tutta l’altezza del box */
  width: auto !important; /* 🔥 mantiene proporzioni */
  object-fit: cover !important;
  flex-shrink: 0 !important;
  display: block;
}

/* Wrapper testo 
.settore-text-wrapper {
    flex: 1;
    display: flex;
    flex-direction: column;
}*/

/* TESTO A DESTRA */
.settore-text-wrapper {
  flex: 1;
  padding: 20px;
  display: flex;
  flex-direction: column;
  color: #ffffff!important;
}

/* Titolo */
.settore-text-wrapper h3 {
  margin: 0 0 15px 0;
  font-size: 1.8rem;
  font-weight: 600;
}

/* Contenuto */
.settore-full-content {
  font-size: 1.05rem;
  line-height: 1.6;
  color: #ffffff !important;
}

/* Responsive 
@media (max-width: 900px) {
    .settore-item {
        flex-direction: column;
    }

    .settore-image {
        width: 100%;
    }
}*/

/* RESPONSIVE: su mobile va in colonna */
@media (max-width: 900px) {
  .settore-item {
    flex-direction: column;
  }
  .settore-image {
    width: 100% !important;
    height: auto !important; /* 🔥 torna normale su mobile */
  }
}



/* TESTO SEMPRE BIANCO OVUNQUE NELLA CARD */
.settori-grid-wrapper .settore-item .settore-text-wrapper,
.settori-grid-wrapper .settore-item .settore-text-wrapper * {
    color: #ffffff !important;
}


.settore-item .settore-text-wrapper p,
.settore-item .settore-text-wrapper span,
.settore-item .settore-text-wrapper div,
.settore-item .settore-text-wrapper * {
    color: #ffffff !important;
}
.settore-text-wrapper,
.settore-text-wrapper *,
.settore-full-content,
.settore-full-content * {
    display: inline-block !important;
    visibility: visible !important;
    opacity: 1 !important;
  
}