/* Réinitialisation et styles de base */
body {
   font-family: "Georgia", "Times New Roman", serif;
   line-height: 1.6;
   color: #2c2c2c;
   background-color: #f0e6d2; /* Couleur sable */
   margin: 0;
   padding: 0;
}

/* Conteneur principal - Effet papier */
.container {
   max-width: 1100px;
   margin: 40px auto;
   background-color: #fffbf0;
   padding: 40px;
   box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2);
   border-radius: 2px;
   border: 1px solid #d4c5a9;
}

/* En-tête */
header {
   text-align: center;
   margin-bottom: 50px;
   border-bottom: 2px solid #8b4513;
   padding-bottom: 20px;
}

h1 {
   color: #8b4513; /* Terre de Sienne */
   font-size: 2.5em;
   margin-bottom: 10px;
   text-transform: uppercase;
   letter-spacing: 2px;
}

.subtitle {
   font-style: italic;
   color: #5a5a5a;
   font-size: 1.2em;
}

/* Introduction */
.intro-box {
   background-color: #e8ded1;
   padding: 20px;
   border-left: 5px solid #8b4513;
   margin-bottom: 40px;
   font-size: 1.1em;
}

/* Cartes des explorateurs */
.explorer-section {
   display: flex;
   flex-wrap: wrap;
   margin-bottom: 50px;
   gap: 20px;
   align-items: flex-start;
}

/* Alterner l'ordre image/texte pour le rythme visuel */
.explorer-section:nth-child(even) {
   flex-direction: row-reverse;
}

.text-content {
   flex: 1;
   min-width: 300px;
}

.image-container {
   flex: 0 0 300px;
   max-width: 100%;
}

.image-container img {
   width: 100%;
   height: auto;
   max-height: 400px;
   object-fit: cover;
   border: 5px solid #fff;
   box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
}

.caption {
   font-size: 0.85em;
   color: #666;
   text-align: center;
   margin-top: 5px;
   font-style: italic;
}

h2 {
   color: #a0522d;
   border-bottom: 1px solid #dccbb1;
   padding-bottom: 10px;
   margin-top: 0;
}

h3 {
   font-size: 1em;
   color: #555;
   text-transform: uppercase;
   letter-spacing: 1px;
   margin-top: -10px;
}

ul {
   list-style-type: none;
   padding-left: 0;
}

ul li {
   padding-left: 20px;
   position: relative;
   margin-bottom: 10px;
}

ul li::before {
   content: "✦";
   color: #8b4513;
   position: absolute;
   left: 0;
}

/* Synthèse */
.synthesis {
   background-color: #2f4f4f;
   color: #fff;
   padding: 30px;
   border-radius: 4px;
   margin-top: 60px;
}

.synthesis h2 {
   color: #f0e6d2;
   border-color: #5f7f7f;
}

/* Pied de page */
footer {
   text-align: center;
   margin-top: 50px;
   font-size: 0.9em;
   color: #888;
   border-top: 1px solid #d4c5a9;
   padding-top: 20px;
}

/* Responsive - Corrections de débordement (Overflow Fix) pour l'héritage de voyages.css */
@media (max-width: 1100px) {
   .explorer-section,
   .explorer-section:nth-child(even) {
      flex-direction: column;
   }
   .image-container {
      flex: 0 0 auto;
      width: 100%;
   }
   .container {
      padding: 15px;
      margin: 10px auto;
      width: 100% !important;
      max-width: 100% !important;
      box-sizing: border-box;
   }
   /* Neutralisation impérative de toutes les largeurs fixes héritées de voyages.css (table, div géants...) */
   body,
   html {
      max-width: 100vw;
      overflow-x: hidden; /* Coupe radicalement tout ce qui essaie de dépasser à droite */
   }
   table,
   .bandeau,
   .texte,
   .colonne_g,
   .colonne_d,
   .colonne_test,
   img,
   video {
      max-width: 100% !important;
      width: auto !important;
      box-sizing: border-box;
   }
   /* Exception : le menu déroulant qui doit gérer sa propre largeur flex */
   .footer-nav-popup table {
      width: 100% !important;
   }
}

/* Désactivation du champ de recherche Pagefind sur les récits Gemini */
.search-container {
   display: none !important;
}