/* ===== Section Overlap custom Fynn ===== */

.section-overlap {
  position: relative;
  padding: 80px 0;
  overflow: hidden;
}

/* Container texte calé à gauche */
.section-overlap-content .container {
  position: relative;
  z-index: 3;
}

/* Image colonne droite = 2/3 */
.section-overlap-image {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  width: 66%;              /* 2/3 */
  background: none;            /* on enlève l'ancien bg */
  overflow: hidden;
  z-index: 1;
}

.thumbnail-corporate {
  position: relative;
}

.thumbnail-corporate-overlay {
  position: absolute;
  inset: 0;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(0,0,0,0);
  transition: background .25s ease;
  text-decoration: none;
}

.thumbnail-corporate-overlay i {
  font-size: 34px;
  color: #a76b01;
  opacity: 0;
  transition: opacity .25s ease;
}

.thumbnail-corporate {
  position: relative;
  overflow: hidden;
}

.thumbnail-corporate-image {
  display: block;
  width: 100%;
  transition: transform .5s ease, filter .35s ease;
  transform: scale(1);
}

.thumbnail-corporate:hover .thumbnail-corporate-image {
  transform: scale(1.08);
  filter: brightness(1.04);
}

.thumbnail-corporate:hover .thumbnail-corporate-overlay {
  background: rgba(0,0,0,.15);
}

/* Hauteur un peu plus généreuse */
.section-overlap {
  min-height: 520px;
}

/* Header */
.rd-navbar{
    background: #ebecf014;
}

.rd-navbar-main-outer{
    background: #eff0f661;
}

.rd-navbar-fixed .rd-navbar-panel {
    background: #eff0f661;
}

@media (min-width: 1200px) {
  .rd-navbar-minimal.rd-navbar-static .rd-navbar-main {
    padding: 10px 0 30px 0;
  }
}

.rd-navbar-minimal.rd-navbar-static .rd-navbar-brand img {
  width: auto;
  height: auto;
  max-width: 280px;
  max-height: 200px;
}

/* Slider plein espace image */
.section-overlap-carousel,
.section-overlap-carousel .carousel-inner,
.section-overlap-carousel .carousel-item {
  height: 100%;
}

.section-overlap-carousel .carousel-item {
  background-size: cover;
  background-position: center center;
}

.section-overlap-image::after {
  content: '';
  position: absolute;
  top: 0;
  left: 60%;
  width: 40%;
  height: 100%;
  pointer-events: none;
  z-index: 2;
  background: url('../images/back2.png') no-repeat left center;
  background-size: cover;
}

 /* ====== Carte Revendeurs ====== */
 :root {
   --black: #000000;
   --white: #ffffff;
   --gold: #a76b01;
 }

 .map-wrapper {
   display: flex;
   flex-direction: column;
   gap: 10px;
   padding: 20px;
   max-width: 1400px;
   margin: 0 auto;
 }

 .map-wrapper h2 {
   font-size: 24px;
   font-weight: 600;
   color: var(--black);
   margin-bottom: 5px;
 }

 .subtitle {
   font-size: 14px;
   color: #555;
   margin-bottom: 12px;
 }

 #filters {
   display: flex;
   flex-wrap: wrap;
   align-items: center;
   gap: 14px;
   padding: 10px 14px;
   border-radius: 999px;
   border: 1px solid #e0e0e0;
   background-color: var(--white);
   box-shadow: 0 4px 10px rgba(0,0,0,0.04);
 }

 #filters span.label {
   font-size: 13px;
   font-weight: 600;
   text-transform: uppercase;
   color: var(--black);
 }

 .filter-item {
   display: inline-flex;
   align-items: center;
   gap: 6px;
   font-size: 13px;
   cursor: pointer;
   padding: 6px 10px;
   border-radius: 999px;
   border: 1px solid transparent;
   transition: all .2s ease;
 }

 .filter-item:hover {
   border-color: var(--gold);
   background-color: #fff7e6;
 }

 #map {
   width: 100%;
   height: 80vh;
   border-radius: 18px;
   overflow: hidden;
   border: 1px solid #e5e5e5;
   box-shadow: 0 8px 30px rgba(0,0,0,0.06);
 }

 .custom-marker {
   width: 18px;
   height: 18px;
   border-radius: 50%;
   border: 2px solid var(--black);
   background-color: var(--gold);
   box-shadow: 0 0 6px rgba(0,0,0,0.4);
 }

 .marker-cluster div {
   background-color: var(--gold);
   color: var(--white);
   border-radius: 999px;
   border: 2px solid var(--black);
   font-weight: 700;
   font-size: 12px;
 }

 .leaflet-popup-content-wrapper {
   border-radius: 12px;
   border: 1px solid #eee;
 }

 .popup-title {
   font-weight: 700;
   font-size: 14px;
   color: var(--black);
   margin-bottom: 2px;
 }

 .popup-address {
   font-size: 12px;
   color: #555;
   margin-bottom: 4px;
 }

 .popup-brands {
   font-size: 11px;
   color: var(--gold);
   text-transform: uppercase;
   letter-spacing: 0.08em;
   font-weight: 600;
 }

 @media (max-width: 768px) {
   #map { height: 70vh; }
 }



/* Mobile / tablettes : on repasse l'image derrière pour éviter les soucis */
@media (max-width: 767.98px) {
  .section-overlap {
    padding: 40px 0;
    min-height: auto;
  }

  .section-overlap-image {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    height: 60vh;
  }

  .section-overlap-image::after {
    left: 50%;
    width: 50%;
    background-position: left center;
  }

  .section-overlap-content .container {
    margin-top: 40vh;
    background: rgba(255,255,255,0.96);
    padding: 20px 15px;
    border-radius: 4px;
  }
}

/* Mobiles (moins de 768px) */
@media (max-width: 767.98px) {
  .section-overlap-image::after {
    left: 0;
    top: auto;
    bottom: 0;
    width: 100%;
    height: 40%;
    background: linear-gradient(
      to bottom,
      rgba(255, 255, 255, 1) 0%,
      rgba(255, 255, 255, 0.9) 30%,
      rgba(255, 255, 255, 0) 100%
    );
  }
}


/* ========================
   Ajustements FynnSports
======================== */

/* ✅ Carte centrée, 70% largeur */
#carte-revendeurs {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}

#carte-revendeurs .subtitle {
  max-width: 70%;
  margin: 0 auto 1rem auto;
}

#map {
  width: 70%;
  height: 65vh;
  margin: 0 auto !important;
  border-radius: 18px;
  overflow: hidden;
  border: 1px solid #e5e5e5;
  box-shadow: 0 8px 30px rgba(0,0,0,0.06);
}

/* ✅ Mini ajustement du bloc filtres */
#filters {
  justify-content: center;
  margin-bottom: 1rem;
}

/* ✅ Blog : images carrées tronquées à 336x336 */
.post-classic-media img {
  width: 336px !important;
  height: 336px !important;
  object-fit: cover;      /* tronque sans déformer */
  object-position: center;
  border-radius: 8px;
}