/* Comptoir Clair — documents DTC et homologation. */
.documents-shop{max-width:1180px;margin:auto;padding:54px 24px 88px;color:var(--sp-encre)}
.document-hero{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(280px,.72fr);gap:clamp(28px,7vw,100px);align-items:end;padding:34px 0 62px;border-bottom:1px solid var(--sp-ligne)}
.eyebrow{margin:0 0 14px;color:var(--sp-bronze);letter-spacing:.16em;font:11px var(--mono);text-transform:uppercase}
.document-hero h1{margin:0;font:700 clamp(42px,6vw,76px)/.97 var(--display);letter-spacing:-.06em}.document-hero h1 em{color:var(--sp-bronze);font-family:var(--sp-police-accent);font-weight:400}
.documents-shop .intro{max-width:680px;margin:24px 0 0;color:var(--sp-gris);font-size:19px;line-height:1.6}
.document-steps{display:flex;flex-wrap:wrap;gap:10px 24px;margin-top:30px;color:var(--sp-gris);font-size:13px}.document-steps span{display:flex;gap:8px;align-items:center}.document-steps b{color:var(--sp-bronze);font:11px var(--mono)}
.document-hero-card{display:grid;gap:18px;padding:27px;background:var(--sp-craie);border:1px solid var(--sp-ligne);border-radius:12px}.document-hero-card p{margin:0;color:var(--sp-bronze);font:11px var(--mono);letter-spacing:.15em}.document-hero-card strong{font:600 28px/1.12 var(--display);letter-spacing:-.04em}.document-hero-card span{color:var(--sp-gris);font-size:14px;line-height:1.55}.document-hero-card a,.document-cart-link{width:max-content;color:var(--sp-encre);text-decoration:none;border-bottom:1px solid var(--sp-bronze);padding-bottom:3px;font:12px var(--mono);letter-spacing:.06em}.document-hero-card a:hover,.document-cart-link:hover{color:var(--sp-bronze)}
.document-browser{padding:58px 0 38px}.document-browser-head{display:flex;justify-content:space-between;gap:30px;align-items:end}.document-browser h2,.document-request h2{margin:0;font:600 clamp(27px,3vw,40px)/1.08 var(--display);letter-spacing:-.045em}.document-browser-head>div>p:last-child{max-width:610px;color:var(--sp-gris);line-height:1.6;margin:16px 0 0}.vehicle-label{display:grid;gap:8px;min-width:min(100%,330px);font:11px var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--sp-gris)}.documents-shop select{width:100%;min-height:50px;padding:0 14px;background:var(--sp-blanc);border:1px solid var(--sp-ligne);border-radius:7px;color:var(--sp-encre);font:14px var(--corps);letter-spacing:0;text-transform:none}.document-note{max-width:850px;margin:30px 0;color:var(--sp-gris);font-size:14px;line-height:1.65;padding:15px 17px;border-left:3px solid var(--sp-bronze);background:var(--sp-papier)}
#document-families{display:flex;flex-wrap:wrap;gap:8px;margin:28px 0 18px}#document-families button{padding:10px 14px;background:var(--sp-blanc);border:1px solid var(--sp-ligne);border-radius:999px;color:var(--sp-gris);font:13px var(--corps);cursor:pointer}#document-families button:hover{border-color:var(--sp-bronze);color:var(--sp-bronze)}#document-families button[aria-pressed=true]{background:var(--sp-bronze);border-color:var(--sp-bronze);color:var(--sp-blanc)}
#documents-count{margin:0 0 18px;color:var(--sp-gris);font-size:14px}.documents-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.document-card{display:flex;flex-direction:column;gap:13px;padding:23px;background:var(--sp-blanc);border:1px solid var(--sp-ligne);border-radius:10px;box-shadow:0 6px 20px #30362e08}.document-card h2{margin:0;color:var(--sp-encre);font:600 21px/1.25 var(--display);letter-spacing:-.025em}.document-card p{margin:0;color:var(--sp-gris);font-size:13.5px;line-height:1.55}.document-card .document-reference{color:var(--sp-bronze);font:11px var(--mono);letter-spacing:.04em}.document-tag{color:var(--sp-bronze);font:10px var(--mono);letter-spacing:.12em;text-transform:uppercase}.document-card strong{margin-top:auto;font:600 24px var(--display);letter-spacing:-.03em}.document-button{display:block;text-decoration:none;padding:13px 16px;border:1px solid var(--sp-bronze);border-radius:7px;background:var(--sp-bronze);color:var(--sp-blanc);font:13px var(--corps);cursor:pointer;text-align:center}.document-button:hover{background:var(--sp-bronze);border-color:var(--sp-bronze)}.document-card>a:not(.document-button){width:max-content;color:var(--sp-gris);font-size:12px}.document-card>a:not(.document-button):hover{color:var(--sp-bronze)}
.document-request{display:flex;justify-content:space-between;align-items:center;gap:32px;margin-top:24px;padding:34px;background:var(--sp-encre);color:var(--sp-blanc);border-radius:12px}.document-request .eyebrow{color:#d6b978}.document-request h2{color:var(--sp-blanc)}.document-request p:last-child{max-width:650px;margin:14px 0 0;color:var(--sp-ligne);line-height:1.6}.document-request .document-button{white-space:nowrap;background:#d6b978;border-color:#d6b978;color:var(--sp-encre)}.document-request .document-button:hover{background:#f0d69c;border-color:#f0d69c}.document-cart-link{display:block;margin-top:24px}.documents-shop :focus-visible{outline:2px solid var(--sp-bronze);outline-offset:4px}
@media(max-width:850px){.documents-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.document-hero{grid-template-columns:1fr}.document-hero-card{max-width:460px}.document-browser-head{align-items:start;flex-direction:column}}
@media(max-width:580px){.documents-shop{padding:28px 18px 62px}.document-hero{padding:18px 0 42px}.document-hero h1{font-size:48px}.documents-shop .intro{font-size:16px}.document-steps{display:grid;gap:10px}.document-browser{padding:42px 0 24px}.documents-grid{grid-template-columns:1fr}.document-card{padding:20px}.document-request{align-items:start;flex-direction:column;gap:22px;padding:26px}.document-request .document-button{width:100%}.vehicle-label{width:100%}}
/* Photos d'illustration, compteurs de familles et voiture choisie. */
.document-photo{position:relative;margin:0 0 4px;aspect-ratio:16/10;overflow:hidden;background:var(--sp-blanc);border:1px solid var(--sp-craie);border-radius:8px}
.document-photo img{width:100%;height:100%;object-fit:contain;padding:10px;box-sizing:border-box;transition:transform .35s ease}
.document-photo.is-car{background:var(--sp-papier)}.document-photo.is-car img{object-fit:cover;padding:0}
.document-card:hover .document-photo img{transform:scale(1.04)}
.document-photo figcaption{position:absolute;left:8px;bottom:8px;padding:3px 7px;background:#ffffffd9;border-radius:4px;color:#7a7f73;font:9.5px var(--mono);letter-spacing:.06em}
#document-families button span{margin-left:4px;color:#a3a698;font:11px var(--mono)}#document-families button[aria-pressed="true"] span{color:inherit;opacity:.8}
#document-families button.is-empty{opacity:.45}
.document-hero-car{display:block;width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:8px;margin-bottom:4px}
/* legacy-light.css (chargé après) passait ce bandeau en fond blanc : texte blanc invisible. */
.documents-shop .document-request{background:var(--sp-encre);border-color:var(--sp-encre)}
.documents-shop .document-request p:last-child{color:var(--sp-ligne)}
@media(prefers-reduced-motion:reduce){.document-photo img{transition:none}.document-card:hover .document-photo img{transform:none}}