/* DSG AUTO V22.5 — alignements & adaptation iPhone / iPad / PC 1440p+ */
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{overflow-x:hidden;overflow-x:clip}
img,video,iframe,svg{max-width:100%}
button,input,select,textarea{font-family:inherit}

/* Encoche / Dynamic Island / iPad paysage */
.topbar .wrap,.wrap{padding-left:env(safe-area-inset-left);padding-right:env(safe-area-inset-right)}
.footer{padding-bottom:calc(28px + env(safe-area-inset-bottom))}

/* ── Fiche véhicule : bloc « Services » ── */
.service-strip{grid-template-columns:repeat(auto-fit,minmax(min(100%,230px),1fr))!important;align-items:stretch}
.service-mini,.service-mini:visited{
  -webkit-appearance:none;appearance:none;
  display:flex!important;flex-direction:column;justify-content:center;align-items:center;gap:3px;
  width:100%;min-height:78px;margin:0;
  text-align:center!important;color:#fff!important;font:inherit;line-height:1.35;
  text-decoration:none;cursor:pointer;-webkit-tap-highlight-color:transparent;
}
.service-mini strong{display:block;color:inherit!important;font-size:.95rem;margin:0}
.service-mini span{display:block;color:#b4b7bf!important;font-size:.8rem}
#serviceTestDrive{text-align:center!important}

/* ── Pied de page ── */
.footer .wrap{align-items:center}
.footer a{text-decoration:none;font-weight:700;color:#fff}
@media(max-width:600px){
  .footer .wrap{flex-direction:column;text-align:center;gap:8px;font-size:.88rem}
  /* le dock flottant (appel / assistant / WhatsApp) ne doit pas masquer le contenu */
  body{padding-bottom:calc(84px + env(safe-area-inset-bottom))}
  .section-head h2{font-size:1.45rem}
  .desc-items{grid-template-columns:1fr!important}
}

/* ── iPad / tablettes ── */
@media(min-width:601px) and (max-width:1100px){
  .wrap{width:min(100% - 40px,1220px)}
  .hero{grid-template-columns:1fr!important}
  .panel{position:static!important}
  .desc-items{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}

/* ── Grands écrans PC (1440p, 4K) ── */
@media(min-width:1600px){
  .wrap{width:min(1480px,calc(100% - 96px))}
  .hero{grid-template-columns:minmax(0,1.4fr) minmax(400px,.6fr)}
}
@media(min-width:2200px){
  html{font-size:112.5%}
  .wrap{width:min(1760px,calc(100% - 160px))}
}