/* =========================================================================
   MP Grenoble V2 - feuille de styles unique
   Palette : creme #F6F3EC / encre #241F1A / bleu #6E93A8 / or #C9A46A
   ========================================================================= */

:root{
  --bg:#FAF7F1;
  --bg2:#EDE9DE;
  --card:#FDFBF7;
  --ink:#221D19;
  --ink2:#3B342D;
  --muted:#5F564C;
  --faint:#8A8075;
  --line:rgba(34,29,25,.14);
  --line2:rgba(34,29,25,.28);
  --blue:#5E7F95;
  --blue-d:#4C7F9E;
  --blue-l:rgba(94,127,149,.45);
  --gold:#C9A66B;
  --gold-l:#D8B87F;
  --gold-soft:#E5D5B4;
  --dark:#221D19;
  --dark2:#2C2620;
  --dark3:#3A312A;
  --darkline:rgba(250,247,241,.16);
  --dark-muted:rgba(250,247,241,.62);
  --dark-text:#FAF7F1;
  --dark-soft:rgba(250,247,241,.8);
  --foot:#1A1613;
  --ph:#EDE9DE;
  --serif:'Newsreader',Georgia,'Times New Roman',serif;
  --sans:'Instrument Sans',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;
}

/* ---------- Base ---------- */

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{
  margin:0;
  background:var(--bg);
  color:var(--ink);
  font-family:var(--sans);
  font-size:16px;
  line-height:1.6;
  overflow-wrap:break-word;
}
img{max-width:100%;height:auto;display:block}
a{color:var(--blue);text-decoration:none}
a:hover{color:var(--blue-d)}
h1,h2,h3,.h1,.h2,.h3{font-family:var(--serif);font-weight:400;letter-spacing:-.018em;margin:0}
p{margin:0}
ul{margin:0;padding:0;list-style:none}
:focus-visible{outline:2px solid var(--blue);outline-offset:2px}

.wrap{max-width:1520px;margin:0 auto;padding-left:clamp(20px,5vw,64px);padding-right:clamp(20px,5vw,64px)}
/* Meme largeur maximale que .wrap : toutes les sections sont alignees */
.wrap-n{max-width:1520px;margin:0 auto;padding-left:clamp(20px,5vw,64px);padding-right:clamp(20px,5vw,64px)}
.sec{padding-top:clamp(48px,7vw,76px);padding-bottom:clamp(48px,7vw,76px)}
.sec-dark{background:var(--dark);color:var(--dark-text)}
.sec-card{background:var(--card)}
.sec-band{background:var(--bg2)}
body.nav-open{overflow:hidden}
.skip{position:absolute;left:-9999px}
.skip:focus{left:12px;top:12px;z-index:60;background:var(--ink);color:var(--bg);padding:10px 16px;border-radius:6px}

/* ---------- Barre superieure ---------- */

.tb{
  background:var(--dark);color:var(--dark-soft);
  font-size:13.5px;letter-spacing:.02em;
}
.tb-in{
  display:flex;justify-content:space-between;align-items:center;gap:16px;
  padding-top:9px;padding-bottom:9px;flex-wrap:wrap;
}
.tb-r{display:flex;gap:clamp(14px,2vw,26px);align-items:center;flex-wrap:wrap}
.tb a{color:var(--dark-soft)}
.tb a:hover{color:var(--dark-text)}
.tb-cta{color:var(--gold);font-weight:700}
.tb-cta:hover{color:var(--gold-l)}

/* ---------- Navigation ---------- */

.nav{
  position:sticky;top:0;z-index:20;
  background:rgba(246,243,236,.94);
  -webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);
  border-bottom:1px solid var(--line);
}
.nav-in{display:flex;align-items:center;justify-content:space-between;gap:20px;padding-top:16px;padding-bottom:16px;flex-wrap:wrap}
.brand{display:flex;align-items:center;gap:14px;color:inherit;min-width:0}
.brand:hover{color:inherit}
.brand-logo{height:clamp(38px,3.2vw,46px);width:auto;flex:0 0 auto;display:block}
.brand-name,.brand-sub,.pf-title,.pf-sub,.pf-tag{display:block}
.brand-name{font-family:var(--serif);font-size:clamp(19px,2.2vw,23px);font-weight:600;letter-spacing:-.015em;line-height:1.1}
.brand-sub{font-size:11px;letter-spacing:.13em;text-transform:uppercase;color:var(--faint);margin-top:2px}
.nav-links{display:flex;align-items:center;gap:clamp(12px,1.6vw,22px);font-size:14.5px;color:#494C46;font-weight:500;flex-wrap:wrap}
.nav-links a{color:inherit}
.nav-links a:hover{color:var(--blue-d)}
/* Menu deroulant Services (sans JS : hover + focus-within) */
.nav-item{position:relative;display:flex;align-items:center;padding:14px 0;margin:-14px 0}
.nav-top{display:inline-flex;align-items:center;gap:7px;color:inherit;background:none;border:0;padding:0;font:inherit;cursor:pointer}
.nav-top::after{
  content:"";width:6px;height:6px;flex:0 0 auto;
  border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;
  transform:rotate(45deg) translate(-2px,-2px);
}
.nav-sub{
  position:absolute;top:100%;left:50%;transform:translateX(-50%);
  min-width:min(280px,90vw);
  background:var(--card);border:1px solid var(--line);border-radius:2px;
  padding:10px;display:grid;gap:2px;z-index:30;
  opacity:0;visibility:hidden;pointer-events:none;
}
.nav-item:hover .nav-sub,
.nav-item:focus-within .nav-sub{opacity:1;visibility:visible;pointer-events:auto}
.nav-sub a{
  padding:10px 14px;border-radius:6px;font-size:14.5px;font-weight:500;
  color:#494C46;white-space:nowrap;
}
.nav-sub a:hover{background:var(--bg2);color:var(--ink)}

/* Actions mobiles (CTA contact + burger) : masquees au-dessus du point de bascule */
.nav-actions{display:none;align-items:center;gap:10px;flex:0 0 auto}
.nav-cta-mob{
  display:inline-flex;align-items:center;height:46px;padding:0 20px;
  border-radius:100px;background:var(--ink);color:var(--bg);
  font-family:var(--sans);font-size:14px;font-weight:700;white-space:nowrap;
}
.nav-cta-mob:hover{background:var(--dark3);color:var(--bg)}
.nav-burger{
  display:none;width:46px;height:46px;flex:0 0 auto;
  align-items:center;justify-content:center;padding:0;
  background:none;border:1px solid var(--line);border-radius:2px;cursor:pointer;
}
.nav-burger:hover{border-color:var(--ink)}
.nav-burger-b{position:relative;display:block;width:20px;height:1.5px;background:var(--ink)}
.nav-burger-b::before,
.nav-burger-b::after{content:"";position:absolute;left:0;display:block;width:20px;height:1.5px;background:var(--ink)}
.nav-burger-b::before{top:-6px}
.nav-burger-b::after{top:6px}
.nav-burger-b,
.nav-burger-b::before,
.nav-burger-b::after{transition:transform .25s ease,background-color .2s ease}
.nav-open .nav-burger-b{background:transparent}
.nav-open .nav-burger-b::before{transform:translateY(6px) rotate(45deg)}
.nav-open .nav-burger-b::after{transform:translateY(-6px) rotate(-45deg)}

.btn-dark{
  background:var(--ink);color:var(--bg);
  padding:11px 20px;border-radius:100px;font-weight:700;font-size:14px;
  display:inline-block;
}
.btn-dark:hover{background:var(--dark3);color:var(--bg)}
/* Le CTA du header est dans .nav-links, dont la regle « a{color:inherit} »
   est plus specifique que .btn-dark : on remonte la specificite. */
.nav-links a.btn-dark,
.nav-links a.btn-dark:hover{color:var(--bg)}

/* ---------- Hero ---------- */

.hero{background:var(--bg2);border-bottom:1px solid var(--line)}
.hero-in{
  display:grid;grid-template-columns:1.12fr .88fr;gap:clamp(32px,4vw,64px);align-items:center;
  padding-top:clamp(44px,6vw,76px);padding-bottom:clamp(44px,6vw,68px);
}
.hero-in>*{min-width:0}
.eyebrow{
  display:inline-flex;align-items:center;gap:10px;
  font-family:var(--sans);
  font-size:12.5px;letter-spacing:.16em;text-transform:uppercase;
  color:var(--blue);font-weight:700;margin:0 0 20px;
}
.eyebrow-line{width:28px;height:1px;background:var(--blue);display:block;flex:0 0 auto}
.h1{
  margin:0 0 20px;font-size:clamp(38px,5vw,74px);line-height:1.03;
  text-wrap:balance;
}
.h1 em{color:var(--blue);font-style:italic}
.lead{margin:0 0 30px;font-size:clamp(17px,1.6vw,19px);line-height:1.62;color:var(--muted);max-width:32em;text-wrap:pretty}
.lead a{border-bottom:1px solid var(--blue-l)}
.hero-cta{display:flex;gap:14px;align-items:center;flex-wrap:wrap}
.btn-lg{padding:17px 32px;border-radius:100px;font-weight:700;font-size:16.5px;display:inline-block}
.btn-ghost{border:1px solid var(--line2);color:var(--ink);padding:16px 28px;border-radius:100px;font-weight:600;font-size:16.5px;display:inline-block}
.btn-ghost:hover{background:var(--card);color:var(--ink)}
.hero-checks{display:flex;gap:clamp(14px,2.4vw,28px);margin-top:30px;font-size:15px;color:var(--muted);flex-wrap:wrap}
.chk{display:flex;gap:8px;align-items:flex-start}
.chk::before{content:"\2713";color:var(--blue);font-weight:700;flex:0 0 auto}
.hero-media{display:grid;gap:16px}

/* Bandeau de preuves sous le hero */
.hero-proof{
  display:grid;grid-template-columns:repeat(3,minmax(0,1fr));
  border-top:1px solid var(--line);margin-top:clamp(48px,6vw,88px);
}
.hp-item{display:flex;flex-direction:column;gap:8px;padding:26px 32px}
.hp-item:first-child{padding-left:0}
.hp-item:last-child{padding-right:0}
.hp-item+.hp-item{border-left:1px solid var(--line)}
.hp-v{font-family:var(--serif);font-size:clamp(24px,2.6vw,30px);line-height:1}
.hp-l{font-size:14px;line-height:1.5;color:#6E655B}

/* ---------- Emplacements visuels (en attente d'images) ---------- */

.ph{background:var(--ph);border:1px solid var(--line);border-radius:2px;overflow:hidden}
.ph-16x10{aspect-ratio:16/10}
.ph-16x9{aspect-ratio:16/9;border-radius:0;border:0;background:var(--dark3)}
.ph-4x3{aspect-ratio:4/3;border-radius:0;border:0;background:var(--dark3)}
.ph img{width:100%;height:100%;object-fit:cover;display:block}
.ph-r12{border-radius:6px}

/* ---------- Entete de section ---------- */

.kicker{font-size:12.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--blue);font-weight:700;margin-bottom:12px}
.kicker-gold{color:var(--gold)}
.h2{margin:0 0 14px;font-size:clamp(30px,3.7vw,50px);line-height:1.12;text-wrap:balance}
.h2 em{color:var(--blue);font-style:italic}
.h3{margin:0 0 12px;font-size:clamp(22px,2.2vw,27px);line-height:1.2}
.sec-lead{margin:0;font-size:clamp(16px,1.5vw,17.5px);line-height:1.6;color:var(--muted);max-width:52em;text-wrap:pretty}

/* ---------- Portfolio ---------- */

.pf-head{
  display:grid;grid-template-columns:1fr auto;gap:clamp(24px,4vw,48px);align-items:end;
  margin-bottom:40px;padding-bottom:26px;border-bottom:1.5px solid var(--ink);
}
.pf-head>*{min-width:0}
.link-gold{font-size:15px;font-weight:700;color:var(--ink);border-bottom:1px solid var(--gold);padding-bottom:3px;white-space:nowrap}
.link-gold:hover{color:var(--blue-d)}
.pf-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:26px}
.pf-card{position:relative;display:block;overflow:hidden;background:var(--ph);aspect-ratio:4/3;color:var(--bg);border:1px solid var(--line)}
.pf-card:hover{color:var(--bg)}
.pf-card img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:top center}
.pf-card:hover{color:var(--bg)}
.pf-tag{position:absolute;left:16px;top:16px;background:var(--card);color:var(--muted);font-size:12px;padding:6px 10px;border-radius:4px}
.pf-fade{position:absolute;left:0;right:0;bottom:0;height:70%;background:linear-gradient(180deg,rgba(34,29,25,0) 0%,rgba(34,29,25,.55) 45%,rgba(34,29,25,.9) 100%)}
.pf-meta{position:absolute;left:clamp(16px,2vw,26px);right:clamp(16px,2vw,26px);bottom:22px;display:flex;align-items:flex-end;justify-content:space-between;gap:16px}
.pf-title{font-family:var(--serif);font-size:clamp(20px,2.2vw,26px);font-weight:500;line-height:1.15}
.pf-sub{font-size:14px;color:var(--dark-soft);margin-top:4px}
.pf-go{font-size:14.5px;font-weight:700;color:var(--gold);white-space:nowrap;flex:0 0 auto;padding-bottom:4px}
.pf-card:hover .pf-go{color:var(--gold-l)}

/* ---------- Pourquoi ---------- */

.why-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(32px,4vw,64px);align-items:start}
.why-grid>*{min-width:0}
.why-p{margin:0 0 16px;font-size:clamp(16px,1.6vw,18px);line-height:1.65;color:var(--muted);text-wrap:pretty}
.why-p:last-child{margin-bottom:0}
.why-label{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--faint);margin-bottom:18px}
.why-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:2px;background:var(--line);border:1px solid var(--line);border-radius:2px;overflow:hidden}
.why-cell{background:var(--bg);padding:clamp(22px,2.4vw,30px) clamp(20px,2.2vw,28px)}
.why-cell::before{content:"\2713";display:block;color:var(--blue);font-size:17px;font-weight:700;margin-bottom:12px}
.why-cell span{font-size:clamp(15px,1.5vw,17px);line-height:1.55;color:var(--ink2)}
.why-note{margin:22px 0 0;font-size:16.5px;line-height:1.65;color:var(--muted);text-wrap:pretty}
.why-cta{display:inline-block;margin-top:18px}

/* Bloc « Mes engagements » */
.eng{background:var(--bg2);border-radius:0;padding:clamp(26px,3vw,36px)}

/* Les deux colonnes de la section « Pourquoi » se calent a la meme hauteur */
.why-grid--stretch{align-items:stretch}
.why-grid--stretch>*{display:flex;flex-direction:column}
.why-grid--stretch .why-cta{margin-top:auto;align-self:flex-start}
.why-grid--stretch .eng{height:100%;display:flex;flex-direction:column}
/* C'est la liste qui absorbe l'espace libre, pas la note :
   sinon le filet de la note vient se coller au dernier badge. */
.why-grid--stretch .eng-list{margin-bottom:auto}
.eng-t{
  margin:0 0 22px;font-family:var(--serif);
  font-size:clamp(21px,2.2vw,26px);font-weight:500;line-height:1.2;
}
.eng-list{display:grid;gap:16px;margin:0}
.eng-list li{
  display:flex;gap:16px;align-items:center;
  font-size:clamp(16px,1.5vw,17.5px);line-height:1.5;color:var(--ink2);
}
.eng-n{
  flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;
  width:clamp(40px,3.4vw,46px);height:clamp(40px,3.4vw,46px);
  border-radius:2px;background:var(--gold-soft);color:var(--ink);
  font-family:var(--serif);font-size:14px;
  font-weight:700;letter-spacing:.08em;
}
.eng-note{
  margin:24px 0 0;padding-top:22px;border-top:1px solid var(--line2);
  font-size:16px;line-height:1.6;color:var(--muted);text-wrap:pretty;
}

/* ---------- Services (fond sombre) ---------- */

.sv-lead{margin:0 0 44px;font-size:clamp(16px,1.5vw,17.5px);line-height:1.6;color:var(--dark-muted);max-width:52em;text-wrap:pretty}
.sv-lead a{color:var(--gold);border-bottom:1px solid var(--darkline)}
.sv-lead a:hover{color:var(--gold-l)}
.sv-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.sv-card{border:1px solid var(--darkline);border-radius:2px;background:var(--dark2);overflow:hidden;display:flex;flex-direction:column}
.sv-body{padding:clamp(24px,2.6vw,32px);display:flex;flex-direction:column;flex:1}
.sv-num{font-family:var(--serif);font-size:15px;font-weight:700;color:var(--gold);letter-spacing:.1em;margin-bottom:16px}
.sv-card .h3{color:var(--dark-text)}
.sv-p{margin:0 0 24px;font-size:15.5px;line-height:1.65;color:var(--dark-muted);flex:1}
.link-gold-s{font-size:14.5px;font-weight:700;color:var(--gold)}
.link-gold-s:hover{color:var(--gold-l)}

/* ---------- Tarifs ---------- */

.pr-lead{margin:0 0 40px;font-size:clamp(16px,1.5vw,17.5px);line-height:1.6;color:var(--muted);max-width:52em}
.pr-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;margin-bottom:26px}
.pr-card{background:var(--card);border:1px solid var(--line);border-radius:0;padding:clamp(28px,3vw,40px) clamp(24px,3vw,42px)}
.pr-card .h3{margin-bottom:8px;font-size:clamp(22px,2.4vw,28px)}
.pr-price{font-family:var(--serif);font-size:clamp(26px,3vw,34px);color:var(--blue);margin-bottom:20px;line-height:1.2}
.pr-p{margin:0;font-size:16.5px;line-height:1.65;color:var(--muted);text-wrap:pretty}
.pr-note{background:var(--bg2);border-radius:0;padding:clamp(22px,2.6vw,30px) clamp(20px,3vw,36px);font-size:17px;line-height:1.6;color:var(--ink2);text-wrap:pretty}
.pr-claims{display:flex;flex-wrap:wrap;justify-content:center;gap:clamp(14px,2.6vw,36px);font-weight:600}
.pr-claims span{display:flex;align-items:center;gap:10px}
.pr-claims span::before{content:"\2713";color:var(--blue);font-weight:700;flex:0 0 auto}
.pr-media{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;margin-top:26px}

/* ---------- Page Realisations ---------- */

.rz-head{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:clamp(32px,5vw,80px);align-items:end}
.rz-head .lead{margin:0 0 10px}
.rz-filters{display:flex;flex-wrap:wrap;align-items:center;gap:10px;padding-bottom:30px;border-bottom:1px solid var(--line)}
.rz-fil{
  height:44px;padding:0 22px;border-radius:999px;border:1px solid var(--line2);
  background:none;color:var(--ink2);font-family:var(--sans);font-size:13px;font-weight:600;
  letter-spacing:.02em;cursor:pointer;
}
.rz-fil:hover{border-color:var(--ink)}
.rz-fil[aria-pressed="true"]{background:var(--ink);border-color:var(--ink);color:var(--bg)}
.rz-count{margin-left:auto;font-size:14px;color:var(--faint)}
.rz-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(40px,5vw,70px) clamp(24px,3vw,44px);margin-top:52px}
.rz-grid>*{min-width:0}
.rz-card{display:flex;flex-direction:column;gap:22px;color:var(--ink)}
.rz-card:hover{color:var(--ink)}
.rz-card[hidden]{display:none}
.rz-media{position:relative;display:block;aspect-ratio:16/11;background:var(--bg2);border:1px solid var(--line);overflow:hidden}
.rz-media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:top center;transition:transform .6s cubic-bezier(.22,.61,.36,1)}
.rz-card:hover .rz-media img{transform:scale(1.04)}
.rz-body{display:grid;grid-template-columns:auto minmax(0,1fr);gap:clamp(14px,2vw,26px);align-items:baseline}
.rz-n{font-family:var(--serif);font-size:14px;letter-spacing:.1em;color:#8B7040}
.rz-txt{display:flex;flex-direction:column;gap:9px;min-width:0}
.rz-name{font-family:var(--serif);font-size:clamp(24px,2.6vw,30px);line-height:1.14}
.rz-meta{font-size:15px;line-height:1.5;color:var(--faint)}
.rz-desc{font-size:16px;line-height:1.65;color:var(--muted);max-width:44ch}
.rz-go{margin-top:8px;font-size:13px;font-weight:600;letter-spacing:.04em;color:#8B7040}
.rz-card:hover .rz-go{color:var(--blue)}

/* Bandeau d'appel a l'action en fin de page */
.cta-band{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:clamp(28px,5vw,70px);align-items:center}
.cta-band>*{min-width:0}
.cta-band .h2{color:var(--dark-text);max-width:24ch}
.cta-lead{margin:22px 0 0;max-width:56ch;text-align:left}
.cta-acts{display:flex;flex-wrap:wrap;gap:14px}
.btn-gold-lg{
  display:inline-flex;align-items:center;height:58px;padding:0 34px;border-radius:999px;
  background:var(--gold);color:var(--ink);font-size:15px;font-weight:600;white-space:nowrap;
}
.btn-gold-lg:hover{background:var(--gold-l);color:var(--ink)}
.btn-outline-dark{
  display:inline-flex;align-items:center;height:58px;padding:0 34px;border-radius:999px;
  border:1px solid var(--darkline);color:var(--dark-text);font-size:15px;font-weight:600;white-space:nowrap;
}
.btn-outline-dark:hover{border-color:var(--dark-text);color:var(--dark-text)}

/* ---------- Avis clients ---------- */

/* Carrousel : defilement natif + accroche, les fleches ne font que piloter le scroll */
.rev-track{
  display:flex;gap:24px;overflow-x:auto;overscroll-behavior-x:contain;
  scroll-snap-type:x mandatory;scroll-behavior:smooth;
  padding-bottom:10px;scrollbar-width:thin;scrollbar-color:var(--line2) transparent;
}
.rev-track::-webkit-scrollbar{height:6px}
.rev-track::-webkit-scrollbar-thumb{background:var(--line2);border-radius:99px}
.rev-track::-webkit-scrollbar-track{background:transparent}
.rev-track>.rev{flex:0 0 calc((100% - 48px) / 3);scroll-snap-align:start}
.rev-foot{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px;flex-wrap:wrap;margin-top:26px;text-align:center}
.rev-nav{display:flex;gap:10px}
.rev-btn{
  width:46px;height:46px;display:inline-flex;align-items:center;justify-content:center;
  padding:0;background:none;border:1px solid var(--line2);border-radius:99px;
  font-family:var(--sans);font-size:22px;line-height:1;color:var(--ink);cursor:pointer;
}
.rev-btn:hover{border-color:var(--ink);background:var(--card)}
.rev{
  margin:0;background:var(--card);border:1px solid var(--line);
  padding:clamp(26px,3vw,34px);display:flex;flex-direction:column;gap:16px;
}
.rev-stars{color:var(--gold);font-size:15px;letter-spacing:.16em;line-height:1}
.rev-txt{
  margin:0;flex:1;font-family:var(--serif);
  font-size:clamp(17px,1.7vw,19px);line-height:1.5;color:var(--ink2);text-wrap:pretty;
}
.rev-who{margin-top:auto;display:flex;flex-direction:column;gap:3px;font-size:15px;font-weight:600;color:var(--ink)}
.rev-src{font-size:13px;font-weight:400;color:var(--faint)}
.rev-all{display:inline-block}
.rev-google{height:clamp(30px,3vw,38px);width:auto;display:block;margin:14px auto 16px}
#avis .kicker,#avis .h2{text-align:center}

/* ---------- Tarifs : 3 offres comparables ---------- */

.tar-grid{
  display:grid;grid-template-columns:repeat(3,minmax(0,1fr));
  gap:24px;align-items:stretch;padding-top:14px;margin-bottom:26px;
}
.tar-grid>*{min-width:0}
.tar-card{
  background:var(--card);border:1px solid var(--line);border-radius:0;
  padding:clamp(28px,3vw,38px) clamp(24px,2.8vw,34px);
  display:flex;flex-direction:column;position:relative;
}
.tar-card--star{border:2px solid var(--gold)}
.tar-badge{
  position:absolute;top:-13px;left:50%;transform:translateX(-50%);
  background:var(--ink);color:var(--bg);font-size:12px;font-weight:700;
  padding:6px 14px;border-radius:100px;white-space:nowrap;
}
.tar-t{
  margin:0 0 10px;font-family:var(--serif);
  font-size:clamp(21px,2.3vw,26px);font-weight:500;line-height:1.2;
}
.tar-t em{color:var(--blue);font-style:italic}
.tar-p{margin:0 0 22px;font-size:17px;line-height:1.5;color:var(--muted)}
.tar-p b{color:var(--ink);font-weight:700}
.tar-k{margin:0 0 14px;font-size:14px;font-weight:700;color:var(--ink2)}
.tar-l{display:grid;gap:11px;margin:0 0 26px;padding-top:16px;border-top:1px solid var(--line)}
.tar-l li{display:flex;gap:10px;font-size:15.5px;line-height:1.5;color:var(--muted)}
.tar-l li::before{content:"\203A";color:var(--gold);font-weight:700;flex:0 0 auto}
.tar-cta{
  margin-top:auto;display:block;text-align:center;
  background:var(--ink);color:var(--bg);padding:15px 20px;
  border-radius:8px;font-weight:700;font-size:15.5px;
}
.tar-cta:hover{background:var(--dark3);color:var(--bg)}

/* ---------- Methode ---------- */

.st-list{border-top:1.5px solid var(--ink)}
.st-row{display:grid;grid-template-columns:minmax(180px,250px) 1fr;gap:clamp(20px,3vw,40px);padding:34px 0;border-bottom:1px solid var(--line);align-items:start}
.st-row:last-child{border-bottom:0}
.st-row>*{min-width:0}
.st-num{font-family:var(--serif);font-size:15px;font-weight:700;color:var(--blue);letter-spacing:.1em;margin-bottom:12px}
.st-row .h3{margin:0;line-height:1.15}
.st-body{max-width:60em}
.st-p{margin:0 0 14px;font-size:16.5px;line-height:1.65;color:var(--muted);text-wrap:pretty}
.st-p:last-child{margin-bottom:0}
.chk-list{display:grid;gap:10px;margin:0 0 18px}
.chk-list li{display:flex;gap:11px;font-size:16.5px;line-height:1.55;color:var(--ink2)}
.chk-list li::before{content:"\2713";color:var(--blue);font-weight:700;flex:0 0 auto}

/* ---------- FAQ ---------- */

.faq-list{border-top:1px solid var(--line)}
.faq-item{border-bottom:1px solid var(--line)}
.faq-q{
  display:flex;justify-content:space-between;align-items:center;gap:24px;
  padding:24px 0;cursor:pointer;list-style:none;
  font-family:var(--serif);font-size:clamp(19px,2vw,23px);font-weight:500;line-height:1.3;
}
.faq-q::-webkit-details-marker{display:none}
.faq-q::after{content:"+";font-family:var(--sans);font-size:26px;color:var(--blue);line-height:1;flex:0 0 auto}
.faq-item[open] .faq-q::after{content:"\2212"}
.faq-q,.faq-q:focus,.faq-q:focus-visible{outline:none;border:0}
.faq-a{padding:0 0 28px;max-width:52em}
.faq-a p{margin:0 0 14px;font-size:16.5px;line-height:1.65;color:var(--muted)}
.faq-a p:last-child{margin-bottom:0}
.faq-a ul{display:grid;gap:9px;margin:0 0 18px}
.faq-a li{display:flex;gap:11px;font-size:16.5px;line-height:1.55;color:var(--ink2)}
.faq-a li::before{content:"\2713";color:var(--blue);font-weight:700;flex:0 0 auto}

/* ---------- Contact ---------- */

.ct{text-align:center}
.ct .h2{margin-bottom:18px;color:var(--dark-text)}
.ct-lead{margin:0 auto 32px;font-size:clamp(16px,1.6vw,18px);line-height:1.6;color:var(--dark-muted);max-width:36em;text-wrap:pretty}
.ct-form{max-width:640px;margin:0 auto;text-align:left;display:grid;gap:14px}

/* Bloc contact en 2 colonnes : coordonnees + carte a gauche, formulaire a droite */
.ct-grid{
  display:grid;grid-template-columns:.9fr 1.1fr;
  gap:clamp(24px,3vw,40px);align-items:stretch;text-align:left;
  max-width:none;margin:0;
}
.ct-grid>*{min-width:0}
.ct-grid .ct-form{
  max-width:none;margin:0;
  background:rgba(255,255,255,.035);border:1px solid var(--darkline);
  border-radius:0;padding:clamp(24px,3vw,32px);
}
.ct-form-t{
  margin:0 0 4px;font-family:var(--serif);
  font-size:clamp(21px,2.2vw,26px);font-weight:500;line-height:1.2;color:var(--dark-text);
}
.ct-clair .ct-grid .ct-form{background:var(--card);border-color:var(--line)}
.ct-clair .ct-form-t{color:var(--ink)}
.nap{
  display:flex;flex-direction:column;gap:20px;height:100%;
  background:rgba(255,255,255,.035);border:1px solid var(--darkline);
  border-radius:0;padding:clamp(24px,3vw,32px);
}
.nap-t{
  margin:0;font-family:var(--serif);
  font-size:clamp(21px,2.2vw,26px);font-weight:500;line-height:1.2;color:var(--dark-text);
}
.nap-s{margin:-14px 0 0;font-size:15px;line-height:1.5;color:var(--dark-muted)}
.nap-l{display:grid;gap:14px}
.nap-row{
  display:grid;grid-template-columns:minmax(min(96px,40%),112px) 1fr;
  gap:14px;align-items:start;font-size:16px;line-height:1.55;
}
.nap-k{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--dark-muted);padding-top:4px}
.nap-v,.nap-l a{color:var(--dark-text)}
.nap-l a:hover{color:var(--gold)}
.nap-gmb{font-size:15px;font-weight:700;color:var(--gold);justify-self:start}
.nap-gmb:hover{color:var(--gold-l)}
.nap-map{
  border-radius:2px;overflow:hidden;border:1px solid var(--darkline);
  background:var(--dark2);flex:1;min-height:230px;
}
.nap-map iframe{width:100%;height:100%;border:0;display:block}

.ct-clair .nap-t{color:var(--ink)}
.ct-clair .nap-k{color:var(--faint)}
.ct-clair .nap-v,.ct-clair .nap-l a{color:var(--ink2)}
.ct-clair .nap-l a:hover{color:var(--blue-d)}
.ct-clair .nap-gmb{color:var(--blue)}
.ct-clair .nap-gmb:hover{color:var(--blue-d)}
.ct-clair .nap-map{border-color:var(--line);background:var(--ph)}
.ct-clair .nap{background:var(--card);border-color:var(--line)}
.ct-clair .nap-s{color:var(--muted)}
.f-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.f-field{display:grid;gap:8px;min-width:0}
.f-field label{font-size:13px;letter-spacing:.1em;text-transform:uppercase;color:var(--dark-muted)}
.f-field input,.f-field select,.f-field textarea{
  background:var(--dark2);border:1px solid var(--darkline);border-radius:7px;
  padding:14px 16px;font-size:16px;color:var(--dark-text);
  font-family:var(--sans);outline:none;width:100%;
}
.f-field textarea{min-height:140px;resize:vertical}
.f-field input:focus,.f-field select:focus,.f-field textarea:focus{border-color:var(--gold)}
.f-field input::placeholder,.f-field textarea::placeholder{color:#7C7266}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.btn-gold{
  background:var(--gold);color:var(--ink);border:none;border-radius:100px;
  padding:17px 24px;font-size:17px;font-weight:700;
  font-family:var(--sans);cursor:pointer;
}
.btn-gold:hover{background:var(--gold-l)}
.ct-msg{margin:0 0 24px;padding:16px 20px;border-radius:8px;font-size:16px;line-height:1.55;max-width:640px;margin-left:auto;margin-right:auto;text-align:left}
.ct-ok{background:#2E3A2C;border:1px solid #46603F;color:#D9E7D3}
.ct-ko{background:#3A2C2C;border:1px solid #60403F;color:#E7D5D3}
.ct-legal{margin:6px 0 0;font-size:13.5px;line-height:1.55;color:var(--dark-muted)}

/* ---------- Pied de page ---------- */

.ft{background:var(--foot);color:var(--dark-muted);padding-top:clamp(40px,6vw,64px)}
.ft-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:clamp(28px,3.4vw,44px);padding-bottom:48px}
.ft-title-sub{margin-top:26px}
.ft-hours span{display:flex;justify-content:space-between;gap:14px;font-size:14.5px}
.ft-h{color:var(--faint)}
.ft-grid>*{min-width:0}
.ft-logo{height:46px;width:auto;display:block;margin-bottom:20px;filter:brightness(0) invert(1)}
.ft-name{font-family:var(--serif);font-size:22px;color:var(--dark-text);margin-bottom:14px;line-height:1.2}
.ft-p{margin:0;font-size:15px;line-height:1.65;max-width:30em}
.ft-title{font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--faint);margin-bottom:18px}
.ft-links{display:grid;gap:11px;font-size:15px;line-height:1.5}
.ft-links a{color:var(--dark-soft)}
.ft-links a:hover{color:var(--dark-text)}
.ft-bottom{
  border-top:1px solid var(--dark3);padding:24px 0;
  display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;
  font-size:13.5px;color:var(--faint);
}
.ft-bottom a{color:var(--faint)}
.ft-bottom a:hover{color:var(--dark-soft)}
.ft-legal{display:flex;gap:24px;flex-wrap:wrap}

/* Badge Website Carbon */
.ft-carbone{display:inline-flex;align-items:stretch;margin-top:24px;max-width:100%;border:1px solid var(--gold-soft);border-radius:8px;overflow:hidden;font-size:12.5px;font-weight:700;line-height:1.2}
.ft-carbone .wcb-mesure{display:flex;flex-direction:column;justify-content:center;gap:3px;padding:9px 15px;background:var(--dark2);color:var(--dark-text)}
.ft-carbone .wcb-sous{font-weight:600;font-size:11.5px;color:var(--dark-muted)}
.ft-carbone .wcb-marque{display:flex;align-items:center;padding:10px 15px;background:var(--gold-soft);color:var(--ink);white-space:nowrap;transition:background .2s ease}
.ft-carbone:hover .wcb-marque{background:var(--gold-l);color:var(--ink)}
.ft-carbone sub{font-size:.75em;line-height:0}

/* ---------- Page contact : acces rapides ---------- */

.ct-hero{align-items:end}
.ct-quick{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.ct-quick>*{min-width:0}
.qc{border-radius:0;padding:clamp(20px,2.4vw,26px);display:block}
.qc-dark{background:var(--ink);color:var(--dark-text)}
.qc-dark:hover{background:var(--dark2);color:var(--dark-text)}
.qc-light{background:var(--card);border:1px solid var(--line);color:var(--ink)}
.qc-light:hover{border-color:var(--blue-l);color:var(--ink)}
.qc-k{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--faint);margin-bottom:12px}
.qc-v{font-family:var(--serif);font-size:clamp(17px,1.8vw,23px);line-height:1.25;overflow-wrap:anywhere}
.qc-dark .qc-v{color:var(--gold)}
.qc-s{font-size:14px;margin-top:8px}
.qc-dark .qc-s{color:var(--dark-muted)}
.qc-light .qc-s{color:var(--muted)}

/* ---------- Pages internes ---------- */

.page-hero{background:var(--bg2);border-bottom:1px solid var(--line);padding-top:clamp(40px,5vw,64px);padding-bottom:clamp(32px,4vw,48px)}
.page-hero .h1{margin-bottom:0;font-size:clamp(32px,4.6vw,50px);line-height:1.08}
.article{max-width:60em;font-size:16.5px;line-height:1.7;color:var(--muted)}
.article h2{margin:40px 0 14px;font-size:clamp(23px,2.6vw,30px);color:var(--ink)}
.article h3{margin:28px 0 10px;font-size:clamp(19px,2vw,23px);color:var(--ink)}
.article p{margin:0 0 16px}
.article ul{display:grid;gap:9px;margin:0 0 20px}
.article li{display:flex;gap:11px;color:var(--ink2)}
.article li::before{content:"\2022";color:var(--blue);font-weight:700;flex:0 0 auto}
.article strong{color:var(--ink)}
.article a{border-bottom:1px solid var(--blue-l)}

/* ---------- Page service (Agence GEO) ---------- */

.bc{font-size:13.5px;color:var(--faint);margin:0}
.bc a{color:var(--faint)}
.bc a:hover{color:var(--muted)}
.bc-sep{margin:0 8px}
.bc-cur{color:var(--muted)}
.geo-top{padding-top:clamp(32px,5vw,56px);padding-bottom:0}
.geo-hero{padding-top:26px}
.h1-tight{margin-bottom:12px}
.h2-sub{
  font-family:var(--sans);font-size:clamp(18px,2vw,22px);
  font-weight:600;line-height:1.35;letter-spacing:0;color:#494C46;
  max-width:26em;margin:0 0 28px;
}
.ph-4x5{aspect-ratio:4/5}
/* Visuel des heros de pages services : ratio adapte aux captures de sites */
.ph-svc{aspect-ratio:4/3}
.ph-1x1{aspect-ratio:1/1}

/* Section Methode : visuel a gauche, etapes en accordeons a droite */
.methode-grid{
  display:grid;grid-template-columns:.85fr 1.15fr;
  gap:clamp(28px,4vw,56px);align-items:stretch;
}
.methode-grid>*{min-width:0}
/* Le visuel epouse la hauteur de la colonne de droite */
.methode-grid .ph-1x1{aspect-ratio:auto;height:100%;min-height:320px}
.acc-list{display:grid;gap:14px}
.acc-item{
  background:var(--card);border:0;border-radius:0;
  padding:0 clamp(16px,1.8vw,22px);
}
.acc-q{
  display:flex;align-items:center;gap:clamp(14px,1.6vw,20px);
  padding:clamp(13px,1.5vw,17px) 0;cursor:pointer;list-style:none;
}
.acc-q::-webkit-details-marker{display:none}
.acc-q,.acc-q:focus,.acc-q:focus-visible{outline:none;border:0;box-shadow:none}
.acc-n{
  display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;
  width:clamp(46px,3.8vw,60px);height:clamp(46px,3.8vw,60px);
  border-radius:2px;background:var(--gold-soft);
  font-family:var(--serif);font-size:15px;
  font-weight:700;letter-spacing:.1em;color:var(--ink);
}
.acc-t{
  font-family:var(--serif);font-size:clamp(18px,1.9vw,22px);
  font-weight:500;line-height:1.25;flex:1;min-width:0;
}
.acc-q::after{
  content:"";flex:0 0 auto;width:10px;height:10px;margin-right:4px;
  border-right:2px solid var(--faint);border-bottom:2px solid var(--faint);
  transform:rotate(45deg) translate(-3px,-3px);
  transition:transform .25s ease,border-color .2s ease;
}
.acc-item[open] .acc-q::after{transform:rotate(-135deg) translate(-3px,-3px)}
.acc-q:hover::after{border-color:var(--blue)}
.acc-a{
  padding:0 0 clamp(18px,2vw,24px);
  margin-left:calc(clamp(46px,3.8vw,60px) + clamp(14px,1.6vw,20px));
}
.acc-a p{margin:0 0 14px;font-size:16.5px;line-height:1.65;color:var(--muted);text-wrap:pretty}
.acc-a p:last-child{margin-bottom:0}
.acc-a ul{display:grid;gap:10px;margin:0 0 18px}
.acc-a li{display:flex;gap:11px;font-size:16.5px;line-height:1.55;color:var(--ink2)}
.acc-a li::before{content:"\2713";color:var(--blue);font-weight:700;flex:0 0 auto}
.def-h{margin:0}
.def-p{margin:0 0 18px;font-size:clamp(17px,1.7vw,19px);line-height:1.62;color:var(--ink2);text-wrap:pretty}
.def-p2{margin:0 0 30px;font-size:clamp(16px,1.6vw,18px);line-height:1.65;color:var(--muted);text-wrap:pretty}
.p-dark{margin:0 0 18px;font-size:clamp(17px,1.7vw,19px);line-height:1.62;color:var(--dark-text);text-wrap:pretty}
.p-dark2{margin:0 0 18px;font-size:clamp(16px,1.6vw,18px);line-height:1.65;color:#C4BBAD;text-wrap:pretty}
.p-dark2 a{color:var(--gold);border-bottom:1px solid var(--darkline)}
.p-dark2 a:hover{color:var(--gold-l)}
.p-dark2:last-of-type{margin-bottom:32px}

.mini-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:2px;background:var(--line);border:1px solid var(--line);border-radius:2px;overflow:hidden}
.mini-cell{background:var(--card);padding:clamp(24px,2.8vw,32px) clamp(20px,2.4vw,30px)}
.mini-t{font-family:var(--serif);font-size:clamp(20px,2.2vw,24px);font-weight:500;line-height:1.2;margin:0 0 8px}
.mini-s{margin:0;font-size:15.5px;line-height:1.6;color:var(--muted)}
.mini-num{font-family:var(--serif);font-size:15px;font-weight:700;color:var(--gold);letter-spacing:.1em;margin-bottom:14px}
.mini-grid--dark{background:var(--darkline);border-color:var(--darkline)}
.mini-grid--dark .mini-cell{background:var(--dark2)}
.mini-grid--dark .mini-t,.mini-grid--dark .h3{color:var(--dark-text)}
.mini-grid--dark .mini-s{color:#C4BBAD}
.mini-grid--dark .h3{margin-bottom:10px;font-size:clamp(20px,2.2vw,24px)}

.mini-grid--3{grid-template-columns:repeat(3,minmax(0,1fr))}
.mini-grid--5{grid-template-columns:repeat(5,minmax(0,1fr))}
.why-list--3{grid-template-columns:repeat(3,minmax(0,1fr))}
a.mini-cell{display:block;color:inherit}
a.mini-cell:hover{color:inherit}
.mini-grid--dark a.mini-cell:hover{background:var(--dark3)}
.mini-grid:not(.mini-grid--dark) a.mini-cell:hover{background:var(--bg)}
.mini-num--blue{color:var(--blue)}
.mini-grid .h3{margin-bottom:8px;font-size:clamp(19px,2vw,21px)}
.p-dark2 strong{color:var(--dark-text);font-weight:700}

.pr-band{border-top:1px solid var(--darkline);border-bottom:1px solid var(--darkline);padding:28px 0;margin:0 0 24px}
.pr-band-v{font-family:var(--serif);font-size:clamp(28px,4vw,40px);color:var(--gold);line-height:1.05;margin-bottom:12px}
.pr-band-p{margin:0;font-size:17px;line-height:1.6;color:#C4BBAD}

.hl{background:var(--bg2);border-radius:0;padding:clamp(24px,3vw,34px) clamp(22px,3vw,36px)}
.hl-clair{background:var(--card);border:1px solid var(--line)}
.hl p{margin:0;font-size:clamp(17px,1.7vw,19px);line-height:1.62;color:var(--ink2);text-wrap:pretty}

/* Liste de points forts, variantes 5 colonnes et fond sombre */
.why-list--4{grid-template-columns:repeat(4,minmax(0,1fr))}
.why-list--5{grid-template-columns:repeat(5,minmax(0,1fr))}
.why-list--4 .why-cell{padding:clamp(20px,2.2vw,26px) clamp(18px,2vw,22px)}
.why-list--4 .why-cell span{font-size:16.5px}
.why-list--dark{background:var(--darkline);border-color:var(--darkline)}
.why-list--dark .why-cell{background:var(--dark2)}
.why-list--dark .why-cell::before{color:var(--gold)}
.why-list--dark .why-cell span{color:var(--dark-text);font-size:16px}

/* Deux cartes de largeurs inegales (cout / delai) */
.duo-cards{display:grid;grid-template-columns:1.25fr .75fr;gap:24px}
.duo-cards>*{min-width:0}
.card-band{background:var(--bg2);border-radius:0;padding:clamp(28px,3.2vw,44px) clamp(24px,3vw,42px);display:flex;flex-direction:column;justify-content:center}
.h2-card{margin:0 0 20px;font-size:clamp(24px,3vw,34px);line-height:1.12;text-wrap:balance}
.h2-card--s{font-size:clamp(22px,2.6vw,30px)}
.big-v{font-family:var(--serif);font-size:clamp(28px,4vw,40px);line-height:1.05;margin-bottom:20px}
.big-v--blue{color:var(--blue)}
.card-p{margin:0 0 14px;font-size:clamp(16px,1.6vw,17.5px);line-height:1.65;color:var(--muted);text-wrap:pretty}
.card-p:last-child{margin-bottom:0}

/* Etapes numerotees sur 3 colonnes */
.step-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:26px}
.step-grid--4{grid-template-columns:repeat(4,minmax(0,1fr))}
.big-v--xl{font-size:clamp(30px,4.4vw,44px)}
.big-v--gold{color:var(--gold)}
.step-item{border-top:1.5px solid var(--ink);padding-top:20px;min-width:0}
.step-p{margin:0;font-size:17px;line-height:1.6;color:var(--ink2);text-wrap:pretty}

/* Cartes cliquables (services d'une page interne) */
.card-links{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.card-link{
  background:var(--card);border:1px solid var(--line);border-radius:0;
  padding:clamp(26px,3vw,36px) clamp(24px,2.8vw,34px);
  display:flex;flex-direction:column;color:inherit;min-width:0;
}
.card-link:hover{border-color:var(--blue-l);color:inherit}
.card-link .h3{margin:0 0 20px;flex:1;font-size:clamp(20px,2.2vw,25px)}
.card-go{font-size:14.5px;font-weight:700;color:var(--blue)}
.cell-label{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--dark-muted);margin-bottom:14px}
.mini-grid--dark .big-v{margin-bottom:16px}

.mb-0{margin-bottom:0}
.mb-24{margin-bottom:24px}
.mb-32{margin-bottom:32px}

/* Variante claire du bloc contact (le fond sombre est deja pris par la section precedente) */
.ct-clair{background:var(--bg2);color:var(--ink)}
.ct-creme{background:var(--bg)}
.ct-clair .h2{color:var(--ink)}
.ct-clair .ct-lead{color:var(--muted)}
.ct-clair .f-field label{color:var(--faint)}
.ct-clair .f-field input,.ct-clair .f-field select,.ct-clair .f-field textarea{background:var(--card);border-color:var(--line);color:var(--ink)}
.ct-clair .f-field input::placeholder,.ct-clair .f-field textarea::placeholder{color:#9A958C}
.ct-clair .f-field input:focus,.ct-clair .f-field select:focus,.ct-clair .f-field textarea:focus{border-color:var(--blue)}
.ct-clair .btn-gold{background:var(--ink);color:var(--bg)}
.ct-clair .btn-gold:hover{background:var(--dark3)}
.ct-clair .ct-legal{color:var(--faint)}
.ct-clair .ct-ok{background:#E4EDDF;border-color:#B8CFAE;color:#31502A}
.ct-clair .ct-ko{background:#F3E2E0;border-color:#D6ADA9;color:#6E3A34}

/* =========================================================================
   ANIMATIONS
   ========================================================================= */

/* Revelation au scroll : la classe .rv est posee par anim.js, uniquement
   sur ce qui est sous la ligne de flottaison. Sans JS, rien n'est masque. */
.rv{opacity:0;transform:translateY(18px);transition:opacity .55s ease,transform .55s cubic-bezier(.22,.61,.36,1)}
.rv.is-in{opacity:1;transform:none}
.rv-d1{transition-delay:.07s}
.rv-d2{transition-delay:.14s}
.rv-d3{transition-delay:.21s}
.rv-d4{transition-delay:.28s}
.rv-d5{transition-delay:.35s}

/* Transitions de survol */
a,
.btn-dark,.btn-ghost,.btn-gold,.tar-cta,
.pf-card,.sv-card,.tar-card,.card-link,.mini-cell,.why-cell,
.f-field input,.f-field select,.f-field textarea{
  transition:background-color .22s ease,color .22s ease,border-color .22s ease,transform .28s ease;
}
.pf-card img{transition:transform .6s cubic-bezier(.22,.61,.36,1)}
.pf-card:hover img{transform:scale(1.05)}
.pf-card:hover .pf-go,.card-link:hover .card-go{color:var(--gold-l)}
.card-link:hover,.tar-card:hover{transform:translateY(-4px)}
.sv-card:hover{border-color:var(--gold)}
.btn-dark:hover,.btn-gold:hover,.tar-cta:hover{transform:translateY(-2px)}
.acc-q,.faq-q{transition:color .2s ease}
.acc-q:hover,.faq-q:hover{color:var(--blue-d)}

/* =========================================================================
   RESPONSIVE - toujours en fin de fichier pour ecraser les regles de base
   ========================================================================= */

@media (max-width:1340px){
  .nav-in{justify-content:center;row-gap:14px}
  .nav-links{justify-content:center}
}

@media (max-width:1080px){
  /* --- Menu mobile : burger + panneau plein ecran ---
     backdrop-filter est neutralise : il ferait de .nav le bloc conteneur
     du panneau en position:fixed, qui ne couvrirait plus l'ecran. */
  .nav{position:sticky;background:var(--bg);-webkit-backdrop-filter:none;backdrop-filter:none;z-index:50}
  .nav-in{flex-wrap:nowrap;justify-content:space-between;gap:12px;row-gap:0;padding-top:12px;padding-bottom:12px}
  .nav-actions{display:flex}
  .nav-burger{display:inline-flex}

  .nav-links{
    position:fixed;inset:0;z-index:40;background:var(--bg);
    display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start;
    gap:0;padding:96px clamp(20px,5vw,40px) 48px;
    overflow-y:auto;overscroll-behavior:contain;
    transform:translateX(100%);visibility:hidden;
    transition:transform .28s ease;
  }
  .nav-open .nav-links{transform:none;visibility:visible}
  .nav-links>a,
  .nav-top{
    display:flex;width:100%;padding:18px 0;border-bottom:1px solid var(--line);
    font-family:var(--serif);font-size:18px;font-weight:400;color:var(--ink);
  }
  .nav-item{position:static;display:block;width:100%;padding:0;margin:0}
  .nav-top::after{display:none}
  .nav-sub{
    position:static;transform:none;min-width:0;margin:0;
    opacity:1;visibility:visible;pointer-events:auto;
    background:none;border:0;padding:0 0 0 18px;
    display:flex;flex-direction:column;gap:0;
  }
  .nav-sub a{padding:14px 0;border-radius:0;border-bottom:1px solid var(--line);font-size:15.5px}
  .nav-sub a:hover{background:none}
  .nav-links>.btn-dark{
    justify-content:center;margin-top:28px;border-bottom:0;border-radius:100px;
    font-family:var(--sans);font-size:15.5px;font-weight:700;color:var(--bg);
  }

  .pf-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .sv-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .mini-grid--3{grid-template-columns:repeat(2,minmax(0,1fr))}
  .rev-track>.rev{flex-basis:calc((100% - 24px) / 2)}
  .why-list--5{grid-template-columns:repeat(3,minmax(0,1fr))}
  .mini-grid--5{grid-template-columns:repeat(3,minmax(0,1fr))}
  .step-grid--4{grid-template-columns:repeat(3,minmax(0,1fr))}
}

@media (max-width:900px){
  .hero-in{grid-template-columns:1fr}
  .hero-media{order:-1;max-width:min(440px,78%);margin-inline:0 auto;width:100%}
  .why-grid{grid-template-columns:1fr}
  .rz-head{grid-template-columns:1fr;align-items:start}
  .rz-grid{grid-template-columns:1fr}
  .cta-band{grid-template-columns:1fr}
  .methode-grid{grid-template-columns:1fr}
  .methode-grid .ph-1x1{aspect-ratio:1/1;height:auto;min-height:0}
  .ct-grid{grid-template-columns:1fr}
  .tar-grid{grid-template-columns:1fr;gap:32px}
  .nap-map{min-height:260px}
  .pr-grid{grid-template-columns:1fr}
  .pr-media{grid-template-columns:1fr}
  .st-row{grid-template-columns:1fr;gap:14px}
  .duo-cards{grid-template-columns:1fr}
  .card-links{grid-template-columns:repeat(2,minmax(0,1fr))}
  .step-grid,.step-grid--4{grid-template-columns:repeat(2,minmax(0,1fr))}
  .why-list--3,.why-list--4,.why-list--5{grid-template-columns:repeat(2,minmax(0,1fr))}
  .mini-grid--5{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ft-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ft-brand{grid-column:1 / -1}
}

@media (max-width:680px){
  .pf-grid{grid-template-columns:1fr}
  .sv-grid{grid-template-columns:1fr}
  .hero-proof{grid-template-columns:1fr}
  .hp-item{padding:22px 0}
  .hp-item+.hp-item{border-left:0;border-top:1px solid var(--line)}
  .acc-a{margin-left:0}
  .rev-track>.rev{flex-basis:100%}
  .why-list,.why-list--3,.why-list--4,.why-list--5{grid-template-columns:1fr}
  .mini-grid,.mini-grid--5{grid-template-columns:1fr}
  .card-links{grid-template-columns:1fr}
  .step-grid,.step-grid--4{grid-template-columns:1fr}
  .pf-head{grid-template-columns:1fr;align-items:start;gap:20px}
  .f-grid{grid-template-columns:1fr}
  .ct-quick{grid-template-columns:1fr}
  .ft-grid{grid-template-columns:1fr}
  .tb-in{justify-content:center;text-align:center}
  .tb-r{justify-content:center}
  .ft-bottom{flex-direction:column;gap:12px}
  .pf-meta{flex-direction:column;align-items:flex-start;gap:8px}
  .hero-cta .btn-lg,.hero-cta .btn-ghost{width:100%;text-align:center}
  .pr-claims{flex-direction:column;align-items:center;gap:12px}
}

/* ---------- Grands ecrans : le contenu continue de respirer ---------- */

@media (min-width:1600px){
  .wrap,
  .wrap-n{max-width:clamp(1520px,86vw,1880px)}

  .h1{font-size:clamp(74px,4.2vw,84px)}
  .h2{font-size:clamp(50px,3vw,58px)}
  .h2-sub{font-size:clamp(22px,1.35vw,26px)}
  .h3{font-size:clamp(27px,1.55vw,31px)}

  .lead{font-size:clamp(19px,1.22vw,23px);max-width:34em}
  .sec-lead,.pr-lead,.sv-lead{font-size:clamp(17.5px,1.12vw,21px);max-width:56em}
  .def-p,.p-dark,.hl p{font-size:clamp(19px,1.18vw,22px)}
  .def-p2,.p-dark2,.why-p,.why-note,.mini-s,.card-p,.st-p,.step-p{font-size:clamp(18px,1.05vw,20px)}
  .sv-p,.tar-l li,.acc-a p,.faq-a p,.faq-a li{font-size:clamp(16.5px,.98vw,18.5px)}
  .acc-t,.faq-q{font-size:clamp(23px,1.42vw,27px)}

  .sec{padding-top:clamp(76px,5vw,110px);padding-bottom:clamp(76px,5vw,110px)}
  .nav-links{font-size:15.5px;gap:clamp(22px,1.6vw,30px)}
  .btn-dark{font-size:15px;padding:12px 24px}
  .brand-name{font-size:clamp(23px,1.5vw,27px)}
  .nap-map{min-height:300px}
}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *{animation-duration:.01ms !important;transition-duration:.01ms !important}
}
