/* =========================================================
   SB AUTO RELAIS — Harmonisation visuelle globale
   Base de référence : page Recherche
   ========================================================= */

:root{
  --sb-title-size: clamp(30px, 5.6vw, 56px);
  --sb-section-title-size: clamp(24px, 3.4vw, 34px);
  --sb-subtitle-size: 20px;
  --sb-title-line: 1.05;
  --sb-title-margin: 10px 0 12px;
  --sb-hero-padding: 64px 0 30px;
  --sb-section-padding: 54px 0;
  --sb-card-radius: 24px;
  --sb-card-shadow: 0 18px 45px rgba(11,27,52,.10);
}

html,
body{
  font-family: Montserrat, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif !important;
}

/* Ajustement : titres moins lourds visuellement */
/* Titres principaux : même taille et même rythme que Recherche */
h1,
.hero h1,
.annonces-hero h1,
main.container > h1,
.about h1{
  font-family: Montserrat, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif !important;
  font-size: var(--sb-title-size) !important;
  line-height: var(--sb-title-line) !important;
  margin: var(--sb-title-margin) !important;
  color: var(--navy, #0B1B34) !important;
  font-weight: 800 !important;
  letter-spacing: -.035em !important;
  max-width: 960px !important;
  text-wrap: balance;
}

h1::after,
.hero h1::after,
.annonces-hero h1::after,
main.container > h1::after{
  content: "";
  display: block;
  width: min(160px, 42vw);
  height: 6px;
  margin-top: 18px;
  border-radius: 999px;
  background: linear-gradient(90deg, var(--gold, #f9c121), rgba(249,193,33,0));
}

/* Titres de section uniformes */
h2,
.h2,
section .container > h2,
.card h2,
.form h2{
  font-family: Montserrat, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif !important;
  font-size: var(--sb-section-title-size) !important;
  line-height: 1.15 !important;
  margin: 0 0 16px !important;
  color: var(--navy, #0B1B34) !important;
  font-weight: 800 !important;
  letter-spacing: -.024em !important;
  text-wrap: balance;
}

h3,
.card h3,
.group h3,
.vehicle-detail h3,
.price-card h3{
  font-family: Montserrat, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif !important;
  font-size: var(--sb-subtitle-size) !important;
  line-height: 1.22 !important;
  margin: 0 0 12px !important;
  color: var(--navy, #0B1B34) !important;
  font-weight: 700 !important;
  letter-spacing: -.012em !important;
}

p.lead,
.lead,
.hero p,
.annonces-hero p{
  font-size: 18px !important;
  line-height: 1.6 !important;
  color: #475569 !important;
  max-width: 860px !important;
  margin: 0 !important;
}

/* Bannières de page : même hauteur et aucun cadre, bulles conservées */
.hero,
section.hero,
.annonces-hero{
  position: relative !important;
  padding: var(--sb-hero-padding) !important;
  margin: 0 !important;
  border: 0 !important;
  border-bottom: 1px solid rgba(11,27,52,.08) !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  isolation: isolate !important;
}

.hero::before,
section.hero::before,
.annonces-hero::before{
  border: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
}

.hero .container,
.annonces-hero .container{
  position: relative !important;
}

.badges,
.hero .badges{
  display: flex !important;
  gap: 10px !important;
  flex-wrap: wrap !important;
  margin-bottom: 10px !important;
}

.pill,
.tag,
.badge,
.status-badge,
.macaron,
.annonces-hero .eyebrow{
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  border-radius: 999px !important;
  padding: 6px 10px !important;
  font-size: 12px !important;
  line-height: 1.2 !important;
  font-weight: 900 !important;
  letter-spacing: .04em !important;
  text-transform: uppercase !important;
}

/* Sections et blocs */
section,
section.form-section{
  padding: var(--sb-section-padding) !important;
}

.card,
.price-card,
.step,
.group,
.filters,
.toolbar,
.form-top,
.form-body,
.vehicle-detail,
.vehicle-highlight,
.cta-band,
aside.card,
main.container > .card{
  border-radius: var(--sb-card-radius) !important;
  border: 1px solid rgba(11,27,52,.09) !important;
  box-shadow: var(--sb-card-shadow) !important;
}

.card,
.group,
aside.card,
main.container > .card{
  padding: 18px !important;
}

/* Boutons : hauteur, arrondi et graisse homogènes */
.btn,
.btn-primary,
.btn-outline,
.btn-gold,
.btn.primary,
button.btn,
a.btn{
  min-height: 46px !important;
  border-radius: 999px !important;
  padding: 12px 18px !important;
  font-family: Montserrat, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif !important;
  font-weight: 900 !important;
  letter-spacing: -.01em !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
}

/* Champs de formulaire et filtres */
input,
select,
textarea,
.filters input,
.filters select,
.form input,
.form select,
.form textarea{
  min-height: 46px !important;
  border-radius: 16px !important;
  font-family: Montserrat, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif !important;
}

label{
  color: var(--navy, #0B1B34) !important;
  font-weight: 900 !important;
}

/* Pages fiche véhicule : titre harmonisé sans casser la galerie */
main.container{
  width: 100% !important;
}

main.container > a.muted:first-child{
  margin-top: 18px !important;
  margin-bottom: 10px !important;
}

main.container > .badges{
  margin-top: 2px !important;
  margin-bottom: 14px !important;
}

.price{
  font-size: clamp(22px, 2.6vw, 28px) !important;
  font-weight: 900 !important;
}

/* Cartes annonces : textes et rythmes plus homogènes */
.card .title,
.vehicle-card .title,
.item-title{
  font-size: 20px !important;
  line-height: 1.2 !important;
  font-weight: 800 !important;
  color: var(--navy, #0B1B34) !important;
}

.meta,
.desc,
.muted,
.card p,
.group p{
  line-height: 1.58 !important;
}

/* Footer uniforme */
footer{
  margin-top: 0 !important;
}

.footer-grid{
  align-items: center !important;
}

/* Mobile : conserver la compatibilité téléphone */
@media (max-width: 860px){
  :root{
    --sb-title-size: clamp(30px, 9.2vw, 44px);
    --sb-section-title-size: clamp(24px, 7vw, 32px);
    --sb-hero-padding: 58px 0 30px;
    --sb-section-padding: 42px 0;
  }

  h1,
  .hero h1,
  .annonces-hero h1,
  main.container > h1{
    letter-spacing: -.032em !important;
  }

  p.lead,
  .lead,
  .hero p,
  .annonces-hero p{
    font-size: 16px !important;
  }

  .btn,
  .btn-primary,
  .btn-outline,
  .btn-gold,
  .btn.primary,
  button.btn,
  a.btn{
    width: 100% !important;
  }

  .grid,
  .layout,
  .cards,
  .pricing,
  .steps,
  .filters{
    grid-template-columns: 1fr !important;
  }

  .card,
  .group,
  aside.card,
  main.container > .card{
    padding: 16px !important;
  }
}

@media (max-width: 480px){
  :root{
    --sb-title-size: clamp(28px, 10vw, 38px);
  }

  h1::after,
  .hero h1::after,
  .annonces-hero h1::after,
  main.container > h1::after{
    height: 5px;
    margin-top: 14px;
  }
}


/* Pages légales / confidentialité / à propos */
.legal-page{padding-top:54px!important;}
.legal-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;}
.legal-card p{margin:0 0 12px;color:#475569;line-height:1.65;}
.legal-card a{color:var(--navy,#0B1B34);font-weight:900;text-decoration:underline;text-decoration-color:rgba(249,193,33,.65);text-underline-offset:3px;}
.todo{display:inline-flex;align-items:center;border-radius:999px;padding:3px 9px;background:rgba(249,193,33,.18);color:#0B1B34;font-weight:900;}
.footer-grid .f-links{display:flex;gap:10px;justify-content:flex-end;flex-wrap:wrap;}
.footer-grid .f-links a{white-space:nowrap;}
.privacy-note{font-size:12px!important;color:#64748B!important;line-height:1.55!important;margin:10px 0 0!important;}
.privacy-note a{font-weight:900;text-decoration:underline;text-underline-offset:3px;}
@media (max-width:860px){.legal-grid{grid-template-columns:1fr}.footer-grid .f-links{justify-content:flex-start;}}


/* Menu mobile de secours pour les fiches véhicule */
.burger{display:none;border:1px solid var(--line,#E8EEF6);background:#fff;border-radius:10px;padding:8px 10px;font-size:20px;box-shadow:var(--shadow,0 8px 22px rgba(16,24,40,.08));}
.mobile-menu{display:none;position:absolute;top:68px;left:0;right:0;background:#ffffff;border-bottom:1px solid var(--line,#E8EEF6);box-shadow:0 12px 24px rgba(16,24,40,.08);padding:12px 16px;z-index:40;}
.mobile-menu a{display:block;padding:10px 4px;border-bottom:1px dashed var(--line,#E8EEF6);color:#0B1B34;font-weight:800;}
.mobile-menu a:last-child{border-bottom:0;}
@media (max-width:860px){.burger{display:inline-flex;align-items:center;justify-content:center}.nav-links{display:none!important}header nav{justify-content:space-between}}

/* Ajustements demandés : espace accueil, bulles annonces, rendu photo */
#mandataire .container > .lead{
  margin-bottom: 32px !important;
}
#mandataire .container > .lead + .cards{
  margin-top: 0 !important;
}

/* Annonces : badges et boutons plus discrets */
body:has(.annonces-content) .price,
.annonces-content .price,
.annonces-content .pricegold,
.card .price,
.vehicle-card .price{
  font-size: 14px !important;
  line-height: 1.1 !important;
  padding: 5px 9px !important;
  border-radius: 7px !important;
  box-shadow: 0 8px 18px rgba(213,173,53,.18) !important;
}

.annonces-content .actions{
  gap: 8px !important;
  padding: 0 14px 13px !important;
}
.annonces-content .actions .btn,
.annonces-content .btn-primary,
.annonces-content .btn-outline{
  font-size: 13px !important;
  line-height: 1.15 !important;
  padding: 9px 10px !important;
  border-radius: 6px !important;
  gap: 6px !important;
  min-height: 38px !important;
}

/* Rendu visuel des photos : plus net et légèrement plus contrasté sans changer la mise en page */
.annonces-content .media img,
.vehicle-gallery img,
.gallery img,
.detail-media img,
.main-photo img,
.thumbs img{
  image-rendering: auto !important;
  filter: contrast(1.045) saturate(1.04) brightness(1.015) !important;
  transform: translateZ(0) scale(1.01) !important;
  backface-visibility: hidden !important;
}

@media (max-width: 680px){
  #mandataire .container > .lead{
    margin-bottom: 24px !important;
  }
  .annonces-content .actions{
    gap: 7px !important;
  }
  .annonces-content .actions .btn,
  .annonces-content .btn-primary,
  .annonces-content .btn-outline{
    width: auto !important;
    flex: 1 1 0 !important;
    font-size: 12.5px !important;
    padding: 9px 8px !important;
  }
  .annonces-content .price,
  .annonces-content .pricegold{
    font-size: 13px !important;
    padding: 5px 8px !important;
  }
}

/* Garder les boutons des cartes annonce côte à côte sur mobile/tablette */
.annonces-content .actions .btn{
  width: auto !important;
  flex: 1 1 0 !important;
}

/* Ajustement aperçu photos : recentrage manuel par véhicule/photo */
.annonces-content .media img,
.gallery-main img,
.thumb-grid img,
.vehicle-gallery img,
.gallery img,
.detail-media img,
.main-photo img,
.thumbs img{
  object-position: center center !important;
}

/* Peugeot 3008 : cadrage des aperçus sur le véhicule */
.annonces-content .media img[src*="3008-1"],
.gallery img[src*="3008-1"],
.gallery-main img[src*="3008-1"],
.thumb-grid img[src*="3008-1"]{
  object-position: center 56% !important;
}
.annonces-content .media img[src*="3008-2"],
.gallery img[src*="3008-2"],
.gallery-main img[src*="3008-2"],
.thumb-grid img[src*="3008-2"]{
  object-position: center 68% !important;
}
.annonces-content .media img[src*="3008-3"],
.gallery img[src*="3008-3"],
.gallery-main img[src*="3008-3"],
.thumb-grid img[src*="3008-3"]{
  object-position: center 64% !important;
}

/* Toyota RAV4 : aperçu davantage centré sur le véhicule */
.annonces-content .media img[src*="rav4-1"],
.gallery img[src*="rav4-1"],
.gallery-main img[src*="rav4-1"],
.thumb-grid img[src*="rav4-1"]{
  object-position: center 72% !important;
}

@media (max-width: 680px){
  .annonces-content .media img,
  .gallery-main img,
  .thumb-grid img{
    object-position: center 62% !important;
  }
  .annonces-content .media img[src*="3008-1"],
  .gallery img[src*="3008-1"],
  .gallery-main img[src*="3008-1"],
  .thumb-grid img[src*="3008-1"]{
    object-position: center 55% !important;
  }
  .annonces-content .media img[src*="3008-2"],
  .gallery img[src*="3008-2"],
  .gallery-main img[src*="3008-2"],
  .thumb-grid img[src*="3008-2"]{
    object-position: center 70% !important;
  }
  .annonces-content .media img[src*="3008-3"],
  .gallery img[src*="3008-3"],
  .gallery-main img[src*="3008-3"],
  .thumb-grid img[src*="3008-3"]{
    object-position: center 66% !important;
  }
  .annonces-content .media img[src*="rav4-1"],
  .gallery img[src*="rav4-1"],
  .gallery-main img[src*="rav4-1"],
  .thumb-grid img[src*="rav4-1"]{
    object-position: center 72% !important;
  }
}



/* Aperçu annonces façon publication Instagram : photo visible entièrement */
.annonces-content .media{
  aspect-ratio: 1 / 1 !important;
  height: auto !important;
  background: #F4F6F9 !important;
  overflow: hidden !important;
}
.annonces-content .media img{
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
  object-position: center center !important;
  background: #F4F6F9 !important;
  transform: translateZ(0) !important;
}
.annonces-content .card:hover .media img{
  transform: translateZ(0) scale(1.01) !important;
}
.annonces-content .media::after{
  pointer-events: none !important;
}
@media (max-width: 680px){
  .annonces-content .media{
    aspect-ratio: 1 / 1 !important;
    height: auto !important;
  }
  .annonces-content .media img{
    object-fit: contain !important;
    object-position: center center !important;
  }
}

/* Illustrations légères ajoutées aux pages principales */
.hero .container.sb-hero-visual,
section.hero .container.sb-hero-visual{
  display: grid !important;
  grid-template-columns: minmax(0, 1.35fr) minmax(220px, .65fr) !important;
  gap: clamp(18px, 4vw, 34px) !important;
  align-items: center !important;
}
.sb-hero-copy{min-width:0;}
.sb-page-visual{
  width: min(330px, 100%) !important;
  margin: 0 !important;
  justify-self: end !important;
  position: relative !important;
  border-radius: 28px !important;
  isolation: isolate !important;
}
.sb-page-visual::before{
  content:"";
  position:absolute;
  inset: 10% -4% -4% 7%;
  border-radius: 32px;
  background: radial-gradient(circle at 78% 16%, rgba(249,193,33,.26), transparent 38%), linear-gradient(135deg, rgba(11,27,52,.06), rgba(249,193,33,.08));
  z-index:-1;
}
.sb-page-visual img{
  display:block !important;
  width:100% !important;
  height:auto !important;
  max-height: 255px !important;
  object-fit: contain !important;
  filter: drop-shadow(0 18px 32px rgba(11,27,52,.12));
}
@media (max-width: 860px){
  .hero .container.sb-hero-visual,
  section.hero .container.sb-hero-visual{
    grid-template-columns: 1fr !important;
  }
  .sb-page-visual{
    justify-self: center !important;
    width: min(245px, 74vw) !important;
    margin-top: 8px !important;
  }
  .sb-page-visual img{max-height: 190px !important;}
}
@media (max-width: 480px){
  .sb-page-visual{width: min(215px, 72vw) !important;}
  .sb-page-visual img{max-height: 165px !important;}
}

/* Correction menu mobile centralisé : bouton visible + panneau lisible sur téléphone */
header{
  position: sticky !important;
  top: 0 !important;
  z-index: 9999 !important;
}
header nav{
  position: relative !important;
  gap: 14px !important;
}
.burger{
  display: none !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  min-width: 92px !important;
  min-height: 44px !important;
  padding: 10px 14px !important;
  border-radius: 999px !important;
  border: 1px solid rgba(11,27,52,.12) !important;
  background: linear-gradient(135deg, var(--gold, #f9c121), #ffe28a) !important;
  color: var(--navy, #0B1B34) !important;
  font-family: Montserrat, system-ui, sans-serif !important;
  font-size: 14px !important;
  font-weight: 800 !important;
  line-height: 1 !important;
  box-shadow: 0 12px 26px rgba(11,27,52,.14) !important;
  cursor: pointer !important;
  z-index: 10002 !important;
}
.burger-lines{
  width: 18px !important;
  height: 14px !important;
  display: inline-flex !important;
  flex-direction: column !important;
  justify-content: space-between !important;
  flex: 0 0 auto !important;
}
.burger-lines span{
  display: block !important;
  height: 2px !important;
  width: 100% !important;
  border-radius: 999px !important;
  background: currentColor !important;
}
.burger[aria-expanded="true"] .burger-lines span:nth-child(1){transform: translateY(6px) rotate(45deg) !important;}
.burger[aria-expanded="true"] .burger-lines span:nth-child(2){opacity:0 !important;}
.burger[aria-expanded="true"] .burger-lines span:nth-child(3){transform: translateY(-6px) rotate(-45deg) !important;}
.burger-lines span{transition: transform .22s ease, opacity .18s ease !important;}
.mobile-menu-backdrop{
  position: fixed !important;
  inset: 0 !important;
  z-index: 9997 !important;
  background: rgba(11,27,52,.34) !important;
  backdrop-filter: blur(2px) !important;
  opacity: 0 !important;
  transition: opacity .18s ease !important;
}
.mobile-menu-backdrop.is-open{opacity:1 !important;}
.mobile-menu{
  position: fixed !important;
  top: 84px !important;
  left: 14px !important;
  right: 14px !important;
  z-index: 10001 !important;
  display: none !important;
  flex-direction: column !important;
  gap: 6px !important;
  padding: 14px !important;
  max-height: calc(100vh - 104px) !important;
  overflow-y: auto !important;
  border: 1px solid rgba(11,27,52,.10) !important;
  border-radius: 22px !important;
  background: rgba(255,255,255,.98) !important;
  box-shadow: 0 28px 72px rgba(11,27,52,.24) !important;
  transform: translateY(-8px) scale(.985) !important;
  opacity: 0 !important;
  transition: transform .18s ease, opacity .18s ease !important;
}
.mobile-menu:not([hidden]),
.mobile-menu.is-open{
  display: flex !important;
  opacity: 1 !important;
  transform: translateY(0) scale(1) !important;
}
.mobile-menu a{
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  min-height: 46px !important;
  padding: 12px 14px !important;
  border: 1px solid rgba(11,27,52,.08) !important;
  border-radius: 16px !important;
  background: #fff !important;
  color: var(--navy, #0B1B34) !important;
  font-weight: 800 !important;
  text-decoration: none !important;
}
.mobile-menu a.is-active{
  background: rgba(249,193,33,.18) !important;
  border-color: rgba(249,193,33,.52) !important;
}
body.sb-menu-open{
  overflow: hidden !important;
}
@media (max-width: 980px){
  .nav-links{display:none !important;}
  .burger{display:inline-flex !important;}
  header nav{justify-content:space-between !important;}
}
@media (max-width: 560px){
  .burger{
    min-width: 82px !important;
    min-height: 42px !important;
    padding: 9px 12px !important;
    font-size: 13px !important;
  }
  .mobile-menu{
    top: 76px !important;
    left: 10px !important;
    right: 10px !important;
    max-height: calc(100vh - 90px) !important;
    border-radius: 18px !important;
  }
}

/* Harmonisation finale : illustrations mobiles, rythme texte et confort visuel */
:root{
  --sb-card-shadow: 0 14px 34px rgba(11,27,52,.08) !important;
  --sb-card-radius: 22px !important;
}

/* Illustrations : présence plus discrète, surtout sur téléphone */
.sb-page-visual{
  width: min(285px, 100%) !important;
}
.sb-page-visual::before{
  inset: 13% 2% 0 12% !important;
  opacity: .72 !important;
}
.sb-page-visual img{
  max-height: 215px !important;
  filter: drop-shadow(0 12px 22px rgba(11,27,52,.10)) !important;
}

/* Rythme plus uniforme entre les pages */
.hero,
section.hero,
.annonces-hero{
  padding-top: clamp(42px, 6vw, 62px) !important;
  padding-bottom: clamp(24px, 4vw, 34px) !important;
}
.card,
.group,
.price-card,
.step,
.vehicle-highlight{
  box-shadow: var(--sb-card-shadow) !important;
}
p.lead,
.lead,
.hero p,
.annonces-hero p{
  max-width: 790px !important;
}
.pill,
.tag,
.badge,
.status-badge,
.macaron{
  font-weight: 800 !important;
  letter-spacing: .035em !important;
}
.btn,
.btn-primary,
.btn-outline,
.btn-gold,
.btn.primary,
button.btn,
a.btn{
  font-weight: 800 !important;
}

/* Menu mobile : icône seule, plus compacte */
.burger{
  min-width: 46px !important;
  width: 46px !important;
  padding: 0 !important;
  gap: 0 !important;
}
.burger-text{
  display: none !important;
}
.burger-lines{
  width: 19px !important;
  height: 15px !important;
}

@media (max-width: 860px){
  .hero .container.sb-hero-visual,
  section.hero .container.sb-hero-visual{
    gap: 12px !important;
  }
  .sb-page-visual{
    width: min(170px, 46vw) !important;
    margin-top: 2px !important;
  }
  .sb-page-visual::before{
    inset: 16% 4% 4% 16% !important;
    border-radius: 24px !important;
    opacity: .58 !important;
  }
  .sb-page-visual img{
    max-height: 125px !important;
  }
}

@media (max-width: 480px){
  .hero,
  section.hero,
  .annonces-hero{
    padding-top: 34px !important;
    padding-bottom: 22px !important;
  }
  .sb-page-visual{
    width: min(138px, 40vw) !important;
    margin-top: 0 !important;
  }
  .sb-page-visual img{
    max-height: 102px !important;
  }
  p.lead,
  .lead,
  .hero p,
  .annonces-hero p{
    font-size: 15.5px !important;
    line-height: 1.55 !important;
  }
}

/* Estimation : couleur des numéros Véhicule / Détails / Contact */
.estimation-section .progress .prog .n{
  background: #0B1B34 !important;
  color: #f9c121 !important;
  border: 1px solid rgba(249,193,33,.55) !important;
  box-shadow: 0 6px 14px rgba(11,27,52,.12) !important;
}
.estimation-section .progress .prog.active .n{
  background: #f9c121 !important;
  color: #0B1B34 !important;
  border-color: #f9c121 !important;
}

/* Annonces : photos uniformes dans la zone carrée dédiée */
.annonces-content .media{
  aspect-ratio: 1 / 1 !important;
  height: auto !important;
  background: #F4F6F9 !important;
  overflow: hidden !important;
}
.annonces-content .media img{
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center center !important;
  display: block !important;
  background: #F4F6F9 !important;
  transform: translateZ(0) !important;
}
.annonces-content .card:hover .media img{
  transform: translateZ(0) scale(1.02) !important;
}
.annonces-content .media .placeholder{
  width: 100% !important;
  height: 100% !important;
  display: grid !important;
  place-items: center !important;
}
@media (max-width: 680px){
  .annonces-content .media{
    aspect-ratio: 1 / 1 !important;
    height: auto !important;
  }
  .annonces-content .media img{
    object-fit: cover !important;
    object-position: center center !important;
  }
}

/* Fiches véhicule : miniatures carrées uniformes, sans toucher à la grande photo */
.thumbs button,
.thumb-grid button,
.thumb-grid .thumb{
  aspect-ratio: 1 / 1 !important;
}
.thumbs img,
.thumb-grid img{
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center center !important;
}

/* Ajustement annonces : zone photo moins haute + image qui remplit le cadre */
.annonces-content .media{
  aspect-ratio: 4 / 3 !important;
  height: auto !important;
  min-height: 0 !important;
  background: #F4F6F9 !important;
  overflow: hidden !important;
}
.annonces-content .media img{
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center center !important;
  display: block !important;
  transform: scale(1.04) translateZ(0) !important;
  transform-origin: center center !important;
}
.annonces-content .card:hover .media img{
  transform: scale(1.07) translateZ(0) !important;
}
@media (max-width: 680px){
  .annonces-content .media{
    aspect-ratio: 4 / 3 !important;
    max-height: 260px !important;
  }
  .annonces-content .media img{
    object-fit: cover !important;
    object-position: center center !important;
    transform: scale(1.05) translateZ(0) !important;
  }
}

/* Correction définitive annonces : zone carrée remplie correctement */
body .annonces-content .card .media,
body .annonces-content .media{
  position: relative !important;
  display: block !important;
  width: 100% !important;
  aspect-ratio: 1 / 1 !important;
  height: auto !important;
  max-height: none !important;
  min-height: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  background: #f4f6f9 !important;
  border-radius: 0 !important;
}
body .annonces-content .card .media > img,
body .annonces-content .media > img{
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  max-height: none !important;
  display: block !important;
  object-fit: cover !important;
  object-position: center top !important;
  transform: none !important;
  transform-origin: center center !important;
  background: #f4f6f9 !important;
}
body .annonces-content .card:hover .media > img,
body .annonces-content .media:hover > img{
  transform: scale(1.015) !important;
}
body .annonces-content .media .placeholder{
  position:absolute !important;
  inset:0 !important;
  width:100% !important;
  height:100% !important;
  display:grid !important;
  place-items:center !important;
}
@media (max-width: 680px){
  body .annonces-content .card .media,
  body .annonces-content .media{
    aspect-ratio: 1 / 1 !important;
    height: auto !important;
    max-height: none !important;
  }
  body .annonces-content .card .media > img,
  body .annonces-content .media > img{
    object-fit: cover !important;
    object-position: center top !important;
  }
}