/* Styles propres au site vitrine (complète styles.css) */
.topbar a{color:#fff;font-weight:600}
.btn--sm{padding:.6rem 1rem;font-size:.92rem}
.btn--ghost{border:1.5px solid var(--ink);color:var(--ink)}
.btn--ghost:hover{background:var(--ink);color:#fff}
.small{font-size:.85rem}
.eyebrow{display:inline-block;font-size:.8rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--accent-dark);margin-bottom:.6rem}
.eyebrow--light{color:#ff8a5c}
.lead{font-size:1.08rem;color:var(--ink-2);margin:1rem 0 1.4rem}
.sub{color:#aab4bf;margin-bottom:2rem}

/* Hero */
.hero__cta{display:flex;gap:.8rem;flex-wrap:wrap;margin-top:1.8rem}
.hero__visual{position:relative;display:grid;place-items:center;min-height:380px}
.tyre-big{width:min(360px,80vw);filter:drop-shadow(0 30px 40px rgba(0,0,0,.25));animation:spin 40s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.tyre-big{animation:none}}
.float-card{position:absolute;background:#fff;border-radius:14px;padding:.75rem 1rem;font-weight:600;font-size:.92rem;box-shadow:var(--shadow-lg);animation:float 4s ease-in-out infinite}
.float-card--a{top:12%;left:0}
.float-card--b{bottom:10%;right:0;animation-delay:-2s}
@keyframes float{50%{transform:translateY(-10px)}}

/* About */
.about{display:grid;grid-template-columns:1fr 1fr;gap:3.5rem;align-items:center}
.about__photo{aspect-ratio:4/3;border-radius:22px;background:linear-gradient(135deg,#eef1f4,#dfe4e9);display:grid;place-items:center;color:var(--muted);font-weight:600;border:2px dashed #cfd6dd}
.checks{list-style:none;display:grid;gap:.7rem}
.checks li{padding-left:2rem;position:relative}
.checks li::before{content:"✓";position:absolute;left:0;top:0;width:1.4rem;height:1.4rem;border-radius:50%;background:#e3f6ec;color:#0c7a4e;font-weight:800;font-size:.8rem;display:grid;place-items:center}

/* Services */
.services{display:grid;grid-template-columns:repeat(3,1fr);gap:1.2rem;margin-top:2rem}
.service{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:1.6rem;transition:transform .2s,box-shadow .2s}
.service:hover{transform:translateY(-4px);box-shadow:var(--shadow)}
.service span{font-size:1.8rem;width:56px;height:56px;border-radius:14px;background:#fff1ea;display:grid;place-items:center;margin-bottom:1rem}
.service h3{font-size:1.1rem;margin-bottom:.4rem}
.service p{color:var(--ink-2);font-size:.95rem}

/* Ranges */
.ranges{display:grid;grid-template-columns:repeat(3,1fr);gap:1.2rem;margin-top:2rem}
.range{border-radius:20px;padding:2rem;color:#fff;position:relative;overflow:hidden;min-height:220px}
.range::after{content:"";position:absolute;right:-60px;bottom:-60px;width:180px;height:180px;border-radius:50%;border:26px solid rgba(255,255,255,.14)}
.range--ete{background:linear-gradient(135deg,#ff8a3c,#ff5a1f)}
.range--hiver{background:linear-gradient(135deg,#3d7bfd,#1d4ed8)}
.range--4s{background:linear-gradient(135deg,#18b67a,#0b7f55)}
.range__icon{font-size:2rem;margin-bottom:1rem}
.range h3{font-size:1.4rem;margin-bottom:.5rem}
.range p{opacity:.92;max-width:22rem;position:relative;z-index:1}
.vehicles{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem;margin-top:1.5rem}
.vehicle{border:1px solid var(--line);border-radius:14px;padding:1rem;display:flex;align-items:center;gap:.7rem;font-weight:600}
.vehicle span{font-size:1.5rem}
.tiers{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;margin:1.5rem 0 .8rem}
.tier{background:var(--soft);border-radius:14px;padding:1.2rem 1.4rem}
.tier h4{margin-bottom:.25rem}
.tier p{color:var(--ink-2);font-size:.92rem}

/* Dimensions */
.dim-help{display:grid;grid-template-columns:1.1fr .9fr;gap:1.5rem;margin-bottom:2.5rem}
.dim-read,.dim-search{background:#1b2430;border:1px solid #2a3542;border-radius:20px;padding:1.6rem}
.dim-read p{color:#aab4bf}
.dim-code{font-family:Archivo,monospace;font-size:clamp(1.8rem,4vw,2.6rem);font-weight:800;margin:.6rem 0 1rem;letter-spacing:.03em}
.dim-code span{color:#ff8a5c;cursor:help;border-bottom:3px solid transparent;transition:border-color .2s}
.dim-code span.on{border-color:#ff8a5c}
.dim-legend{list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:.4rem 1rem;font-size:.9rem;color:#cfd6dd}
.dim-legend b{color:#fff;display:inline-block;min-width:2.6rem}
.dim-legend li.on{color:#ff8a5c}
.dim-search{display:grid;grid-template-columns:repeat(3,1fr);gap:.7rem;align-content:start}
.dim-search label{display:flex;flex-direction:column;gap:.35rem;font-size:.8rem;font-weight:600;color:#aab4bf}
.dim-search select{height:48px;border-radius:10px;border:1.5px solid #34404e;background:#111820;color:#fff;padding:0 .7rem}
.dim-search select:focus{outline:none;border-color:var(--accent)}
.dim-search .btn{grid-column:1/-1}
.dim-result{grid-column:1/-1;font-size:.95rem}
.dim-result .ok{background:#0f2e22;border:1px solid #1d5b42;color:#9ff0c9;border-radius:12px;padding:.9rem 1rem;display:flex;justify-content:space-between;align-items:center;gap:.8rem;flex-wrap:wrap}
.dim-result .ok a{color:#fff;font-weight:700;white-space:nowrap}

.dim-tools{display:flex;gap:1rem;flex-wrap:wrap;align-items:center;margin-bottom:1.3rem}
.dim-tools input{flex:1;min-width:240px;height:48px;border-radius:12px;border:1.5px solid #34404e;background:#111820;color:#fff;padding:0 1rem}
.dim-tools input:focus{outline:none;border-color:var(--accent)}
.rim-tabs{display:flex;gap:.4rem;flex-wrap:wrap}
.rim-tab{padding:.5rem .85rem;border-radius:999px;border:1.5px solid #34404e;color:#cfd6dd;font-weight:600;font-size:.88rem;transition:all .2s}
.rim-tab:hover{border-color:#6b7682}
.rim-tab.active{background:var(--accent);border-color:var(--accent);color:#fff}
.dim-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:.6rem}
.dim{background:#1b2430;border:1px solid #2a3542;border-radius:12px;padding:.8rem .9rem;text-align:left;color:#fff;transition:all .15s}
.dim:hover{border-color:var(--accent);transform:translateY(-2px)}
.dim strong{font-family:Archivo,sans-serif;font-size:1.05rem;display:block}
.dim small{color:#7ee2b3;font-size:.75rem;font-weight:600}
.dim small.order{color:#ffc58a}
.dim-group{grid-column:1/-1;font-family:Archivo,sans-serif;font-weight:700;color:#8d98a5;margin-top:1rem;padding-bottom:.3rem;border-bottom:1px solid #2a3542}
.dim-group:first-child{margin-top:0}
.dim-count{margin-top:1.4rem;color:#8d98a5;font-size:.9rem}

/* Contact */
.contact{display:grid;grid-template-columns:1.1fr .9fr;gap:3rem;align-items:start}
.info{display:grid;grid-template-columns:1fr 1fr;gap:1.4rem;margin:1.6rem 0}
.info h4{margin-bottom:.3rem}
.info a{color:var(--accent-dark);font-weight:600}
.info > div:last-child{grid-column:1/-1}
.hours{border-collapse:collapse;width:100%;max-width:420px}
.hours td{padding:.35rem 0;border-bottom:1px solid var(--line);font-size:.95rem}
.hours td:last-child{text-align:right;font-weight:600}
.map{width:100%;border:0;height:260px;border-radius:18px;background:repeating-linear-gradient(45deg,#e9edf1,#e9edf1 12px,#f1f4f6 12px,#f1f4f6 24px);display:grid;place-items:center;text-align:center;padding:1rem;color:var(--muted);font-weight:600}
.quote{background:#fff;border-radius:22px;box-shadow:var(--shadow-lg);padding:1.8rem;display:grid;gap:.9rem;border:1px solid var(--line)}
.quote h3{font-size:1.3rem}
.quote label{display:flex;flex-direction:column;gap:.35rem;font-size:.85rem;font-weight:600;color:var(--ink-2)}
.quote input,.quote select,.quote textarea{border:1.5px solid var(--line);border-radius:10px;padding:.75rem .85rem;background:#fff;color:var(--ink);font:inherit;resize:vertical}
.quote input:focus,.quote select:focus,.quote textarea:focus{outline:none;border-color:var(--accent)}
.quote .row{display:grid;grid-template-columns:1fr 1fr;gap:.8rem}
.quote.flash{animation:flash 1s}
@keyframes flash{30%{box-shadow:0 0 0 4px rgba(255,90,31,.45)}}

/* Bouton d'appel flottant (mobile) */
.fab{position:fixed;right:18px;bottom:18px;width:58px;height:58px;border-radius:50%;background:var(--accent);color:#fff;display:none;place-items:center;font-size:1.5rem;box-shadow:0 12px 30px rgba(255,90,31,.45);z-index:60}

@media (max-width:980px){
  .about,.contact,.dim-help{grid-template-columns:1fr}
  .services,.ranges{grid-template-columns:1fr 1fr}
  .vehicles{grid-template-columns:1fr 1fr}
  .hero__visual{min-height:300px}
}
@media (max-width:760px){
  .hide-mobile{display:none}
  .fab{display:grid}
  .services,.ranges,.tiers,.info{grid-template-columns:1fr}
  .dim-legend{grid-template-columns:1fr}
  .float-card{font-size:.8rem}
}

/* Bloc avis Google */
.g-reviews{display:flex;justify-content:space-between;align-items:center;gap:2rem;flex-wrap:wrap;background:var(--soft);border-radius:22px;padding:2.2rem}
.g-reviews p{max-width:34rem;margin-top:.4rem}
.g-reviews__btns{display:flex;gap:.7rem;flex-wrap:wrap}

.about__img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:22px;box-shadow:var(--shadow-lg)}
/* Teintes vertes de l'enseigne */
.section--dark .dim-read,.section--dark .dim-search,.dim,.garage-finder{background:#173a28;border-color:#24533a}
.dim-search select,.dim-tools input{background:#0f2a1c;border-color:#2e6147}
.rim-tab{border-color:#2e6147}
.dim-group{border-color:#24533a;color:#9cc2ad}
.dim small{color:#ffb38a}
