/* ===== Animations légères (site redesign) ===== */
@keyframes rise{from{opacity:0;transform:translateY(26px)}to{opacity:1;transform:none}}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
@keyframes stripeIn{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@keyframes pricePop{40%{transform:scale(1.07);color:#d71920}}
/* header */
.site-header{transition:box-shadow .3s}.site-header.scrolled{box-shadow:0 10px 30px #0000001a}
.site-header:after{transform-origin:left;animation:stripeIn .9s .1s cubic-bezier(.2,.7,.2,1) both}
.main-nav a:not(.nav-cta){position:relative}
.main-nav a:not(.nav-cta):after{content:"";position:absolute;left:0;right:0;bottom:-7px;height:2px;background:#d71920;transform:scaleX(0);transform-origin:left;transition:transform .3s cubic-bezier(.2,.7,.2,1)}
.main-nav a:not(.nav-cta):hover:after,.main-nav a.is-active:after{transform:scaleX(1)}
.scroll-progress{will-change:transform;position:fixed;left:0;top:0;height:3px;width:100%;background:#d71920;transform:scaleX(0);transform-origin:left;z-index:200;pointer-events:none}
/* hero */
.hero-image{overflow:hidden}
.hero-content>*{animation:rise .85s cubic-bezier(.2,.7,.2,1) both}
.hero-content>:nth-child(1){animation-delay:.15s}.hero-content>:nth-child(2){animation-delay:.3s}.hero-content>:nth-child(3){animation-delay:.48s}.hero-content>:nth-child(4){animation-delay:.62s}
.hero-foot,.hero-index{animation:fadeIn 1s 1.1s both}
/* boutons, cartes, photos */
.button,.nav-cta{transition:transform .25s,background .25s,color .25s,border-color .25s}
.button:hover,.nav-cta:hover{transform:translateY(-2px)}
.button span,.nav-cta span,.text-link span{display:inline-block;transition:transform .25s}
.button:hover span,.nav-cta:hover span,.text-link:hover span{transform:translate(3px,-3px)}
.vehicle-visual img,.sc-img img{transition:transform 1s cubic-bezier(.2,.7,.2,1)}
.vehicle-card:hover .vehicle-visual img,.sc:hover .sc-img img{transform:scale(1.05)}
.service-grid article{transition:transform .3s,background .3s}.service-grid article:hover{transform:translateY(-5px)}
.color-option{transition:transform .2s,border-color .2s}.color-option:hover{transform:translateY(-2px)}
.gamme-tabs button,.acc-tabs button{transition:background .2s,color .2s,border-color .2s,transform .2s}.gamme-tabs button:hover,.acc-tabs button:hover{transform:translateY(-1px)}
/* apparition au scroll (classes ajoutées puis retirées par animations.js) */
.rv{opacity:0;transform:translateY(28px);transition:opacity .7s cubic-bezier(.2,.7,.2,1),transform .7s cubic-bezier(.2,.7,.2,1)}
.rv.in{opacity:1;transform:none}
/* prix qui grimpe */
#summaryTotal,#summaryPrice,#summaryAccessoriesPrice{display:inline-block;transform-origin:right center}
.pop{animation:pricePop .55s ease}
/* ===== Barre Face / Côté / Arrière (photos du véhicule) ===== */
.gallery-views{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:12px}
.gallery-view{height:46px;padding:0 10px;border:1px solid #cfcdc7;border-radius:0;background:#fff;color:#171719;font:700 11px/1 Inter,sans-serif;letter-spacing:.9px;text-transform:uppercase;cursor:pointer;transition:background .2s,color .2s,border-color .2s,transform .2s}
.gallery-view:hover{border-color:#171719;color:#171719;box-shadow:none;transform:translateY(-1px)}
.gallery-view.is-active,.gallery-view.is-active:hover{background:#171719;border-color:#171719;color:#fff;box-shadow:inset 0 -3px 0 #d71920}
.gallery-view:focus-visible{outline:2px solid #d71920;outline-offset:2px}
/* ===== Pied de page : S.BEKE en blanc ===== */
.footer .sbeke-mark{color:#bdbdc0}.footer .sbeke-mark b{color:#fff}
/* ===== Carte Google Maps ===== */
.contact-section{overflow:hidden}
.contact-map{position:relative;display:block;width:100%;max-width:100%;box-sizing:border-box;margin-top:48px;border:1px solid #e3e1db;background:#e9e8e4;height:clamp(300px,36vw,450px)}
.contact-map iframe{position:absolute;inset:0;width:100%;height:100%;border:0;display:block}
@media(max-width:700px){.contact-map{height:320px;margin-top:32px}}
.stock-more{grid-column:1/-1;text-align:center;padding:14px 0 4px}
.sc,.accessory-card{contain:layout style}
@media(max-width:1280px){.main-nav{gap:18px}.nav-cta{padding-left:16px;padding-right:16px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}.rv{opacity:1;transform:none}}

/* ===== Bouton langue FR / EN ===== */
.lang-toggle{display:inline-flex;height:36px;padding:0;border:1px solid #cfcdc7;background:#fff;cursor:pointer;font:700 11px/1 Inter,sans-serif;letter-spacing:.8px;flex:0 0 auto}
.lang-toggle span{display:flex;align-items:center;padding:0 10px;color:#6b6b70;transition:background .2s,color .2s}
.lang-toggle span.on{background:#171719;color:#fff;box-shadow:inset 0 -3px 0 #d71920}
.lang-toggle:hover{border-color:#171719}
.accessory-ref{display:none}
@media(max-width:1280px){.lang-toggle span{padding:0 8px}}
/* ===== Mobile : la gamme ne dépasse plus de l'écran ===== */
.gamme-cell{min-width:0}
@media(max-width:700px){
  .gamme-row{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .gamme-cell{grid-template-columns:minmax(0,1fr);padding:12px 12px}
  .gamme-cell b{font-size:28px}
  .gamme-cell em{text-align:left;font-size:10px}
  .gamme-row>strong{font-size:22px}
}
/* ===== Mobile : les titres en rouge passent à la ligne au lieu de dépasser ===== */
@media(max-width:700px){h1 em,h2 em,h3 em{white-space:normal;overflow-wrap:anywhere}h1,h2{overflow-wrap:anywhere}}
@media(max-width:700px){body{overflow-x:clip}}

/* ===== Filtres du parc : menus longs (versions) ===== */
.stock-filters select{max-width:100%;text-overflow:ellipsis}#fVer{max-width:min(100%,380px)}
@media(max-width:700px){.stock-filters select{flex:1 1 calc(50% - 10px);min-width:0}#fVer{max-width:100%;flex-basis:100%}}
