* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: 'Roboto', sans-serif;
}

body {
    line-height: 1.6;
	
}

html, body {
    width: 100%;
    overflow-x: hidden; /* Empêche le défilement horizontal */
}

/* Liens : Style par défaut et au survol */

a {
    text-decoration: none;
    color: #333;
}

a:hover {
    color: #0056b3;
}

.header-contact {
    color: white;
    font-size: 18px; /* Taille du texte ajustée */
    font-weight: 400;
    min-height: 50px;
    display: flex; /* Assure un alignement correct */
    align-items: center;
    justify-content: left;
    position: fixed;
    width: 100%;
    z-index: 500;
    background: linear-gradient(to right, #0a2540, #002f6c); /* Couleurs sobres */
    padding-left: 10px;
    text-align: center;
    padding-bottom: 10px;
}
.header-contact a {
    color: white;
    text-decoration: none;
}
.header-contact p {
    color: white;
    text-decoration: none;
}

.et-hero-tabs,
.et-slide {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    position: relative;
    background: #eee;
    text-align: center;
	margin-top:80px;
    font-family: 'Roboto', sans-serif;
	font-weight: 400; /* Applique la variante de poids */
}

.et-hero-tabs-container {
	min-height:5%;
	font-size:1rem;
    display: flex;
    flex-direction: row;
    position: fixed; /* Positionne en haut */
    top: 0; 
    width: 100%;
    height: 40px;
    box-shadow: 0 0 20px rgba(0, 0, 0, 0.6);
    background: #F0EDE8; /* Couleur marine foncée et unie pour une esthétique plus épurée */
    z-index: 500;
		margin-top:40px;

}

.et-hero-tab {
    display: flex;
    justify-content: center;
    align-items: center;
    flex: 1;
    color: #000;
    letter-spacing: 0.1rem;
    transition: all 0.5s ease;
	font-weight:bold;
	
	
}
.et-hero-tabR {
    display: flex;
    justify-content: center;
    align-items: center;
    flex: 1;
    color: white;
		background-color:black;
    cursor: pointer; /* Change le curseur en pointeur pour indiquer que c'est cliquable */

    letter-spacing: 0.1rem;
    transition: all 0.5s ease;
	font-weight:bold;
	
	
}

summary::after {
  content: "";
  display: inline-block;
  text-align: center;
  letter-spacing: -1px;
  margin: 0 auto;
}

summary::before,
summary::after {
  position: static;
  top: 0;
  left: 0;
}
summary::before {
  content: "";
}

summary:hover {
  transform: none;
}
summary::marker {
  font-size: 0;
}
summary::-webkit-details-marker {
  display: none;
}
details[open] .menu {
  animation-name: menuAnim;
}
details[open] summary::before {
  content: "";
}
details[open] summary::after {
  content: "";
}


.menu a:nth-of-type(1) {
  padding-top: 11px;
}
.menu a:nth-last-of-type(1) {
  border-bottom: none;
}



/* Styles pour le conteneur */
.menu-container {
	    display: none; /* Caché par défaut */

    position: fixed;
    top: 1px;
    right: 10px;
    z-index: 700;
}

/* Styles pour le bouton Summary */
summary {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 11px 20px;
    background-color: black; /* Couleur de fond du bouton */
    color: #fff; /* Couleur du texte */
    cursor: pointer;
    font-weight: bold;
    font-size: 16px;
    transition: transform 0.2s ease, background-color 0.3s ease;
}

summary:hover {
    background-color: #0056b3;
}

/* Styles pour le menu */
.menu {
    display: none; /* Caché par défaut */
    position: absolute;
    top: 44px;
    right: 0px;
    background-color: #fff; /* Fond blanc pour contraste */
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2); /* Ombre portée */
    overflow: hidden;
    z-index: 1000;
    flex-direction: column;
	
}

.menu a {
    padding: 11px 20px;
    color: #333;
    text-decoration: none;
    border-bottom: 1px solid #ddd; /* Ligne de séparation */
    text-align: left;
    transition: background-color 0.3s ease;
}



#accueil {
	
    position: relative;
    width: 100vw;
    min-height: 100vh; /* Assure une hauteur minimum pour tout le contenu */
    overflow: hidden; /* Évite tout débordement visuel */
    background: linear-gradient(to bottom, #FFD700, #FFA500, #FF8C00, #1E3A5F);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start; /* Les éléments commencent en haut */
    padding: 2rem 1rem; /* Ajoute un peu de respiration */
}
@keyframes fadeInGoogle {
    from { opacity: 0; transform: translateY(8px); }
    to   { opacity: 1; transform: translateY(0); }
}