/* Pages hors accueil (DTC & homologation, Par référence, contact, Mon compte,
   fiches, pages texte) habillées comme l'accueil Comptoir : même en-tête,
   mêmes polices, mêmes couleurs (demande de Miguel, 12.10.2026). Posé par
   appliquer-comptoir.py (comme_accueil). Sélecteurs préfixés par `body` pour
   l'emporter sur styles.css, legacy-light.css et fiche-produit.css quel que
   soit l'ordre de chargement. Valeurs reprises de comptoir-clair/style.css et
   accueil.css (body[data-home]). */
body{background:var(--sp-papier)!important}
body,body .page-texte{--nuit:var(--sp-papier)}
body .page-texte{background:transparent}

/* En-tête : identique à celui de l'accueil (logo, menu, « Mon panier »). */
body .barre{position:sticky;top:0;z-index:12;box-sizing:border-box;display:flex;flex-wrap:nowrap;align-items:center;justify-content:space-between;gap:24px;height:80px;max-width:1440px;margin:0 auto;padding:0 4%;background:var(--sp-papier);color:var(--sp-encre);border:0;box-shadow:none;font:15px/normal var(--sp-police-texte);letter-spacing:0;text-transform:none}
body .barre .marque{display:flex;align-items:center;font-size:inherit;letter-spacing:normal}
body .barre a.logo-sp{font:800 25px/1 var(--sp-police-titre);letter-spacing:-1px;color:var(--sp-encre);text-transform:none}
body .barre a.logo-sp span{color:var(--sp-foret);font-weight:700}
/* Le choix du véhicule se fait sur l'accueil (garage) ; l'en-tête n'en a pas. */
body .barre .veh-switch{display:none}
body .barre .nav-sp{order:0;flex:0 1 auto;display:flex;align-items:center;gap:25px;height:100%;margin:0;padding:0;overflow:visible;font:13px/normal var(--sp-police-texte);letter-spacing:0;text-transform:none}
body .barre .nav-sp a{display:flex;align-items:center;height:100%;padding:0;color:var(--sp-encre);white-space:normal}
body .barre .nav-sp a:hover{color:var(--sp-foret)}
body .barre .nav-sp a[aria-current="page"]{color:var(--sp-foret)}
body .barre .btn-panier{display:block!important;flex:none;margin:0;padding:12px 16px;border:1px solid var(--sp-ligne);border-radius:7px;background:var(--sp-blanc);color:var(--sp-encre);font:13px/normal var(--sp-police-texte);letter-spacing:0;text-transform:none;text-decoration:none;white-space:nowrap;box-shadow:none;transform:none;transition:none}
body .barre .btn-panier:hover{color:var(--sp-foret);border-color:var(--sp-ligne)}
body .barre .btn-panier b,body .barre .btn-panier[data-vide="1"] b{display:inline;min-width:0;margin-left:6px;padding:3px 7px;border-radius:4px;background:var(--sp-craie);color:inherit;font:700 11px/normal var(--sp-police-texte);letter-spacing:0}
body .servicebar{display:flex;justify-content:space-between;gap:20px;padding:9px 4%;border-top:1px solid var(--sp-ligne);border-bottom:1px solid var(--sp-ligne);background:var(--sp-papier);color:var(--sp-gris);font:11px/normal var(--sp-police-texte)}
body .servicebar i{margin:0 13px;font-style:normal}
@media(min-width:1450px){
  body .barre{padding-left:max(4%,calc((100% - 1325px)/2));padding-right:max(4%,calc((100% - 1325px)/2))}
  body .servicebar{padding-left:max(4%,calc((100vw - 1325px)/2));padding-right:max(4%,calc((100vw - 1325px)/2))}
}
@media(max-width:1100px){body .barre .nav-sp{gap:15px;font-size:12px}}
/* Téléphone et tablette : logo et panier comme sur l'accueil ; le menu passe
   sur une ligne défilante (l'accueil a sa barre du bas, pas ces pages). */
@media(max-width:850px){
  body .barre{height:auto;flex-wrap:wrap;row-gap:0}
  body .barre .marque{min-height:70px}
  body .barre .nav-sp{order:4;flex:1 0 100%;height:44px;gap:20px;font-size:13px;overflow-x:auto;scrollbar-width:none}
  body .barre .nav-sp::-webkit-scrollbar{display:none}
  body .barre .nav-sp a{white-space:nowrap}
}
@media(max-width:700px){
  body .barre{padding:0 18px;column-gap:10px}
  body .barre .btn-panier{padding:9px;font-size:11px}
  body .servicebar{padding:9px 18px;font-size:10px}
  body .servicebar span+span{display:none}
}
@media(max-width:600px){
  body .barre{padding:0 20px}
  body .barre .btn-panier{padding:9px 10px}
  body .barre a.logo-sp{font-size:22px;letter-spacing:-1px}
  body .barre a.logo-sp i{font-size:27px;margin-left:7px}
  body .servicebar{display:block;padding:9px 20px}
}

/* Contenu : titres, italique vert olive et boutons comme sur l'accueil. */
@media(min-width:581px){body .documents-shop,body .ref-shop{max-width:1440px;padding-left:4%;padding-right:4%;box-sizing:border-box}}
body .document-hero h1,body .ref-hero h1{font-weight:500;letter-spacing:-.044em;line-height:1.08}
body .document-hero h1 em,body .ref-hero h1 em,body .page-texte h1 em{color:var(--sp-foret)}
body .document-button,body .ref-field button,body .ref-button,body .form-contact button,body .page-texte .cta-bloc a.bouton,body .bouton{background:var(--sp-foret)!important;border-color:var(--sp-foret)!important;color:var(--sp-blanc)!important;font-family:var(--sp-police-texte);font-weight:500;letter-spacing:0;text-transform:none;border-radius:6px}
body .document-button:hover,body .ref-field button:hover,body .ref-button:hover,body .form-contact button:hover,body .page-texte .cta-bloc a.bouton:hover,body .bouton:hover{background:var(--sp-foret-fonce)!important;border-color:var(--sp-foret-fonce)!important}
/* Encart sombre « document sur demande » : bouton clair, lisible sur le fond. */
body .document-request .document-button{background:#d6b978!important;border-color:#d6b978!important;color:var(--sp-encre)!important}
body .document-request .document-button:hover{background:#f0d69c!important;border-color:#f0d69c!important}
body #document-families button:hover{border-color:var(--sp-foret);color:var(--sp-foret)}
body #document-families button[aria-pressed=true]{background:var(--sp-foret);border-color:var(--sp-foret);color:var(--sp-blanc)}
body .document-hero-card a,body .document-cart-link{color:var(--sp-foret);border-bottom-color:var(--sp-foret);font:500 13px var(--sp-police-texte);letter-spacing:0}
body .ref-card h2 a:hover,body .ref-vehicles a:hover,body .ref-other button,body .ref-vehicles summary{color:var(--sp-foret)}
body .ref-vehicles a:hover{border-color:var(--sp-foret)}
body .documents-shop :focus-visible,body .ref-field input:focus,body .ref-request input:focus,body .ref-request textarea:focus{outline-color:var(--sp-foret)}
body .page-texte p a,body .page-texte li a,body .page-texte dd a{color:var(--sp-foret)}
body .form-contact label{font-family:var(--sp-police-texte);font-size:13px;font-weight:500;letter-spacing:0;text-transform:none}
body .form-contact input,body .form-contact select,body .form-contact textarea{border:1px solid #CAD0D5;border-radius:7px;background:#faf9f6;padding:12px 13px;font-family:var(--sp-police-texte);font-size:16px}
body .form-contact button{font-size:15px;padding:14px 22px;border-radius:7px}

/* Pied de page : polices de l'accueil (plus de chasse fixe en capitales). */
body .pied-page{background:var(--sp-papier);color:var(--sp-gris);border-top:1px solid var(--sp-ligne);font-family:var(--sp-police-texte);font-size:12px;letter-spacing:0}
body .pied-page a{color:var(--sp-gris)}
body .pied-page a:hover{color:var(--sp-foret)}
body .pied-grille h5{font-family:var(--sp-police-mono);font-weight:500;font-size:10px;letter-spacing:1.7px;text-transform:uppercase;color:var(--sp-bronze)}
body .pied-grille a,body .pied-ident p{font-size:13px;letter-spacing:0}
body .pied-bas{font-size:11px;letter-spacing:0;border-top-color:var(--sp-ligne)}
body .paiements span{border-color:var(--sp-ligne);border-radius:4px;letter-spacing:0}
/* Conseil IA rangé dans le pied de page, comme sur l'accueil. */
body .pied-page .conseil-ia-ouvrir{position:static;display:inline-flex;align-items:center;gap:9px;box-shadow:none;border:1px solid var(--sp-ligne);border-radius:6px;padding:10px 13px;background:var(--sp-blanc);color:var(--sp-encre);font:12px var(--sp-police-texte);letter-spacing:0;text-transform:none;white-space:nowrap}
body .pied-page .conseil-ia-ouvrir span:first-child{color:var(--sp-bronze)}
body .pied-page .conseil-ia-ouvrir span:last-child{display:inline}
body .pied-page .conseil-ia-ouvrir:hover,body .pied-page .conseil-ia-ouvrir:focus-visible{background:var(--sp-craie);color:var(--sp-foret)}
body .pied-page .conseil-ia-ouvrir:hover span:first-child{color:var(--sp-foret)}

/* Bandeau cookies : même bouton « Accepter » que sur l'accueil. */
body #cookies-accepter{background:var(--sp-encre);color:var(--sp-papier)}