/* ==========================
   1. GLOBAL & CONFIGURATION
   ========================== */
@media (max-width: 1600px) {
  body {
    zoom: 75%;
  }
}

/* ==========================
   2. EN-TÊTE / NAVIGATION
   ========================== */
.site-header-logo {
  margin-left: 3em;
}

.top-bar .top-bar-inner {
  padding-left: 20px;
  padding-right: 20px;
}

/* ==========================
   3. TYPOGRAPHIE & TITRES
   ========================== */
.titrespecialites {
  background-color: #fff;
  color: #5987a6 !important;
  font-family: Lato, sans-serif;
  text-align: left;
  font-size: 20px;
}

.titrespecialites a,
.titrespecialites span {
  color: #5987a6 !important;
  font-family: Lato, sans-serif;
  font-size: 20px;
}

/* ==========================
   4. CARROUSEL & CARTES
   ========================== */
/* Conteneur */
.carousel-track {
  display: flex;
  gap: 20px;
  overflow-x: auto;
  scrollbar-width: thin;
  scrollbar-color: #888 #f1f1f1;
  padding-bottom: 15px;
}

/* Cartes */
.lot-card {
  flex: 0 0 auto;
  width: var(--carousel-fit, 250px);
}

/* Barre de défilement (Webkit) */
.carousel-track::-webkit-scrollbar {
  height: 8px;
}

.carousel-track::-webkit-scrollbar-track {
  background: #f1f1f1;
  border-radius: 4px;
}

.carousel-track::-webkit-scrollbar-thumb {
  background: #888;
  border-radius: 4px;
}

.carousel-track::-webkit-scrollbar-thumb:hover {
  background: #555;
}

/* ==========================
   5. PIED DE PAGE (FOOTER)
   ========================== */
footer:where(.footer) {
  margin-top: 50px;
}