/*
Theme Name: Technoland 4x4 Noir
Theme URI: https://technoland4x4.fr
Author: Refonte 2026
Description: Thème sur mesure pour Technoland 4x4, spécialiste Land Rover à Sanvignes-les-Mines. Gestion des véhicules à vendre, du véhicule en vedette et des actualités.
Version: 3.8-noir
Requires at least: 6.0
Requires PHP: 7.4
License: GNU General Public License v2 or later
Text Domain: technoland
*/


/* Police Figtree hébergée avec le thème (licence SIL OFL, voir assets/fonts/OFL.txt) :
   aucune requête vers Google, donc aucune adresse IP de visiteur transmise. */
@font-face{font-family:"Figtree";font-style:normal;font-weight:400 800;font-display:swap;
  src:url("assets/fonts/figtree-latin.woff2") format("woff2");
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Figtree";font-style:normal;font-weight:400 800;font-display:swap;
  src:url("assets/fonts/figtree-latin-ext.woff2") format("woff2");
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF}

:root{
  /* DA : orange, gris, noir */
  --bg:#F2F3F5;      /* gris acier très clair */
  --bg-alt:#E4E6E9;  /* alternance discrète, même famille que le fond */
  --card:#FFFFFF;
  --ink:#141414;     /* noir */
  --soft:#4E545B;    /* gris acier, texte */
  --faint:#868C93;
  /* gris métallisé : reflets d’acier brossé, à garder pour quelques surfaces */
  --metal:linear-gradient(135deg,#C9CDD2 0%,#F3F4F6 32%,#AEB4BB 58%,#E6E8EB 80%,#BCC1C7 100%);
  --metal-soft:linear-gradient(160deg,#E9EBEE 0%,#DADDE1 45%,#E7E9EC 70%,#D5D9DD 100%);
  --metal-dark:linear-gradient(135deg,#141414 0%,#2A2D31 55%,#161718 100%);
  --brand:#F26A1B;   /* orange de marque, jamais redéfini */
  --main:#141414;    /* couleur structurante : noir (boutons, bandeaux) */
  --main-hi:#2E2E2E;
  --tint:#E8EAED;    /* aplats gris acier */
  --tint-2:#D9DCE0;
  --accent:#F26A1B;  /* orange */
  --accent-hi:#FF8236;
  --accent-ink:#C2500C;   /* orange assombri, lisible en texte sur fond clair */
  --accent-tint:#FDEADD;
  --on-accent:#141414;    /* texte sur aplat orange : noir */
  --dark:#111111;
  --dark-2:#1E1E1E;
  --r-pill:999px;
  --r-lg:24px;
  --r-md:20px;
  --r-sm:14px;
  --sh:0 2px 20px rgba(17,17,17,.06);
  --sh-hi:0 8px 30px rgba(17,17,17,.11);
  --shell:1180px;
  --font:"Figtree",-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
}
*{box-sizing:border-box}
body{
  margin:0;background:var(--bg);color:var(--ink);
  font-family:var(--font);font-size:17px;line-height:1.65;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
p{margin:0}
h1,h2,h3,h4{margin:0;text-wrap:balance;letter-spacing:-.025em;line-height:1.1;font-weight:800;color:var(--ink)}
button,input,textarea,select{font:inherit;color:inherit}
textarea{resize:none}  /* pas de poignée d’agrandissement */
:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

/* ---------------- tonalités de section ----------------
   Trois fonds, pas davantage :
     .tone        fond clair, le défaut
     .tone-soft   variation à peine plus soutenue, pour le rythme
     .tone-green  aplat orange de marque — UNE SEULE section par page
                  (le nom de classe est historique, la couleur est l’orange)
   L’entête et le pied de page sont noirs. Tout le reste de la couleur
   vient des cartes blanches et des accents orange. */
.tone{background:var(--bg);color:var(--ink)}
.tone-soft{background:var(--bg-alt) var(--metal-soft)}
.tone-dark{
  --ink:#F2F2F2;
  --soft:#B4B6BA;
  --faint:#8E9095;
  --card:var(--dark-2);
  --main:var(--accent);
  --main-hi:var(--accent-hi);
  --tint:rgba(255,255,255,.09);
  --tint-2:rgba(255,255,255,.15);
  --accent-ink:#FF8236;   /* orange éclairci pour rester lisible sur le noir */
  --sh:none;
  --sh-hi:0 10px 34px rgba(0,0,0,.4);
  background:var(--dark);color:var(--ink);
}
.tone-dark .field input,.tone-dark .field textarea,.tone-dark .field select{background:rgba(255,255,255,.07)}

/* orange de marque plein : sur l’orange, les accents passent au noir */
.tone-green{
  --ink:#141414;
  --soft:#1A120C;    /* quasi noir, plein : reste net sur l’orange */
  --faint:#3A2414;
  --card:rgba(255,255,255,.22);
  --main:#141414;
  --main-hi:#2E2E2E;
  --tint:rgba(0,0,0,.08);
  --tint-2:rgba(0,0,0,.14);
  --accent:#141414;
  --accent-hi:#2E2E2E;
  --accent-ink:#141414;
  --accent-tint:rgba(255,255,255,.35);
  --on-accent:#FFFFFF;
  --sh:none;
  --sh-hi:0 12px 38px rgba(0,0,0,.22);
  background:var(--brand);color:var(--ink);
}
.tone-green .caro__b{background:#141414;color:#fff}
.tone-green .caro__b:hover{background:#fff;color:#141414}
.tone-green .caro__s{background:rgba(0,0,0,.22);box-shadow:0 10px 34px rgba(0,0,0,.24)}
.tone-green .caro__pt{background:rgba(0,0,0,.28)}
.tone-green .caro__pt[aria-current="true"]{background:#141414;opacity:1}

/* ---------------- primitives ---------------- */
.shell{width:100%;max-width:var(--shell);margin-inline:auto;padding-inline:24px}
.sec{padding-block:clamp(52px,6.5vw,92px)}
.sec--tight{padding-block:clamp(38px,4.5vw,58px)}
.sec--flush-t{padding-top:0}
.label{font-size:.94rem;font-weight:700;color:var(--accent-ink);margin-bottom:14px}
.label--amber{color:var(--accent-ink)}
.h-xl{font-size:clamp(2.15rem,5vw,3.6rem)}
.h-lg{font-size:clamp(1.7rem,3.2vw,2.5rem)}
.h-md{font-size:clamp(1.2rem,1.8vw,1.4rem);font-weight:700}
.lede{font-size:clamp(1.05rem,1.3vw,1.18rem);color:var(--soft);max-width:56ch}
.copy{display:flex;flex-direction:column;gap:16px}
.copy p{color:var(--soft);max-width:62ch}
.head-row{display:flex;flex-wrap:wrap;gap:18px;align-items:end;justify-content:space-between;margin-bottom:30px}

/* ---------------- boutons ---------------- */
.btn{display:inline-flex;align-items:center;gap:9px;cursor:pointer;font-weight:600;font-size:1rem;
  padding:15px 27px;border-radius:var(--r-pill);border:0;transition:.17s ease}
.btn--green{background:var(--main);color:#fff}
.btn--green:hover{background:var(--main-hi);transform:translateY(-1px)}
.tone-dark .btn--green{color:var(--dark)}
.btn--amber{background:var(--accent);color:var(--on-accent)}
.btn--amber:hover{background:var(--accent-hi);transform:translateY(-1px)}
.btn--tint{background:var(--metal);color:var(--main);box-shadow:inset 0 1px 0 rgba(255,255,255,.7),0 1px 2px rgba(0,0,0,.12)}
.btn--tint:hover{filter:brightness(1.05)}
.tone-dark .btn--tint,.tone-green .btn--tint{background:var(--tint);box-shadow:none}
.tone-green .btn--tint{color:#141414}
.tone-dark .btn--tint:hover,.tone-green .btn--tint:hover{background:var(--tint-2);filter:none}
.btn--warm{background:var(--accent-tint);color:var(--accent-ink)}
.btn--warm:hover{background:#FBD9C3}
.btn--dark{background:var(--dark);color:#fff}
.btn--dark:hover{background:var(--dark-2)}
.btn--sm{padding:11px 20px;font-size:.94rem}
.btn__a{transition:transform .17s}
.btn:hover .btn__a{transform:translateX(3px)}
.btns{display:flex;flex-wrap:wrap;gap:12px}
.tlink{font-weight:600;color:var(--accent-ink);display:inline-flex;align-items:center;gap:7px}
.tlink:hover{color:var(--accent)}

/* ---------------- photo ---------------- */
.ph{position:relative;overflow:hidden;background:var(--tint);border-radius:var(--r-lg)}
.ph img{width:100%;height:100%;object-fit:cover}
.ph.is-empty img{display:none}
/* cadre libre : garde les proportions d’origine de la photo */
.ph--auto{aspect-ratio:auto}
.ph--auto img{height:auto;object-fit:contain}
.ph.is-empty::after{content:attr(data-label);position:absolute;inset:0;display:flex;align-items:center;
  justify-content:center;padding:18px;text-align:center;font-size:.88rem;font-weight:600;color:var(--faint)}

/* ---------------- entête ---------------- */
.top{position:sticky;top:0;z-index:60;background:var(--dark) var(--metal-dark);color:#fff}
.top::after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;background:var(--metal)}
.top__bar{display:flex;align-items:center;gap:26px;padding-block:18px}
.logo{font-weight:800;font-size:1.4rem;letter-spacing:-.03em;flex:none;color:#fff}
.logo span{color:var(--accent)}
.nav{display:flex;gap:24px;margin-left:auto;font-weight:500;color:rgba(255,255,255,.78)}
.nav a{padding-block:4px;transition:color .15s;white-space:nowrap}
.nav a:hover{color:#fff}
.nav a[aria-current="page"]{color:#fff;font-weight:600;box-shadow:0 2px 0 var(--accent)}
.top .btn{flex:none}
.burger{display:none;margin-left:auto;background:rgba(255,255,255,.15);color:#fff;border:0;
  border-radius:var(--r-pill);padding:11px 20px;font-weight:600;cursor:pointer}

/* ---------------- hero ---------------- */
.hero{display:grid;grid-template-columns:1.02fr .98fr;gap:clamp(32px,4.4vw,60px);align-items:center;
  padding-block:clamp(28px,3.5vw,52px) clamp(44px,5.5vw,72px)}
.hero h1 em{font-style:normal;color:var(--accent-ink)}
.hero .lede{margin-top:20px}
.hero .btns{margin-top:32px}
.hero__media .ph{aspect-ratio:5/4}
.hero__note{display:inline-flex;align-items:center;gap:10px;margin-top:26px;color:var(--soft);font-size:.98rem;
  background:var(--accent-tint);border-radius:var(--r-pill);padding:9px 18px}
.hero__note b{color:var(--accent-ink);font-weight:700}

/* ---------------- chiffres ---------------- */
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:26px;
  background:var(--card);border-radius:var(--r-lg);padding:clamp(26px,3vw,40px);box-shadow:var(--sh)}
.stat__n{font-size:clamp(1.6rem,2.6vw,2.1rem);font-weight:800;color:var(--main);letter-spacing:-.03em}
.stat:nth-child(2) .stat__n,.stat:nth-child(4) .stat__n{color:var(--accent-ink)}
.stat__l{color:var(--soft);font-size:.98rem;margin-top:4px;line-height:1.45}

/* ---------------- cartes ---------------- */
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.card{background:var(--card);border-radius:var(--r-md);padding:32px 30px;box-shadow:var(--sh);
  display:flex;flex-direction:column;gap:11px;transition:box-shadow .2s,transform .2s}
.card:hover{box-shadow:var(--sh-hi);transform:translateY(-2px)}
.card p{color:var(--soft);line-height:1.62}
.card__link{margin-top:auto;padding-top:6px}
.dot{width:46px;height:46px;border-radius:var(--r-pill);background:var(--accent-tint);color:var(--accent-ink);
  display:flex;align-items:center;justify-content:center;font-weight:800;font-size:1.05rem;margin-bottom:8px}
.tone-dark .dot{background:rgba(242,106,27,.18);color:var(--accent)}

/* ---------------- blocs deux colonnes ---------------- */
.split{display:grid;grid-template-columns:1fr 1fr;gap:clamp(30px,4.4vw,60px);align-items:center}
.split--rev .split__media{order:2}
.split__media .ph{aspect-ratio:4/3}
.split__body{display:flex;flex-direction:column;gap:20px;align-items:flex-start}

/* ---------------- bandeaux ---------------- */
.band{border-radius:var(--r-lg);padding:clamp(32px,4vw,52px) clamp(26px,4vw,52px);
  display:flex;flex-wrap:wrap;gap:26px;align-items:center;justify-content:space-between}
.band__t{flex:1 1 380px}
.band--green{background:var(--main) var(--metal-dark);color:#fff}
.band--green h2{color:#fff}
.band--green p{color:rgba(255,255,255,.82);margin-top:12px;max-width:48ch}
.band--amber{background:var(--accent);color:var(--on-accent)}
.band--amber h2{color:var(--on-accent)}
.band--amber p{color:rgba(17,17,17,.78);margin-top:12px;max-width:48ch}

/* ---------------- fiches véhicules ---------------- */
.fiche{background:var(--card);border-radius:var(--r-md);overflow:hidden;box-shadow:var(--sh);
  display:flex;flex-direction:column;transition:box-shadow .2s,transform .2s}
.fiche:hover{box-shadow:var(--sh-hi);transform:translateY(-2px)}
.fiche .ph{aspect-ratio:4/3;border-radius:0}
.fiche__b{padding:22px 24px 26px;display:flex;flex-direction:column;gap:8px;flex:1}
.fiche__p{color:var(--accent-ink);font-weight:800;font-size:1.3rem;letter-spacing:-.02em}
.fiche__s{color:var(--soft);font-size:.98rem}
.fiche__f{margin-top:auto;padding-top:14px;border-top:1px solid var(--tint-2);
  display:flex;align-items:center;justify-content:space-between;gap:12px}

/* ---------------- catégories ---------------- */
.cat{background:var(--card);border-radius:var(--r-md);padding:26px;box-shadow:var(--sh);
  display:flex;flex-direction:column;gap:7px;transition:.2s}
.cat:hover{box-shadow:var(--sh-hi);transform:translateY(-2px)}
.cat__k{color:var(--accent-ink);font-weight:700;font-size:.92rem}
.cat__n{font-weight:700;font-size:1.14rem;letter-spacing:-.02em}
.cat__d{color:var(--soft);font-size:.97rem;line-height:1.5}
.cat__go{margin-top:12px;color:var(--accent-ink);font-weight:700;font-size:.94rem}
button.cat{border:0;font:inherit;color:inherit;text-align:left;cursor:pointer;width:100%}

/* ---------------- le patron ---------------- */
.patron{display:flex;gap:18px;align-items:center;background:var(--card);border-radius:var(--r-md);
  box-shadow:var(--sh);padding:16px 22px 16px 16px;max-width:420px}
.patron__ph{width:82px;height:82px;border-radius:var(--r-pill);overflow:hidden;flex:none;
  background:var(--tint);line-height:0;box-shadow:0 0 0 3px var(--card),0 3px 12px rgba(17,17,17,.14)}
.patron__ph img{width:100%;height:100%;object-fit:cover;object-position:center 28%}
.patron__ph.is-empty{display:flex;align-items:center;justify-content:center;padding:8px;line-height:1.25;
  font-size:.7rem;font-weight:600;color:var(--faint);text-align:center}
.patron__ph.is-empty::after{content:"Portrait"}
.patron__ph.is-empty img{display:none}
.patron__t{display:flex;flex-direction:column;gap:2px;min-width:0}
.patron__n{font-weight:800;font-size:1.15rem;letter-spacing:-.02em}
.patron__r{color:var(--accent-ink);font-weight:600;font-size:.95rem}
.patron__m{color:var(--soft);font-size:.94rem;margin-top:4px}
@media (max-width:480px){ .patron{flex-direction:column;text-align:center;padding:20px} }

/* ---------------- carrousel des réalisations ---------------- */
.caro{position:relative}
.caro__t{display:flex;gap:20px;overflow-x:auto;scroll-snap-type:x mandatory;
  scroll-behavior:smooth;scrollbar-width:none;-webkit-overflow-scrolling:touch;padding-bottom:4px}
.caro__t::-webkit-scrollbar{display:none}
.caro__s{flex:0 0 100%;scroll-snap-align:center;position:relative;border-radius:var(--r-lg);
  overflow:hidden;background:var(--dark-2)}
.caro__s .ph{border-radius:0;aspect-ratio:16/9;width:100%}
.caro__l{position:absolute;left:0;right:0;bottom:0;padding:60px 28px 26px;
  background:linear-gradient(to top,rgba(12,12,12,.94) 12%,rgba(12,12,12,0));color:#fff}
.caro__n{font-size:clamp(1.15rem,2.2vw,1.6rem);font-weight:800;letter-spacing:-.02em;color:#fff}
.caro__d{color:rgba(255,255,255,.84);margin-top:7px;max-width:60ch;font-size:.98rem}
.caro__nav{display:flex;gap:10px}
.caro__b{width:48px;height:48px;border-radius:var(--r-pill);border:0;cursor:pointer;
  background:var(--tint);color:var(--main);font-size:1.7rem;line-height:1;padding-bottom:4px;
  display:flex;align-items:center;justify-content:center;transition:.16s}
.caro__b:hover{background:var(--accent);color:var(--on-accent)}
.caro__p{display:flex;gap:9px;justify-content:center;margin-top:22px;flex-wrap:wrap}
.caro__pt{width:9px;height:9px;padding:0;border:0;border-radius:var(--r-pill);cursor:pointer;
  background:var(--tint);opacity:.45;transition:.2s}
.caro__pt[aria-current="true"]{opacity:1;width:30px;background:var(--accent)}
@media (min-width:820px){ .caro__s{flex-basis:calc(50% - 10px)} }
.caro__s .ph{aspect-ratio:4/3}

/* ---------------- avis clients ---------------- */
.avis-tete{display:flex;flex-wrap:wrap;gap:22px;align-items:end;justify-content:space-between;margin-bottom:30px}
.note-g{display:flex;align-items:center;gap:16px;flex-wrap:wrap;background:var(--card);
  border-radius:var(--r-md);box-shadow:var(--sh);padding:16px 20px}
.note-g__n{font-size:2.1rem;font-weight:800;letter-spacing:-.03em;color:var(--accent-ink);line-height:1}
.note-g__t{display:flex;flex-direction:column;gap:2px}
.note-g__c{color:var(--soft);font-size:.9rem;font-weight:600}

.etoiles{color:var(--accent);font-size:1.05rem;letter-spacing:.09em;line-height:1}
.etoiles .off{color:var(--tint-2)}

.avis{background:var(--card);border-radius:var(--r-md);box-shadow:var(--sh);padding:26px 24px 24px;
  display:flex;flex-direction:column;gap:14px;transition:box-shadow .2s,transform .2s}
.avis:hover{box-shadow:var(--sh-hi);transform:translateY(-2px)}
.avis__t{color:var(--ink);font-size:1.02rem;line-height:1.6;flex:1}
.avis__p{display:flex;align-items:center;gap:12px;margin-top:auto;padding-top:6px}
.avis__ph{width:46px;height:46px;border-radius:var(--r-pill);overflow:hidden;flex:none;
  background:var(--tint);line-height:0}
.avis__ph img{width:100%;height:100%;object-fit:cover}
.avis__ph--i{display:flex;align-items:center;justify-content:center;line-height:1;
  font-weight:800;font-size:1.2rem;color:var(--main)}
.avis__q{display:flex;flex-direction:column;gap:1px;min-width:0}
.avis__n{font-weight:700}
.avis__c{color:var(--soft);font-size:.9rem}

/* ---------------- citation ---------------- */
.quote{background:var(--card);border-radius:var(--r-lg);box-shadow:var(--sh);padding:clamp(30px,4vw,50px);
  max-width:820px;margin-inline:auto;text-align:center}
.quote__ph{position:relative;margin:0 auto 22px;overflow:hidden;background:var(--tint);
  box-shadow:0 0 0 6px var(--card),0 8px 28px rgba(17,17,17,.16);line-height:0}
.quote__ph img{width:100%;height:100%;object-fit:cover;object-position:center 28%}
.quote__ph.is-empty{display:flex;align-items:center;justify-content:center;padding:14px;line-height:1.3;
  font-size:.8rem;font-weight:600;color:var(--faint);text-align:center}
.quote__ph.is-empty::after{content:attr(data-label)}
.quote__ph.is-empty img{display:none}

/* rond : recadre en cercle */
.quote__ph--rond{width:150px;height:150px;border-radius:var(--r-pill)}
/* carré arrondi : montre davantage du sujet */
.quote__ph--carre{width:170px;height:170px;border-radius:26px}
/* photo entière : aucun recadrage */
.quote__ph--entiere{width:auto;max-width:300px;height:auto;border-radius:22px}
.quote__ph--entiere img{width:100%;height:auto;object-fit:fill;object-position:center}
.quote__ph--entiere.is-empty{width:300px;height:200px}

.quote__b{position:absolute;right:-4px;bottom:-4px;width:44px;height:44px;border-radius:var(--r-pill);
  background:var(--accent);color:var(--on-accent);display:flex;align-items:center;justify-content:center;
  font-size:1.8rem;font-weight:800;line-height:1;padding-top:12px;box-shadow:0 3px 10px rgba(17,17,17,.22)}
@media (max-width:600px){
  .quote__ph--rond{width:124px;height:124px}
  .quote__ph--carre{width:140px;height:140px}
  .quote__ph--entiere{max-width:240px}
}
.quote__m{font-size:2.4rem;line-height:1;color:var(--accent);font-weight:800;margin-bottom:10px}
.quote p{font-size:clamp(1.2rem,2.2vw,1.6rem);font-weight:600;letter-spacing:-.02em;line-height:1.4}
.quote cite{display:block;margin-top:18px;font-style:normal;color:var(--faint);font-weight:600}

/* ---------------- entêtes de page ---------------- */
.phead{padding-block:clamp(34px,4.5vw,58px) clamp(28px,3.5vw,42px)}
.phead h1{font-size:clamp(2rem,4.2vw,3.1rem);max-width:19ch}
.phead .lede{margin-top:18px}

/* ---------------- actualités ---------------- */
.post{display:grid;grid-template-columns:.8fr 1.2fr;gap:clamp(26px,4vw,52px);align-items:start;
  background:var(--card);border-radius:var(--r-lg);box-shadow:var(--sh);padding:clamp(22px,2.6vw,32px);
  margin-bottom:26px}
.post .ph{aspect-ratio:4/3}
.post__b{display:flex;flex-direction:column;gap:15px}
.post__b p{color:var(--soft)}
.post__k{color:var(--accent-ink);font-weight:700;font-size:.94rem}
.post__sign{color:var(--faint);font-weight:600}

/* ---------------- contact ---------------- */
.contact{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(26px,3.4vw,44px);align-items:start}
.panel{background:var(--card);border-radius:var(--r-lg);box-shadow:var(--sh);padding:clamp(26px,3vw,38px)}
.field{display:flex;flex-direction:column;gap:7px;margin-bottom:18px}
.field label{font-weight:600;font-size:.96rem}
.field input,.field textarea,.field select{background:var(--bg);border:1.5px solid transparent;
  border-radius:var(--r-sm);padding:13px 16px;width:100%;transition:.15s}
.field input:focus,.field textarea:focus,.field select:focus{border-color:var(--accent);background:#fff;outline:0;color:#141414}
.field textarea{min-height:140px}
.note{color:var(--faint);font-size:.94rem;margin-top:14px}
.ok{display:none;margin-top:16px;padding:15px 18px;border-radius:var(--r-sm);background:var(--accent-tint);
  color:var(--accent-ink);font-weight:600}
.ok.is-on{display:block}
.info{background:var(--main) var(--metal-dark);color:#fff;border-radius:var(--r-lg);padding:clamp(24px,3vw,34px);
  display:flex;flex-direction:column;gap:22px}
.info__b{display:flex;flex-direction:column;gap:3px}
.info__k{color:var(--accent);font-weight:700;font-size:.94rem}
.info__v{font-size:1.08rem;font-weight:600;color:#fff}
.info__v a:hover{color:var(--accent)}
.hours{display:flex;flex-direction:column;gap:7px}
.hrow{display:flex;justify-content:space-between;gap:20px;color:var(--soft)}
.hrow b{color:var(--ink);font-weight:600}

/* ---------------- plan d’accès ---------------- */
.plan{aspect-ratio:16/10;overflow:hidden;border-radius:var(--r-lg);background:var(--tint);
  box-shadow:var(--sh)}
.plan iframe{width:100%;height:100%}

/* ---------------- galerie ---------------- */
.gal{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.gal .ph{aspect-ratio:1;border-radius:var(--r-md)}

/* ---------------- pied de page ---------------- */
.foot{background:var(--dark);color:#fff;padding-block:clamp(40px,5vw,58px) 28px;
  border-top:3px solid #AEB4BB;border-image:var(--metal) 1}
.foot__g{display:grid;grid-template-columns:1.5fr 1fr 1fr;gap:36px}
.foot h4{font-size:1rem;font-weight:700;margin-bottom:14px;color:var(--accent)}
.foot ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:9px}
.foot a,.foot li{color:rgba(255,255,255,.78)}
.foot a:hover{color:var(--accent)}
.foot__ab{color:rgba(255,255,255,.72);margin-top:12px;max-width:38ch}
.foot__logo{font-weight:800;font-size:1.35rem;letter-spacing:-.03em;color:#fff}
.foot__logo span{color:var(--accent)}
.foot__bt{margin-top:34px;padding-top:20px;border-top:1px solid rgba(255,255,255,.15);
  display:flex;flex-wrap:wrap;gap:12px;justify-content:space-between;color:rgba(255,255,255,.6);font-size:.94rem}

/* véhicule phare *//* véhicule phare */
.star{display:grid;grid-template-columns:1.08fr .92fr;gap:0;background:var(--card);
  border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--sh-hi)}
.star__m{position:relative;min-height:340px}
.star__m .ph{width:100%;height:100%;border-radius:0;border:0}
.star__tag{position:absolute;left:18px;top:18px;z-index:2;background:var(--accent);color:var(--on-accent);
  font-weight:700;font-size:.86rem;padding:8px 16px;border-radius:var(--r-pill);box-shadow:var(--sh)}
.star__b{padding:clamp(26px,3.4vw,44px);display:flex;flex-direction:column;justify-content:center;gap:16px}
.star__p{color:var(--accent-ink);font-weight:800;font-size:clamp(1.7rem,3vw,2.3rem);letter-spacing:-.03em}
.star__s{display:grid;grid-template-columns:repeat(2,auto);gap:12px 26px;margin-top:2px}
.star__s div{display:flex;flex-direction:column}
.star__s dt{color:var(--faint);font-weight:600;font-size:.88rem}
.star__s dd{margin:0;font-weight:700;font-size:1.02rem}
@media (max-width:900px){
  .star{grid-template-columns:1fr}
  .star__m{min-height:0;aspect-ratio:4/3}
}

/* cartes catégories */
.pcats{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.pcat{position:relative;background:var(--card);border-radius:var(--r-md);overflow:hidden;box-shadow:var(--sh);
  border:0;padding:0;font:inherit;color:inherit;text-align:left;cursor:pointer;width:100%;
  display:flex;flex-direction:column;transition:box-shadow .2s,transform .2s}
.pcat:hover{box-shadow:var(--sh-hi);transform:translateY(-3px)}
.pcat .ph{display:block;aspect-ratio:4/3;border-radius:0;width:100%}
.pcat .ph img{transition:transform .55s cubic-bezier(.22,.61,.36,1)}
.pcat:hover .ph img{transform:scale(1.06)}
.pcat__b{position:absolute;left:0;right:0;bottom:0;padding:56px 20px 18px;display:flex;flex-direction:column;gap:2px;
  background:linear-gradient(to top,rgba(12,12,12,.9) 20%,rgba(12,12,12,0));color:#fff}
.pcat__n{font-weight:800;font-size:1.2rem;letter-spacing:-.02em;color:#fff}
.pcat__g{color:#FF9A5C;font-weight:700;font-size:.92rem}
.pcat:hover .pcat__g{color:#fff}
@media (max-width:900px){.pcats{grid-template-columns:repeat(2,1fr)}}
@media (max-width:600px){.pcats{grid-template-columns:1fr}}

/* fiche pièce */
.fp{position:fixed;inset:0;z-index:90;display:none}
.fp.is-on{display:block}
.fp__bd{position:absolute;inset:0;background:rgba(12,12,12,.6)}
.fp__p{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:min(580px,94vw);
  max-height:92vh;overflow:auto;background:var(--card);border-radius:var(--r-lg);box-shadow:var(--sh-hi)}
.fp__x{position:absolute;right:14px;top:14px;z-index:2;border:0;background:rgba(255,255,255,.94);
  width:38px;height:38px;border-radius:var(--r-pill);cursor:pointer;font-size:1.15rem;font-weight:700;
  box-shadow:var(--sh)}
.fp__i{aspect-ratio:4/3;background:var(--tint);position:relative}
.fp__i img{width:100%;height:100%;object-fit:cover}
.fp__i .nope{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  color:var(--faint);font-weight:600}
.fp__b{padding:26px 26px 30px}
.fp__s{display:grid;grid-template-columns:auto 1fr;gap:9px 20px;margin:18px 0 22px;font-size:.96rem}
.fp__s dt{color:var(--faint);font-weight:600}
.fp__s dd{margin:0;font-weight:600}

/* ---------------- bandeau défilant ---------------- */
.marq{overflow:hidden;background:var(--main);color:#fff;padding-block:18px;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);
  mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.marq__t{display:flex;width:max-content;animation:marq 38s linear infinite}
.marq__g{display:flex;align-items:center;gap:46px;padding-right:46px;white-space:nowrap}
.marq__g b{font-weight:800;font-size:1.05rem;letter-spacing:-.01em}
.marq__g i{font-style:normal;color:var(--accent);font-size:.8rem}
.marq:hover .marq__t{animation-play-state:paused}
@keyframes marq{to{transform:translateX(-50%)}}

/* ---------------- animations ---------------- */
.js .reveal{opacity:0;transform:translateY(24px);
  transition:opacity .75s cubic-bezier(.22,.61,.36,1),transform .75s cubic-bezier(.22,.61,.36,1);
  transition-delay:var(--d,0ms)}
.js .reveal.is-in{opacity:1;transform:none}
.js .ph img{transition:transform 1.1s cubic-bezier(.22,.61,.36,1)}
.js .reveal .ph img,.js .reveal.ph img{transform:scale(1.1)}
.split__media .ph img,.hero__media .ph img{transform:scale(1.06)}
.js .reveal.is-in .ph img,.js .reveal.is-in.ph img{transform:scale(1)}
.fiche .ph,.cat,.gal .ph{overflow:hidden}
.fiche:hover .ph img,.gal .ph:hover img{transform:scale(1.06)}
.top{transition:padding .25s ease,box-shadow .25s ease,background .25s ease}
.top.is-stuck{box-shadow:0 2px 22px rgba(0,0,0,.35)}
.top.is-stuck .top__bar{padding-block:11px}

@keyframes pagein{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.hero__media .ph{will-change:transform}
@media (prefers-reduced-motion:reduce){
  .js .reveal{opacity:1;transform:none}
  .js .ph img{transform:none!important}
  .marq__t{animation:none}

}

/* ---------------- responsive ---------------- */
@media (max-width:1040px){
  .nav{gap:18px}
  .stats{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:900px){
  .hero,.split,.contact,.post{grid-template-columns:1fr}
  .split--rev .split__media{order:0}
  .grid-3{grid-template-columns:repeat(2,1fr)}
  .gal{grid-template-columns:repeat(2,1fr)}
  .foot__g{grid-template-columns:1fr 1fr}
}
@media (max-width:660px){
  body{font-size:16px}
  .nav{display:none;order:3;width:100%;flex-direction:column;gap:0;margin:0;padding-top:10px}
  .nav.is-open{display:flex}
  .nav a{padding-block:12px;border-top:1px solid rgba(255,255,255,.14)}
  .burger{display:block}
  .top .btn{display:none}
  .top__bar{flex-wrap:wrap;gap:14px}
  .grid-3{grid-template-columns:1fr}
  .stats{grid-template-columns:1fr;gap:20px}
  .foot__g{grid-template-columns:1fr}
}


/* ---------------- contenu éditorial WordPress ---------------- */
.copy h2,.copy h3{margin-top:26px}
.copy ul,.copy ol{color:var(--soft);padding-left:22px}
.copy li{margin-bottom:7px}
.copy img{border-radius:var(--r-md);margin-block:20px}
.copy a{color:var(--accent-ink);font-weight:600}
.post__b p{color:var(--soft)}
.post__b h2 a:hover{color:var(--accent-ink)}
.fiche__b h3 a:hover{color:var(--accent-ink)}
.nav-links{display:flex;gap:10px;flex-wrap:wrap;justify-content:center}
.nav-links .page-numbers{background:var(--card);box-shadow:var(--sh);border-radius:var(--r-pill);
  padding:10px 18px;font-weight:600;color:var(--soft)}
.nav-links .page-numbers.current{background:var(--main);color:#fff}
.screen-reader-text{position:absolute;left:-9999px}

/* ---------------- cadre photo libre ----------------
   Doit venir APRÈS les règles de mise en page, qui sont plus spécifiques
   (.split__media .ph) et écraseraient sinon ces proportions libres. */
.ph--auto,
.split__media .ph--auto,
.hero__media .ph--auto,
.star__m .ph--auto{aspect-ratio:auto;height:auto;min-height:0;
  display:flex;align-items:center;justify-content:center;background:transparent}
.ph--auto img,
.split__media .ph--auto img,
.hero__media .ph--auto img,
.js .reveal .ph--auto img,
.js .reveal.is-in .ph--auto img{
  width:auto;height:auto;max-width:100%;max-height:min(620px,72vh);
  object-fit:contain;transform:none;border-radius:var(--r-lg)}

/* bloc deux colonnes où la photo prend plus de place */
.split--photo{grid-template-columns:1.22fr 0.78fr}
.split--photo.split--rev{grid-template-columns:0.78fr 1.22fr}
@media (max-width:900px){
  .split--photo,.split--photo.split--rev{grid-template-columns:1fr}
}

/* ---------------- espace de gestion (côté site) ---------------- */
.g-onglets{display:flex;flex-wrap:wrap;gap:6px;background:var(--tint);border-radius:var(--r-pill);
  padding:6px;margin-bottom:24px}
.g-onglet{padding:12px 22px;border-radius:var(--r-pill);font-weight:700;color:var(--soft);white-space:nowrap}
.g-onglet:hover{color:var(--ink)}
.g-onglet[aria-current="page"]{background:var(--main);color:#fff}
.g-onglet--sortie{margin-left:auto;color:var(--accent-ink)}

.g-msg{background:var(--tint);color:var(--main);border-radius:var(--r-sm);
  padding:14px 18px;font-weight:600;margin-bottom:22px}
.g-msg--e{background:#FCEDEC;color:#B3261E}
.g-aide{color:var(--soft);margin-bottom:20px;max-width:70ch}

.g-form{background:var(--card);border-radius:var(--r-md);box-shadow:var(--sh);margin-bottom:26px;
  overflow:hidden}
.g-form summary{cursor:pointer;font-weight:800;font-size:1.1rem;padding:20px 24px;list-style:none;
  color:var(--main)}
.g-form summary::-webkit-details-marker{display:none}
.g-form summary:hover{background:var(--tint)}
.g-form form{padding:4px 24px 26px}
.g-form input[type="file"]{background:var(--bg);border-radius:var(--r-sm);padding:12px 14px;width:100%}
.g-2{display:grid;grid-template-columns:1fr 1fr;gap:14px}

.g-liste{display:flex;flex-direction:column;gap:14px}
.g-ligne{background:var(--card);border-radius:var(--r-md);box-shadow:var(--sh);padding:16px;
  display:flex;gap:18px;align-items:center;flex-wrap:wrap}
.g-ligne--star{box-shadow:0 0 0 2.5px var(--accent),var(--sh)}
.g-ph{width:130px;height:96px;border-radius:var(--r-sm);overflow:hidden;flex:none;background:var(--tint);
  display:flex;align-items:center;justify-content:center;color:var(--faint);font-size:.8rem;
  font-weight:600;text-align:center;padding:8px;line-height:1.3}
.g-ph img{width:100%;height:100%;object-fit:cover}
.g-info{flex:1 1 240px;min-width:0;display:flex;flex-direction:column;gap:3px}
.g-nom{font-weight:800;font-size:1.12rem;letter-spacing:-.02em}
.g-prix{color:var(--accent-ink);font-weight:800}
.g-sub{color:var(--soft);font-size:.94rem}
.g-actions{display:flex;gap:9px;flex-wrap:wrap;margin-left:auto}
.g-actions form{margin:0}
.g-vide{background:var(--card);border-radius:var(--r-md);box-shadow:var(--sh);padding:44px 24px;
  text-align:center;color:var(--soft)}

.login-username label,.login-password label{display:block;font-weight:600;font-size:.96rem;margin-bottom:6px}
.login-username input,.login-password input{background:var(--bg);border:1.5px solid transparent;
  border-radius:var(--r-sm);padding:13px 16px;width:100%;margin-bottom:16px}
.login-username input:focus,.login-password input:focus{border-color:var(--accent);background:#fff;outline:0}
.login-remember{display:block;margin-bottom:16px;color:var(--soft)}
.login-submit input{background:var(--main);color:#fff;border:0;border-radius:var(--r-pill);
  padding:15px 27px;font-weight:700;cursor:pointer;width:100%}

@media (max-width:700px){
  .g-2{grid-template-columns:1fr}
  .g-actions{margin-left:0;width:100%}
  .g-actions .btn{flex:1}
  .g-onglets{border-radius:var(--r-md)}
  .g-onglet{flex:1;text-align:center;padding-inline:12px}
  .g-onglet--sortie{margin-left:0;flex-basis:100%}
}

/* grille de photos dans l’espace de gestion */
.g-grille{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:16px}
.g-vignette{position:relative;margin:0;border-radius:var(--r-md);overflow:hidden;background:var(--tint);
  box-shadow:var(--sh);aspect-ratio:4/3}
.g-vignette img{width:100%;height:100%;object-fit:cover}
.g-vignette__no{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  color:var(--faint);font-weight:600;font-size:.85rem}
.g-vignette form{position:absolute;top:8px;right:8px;margin:0}
.g-x{width:34px;height:34px;border-radius:var(--r-pill);border:0;cursor:pointer;font-weight:800;
  background:rgba(255,255,255,.94);color:#B3261E;box-shadow:var(--sh);line-height:1}
.g-x:hover{background:#B3261E;color:#fff}

/* ---------------- véhicule du moment ---------------- */
.phare{display:grid;grid-template-columns:1.18fr 0.82fr;gap:clamp(26px,3.6vw,52px);
  align-items:center;background:var(--card);border-radius:var(--r-lg);
  padding:clamp(18px,2.2vw,26px);box-shadow:0 10px 44px rgba(17,17,17,.12)}
.phare__m{position:relative}
.phare__m .ph{aspect-ratio:3/2;border-radius:var(--r-md);width:100%}
.phare__ruban{position:absolute;left:16px;top:16px;z-index:2;background:var(--accent);
  color:var(--on-accent);font-weight:800;font-size:.92rem;letter-spacing:-.01em;
  padding:10px 20px;border-radius:var(--r-pill);box-shadow:0 4px 14px rgba(17,17,17,.28)}
.phare__b{display:flex;flex-direction:column;gap:14px;padding-block:8px}
.phare__n{font-size:clamp(1.7rem,3.4vw,2.7rem);font-weight:800;letter-spacing:-.03em;line-height:1.05}
.phare__p{font-size:clamp(1.8rem,3.4vw,2.6rem);font-weight:800;letter-spacing:-.03em;
  color:var(--accent-ink);line-height:1}
.phare__s{list-style:none;margin:4px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:10px}
.phare__s li{background:var(--tint) var(--metal-soft);border-radius:var(--r-sm);padding:10px 15px;
  display:flex;flex-direction:column;gap:1px;min-width:104px}
.phare__s span{color:var(--soft);font-size:.82rem;font-weight:600}
.phare__s b{font-weight:800;font-size:1rem}
.phare__d{color:var(--soft);line-height:1.6}
.phare__a{margin-top:6px}
.phare__l{margin-top:2px}
.phare__l a{color:var(--main);font-weight:700;font-size:.96rem}
.phare__l a:hover{color:var(--accent-ink)}
@media (max-width:900px){
  .phare{grid-template-columns:1fr;padding:14px}
  .phare__b{padding:4px 10px 14px}
}

/* ---------------- galerie d’un véhicule ---------------- */
.gal-v{display:flex;flex-direction:column;gap:12px}
.gal-v__g{aspect-ratio:4/3;border-radius:var(--r-md);overflow:hidden;background:var(--tint)}
.gal-v__g img{width:100%;height:100%;object-fit:cover;transition:opacity .25s}
.gal-v__g.is-chargement img{opacity:.45}
.gal-v__t{display:flex;gap:10px;overflow-x:auto;padding-bottom:4px;scrollbar-width:thin}
.gal-v__b{flex:0 0 92px;height:70px;padding:0;border:0;border-radius:var(--r-sm);overflow:hidden;
  cursor:pointer;background:var(--tint);opacity:.62;transition:.18s;
  box-shadow:0 0 0 0 var(--accent)}
.gal-v__b img{width:100%;height:100%;object-fit:cover}
.gal-v__b:hover{opacity:.9}
.gal-v__b[aria-current="true"]{opacity:1;box-shadow:0 0 0 3px var(--accent)}
.gal-v__c{color:var(--soft);font-size:.92rem;font-weight:600}
.star__m .gal-v__t{padding-inline:16px}
.star__m .gal-v__c{padding:0 16px 16px}

/* miniatures dans l’espace de gestion */
.g-mini{display:flex;flex-wrap:wrap;gap:9px;margin-top:4px}
.g-mini__i{position:relative;width:74px;height:56px;border-radius:var(--r-sm);overflow:hidden;
  background:var(--tint);display:block}
.g-mini__i img{width:100%;height:100%;object-fit:cover}
.g-mini__p{position:absolute;left:0;right:0;bottom:0;background:var(--accent);color:var(--on-accent);
  font-size:.62rem;font-weight:800;text-align:center;padding:2px}
.g-vignette__p{position:absolute;left:8px;bottom:8px;background:var(--accent);color:var(--on-accent);
  font-size:.72rem;font-weight:800;padding:4px 10px;border-radius:var(--r-pill);margin:0}

/* ================================================================
   PAGES INTÉRIEURES
   ================================================================ */

/* ---------------- entête : anthracite et tôle larmée ----------------
   Le motif reprend la tôle aluminium antidérapante des Defender.
   Il s’efface vers la gauche pour laisser le titre sur un fond calme.
   Avec une photo, celle-ci déborde sur la section suivante. */
.phero{position:relative;z-index:2;color:#fff;background:#161718 var(--metal-dark);
  padding-block:clamp(34px,4.6vw,60px) clamp(40px,5vw,64px);border-bottom:4px solid var(--brand)}
.phero::before{content:"";position:absolute;inset:0;pointer-events:none;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='30' height='30'%3E%3Cg stroke-width='3.2' stroke-linecap='round'%3E%3Cpath d='M4 11 11 4M19 4l7 7M4 19l7 7M19 26l7-7' stroke='%23000' stroke-opacity='.55' transform='translate(.8 1)'/%3E%3Cpath d='M4 11 11 4M19 4l7 7M4 19l7 7M19 26l7-7' stroke='%23fff' stroke-opacity='.13'/%3E%3C/g%3E%3C/svg%3E");
  -webkit-mask-image:linear-gradient(100deg,transparent 22%,#000 70%);mask-image:linear-gradient(100deg,transparent 22%,#000 70%)}
.phero__in{position:relative;display:grid;grid-template-columns:minmax(0,1fr);gap:clamp(28px,4vw,56px);align-items:end}
.phero--photo .phero__in{grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr)}
.phero__fil{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:20px;font-size:.92rem;font-weight:600;color:#9AA0A7}
.phero__fil a:hover{color:#fff}
.phero__fil [aria-current]{color:#FF9A5C}
.phero h1{color:#fff;font-size:clamp(2.2rem,5vw,3.7rem);line-height:1.04;max-width:15ch}
.phero__t{margin-top:20px;color:#C9CDD2;font-size:clamp(1.05rem,1.3vw,1.18rem);max-width:50ch}
.phero__a{margin-top:30px}
.phero__f{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:0 28px;margin:36px 0 0;
  border-top:1px solid rgba(255,255,255,.16)}
.phero__f div{padding-top:18px}
.phero__f dt{color:#9AA0A7;font-size:.9rem;font-weight:600}
.phero__f dd{margin:4px 0 0;color:#fff;font-weight:700;font-size:1.06rem;line-height:1.45;overflow-wrap:anywhere}
.phero__f dd a:hover{color:#FF9A5C}
.phero__f .is-fort dd{color:#FF9A5C;font-size:clamp(1.45rem,2.4vw,1.9rem);font-weight:800;letter-spacing:-.02em;line-height:1.15}
.phero__f .is-fort dd a:hover{color:#fff}
/* photo qui déborde sur la section suivante */
.phero__m{margin-bottom:calc(-1 * clamp(40px,5vw,64px) - 64px)}
.phero__m .ph{aspect-ratio:4/3;box-shadow:0 26px 60px rgba(0,0,0,.38)}
.phero__m .ph--portrait img{object-position:center 30%}
.phero--photo + section{padding-top:calc(64px + clamp(48px,6vw,84px))}
@media (max-width:900px){
  .phero--photo .phero__in{grid-template-columns:minmax(0,1fr)}
  .phero__m{margin-bottom:-56px}
  .phero--photo + section{padding-top:calc(56px + 44px)}
}

/* fil d’Ariane sur fond clair (fiche véhicule) */
.fil{display:flex;flex-wrap:wrap;gap:8px;font-size:.92rem;font-weight:600;color:var(--faint)}
.fil a:hover{color:var(--accent-ink)}
.fil [aria-current]{color:var(--ink)}
.star__tag.is-vendu{background:var(--ink);color:#fff}

/* ---------------- liste des prestations (atelier) ---------------- */
.svc{display:grid;grid-template-columns:1fr 1fr;column-gap:clamp(28px,4vw,60px);border-top:3px solid var(--ink)}
.svc__l{display:grid;grid-template-columns:7.2rem minmax(0,1fr) auto;gap:4px 20px;align-items:baseline;
  padding:22px 0;border-bottom:1px solid var(--tint-2)}
.svc__k{color:var(--faint);font-weight:600;font-size:.92rem}
.svc__n{font-weight:800;font-size:1.16rem;letter-spacing:-.02em;transition:color .15s}
.svc__go{color:var(--accent-ink);font-weight:700;font-size:.92rem}
.svc__d{grid-column:2 / 4;color:var(--soft);font-size:.98rem;line-height:1.5}
.svc__l:hover .svc__n{color:var(--accent-ink)}
.svc--simple .svc__l{grid-template-columns:minmax(0,1fr) auto}
.svc--simple .svc__d{grid-column:1 / -1}
@media (max-width:820px){ .svc{grid-template-columns:1fr} }
@media (max-width:520px){
  .svc__l{grid-template-columns:minmax(0,1fr) auto}
  .svc__k{grid-column:1 / -1}
  .svc__d{grid-column:1 / -1}
}

/* ---------------- trois colonnes réglées ----------------
   .trio--num numérote les colonnes : à réserver à une vraie suite d’étapes. */
.trio{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);
  gap:clamp(24px,3.4vw,48px);counter-reset:etape}
.trio li{border-top:3px solid var(--ink);padding-top:22px;display:flex;flex-direction:column;gap:10px}
.trio p{color:var(--soft);line-height:1.62}
.trio--num li{counter-increment:etape}
.trio--num li::before{content:counter(etape);font-size:clamp(2.6rem,4vw,3.4rem);font-weight:800;
  letter-spacing:-.05em;line-height:1;margin-bottom:6px}
@media (max-width:820px){ .trio{grid-template-columns:1fr} }

/* ---------------- titre à gauche, texte à droite ---------------- */
.duo{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(26px,5vw,80px);align-items:start}
.duo__b{display:flex;flex-direction:column;gap:26px;align-items:flex-start}
@media (max-width:820px){ .duo{grid-template-columns:1fr} }

/* ---------------- liste à puces orange ---------------- */
.coche{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.coche li{display:flex;gap:14px;align-items:baseline;font-weight:600}
.coche li::before{content:"";flex:none;width:10px;height:10px;border-radius:2px;background:var(--accent);
  transform:translateY(-1px)}

/* ---------------- engagements (pièces) ---------------- */
.atouts{display:grid;grid-template-columns:repeat(3,1fr);background:var(--card);border-radius:var(--r-lg);
  box-shadow:var(--sh);overflow:hidden}
.atouts > div{padding:clamp(22px,2.6vw,32px);border-left:1px solid var(--tint-2);display:flex;flex-direction:column;gap:8px}
.atouts > div:first-child{border-left:0}
.atouts p{color:var(--soft);font-size:.98rem;line-height:1.55}
@media (max-width:820px){
  .atouts{grid-template-columns:1fr}
  .atouts > div{border-left:0;border-top:1px solid var(--tint-2)}
  .atouts > div:first-child{border-top:0}
}

/* ---------------- contact ---------------- */
.acces{display:flex;flex-direction:column;gap:18px}
.acces .plan{aspect-ratio:4/3}
.acces .hours{background:var(--card);border-radius:var(--r-md);padding:18px 22px;box-shadow:var(--sh)}

/* ---------------- état vide ---------------- */
.vide{background:var(--card);border-radius:var(--r-lg);box-shadow:var(--sh);padding:clamp(30px,4vw,48px);
  display:flex;flex-direction:column;gap:14px;align-items:flex-start;max-width:640px}
.vide p{color:var(--soft)}

/* ---------------- lecture (articles, pages libres) ---------------- */
.lecture{max-width:760px}
.lecture .copy{gap:20px}
.lecture .copy p,.lecture .copy li{color:var(--ink);font-size:1.06rem;line-height:1.75}
.lecture .copy h2{font-size:clamp(1.5rem,2.4vw,1.9rem);margin-top:22px}
.lecture .copy h3{font-size:1.25rem;margin-top:14px}
.lecture .copy blockquote{margin:8px 0;padding:4px 0 4px 22px;border-left:4px solid var(--accent);font-weight:600}

/* ---------------- pages légales ---------------- */
.ident{margin:0;background:var(--card);border-radius:var(--r-md);box-shadow:var(--sh);padding:6px 24px}
.ident div{display:grid;grid-template-columns:minmax(0,13rem) minmax(0,1fr);gap:4px 20px;padding:12px 0;
  border-top:1px solid var(--tint-2)}
.ident div:first-child{border-top:0}
.ident dt{color:var(--soft);font-weight:600}
.ident dd{margin:0;font-weight:600;overflow-wrap:anywhere}
@media (max-width:560px){ .ident div{grid-template-columns:1fr} }
.tableau{overflow-x:auto;background:var(--card);border-radius:var(--r-md);box-shadow:var(--sh)}
.tableau table{width:100%;min-width:620px;border-collapse:collapse;font-size:.96rem;line-height:1.5}
.tableau th{text-align:left;font-weight:700;padding:14px 16px;border-bottom:2px solid var(--ink)}
.tableau td{vertical-align:top;padding:14px 16px;border-top:1px solid var(--tint-2);color:var(--soft)}
.tableau td:first-child{color:var(--ink);font-weight:600}
.copy blockquote p{color:var(--ink)}
.note a,.copy a{text-decoration:underline;text-underline-offset:3px}
.foot__legal{display:flex;flex-wrap:wrap;gap:6px 18px}
.foot__legal a{color:rgba(255,255,255,.6)}

/* ---------------- bandeau de saison (inc-evenements.php) ---------------- */
.fete{position:relative;z-index:55;background:var(--brand);color:#141414}
.fete[hidden]{display:none}
.fete__in{display:flex;align-items:center;gap:14px;padding-block:12px}
.fete__ic{flex:none;display:flex;width:38px;height:38px;border-radius:var(--r-pill);background:#141414;color:var(--brand);
  align-items:center;justify-content:center}
.fete__t{flex:1;min-width:0;display:flex;flex-wrap:wrap;column-gap:10px;row-gap:2px;align-items:baseline;line-height:1.4}
.fete__t strong{font-weight:800;font-size:1.06rem;letter-spacing:-.01em}
.fete__t span{color:#2A1A0F}
.fete__a{flex:none;font-weight:700;color:#141414;text-decoration:underline;text-underline-offset:3px;white-space:nowrap}
.fete__a:hover{color:#fff}
.fete__x{flex:none;display:flex;align-items:center;justify-content:center;width:36px;height:36px;border:0;cursor:pointer;
  border-radius:var(--r-pill);background:rgba(0,0,0,.1);color:#141414}
.fete__x:hover{background:rgba(0,0,0,.2)}
.fete__x:focus-visible{outline-color:#141414}
@media (max-width:600px){
  .fete__in{align-items:flex-start;flex-wrap:wrap;gap:10px 12px}
  .fete__ic{width:32px;height:32px}
  .fete__t{flex-basis:calc(100% - 100px)}
  .fete__a{order:4;margin-left:44px}
}

/* neige : légère, au-dessus de tout, ne gêne aucun clic */
.neige{position:fixed;inset:0;z-index:80;pointer-events:none;overflow:hidden}
.neige span{position:absolute;top:-30px;color:#fff;text-shadow:0 0 1px rgba(60,66,74,.9),0 1px 4px rgba(60,66,74,.45);opacity:.9;
  animation:neige linear infinite}
@keyframes neige{
  0%{transform:translate3d(0,-30px,0) rotate(0)}
  50%{transform:translate3d(18px,50vh,0) rotate(160deg)}
  100%{transform:translate3d(-10px,105vh,0) rotate(320deg)}
}

/* confettis : une salve au chargement, puis retirés par site.js */
.confettis{position:fixed;inset:0;z-index:80;pointer-events:none;overflow:hidden}
.confettis[hidden]{display:none}
.confettis i{position:absolute;top:-20px;width:9px;height:14px;border-radius:2px;opacity:0;
  animation:confetti ease-in forwards}
@keyframes confetti{
  0%{opacity:1;transform:translate3d(0,0,0) rotate(var(--r))}
  85%{opacity:1}
  100%{opacity:0;transform:translate3d(30px,100vh,0) rotate(calc(var(--r) + 540deg))}
}
@media (prefers-reduced-motion:reduce){ .neige,.confettis{display:none} }