.header1 {
    height: 5.56vh;
    display: flex;
    align-items: center;
    justify-content: space-between; /* Maintient l'espacement original */
    border: 1px solid rgb(2, 2, 2);
    width: 100vw;
    margin: 30px 0;
    padding: 0 20px;
/* Reset des positions absolues */
    position: relative;
}

/* Réinitialisation des positions */
.social-icons,
.sejours,
.concept,
.phone-icon {
    position: static;
    transform: none;
}

/* Ajustement des tailles originales */
.social-icons {
    font-size: 1.5em;
    display: flex;
    gap: 15px;
}

.sejours, .concept {
    font-size: 2em;
    white-space: nowrap;
}

.sperienza {
    width: 250px;
    max-height: 200px;
    object-fit: contain;
    /* Garantit la priorité d'ordre */
    order: 0 !important;
}

.luxurious-script-regular {
  font-family: "Luxurious Script", serif !important;
  font-weight: 400;
  font-style: normal;
  }

.forum-regular {
  font-family: "Forum", serif;
  font-weight: 400;
  font-style: normal;
  }

a {
  text-decoration: none;
  color: #1a1a1a;
}

* {
  margin: 0;
  padding: 0;
}

h1 {
    font-size: 65px;
}
.mtt1 {
    margin-top: 90px;
}

.sejours-link {
  font-size : 2em;
}

.under {
  display: block;
  text-align: center; /* Centrer le texte */
  font-size: 2em; /* Taille de police uniforme */
  color: #333;
  text-decoration: none;
  border: none; /* Supprimer la ligne sous "Séjours" */
  cursor: pointer;
}

.under2 {
  margin-top: 5px;
}

.under3 {
  font-size: 1.5em;
}
/* =================== */
/*  DROPDOWN */
/* (Version 2.0 ) */
/* =================== */

.dropdown-wrapper {
  position: relative;
  display: inline-block;
  /* Pour pas que le menu s'enfuie */
  z-index: 100;
}

/* ------------------- */
/* 💫 Cœur du dropdown */
/* ------------------- */
.dropdown-content {
  /* Structure */
  display: block; /* On change le 'none' original */
  position: absolute;
  min-width: 180px; /* Un peu plus large pour le glamour */
  background: white;
  border-radius: 8px; /* Plus doux */
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.15);
  z-index: 1000;
  
  /* Animation */
  opacity: 0;
  visibility: hidden;
  transform: translateY(-15px); /* Effet "flottant" */
  transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94); /* Courbe de bézier */
  
  /* Détails chic */
  border: 1px solid rgba(0,0,0,0.05);
  overflow: hidden;
  backdrop-filter: blur(5px); /* Flou */  
}

/* ------------------- */
/* Liens du menu */
/* ------------------- */
.dropdown-content a {
  color: #555;
  padding: 12px 20px;
  text-decoration: none;
  display: block;
  transition: all 0.3s ease;
  font-family: 'Forum', sans-serif; /* Pour matcher ton style */
  
  /* Bordure séparatrice subtile */
  border-bottom: 1px solid rgba(0,0,0,0.03);
}

.dropdown-content a:last-child {
  border-bottom: none; /* Pas de bordure sur le dernier */
}

/* Effet hover - Version 1 */
.dropdown-content a:hover {
  background: #fff5f7;
  color: #ff6b81;
  transform: translateX(5px); /* Petit décalage */
  padding-left: 25px; /* Animation décalée */
}

/* ------------------- */
/* Activation */
/* ------------------- */
.sejours-link:hover + .dropdown-content,
.dropdown-content:hover {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

/* ------------------- */
/* Extras */
/* ------------------- */
/* Petite flèche */
.dropdown-content::before {
  content: "";
  position: absolute;
  top: -8px;
  left: 20px;
  width: 0;
  height: 0;
  border-left: 8px solid transparent;
  border-right: 8px solid transparent;
  border-bottom: 8px solid white;
  filter: drop-shadow(0 -2px 2px rgba(0,0,0,0.05));
}

/* Micro-retard pour les items */
.dropdown-content a:nth-child(1) { transition-delay: 0.05s; }
.dropdown-content a:nth-child(2) { transition-delay: 0.1s; }

.test1 {
  margin-right: 20px;
}

.test2 {
  margin-left:20px;
}

/* Style classique avec bordures et ombres douces */
.dropdown-wrapper.classic .dropdown-content {
  border: 1px solid #ddd;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
  padding: 10px;
}

/* Style minimaliste */
.dropdown-wrapper.minimal .dropdown-content {
  border: none;
  background-color: #f9f9f9;
  padding: 10px;
  transition: background-color 0.3s ease;
}
.dropdown-wrapper.minimal .dropdown-content a:hover {
  background-color: #eaeaea;
}

/* Suppression des styles modernes et plein écran */
.dropdown-wrapper.modern .dropdown-content a::before {
  content: none;
}

.dropdown-wrapper.fullscreen .dropdown-content {
  position: absolute;
  top: 100%;
  left: 0;
  width: auto;
  height: auto;
  background-color: white;
  box-shadow: none;
  border-radius: 5px;
  display: none;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  z-index: 1000;
}

.dropdown-wrapper.fullscreen .dropdown-content a {
  width: auto;
  text-align: left;
  padding: 10px;
  box-sizing: border-box;
}

/* Style en colonnes */
.dropdown-wrapper.columns .dropdown-content {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 10px;
  padding: 10px;
}

/* Centrer verticalement le bouton hamburger dans le header */
.hamburger {
  position: absolute;
  right: 20px;
  top: 50%; /* Centrage vertical */
  transform: translateY(-50%); /* Ajustement pour centrer */
  display: none;
  flex-direction: column;
  justify-content: space-around;
  width: 30px;
  height: 30px;
  background: none;
  border: none;
  cursor: pointer;
  z-index: 1001;
}

.hamburger span {
  display: block;
  width: 100%;
  height: 3px;
  background-color: #333;
  border-radius: 5px;
  transition: all 0.3s ease;
  margin: 4px 0; /* Ajout d'une marge entre les barres */
}

.hamburger.open span:nth-child(1) {
  transform: rotate(45deg) translate(6px, 6px);
}

.hamburger.open span:nth-child(2) {
  opacity: 0;
}

.hamburger.open span:nth-child(3) {
  transform: rotate(-45deg) translate(6px, -6px);
}

.hamburger.open {
  background-color: transparent; /* Suppression du fond jaune */
}

.nav-mobile {
  display: none;
  position: absolute;
  top: 100%;
  left: 0;
  width: 100%;
  background-color: white;
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
  z-index: 1000;
  flex-direction: column;
  align-items: center;
}

.nav-mobile.active {
  display: flex;
  position: fixed; /* Fixe le menu pour qu'il reste visible */
  top: 0;
  left: 0;
  width: 100%;
  height: 100%; /* Prend toute la hauteur de l'écran */
  background-color: rgba(255, 255, 255, 0.95); /* Fond semi-transparent */
  flex-direction: column;
  justify-content: center;
  align-items: center;
  z-index: 1000;
  border: none; /* Suppression de la bordure rouge */
}

/* Styles pour afficher les éléments sous "Séjours" dans le menu hamburger */
.nav-mobile .dropdown-wrapper {
  width: 100%;
}

.nav-mobile .dropdown-content {
  display: none;
  flex-direction: column;
  width: 100%;
  background-color: white;
  box-shadow: none;
  border-radius: 0;
  overflow: hidden;
  margin-top: 10px;
}

.nav-mobile .dropdown-wrapper.active .dropdown-content {
  display: block;
  position: relative;
}

.nav-mobile .dropdown-content a {
  padding: 10px;
  text-align: left;
  color: #555;
  text-decoration: none;
  font-size: 1em;
  border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}

.nav-mobile .dropdown-content a:last-child {
  border-bottom: none;
}

.nav-mobile .dropdown-content a:hover {
  background-color: #f0f0f0;
}

/* Alignement de "Séjours" avec les autres éléments */
.nav-mobile .sejours-link {
  display: block;
  text-align: center; /* Alignement centré comme les autres éléments */
  padding: 10px;
  font-size: 1.2em;
  color: #333;
  text-decoration: none;
  border-bottom: 1px solid rgba(0, 0, 0, 0.1);
  width: 100%; /* S'assurer qu'il occupe toute la largeur */
  box-sizing: border-box; /* Inclure le padding dans la largeur totale */
}

/* Styles pour le collapse dans le menu hamburger */
.collapse-wrapper {
  text-align: center; /* Centrer le texte */
  width: 100%;
}

.collapse-toggle {
  display: block;
  text-align: center; /* Centrer le texte */
  font-size: 2em; /* Taille de police uniforme */
  color: #333;
  text-decoration: none;
  border: none; /* Supprimer la ligne sous "Séjours" */
  cursor: pointer;
}

.collapse-content {
  display: none;
  flex-direction: column;
  width: 100%;
  background-color: transparent; /* Uniformiser le fond avec le reste */
  overflow: hidden;
  margin-top: 5px;
}

.collapse-content.active {
  display: flex;
}

.collapse-content a {
  text-align: center; /* Centrer les sous-liens */
  font-size: 1.5em;
  padding: 10px 0; /* Supprimer les bordures et ajuster l'espacement */
  border: none; /* Supprimer les lignes */
}

.collapse-content a:last-child {
  border-bottom: none;
}

/* Uniformiser l'espacement vertical entre tous les éléments du menu hamburger */
.nav-mobile a,
.collapse-wrapper {
  margin-bottom: 5px; /* Réduction de l'espacement pour uniformiser visuellement */
}

.profile-floater {
  position: absolute;
  left: 150px; /* Ajustez comme précédemment */
  top: 50%;
  transform: translateY(-50%);
  background: rgba(255,255,255,0.85);
  padding: 4px 15px 4px 10px;
  border-radius: 50px;
  font-family: 'Forum', sans-serif;
  font-size: 0.85em;
  display: flex;
  align-items: center;
  gap: 8px;
  box-shadow: 0 2px 5px rgba(0,0,0,0.1);
  backdrop-filter: blur(5px);
  border: 1px solid rgba(0,0,0,0.05);
  z-index: 1;
  transition: all 0.3s ease;
  text-decoration: none;
  color: inherit;
}

.profile-icon {
  flex-shrink: 0;
  opacity: 0.8;
}

.profile-floater:hover {
  background: rgba(255,255,255,0.95);
    transform: translateY(-48%);
    box-shadow: 0 3px 10px rgba(0,0,0,0.2);
}

.profile-floater:active {
  transform: translateY(0.1px);
  box-shadow: 0 1px 3px rgba(0,0,0,0.2);
}

.w30 {
  width: 30px;
  height: 30px;
}

@media (max-width: 943px) {
  .hamburger {
    display: flex;
  }

  .header1 {
    justify-content: space-between;
  }

  .sejours-link {
    display: none; /* Rendre visible */
    font-size: 1.2em; /* Ajustement pour mobile */
    margin-bottom: 10px; /* Espacement avec les autres éléments */
  }
}

@media (max-width: 943px) {
  .header1 {
    height: 4vh; /* Encore plus petit sur mobile */
    margin: 20px 0; /* Marges minimales */
    padding: 0 10px;
    width: 100%; /* S'assurer que le header prend toute la largeur */
    max-width: 100vw; /* Limiter la largeur à 100% de l'écran */
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    padding: 10px;
    position: relative;
  }

  .sperienza {
    width: 150px;
    max-height: 100px;
    margin: 0 auto;
  }

  .dropdown-wrapper {
    position: absolute;
    right: 10px;
  }

  .dropdown-button {
    background-color: #555;
    color: white;
    padding: 10px 20px;
    border: none;
    border-radius: 5px;
    cursor: pointer;
    font-size: 1em;
  }

  .dropdown-content {
    display: none;
    position: absolute;
    top: 100%;
    right: 0;
    background-color: white;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    border-radius: 5px;
    overflow: hidden;
    z-index: 1000;
  }

  .dropdown-wrapper.active .dropdown-content {
    display: block;
  }

  .dropdown-content a {
    display: block;
    padding: 10px;
    text-align: left;
    color: #555;
    text-decoration: none;
    font-size: 1em;
  }

  .dropdown-content a:hover {
    background-color: #f0f0f0;
  }

  .social-icons, .sejours, .concept, .phone-icon {
    display: none;
  }
}
@media (max-width: 880px) {
  .sperienza {
    width: 150px; /* Logo plus petit sur mobile */
    max-height: 100px;
  }
}
@media (min-width: 900px) and (max-width: 1000px) {
  .sperienza {
    width: 200px; /* Logo encore plus petit sur mobile */
    max-height: 150px;
  }
}

a {
  font-family: 'Forum', serif;;
}
@media (max-width: 956px) and (orientation: landscape) {
  .header1 {
    height: 10vh;
    margin: 15px 0;
    padding: 0 15px;
    display: flex;
    align-items: center;
    justify-content: space-between; /* Changé de center à space-between */
    position: relative;
  }

  .sperienza {
    position: absolute; /* Position absolue pour le centrage précis */
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 120px;
    max-height: 80px;
    margin: 0;
  }

  .social-icons.test2 {
    display: flex !important;
    align-items: center;
    order: -1; /* Force à gauche */
    margin-left: 0;
    position: static;
    transform: none;
    width: 20px !important;
    gap: 8px;
  }

  .hamburger {
    display: flex !important; /* Affiche le burger */
    position: static; /* Réintègre le flux */
    transform: none;
    order: 1; /* Force à droite */
    margin-left: auto; /* Pousse vers la droite */
  }

  .profile-floater {
    display: flex !important;
    font-size: 0.65em;
    padding: 2px 8px;
    margin-left: 5px;
    position: static;
    transform: none;
    gap: 5px;
  }

  .profile-icon {
    width: 12px !important;
    height: 12px !important;
  }

  /* Cache les éléments inutiles */
  .dropdown-wrapper,
  .concept,
  .social-icons:not(.test2) {
    display: none !important;
  }

  .w30 {
    width: 25px !important; /* Réduit la taille des icônes */
    height: 25px !important;
  }
  .nav-mobile.active {
    line-height: 1.1;
  }
}

