body {
    font-family: 'Segoe UI', sans-serif;
    background-color: #f9f9f9;
    color: #333;
}

.navbar-brand {
    color: #004080;
}



/* Menu principale - stile base */
.nav-item .nav-link {
  color: #000;              /* Testo nero */
  font-weight: 600;         /* Bold */
  transition: color 0.3s ease;
}

/* Hover - colore dorato */
.nav-item .nav-link:hover {
  color: #d4af37;           /* Oro  */
  font-weight: 600;
}



/* Mega menu al passaggio del mouse - solo desktop */
@media (min-width: 992px) {
  .navbar-nav .dropdown:hover > .dropdown-menu {
    display: block;
    margin-top: 0;
  }

  .dropdown-menu {
    display: none;
    position: absolute;
    left: 0;
    right: 0;
    top: 80%;
    z-index: 1050;
	margin-top: 0 !important;
	padding-top: 0 !important;
	padding-bottom: 0 !important;
  }

  .position-static > .dropdown-menu {
    width: 100%;
  }
  
	.dropdown-menu.show {
	  display: block !important; /* Assicurati che venga visualizzato quando è attivo */
	}


	/* Rimuovere il margine e padding tra il menu e il sotto-menu */
	.navbar-nav .nav-item {
	  margin-bottom: 0 !important;
	  padding-bottom: 0 !important;
	}


}
/**************************************************/





/* Immagini carosello a piena larghezza e responsive */
#gtCarousel .carousel-item img {
  width: 100%;
  height: auto;
  object-fit: cover;
  max-height: 600px; /* Puoi regolare l'altezza massima */
}

#gtCarousel .carousel-caption {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  color: #000;
  /*background-color: rgba(255, 255, 255, 0.6);*/
  padding: 2rem 3rem;        /* Aumenta spazio interno */
  border-radius: 0.5rem;
  width: 80%;                /* Allarga la box fino all'80% */
  max-width: 1000px;         /* Dimensione massima su schermi grandi */
  text-align: center;
}

#gtCarousel .carousel-caption h2 {
  font-size: 2rem;
  font-weight: bold;
}

#gtCarousel .carousel-caption p {
  font-size: 1.2rem;
}

.carousel-control-prev, .carousel-control-next {
  position: absolute;
  top: 50%; /* Posiziona i bottoni al centro verticalmente */
  transform: translateY(-50%); /* Centra verticalmente */
  background-color: rgba(0, 0, 0, 0.2); /* Colore di sfondo semitrasparente */
  border-radius: 50%; /* Forma circolare per i bottoni */
  width: 40px; /* Dimensione del bottone */
  height: 40px;
  z-index: 5; /* Assicurati che i bottoni siano sopra le immagini */
}

.carousel-control-prev {
  left: 10px; /* Posiziona il bottone "Precedente" a sinistra */
}

.carousel-control-next {
  right: 10px; /* Posiziona il bottone "Successivo" a destra */
}

/* Icone dei bottoni */
.carousel-control-prev-icon, .carousel-control-next-icon {
  filter: invert(1); /* Inverti i colori per il contrasto */
}

/* Ridimensionamento testo sui dispositivi mobili */
@media (max-width: 768px) { /* Per dispositivi con larghezza massima di 768px */
  #gtCarousel .carousel-caption h2 {
	  font-size: 1.2rem;
	  font-weight: bold;
	}

	#gtCarousel .carousel-caption p {
	  font-size: 1.0rem;
	}
}

/* Su schermi più piccoli (es. mobile), puoi abbassare ulteriormente la dimensione */
@media (max-width: 576px) { /* Per dispositivi con larghezza massima di 576px */
	 #gtCarousel .carousel-caption h2 {
	  font-size: 1.0rem;
	  font-weight: bold;
	}

	#gtCarousel .carousel-caption p {
	  font-size: 1.0rem;
	}
}




/**************************************************/




 /* Applica a tutti i bottoni social */
  .social-btn {
    border-radius: 5px; /* Modifica questo valore per ottenere l'angolo desiderato */
    padding: 5px 20px; /* Assicurati che il padding sia uguale per tutti */
  }

  .social-btn i {
    font-size: 1em; /* Imposta una dimensione uniforme per le icone */
  }

/**************************************************/


/* Titolo Sezioni */
.text-sezioni {
  color: #000; /* nero */
  position: relative;
  display: inline-block;
  padding: 0.5rem 1rem;
  font-size: 1.7rem; /* Impostazione della dimensione del font */
  font-weight: 700; /* Bold */
  
}

.text-sezioni::before,
.text-sezioni::after {
  content: "";
  display: block;
  height: 3px;
  background-color: #1e80b9; /* Blu */
  margin: 0 auto;
  width: 60%;
  border-radius: 2px;
}

.text-sezioni::before {
  margin-bottom: 0.5rem;
}

.text-sezioni::after {
  margin-top: 0.5rem;
}

/*****************************************************/


/* Pulsanti */
.btn {
  border: 2px solid #d4af37; /* oro */
  border-radius: 30px; /* angoli arrotondati */
  color: #000; /* testo nero */
  background-color: transparent;
  transition: all 0.3s ease;
  font-weight: 500;
}

.btn:hover {
  background-color: #f0f0f0; /* oro pieno */
  border: 2px solid #d4af37; /* oro */
  color: #000; /* testo bianco su hover */
  box-shadow: 0 0 10px rgba(212, 175, 55, 0.6);
}

/*****************************************************/





/* Stile Card */

.gt-corner-stripes {
  position: relative;
  border: 1px solid #ccc; /* bordo grigio */
  background-color: #fff;
  transition: border-color 0.3s ease;
  overflow: hidden;
}

/* Linea dorata in basso a destra */
.gt-corner-stripes::before {
  content: '';
  position: absolute;
  background-color: #d4af37; /* ORO */
  width: 0; /* la linea parte da 0 */
  height: 3px; /* spessore della linea */
  bottom: 0;
  right: 0;
  transition: width 0.5s ease; /* animazione per l'espansione */
}

/* Espansione della linea dorata al passaggio del mouse */
.gt-corner-stripes:hover::before {
  width: 100%; /* la linea si espande completamente */
}



}

/*****************************************************/


/* Progetti */
.card-img-top {
  display: block;
  margin: 0 auto; /* Centra l'immagine all'interno della card */
}


.img-thumbnail {
  max-width: 200px;
  max-height: 60px;
  width: auto;
  height: auto;
  object-fit: contain; /* Mantiene le proporzioni */
  display: block; /* Rende l'immagine un blocco per poter usare il margin */
  margin: 0 auto; /* Centra orizzontalmente */
  border: none;
}

/*****************************************************/




/* BLOG */

/* Stile generale della sezione Blog */
#blog {
  background-color: #121212; /* Colore di sfondo scuro */
  color: #fff; /* Colore del testo bianco */
  padding-top: 70px; /* Distanza tra il top e la sezione */
}

/* Stile per il contenitore delle card */
.blog-row {
  display: flex;
  flex-wrap: wrap; /* Permette di disporre le card su più righe se necessario */
  justify-content: center; /* Centra le card orizzontalmente */
  align-items: center; /* Centra le card verticalmente */
  min-height: 500px; /* Altezza minima per garantire l'allineamento verticale */
}

/* Stile delle card del blog */
.blog-card {
  border: none;
  box-shadow: 0 8px 15px rgba(0, 0, 0, 0.3);
  transition: transform 0.3s ease, box-shadow 0.3s ease;
  height: 350px; /* Altezza base per le card laterali */
  display: flex;
  flex-direction: column;
  justify-content: space-between; /* Distribuisce il contenuto all'interno della card */
}

/* Centra il pulsante nella parte inferiore della card */
.blog-card .card-body {
  display: flex;
  flex-direction: column;
  justify-content: space-between; /* Distribuisce gli spazi tra gli elementi */
  height: 100%; /* Fa in modo che la card prenda tutta l'altezza disponibile */
}

.blog-card .btn {
  align-self: center; /* Centra il pulsante orizzontalmente */
  margin-top: auto; /* Posiziona il pulsante in fondo alla card */
}

.blog-card:hover {
  transform: translateY(-10px); /* Sposta la card in alto al passaggio del mouse */
  box-shadow: 0 15px 30px rgba(0, 0, 0, 0.5); /* Ombra più marcata */
}

/* Card Centrale Più Alta */
.central-card {
  height: 450px; /* Altezza maggiore per la card centrale */
}

.blog-card .card-img-top {
  transition: transform 0.3s ease;
}

.blog-card:hover .card-img-top {
  transform: scale(1.05); /* Ingrandisce l'immagine al passaggio del mouse */
}

/* Stile del testo e del titolo nelle card */
.blog-card .card-title {
  font-size: 1.4rem;
  font-weight: bold;
  color : #1e80b9;
  text-align: center; /* Centra il titolo */
}



/* Stile del footer della card (data di pubblicazione) */
.blog-card .card-footer {
   border-top: 1px solid #444; /* Linea separatrice */
   font-size: 0.85rem;
}



/* Animazione delle immagini */
.blog-card .card-img-top {
  transition: transform 0.3s ease;
}

.blog-card:hover .card-img-top {
  transform: scale(1.05); /* Ingrandisce l'immagine al passaggio del mouse */
}

/* Responsive: schermi più piccoli */
@media (max-width: 768px) {
  #blog h2 {
    font-size: 2rem;
  }

  .blog-card .card-title {
    font-size: 1.2rem;
  }

  .blog-card .card-text {
    font-size: 0.9rem;
  }
}

/* Pulsante "Vedi Tutti gli Articoli" con colore di sfondo della card e testo nero */
.text-center .btn-outline-light {
  /*background-color: #fff; /* Colore di sfondo che richiama lo sfondo della card */
  border: 2px solid #d4af37; /* oro */
  color: #fff; /* Colore del testo in nero */
  font-weight: bold;
  transition: all 0.3s ease;
}

.text-center .btn-outline-light:hover {
  background-color: #f0f0f0; /* oro pieno */
  border: 2px solid #d4af37; /* oro */
  color: #000; /* testo bianco su hover */
  box-shadow: 0 0 10px rgba(212, 175, 55, 0.6);
}

/*****************************************************/





/* Aggiungi bordo oro all'input */
.input-newsletter {
  border: 2px solid #d4af37; /* Bordo oro */
  transition: border-color 0.3s ease; /* Transizione morbida per il bordo */
}

.input-newsletter:focus {
  border-color: #FFD700; /* Colore oro brillante al focus */
  outline: none; /* Rimuove il bordo di default del browser */
}

/* Stile base per il pulsante */
.btn-newsletter {
  color: white; /* Scritta bianca di default */
  /*background-color: #000; /* Colore di sfondo del pulsante */
  border: 2px solid #d4af37; /* Bordo dello stesso colore */
  transition: color 0.3s ease, background-color 0.3s ease; /* Transizione morbida per il colore */
}

.btn-newsletter:hover {
  color: #fff; /* Scritta nera al passaggio del mouse */
  background-color: #000; /* Sfondo grigio chiaro al passaggio del mouse */
}







/* Imposta tutte le card con la stessa altezza */
.card.h-100 {
  display: flex;
  flex-direction: column;
}

.card-body {
  flex-grow: 1; /* Fa sì che il contenuto si adatti alla card */
}



/* Stile per le icone social */
.social-icon {
  font-size: 1.5rem; /* Ingrandisce le icone */
  color: #fff; /* Colore bianco */
  transition: transform 0.3s ease, color 0.3s ease;
}

.social-icon:hover {
  color: #d4af37; /* Colore oro */
}



/* Footer */
footer {
    background: #00264d;
}

footer a {
    color: #fff;
}
