/* StarLead v13.1 — charte v2 : Bricolage Grotesque 800, IBM Plex Mono pour les données, papier, encre, un seul orange.
   Concept « la fiche » : la carte de contact au format d'une fiche Google.
   v13.1 : échelle typographique resserrée, alternance des fonds (papier, blanc, noir, orange), preuves en image.
   Une seule ombre (la fiche et les cadres d'écran), aucun dégradé, un seul mouvement (l'anneau du bouton d'appel). */
@font-face{font-family:"Bricolage";src:url(/assets/fonts/bricolage-grotesque-latin-wght-normal.woff2) format("woff2");font-weight:200 800;font-display:swap}
@font-face{font-family:"Plex Mono";src:url(/assets/fonts/ibm-plex-mono-latin-400-normal.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Plex Mono";src:url(/assets/fonts/ibm-plex-mono-latin-500-normal.woff2) format("woff2");font-weight:500;font-display:swap}
:root{--bg:#F2F2EE;--paper:#FFFFFF;--ink:#141414;--ink-2:#3A3A40;--mute:#5F5F66;--line:#D9D9D1;--band:#0E0E0E;--card-d:#191919;--line-d:#2D2D2D;--ok:#1E9E52;--acc:#E8552B;--acc-h:#F06A42;--acc-d:#B03813;--pad:clamp(16px,4vw,48px);--hd:60px;--r:20px;--sh:0 1px 2px rgba(20,20,20,.05),0 20px 44px -20px rgba(20,20,20,.25)}
*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%;scroll-padding-top:calc(var(--hd) + 12px)}
@media (prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}
body{font-family:"Bricolage",system-ui,-apple-system,"Segoe UI",sans-serif;background:var(--bg);color:var(--ink);font-size:17px;line-height:1.55;letter-spacing:-.005em;overflow-x:hidden;-webkit-font-smoothing:antialiased}
img{display:block;max-width:100%;height:auto}
a{color:inherit}
button,input,select,textarea{font:inherit;color:inherit}
h1,h2,h3{overflow-wrap:break-word;text-wrap:balance}
p{text-wrap:pretty}
.mono{font-family:"Plex Mono",ui-monospace,Menlo,Consolas,monospace;letter-spacing:0}
.wrap{max-width:1180px;margin:0 auto;padding:0 var(--pad)}
:focus-visible{outline:3px solid var(--acc);outline-offset:3px;border-radius:6px}
.skip{position:absolute;left:-999px;top:8px;background:var(--ink);color:#fff;padding:10px 14px;z-index:99;border-radius:8px}.skip:focus{left:8px}
.vh{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.lnk{font-weight:700;text-decoration:underline;text-decoration-color:var(--acc);text-decoration-thickness:2px;text-underline-offset:4px}
.lnk:hover{color:var(--acc-d)}
.txt a,.in a,.answer a,.faq .a a,.ul a,.note a,.steps a,.tbl a,.zt a,.lvl a,.legal a,.fok a,.duo li a{text-decoration:underline;text-decoration-color:var(--acc);text-decoration-thickness:1.5px;text-underline-offset:3px}
.txt a:hover,.in a:hover,.answer a:hover,.faq .a a:hover,.ul a:hover,.note a:hover,.steps a:hover,.tbl a:hover,.zt a:hover,.lvl a:hover,.legal a:hover,.duo li a:hover{color:var(--acc-d)}
.lnk{display:inline-block;margin-right:14px}

/* ---------- Boutons : pilules, une seule action orange par écran, texte foncé sur orange ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;font-weight:700;font-size:16px;line-height:1.15;padding:13px 22px;border-radius:999px;text-decoration:none;border:1.5px solid transparent;cursor:pointer;min-height:50px;text-align:center;background:none;transition:background .15s,color .15s}
.btn-acc{background:var(--acc);color:var(--ink)}
.btn-line{border-color:var(--ink);color:var(--ink)}
.btn-wline{border-color:#fff;color:#fff}
.btn-ink{background:var(--ink);color:#fff}
@media (hover:hover){.btn-acc:hover{background:var(--acc-h)}.btn-line:hover{background:var(--ink);color:#fff}.btn-wline:hover{background:#fff;color:var(--ink)}.btn-ink:hover{background:#000}}
.btn[disabled]{opacity:.6;cursor:wait}
.btn svg{width:18px;height:18px;flex:none}
/* Seul mouvement du site : l'anneau du bouton d'appel (repris de « l'appel entrant »). */
.ringi{position:relative;width:18px;height:18px;flex:none;display:inline-flex;margin:0 3px 0 4px}
.ringi::before{content:"";position:absolute;inset:-5px;border-radius:50%;border:2px solid currentColor;opacity:0}
@media (prefers-reduced-motion:no-preference){.btn-call .ringi::before{animation:ring 2.2s ease-out infinite}}
@keyframes ring{0%{transform:scale(.6);opacity:.75}70%,100%{transform:scale(1.45);opacity:0}}

/* ---------- En-tête ---------- */
header.site{position:sticky;top:0;z-index:50;background:var(--bg);border-bottom:1px solid var(--line)}
.hd{display:flex;align-items:center;justify-content:space-between;height:var(--hd);gap:14px}
.wm{font-weight:800;font-size:23px;letter-spacing:-.045em;display:inline-flex;align-items:center;line-height:1;text-decoration:none}
.wm .ring{width:11px;height:11px;border-radius:50%;border:2.5px solid var(--acc);margin-left:4px;position:relative;flex:none}
.wm .ring::after{content:"";position:absolute;inset:1.5px;border-radius:50%;background:var(--acc)}
.menu{display:none;list-style:none;align-items:center;gap:2px}
.menu a{font-size:15px;font-weight:600;text-decoration:none;padding:9px 11px;border-radius:999px;white-space:nowrap}
.menu a:hover{background:#E4E4DD}
.menu a[aria-current="page"]{background:var(--ink);color:#fff}
.hd-r{display:flex;align-items:center;gap:8px}
.hd-r .btn{min-height:44px;padding:9px 16px;font-size:15px}
.hd-r .num{display:none;font-family:"Plex Mono",monospace;font-weight:500;letter-spacing:0}
.burger{width:44px;height:44px;border:1.5px solid var(--ink);border-radius:50%;background:none;display:inline-flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;cursor:pointer}
.burger span{display:block;width:18px;height:2px;background:var(--ink);transition:transform .2s,opacity .2s}
.burger[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.burger[aria-expanded="true"] span:nth-child(2){opacity:0}
.burger[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
.mmenu{display:none;position:fixed;inset:var(--hd) 0 0 0;z-index:49;background:var(--bg);padding:10px var(--pad) 28px;overflow-y:auto}
.mmenu.open{display:block}
.mmenu a.ml{display:flex;justify-content:space-between;align-items:baseline;gap:12px;padding:15px 0;border-bottom:1px solid var(--line);font-size:21px;font-weight:800;letter-spacing:-.02em;text-decoration:none}
.mmenu a.ml small{font:400 13px "Plex Mono",monospace;color:var(--mute);letter-spacing:0;white-space:nowrap}
.mmenu .btn{width:100%;margin-top:14px}
@media (min-width:1180px){:root{--hd:72px}.menu{display:flex}.burger,.mmenu{display:none!important}.hd-r .num{display:inline}.hd-r .short{display:none}.wm{font-size:25px}}

/* ---------- Premier écran : un seul très grand titre, deux lignes de réponse, la fiche en vraie carte ---------- */
.hero{padding:18px 0 34px}
.hero-g{display:grid;gap:18px}
.hero-t{min-width:0}
.bc{font:400 12.5px "Plex Mono",monospace;color:var(--mute);margin-bottom:10px}
.bc ol{list-style:none;display:flex;flex-wrap:wrap;gap:4px 8px}
@media (max-width:699px){.bc li:last-child:not(:first-child){display:none}}
.bc li+li::before{content:"/";margin-right:8px;color:var(--line)}
.bc a{text-decoration:none}.bc a:hover{text-decoration:underline}
h1{font-weight:800;letter-spacing:-.045em;line-height:1.02;font-size:clamp(30px,8.7vw,40px)}
h1 .h1s{display:block;font-size:.56em;font-weight:600;letter-spacing:-.025em;line-height:1.18;color:var(--ink-2);margin-top:.45em}
h1.l{font-size:clamp(25px,6.9vw,34px);letter-spacing:-.035em;line-height:1.08}
.answer{margin-top:12px;font-size:16.5px;line-height:1.5;max-width:54ch;color:var(--ink-2)}
.answer b{color:var(--ink)}
.answer .lg{display:none}
.stars{color:var(--acc-d);letter-spacing:1px}
.fiche{position:relative;background:var(--paper);border:1px solid var(--line);border-radius:var(--r);padding:12px;display:grid;grid-template-columns:84px 1fr;gap:10px 14px;align-items:center;box-shadow:var(--sh)}
.fiche-ph{width:84px;height:84px;border-radius:16px;object-fit:cover;object-position:38% 22%}
.fiche-id{min-width:0;line-height:1.3}
.fiche-n{font-size:18px;font-weight:800;letter-spacing:-.02em;line-height:1.15}
.fiche-k{font:400 12.5px "Plex Mono",monospace;color:var(--mute);margin-top:2px}
.fiche-r{font-size:14.5px;margin-top:3px}.fiche-r a{text-decoration:none}.fiche-r a:hover{text-decoration:underline}
.fiche-s{font:400 12px "Plex Mono",monospace;color:var(--mute);margin-top:3px}
.fiche-s::before{content:"";display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--ok);margin-right:6px;vertical-align:1px}
.fiche-f{grid-column:1/-1;list-style:none;border-top:1px solid var(--line)}
.fiche-f li{display:flex;justify-content:space-between;align-items:baseline;gap:12px;padding:8px 2px;border-bottom:1px solid var(--line);font-size:14.5px;line-height:1.3}
.fiche-f span{font:400 12.5px "Plex Mono",monospace;color:var(--mute);flex:none}
.fiche-f b{font-weight:700;text-align:right}
.fiche-a{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr;gap:8px}
.fiche-a .btn{min-height:48px;padding:10px 8px;font-size:15px;gap:6px}
.fiche-a .ringi{margin:0 3px 0 0}
.fiche-a.one{grid-template-columns:1fr}
.fiche-r{white-space:nowrap}
@media (max-width:380px){.fiche{grid-template-columns:72px 1fr;gap:10px 12px}.fiche-ph{width:72px;height:72px}.fiche-r{font-size:14px}.fiche-r .stars{letter-spacing:0}}
@media (min-width:700px){
  .hero{padding:30px 0 46px}
  h1{font-size:50px}
  h1.l{font-size:38px}
  .answer{margin-top:18px;font-size:18px}
  .answer .lg{display:inline}
  .fiche{grid-template-columns:112px 1fr minmax(230px,auto);padding:18px;gap:14px 22px}
  .fiche-ph{width:112px;height:112px}
  .fiche-n{font-size:21px}.fiche-r{font-size:16px}
  .fiche-a{grid-column:3;grid-row:1;grid-template-columns:1fr}
  .fiche-a .btn{font-size:15.5px;padding:11px 20px}
}
@media (min-width:960px){
  .hero{padding:44px 0 68px}
  .hero.inner{padding:34px 0 52px}
  .hero:not(.inner) .hero-g{grid-template-columns:minmax(0,1fr) minmax(360px,410px);gap:clamp(36px,5vw,72px);align-items:center}
  .hero.inner .hero-g{gap:26px}
  h1{font-size:clamp(46px,5.1vw,72px);line-height:.98}
  h1.l{font-size:clamp(34px,3.4vw,46px);line-height:1.05;max-width:24ch}
  .answer{font-size:19px;margin-top:22px}
  .hero.inner .answer{max-width:70ch;margin-top:16px;font-size:18.5px}
  /* la grande carte de l'accueil */
  .fiche.big{display:block;padding:0;overflow:hidden;--ph:clamp(160px,27vh,244px)}
  .fiche.big .fiche-ph{width:100%;height:var(--ph);border-radius:0;object-position:50% 20%}
  .fiche.big .fiche-id{padding:18px 24px 0}
  .fiche.big .fiche-n{font-size:24px}
  .fiche.big .fiche-k{font-size:13px;margin-top:4px}
  .fiche.big .fiche-r{font-size:16.5px;margin-top:8px}
  .fiche.big .fiche-s{position:absolute;left:14px;top:calc(var(--ph) - 44px);margin:0;background:#fff;color:var(--ink);border-radius:999px;padding:6px 12px 6px 10px;font-size:12.5px;line-height:1.4}
  .fiche.big .fiche-f{margin:14px 24px 0}
  .fiche.big .fiche-f li{padding:9px 0;font-size:15px}
  .fiche.big .fiche-a{padding:16px 24px 22px;gap:9px;grid-template-columns:1fr}
  .fiche.big .fiche-a .btn{min-height:48px;font-size:15.5px;padding:10px 8px}
  /* la fiche en une ligne des pages intérieures */
  .fiche:not(.big){grid-template-columns:96px minmax(190px,auto) minmax(0,1fr) auto;gap:10px 28px;padding:16px 20px}
  .fiche:not(.big) .fiche-ph{width:96px;height:96px}
  .fiche:not(.big) .fiche-f{grid-column:3;grid-row:1;border-top:0;border-left:1px solid var(--line);padding-left:28px;align-self:center}
  .fiche:not(.big) .fiche-f li{display:block;border-bottom:0;padding:0}
  .fiche:not(.big) .fiche-f span{display:block}
  .fiche:not(.big) .fiche-f b{display:block;text-align:left;font-size:16px;margin-top:3px;text-wrap:balance}
  .fiche:not(.big) .fiche-a{grid-column:4;grid-row:1;min-width:236px}
}
@media (min-width:1180px){
  .hero:not(.inner) .hero-g{grid-template-columns:minmax(0,1fr) 420px}
  .fiche.big .fiche-a{grid-template-columns:1fr 1fr}.fiche.big .fiche-a.stack{grid-template-columns:1fr}
  .fiche:not(.big) .fiche-a:not(.stack){grid-template-columns:auto auto;min-width:0}
  .fiche:not(.big) .fiche-a.stack{min-width:260px}
  .fiche:not(.big) .fiche-a .btn{padding:11px 22px;white-space:nowrap}
}
/* Téléphone, pages intérieures : la fiche passe juste sous le titre (qui, prix, appeler), le texte d'introduction vient après. */
@media (max-width:699px){
  .hero{padding-top:12px}
  .hero.inner .hero-t{display:contents}
  .hero.inner .bc{order:1;margin-bottom:-8px}
  .hero.inner h1{order:2}
  .hero.inner .fiche{order:3}
  .hero.inner .answer{order:4;margin-top:0}
  .hero.inner .hero-extra{order:5;margin-top:0}
}
.hero-extra{margin-top:18px}

/* ---------- Sections : le rythme vient des fonds (papier, blanc, noir, orange), plus des filets noirs ---------- */
.sec{padding:44px 0}
.sec.w{background:var(--paper)}
.sec.d{background:var(--band);color:#fff}
.sec.o{background:var(--acc);color:var(--ink)}
main>.sec:not(.w):not(.d):not(.o)+.sec:not(.w):not(.d):not(.o),main>.sec.w+.sec.w{border-top:1px solid var(--line)}
.sh{max-width:760px}
h2{font-weight:800;letter-spacing:-.035em;line-height:1.08;font-size:clamp(25px,6.4vw,31px);max-width:24ch}
.sec>.wrap>p.in,.in{margin-top:12px;max-width:60ch;color:var(--ink-2);font-size:16.5px}
.sec.d .in{color:#C9C9CE}
.sb{margin-top:22px}
.sb>:first-child{margin-top:0}
h3{font-weight:800;letter-spacing:-.02em;line-height:1.15;font-size:20px}
.txt{max-width:60ch}.txt p{margin-top:12px;color:var(--ink-2)}.txt p:first-child{margin-top:0}.txt p b,.txt li b{color:var(--ink)}
.txt ul,.ul{list-style:none;margin-top:14px;max-width:70ch}
.txt ul li,.ul li{position:relative;padding:9px 0 9px 22px;border-top:1px solid var(--line);color:var(--ink-2)}
.txt ul li:last-child,.ul li:last-child{border-bottom:1px solid var(--line)}
.txt ul li::before,.ul li::before{content:"";position:absolute;left:2px;top:19px;width:9px;height:2px;background:var(--acc)}
.ul li b{color:var(--ink)}
.cta-row{display:flex;flex-wrap:wrap;gap:10px 14px;margin-top:22px;align-items:center}
.note{font:400 13px "Plex Mono",monospace;color:var(--mute);margin-top:14px;max-width:84ch;line-height:1.55}
.sec.d .lnk{color:#fff}
.sec.o .lnk{text-decoration-color:var(--ink)}.sec.o .lnk:hover{color:var(--ink);text-decoration-thickness:3px}
@media (min-width:900px){
  .sec{padding:84px 0}
  h2{font-size:clamp(32px,2.9vw,40px)}
  .in{font-size:18px;margin-top:14px}
  .sb{margin-top:36px}
  h3{font-size:22px}
  .sec.split>.wrap{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,7fr);gap:clamp(40px,5vw,72px);align-items:start}
  .sec.split .sb{margin-top:0}
  .sec.split .sh{position:sticky;top:calc(var(--hd) + 28px)}
}

/* Lignes d'offre : un panneau blanc, le prix en mono à droite, une flèche quand la ligne mène quelque part. */
.rows{list-style:none;background:var(--paper);border:1px solid var(--line);border-radius:var(--r);overflow:hidden}
.rows>li+li{border-top:1px solid var(--line)}
.rows>li>a,.rows>li>div{display:grid;grid-template-columns:1fr auto;gap:3px 16px;padding:17px 18px;text-decoration:none;align-items:baseline}
.rows b{font-size:20px;font-weight:800;letter-spacing:-.02em;line-height:1.2}
.rows .d{grid-column:1/-1;color:var(--ink-2);font-size:15.5px;max-width:60ch}
.rows .p{grid-column:2;grid-row:1;font:500 14.5px "Plex Mono",monospace;white-space:nowrap;text-align:right}
.rows .p small{display:block;font:400 11.5px "Plex Mono",monospace;color:var(--mute)}
.rows>li>a{transition:background .15s}
@media (hover:hover){.rows>li>a:hover{background:#FAFAF7}.rows>li>a:hover b{text-decoration:underline;text-decoration-color:var(--acc);text-decoration-thickness:3px;text-underline-offset:5px}}
@media (min-width:800px){
  .rows>li>a,.rows>li>div{grid-template-columns:minmax(200px,3fr) 6fr minmax(150px,auto) 22px;padding:24px 28px;gap:0 28px;align-items:center}
  .rows b{font-size:23px}
  .rows .d{grid-column:2;grid-row:1;font-size:16px}
  .rows .p{grid-column:3;font-size:16px}
  .rows>li>a::after{content:"→";grid-column:4;grid-row:1;font:400 20px/1 "Plex Mono",monospace;color:var(--acc-d);transition:transform .15s}
  .rows>li>a:hover::after{transform:translateX(4px)}
}

/* Tableaux de données (prix, abonnements, résultats mesurés) : mono pour les chiffres. */
.tbl{width:100%;border-collapse:collapse;margin-top:22px;font-size:15.5px}
.tbl caption{text-align:left;font:400 13px "Plex Mono",monospace;color:var(--mute);padding-bottom:8px}
.tbl th,.tbl td{text-align:left;vertical-align:top;padding:12px 14px 12px 0;border-bottom:1px solid var(--line)}
.tbl thead th{font:500 12.5px "Plex Mono",monospace;color:var(--mute);border-bottom:1px solid var(--ink);font-weight:500}
.tbl tbody th{font-weight:700}
.tbl .n{font-family:"Plex Mono",monospace;font-weight:500;white-space:nowrap}
.tbl .src{font:400 13px "Plex Mono",monospace;color:var(--mute)}
.tblw{overflow-x:auto;-webkit-overflow-scrolling:touch}
@media (max-width:699px){
  .tbl.stack thead{position:absolute;left:-9999px}
  .tbl.stack tr{display:block;padding:12px 0;border-bottom:1px solid var(--line)}
  .tbl.stack th,.tbl.stack td{display:block;border:0;padding:2px 0}
  .tbl.stack td[data-l]::before{content:attr(data-l) " : ";font:400 12.5px "Plex Mono",monospace;color:var(--mute)}
  .tbl.stack tbody th{font-size:17px;font-weight:800}
}
/* Bloc « Résultats mesurés » : indicateur, valeur, source, date. */
.mes{border:1px solid var(--line);border-radius:var(--r);background:var(--paper);padding:16px 16px 6px}
.mes-t{font:500 12.5px "Plex Mono",monospace;display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap}
.mes-t span:last-child{color:var(--mute)}
.mes .tbl{margin-top:8px}
.mes .tbl tr:last-child td,.mes .tbl tr:last-child th{border-bottom:0}
.mes .v{font:500 clamp(20px,5vw,26px)/1.1 "Plex Mono",monospace;color:var(--ink)}
.mes-none{padding:10px 0 12px;color:var(--ink-2)}
@media (min-width:700px){.mes{padding:22px 24px 10px}}

/* Avis Google cités mot pour mot : des cartes (étoiles, texte, initiale et nom). */
.avis-h{display:flex;flex-wrap:wrap;gap:6px 14px;align-items:center;font-size:16.5px;color:var(--ink-2)}
.avis-h .big{font:500 44px/1 "Plex Mono",monospace;letter-spacing:-.04em;color:var(--ink)}
.avis-h .stars{font-size:20px}
.avis{list-style:none;margin-top:22px;display:grid;gap:14px}
.avis li{background:var(--bg);border-radius:var(--r);padding:22px;display:flex;flex-direction:column;gap:14px}
.sec:not(.w) .avis li{background:var(--paper);border:1px solid var(--line)}
.avis .stars{font-size:15px}
.avis blockquote{font-size:17.5px;line-height:1.45;font-weight:500;letter-spacing:-.01em}
.avis blockquote::before{content:"« "}.avis blockquote::after{content:" »"}
.avis .more{font-size:14px;font-weight:700;text-decoration:underline;text-decoration-color:var(--acc);text-decoration-thickness:2px;text-underline-offset:3px}
.avis cite{display:grid;grid-template-columns:40px 1fr;gap:0 12px;align-items:center;font-style:normal;margin-top:auto}
.avis .av{grid-row:span 2;width:40px;height:40px;border-radius:50%;background:var(--ink);color:#fff;display:grid;place-items:center;font-weight:800;font-size:17px;text-transform:uppercase}
.avis cite b{font-weight:700;font-size:15.5px;line-height:1.25}
.avis cite span{font:400 12px "Plex Mono",monospace;color:var(--mute)}
@media (min-width:900px){.avis{grid-template-columns:repeat(3,1fr);gap:20px}.avis.c2{grid-template-columns:1fr 1fr}.avis li{padding:26px}}

/* Étapes : une liste ordonnée, des filets, pas de cartes. */
.steps{list-style:none;counter-reset:s;border-top:1px solid var(--line);max-width:860px}
.steps li{counter-increment:s;display:grid;grid-template-columns:44px 1fr;padding:15px 0;border-bottom:1px solid var(--line)}
.steps li::before{content:counter(s);font:500 15px "Plex Mono",monospace;color:var(--acc-d);padding-top:3px}
.steps b{display:block;font-size:19px;font-weight:800;letter-spacing:-.02em;line-height:1.25}
.steps span{color:var(--ink-2)}

/* Abonnements : deux cartes, dont une mise en avant ; listes à coches. (.duo reste pour les pages pas encore reprises.) */
.duo{display:grid;gap:14px;margin-top:22px}
.duo>div{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);padding:18px}
.duo .pr{font:500 24px "Plex Mono",monospace;margin:6px 0 2px}
.duo .pr small{font-size:13px;color:var(--mute);font-weight:400}
.duo ul{list-style:none;margin-top:10px}
.duo li{padding:7px 0;border-top:1px solid var(--line);font-size:15.5px;color:var(--ink-2)}
@media (min-width:800px){.duo{grid-template-columns:1fr 1fr;gap:20px}.duo>div{padding:24px}}
.plans{display:grid;gap:14px}
.plan{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);padding:22px}
.plan.hl{background:var(--ink);color:#fff;border-color:var(--ink)}
.plan .tag{display:inline-block;font:500 12px "Plex Mono",monospace;padding:5px 11px;border-radius:999px;background:var(--bg);color:var(--ink-2)}
.plan.hl .tag{background:var(--acc);color:var(--ink)}
.plan h3{font-size:27px;letter-spacing:-.03em;margin-top:14px}
.plan .pr{font:500 40px/1 "Plex Mono",monospace;letter-spacing:-.04em;margin-top:10px;white-space:nowrap}
.plan .pr small{font:400 13px "Plex Mono",monospace;letter-spacing:0;color:var(--mute);margin-left:8px}
.plan.hl .pr small{color:#A8A8AE}
.plan .pm{margin-top:12px;font-size:16px;line-height:1.4;font-weight:600;max-width:34ch}
.plan.hl .pm{color:#fff}
.plan ul{list-style:none;margin-top:16px}
.plan li{position:relative;padding:10px 0 10px 28px;border-top:1px solid var(--line);font-size:15.5px;color:var(--ink-2)}
.plan li b{color:var(--ink);font-weight:700}
.plan.hl li{border-color:#2E2E2E;color:#D6D6DA}.plan.hl li b{color:#fff}
.plan li::before{content:"";position:absolute;left:3px;top:15px;width:13px;height:7px;border-left:2.5px solid var(--acc);border-bottom:2.5px solid var(--acc);transform:rotate(-45deg)}
.vcc{list-style:none;display:grid;grid-template-columns:1fr;margin-top:16px;background:var(--paper);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;counter-reset:v}
.vcc li{counter-increment:v;padding:14px 18px;display:grid;grid-template-columns:30px 1fr;gap:0 8px;align-items:baseline}
.vcc li+li{border-top:1px solid var(--line)}
.vcc li::before{content:counter(v);font:500 13px "Plex Mono",monospace;color:var(--acc-d);grid-row:span 2}
.vcc b{font-size:19px;font-weight:800;letter-spacing:-.02em}
.vcc span{grid-column:2;color:var(--ink-2);font-size:15px}
@media (min-width:720px){
  .plans{grid-template-columns:1fr 1fr;gap:22px}.plan{padding:32px}
  .vcc{grid-template-columns:repeat(3,1fr);margin-top:22px}.vcc li{padding:18px 24px}.vcc li+li{border-top:0;border-left:1px solid var(--line)}
}

/* Portrait (« Un seul interlocuteur ») : la photo en grand, trois repères, le slogan en signature. */
.por{display:grid;gap:22px}
.por>img{width:100%;max-width:460px;aspect-ratio:4/5;object-fit:cover;object-position:50% 12%;border-radius:var(--r)}
.por h2{max-width:16ch}
.por .txt{margin-top:18px}
.tl{list-style:none;margin-top:18px;max-width:60ch}
.tl li{display:grid;grid-template-columns:62px 1fr;gap:12px;padding:12px 0;border-top:1px solid var(--line);color:var(--ink-2)}
.tl li:last-child{border-bottom:1px solid var(--line)}
.tl span{font:500 13px "Plex Mono",monospace;color:var(--acc-d);padding-top:3px}
.por .sig,.sig{font-weight:800;font-size:clamp(27px,7vw,42px);letter-spacing:-.04em;line-height:1.04;margin-top:24px;max-width:13ch;color:var(--ink)}
.por .sig::after,.sig::after{content:"";display:block;width:56px;height:5px;background:var(--acc);margin-top:14px;border-radius:3px}
@media (min-width:860px){.por{grid-template-columns:minmax(300px,440px) 1fr;gap:clamp(40px,6vw,80px);align-items:center}}

/* Résultats mesurés : une carte par client, la capture réelle du site dans un cadre d'écran, le résultat en une phrase. */
.res{list-style:none;display:grid;gap:16px}
.res-c{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;display:flex;flex-direction:column}
.res-img{display:block;padding:16px 16px 0;text-decoration:none}
.frame{display:block;border-radius:12px 12px 0 0;overflow:hidden;background:#fff;border:1px solid var(--line);border-bottom:0}
.frame-bar{display:flex;align-items:center;gap:6px;height:28px;padding:0 12px;background:#ECECE6;font:400 11.5px "Plex Mono",monospace;color:var(--mute)}
.frame-bar i{width:8px;height:8px;border-radius:50%;background:#C9C9C1}
.frame-bar span{margin-left:8px}
.frame img{width:100%;aspect-ratio:16/9;object-fit:cover;object-position:top}
.res-b{padding:20px 20px 24px;display:flex;flex-direction:column;flex:1}
.res .k{font:400 12.5px "Plex Mono",monospace;color:var(--mute)}
.res h3{font-size:22px;line-height:1.18;margin-top:8px;font-weight:700;letter-spacing:-.025em}
.res h3 b{font-weight:800;color:var(--acc-d)}
.res-l{list-style:none;margin-top:12px}
.res-l li{padding:9px 0;border-top:1px solid var(--line);color:var(--ink-2);font-size:15.5px}
.res-l b{color:var(--ink)}
.res-src{font:400 12px "Plex Mono",monospace;color:var(--mute);margin-top:12px;line-height:1.5}
.res .lnk{margin-top:16px;align-self:flex-start}
.res-b .res-src{margin-bottom:auto}
.sec.d .res-c{background:var(--card-d);border-color:var(--line-d)}
.sec.d .frame{border-color:#3A3A3A}.sec.d .frame-bar{background:#262626;color:#9A9AA0}.sec.d .frame-bar i{background:#4A4A4A}
.sec.d .res .k,.sec.d .res-src{color:#9C9CA3}
.sec.d .res h3 b{color:var(--acc)}
.sec.d .res-l li{border-color:var(--line-d);color:#D2D2D7}.sec.d .res-l b{color:#fff}
@media (min-width:720px){.res{grid-template-columns:1fr 1fr;gap:24px}.res-img{padding:22px 22px 0}.res-b{padding:24px 26px 28px}.res h3{font-size:26px}}

/* « Pas le budget pour un site ? » : une carte orange, plus une bande pleine largeur. */
.bud{display:grid;gap:20px;background:var(--acc);color:var(--ink);border-radius:24px;padding:26px 22px 28px}
.bud h2{max-width:18ch;font-size:clamp(23px,5.9vw,28px)}
.bud .in{color:var(--ink);max-width:46ch;font-size:16px;margin-top:10px}
.bud-p{font:500 clamp(44px,12vw,60px)/.95 "Plex Mono",monospace;letter-spacing:-.05em;white-space:nowrap}
.bud-p small{display:block;font:500 13.5px/1.4 "Plex Mono",monospace;letter-spacing:0;margin-top:10px;white-space:normal}
.bud .cta-row{margin-top:18px}
.bud .lnk{text-decoration-color:var(--ink)}.bud .lnk:hover{color:var(--ink);text-decoration-thickness:3px}
@media (min-width:860px){.bud{grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:clamp(36px,5vw,72px);align-items:center;padding:44px 52px}.bud h2{font-size:32px}.bud .in{font-size:17px}}

/* Ce qui est compris : une liste à pictogrammes au trait (pas des cartes). */
.inc{list-style:none;display:grid;border-top:1px solid var(--line)}
.inc li{display:grid;grid-template-columns:46px 1fr;gap:2px 16px;padding:16px 0;border-bottom:1px solid var(--line);align-items:start}
.inc svg{grid-row:span 2;width:46px;height:46px;padding:11px;border-radius:13px;background:var(--paper);border:1px solid var(--line);stroke:var(--ink);fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.sec.w .inc svg{background:var(--bg);border-color:transparent}
.inc b{font-size:17.5px;font-weight:800;letter-spacing:-.015em;line-height:1.25;padding-top:2px}
.inc span{grid-column:2;color:var(--ink-2);font-size:15.5px}
@media (min-width:860px){.inc{grid-template-columns:1fr 1fr;column-gap:64px}.inc li{padding:20px 0}}

/* Captures de sites clients. */
.shots{display:grid;gap:12px;margin-top:22px}
.shots figure{border:1px solid var(--line);border-radius:14px;overflow:hidden;background:var(--paper)}
.shots img{width:100%;aspect-ratio:16/10;object-fit:cover;object-position:top}
.shots figcaption{font:400 12.5px "Plex Mono",monospace;color:var(--mute);padding:8px 12px;border-top:1px solid var(--line)}
@media (min-width:700px){.shots{grid-template-columns:repeat(3,1fr);gap:16px}.shots.c2{grid-template-columns:repeat(2,1fr)}}
.cases{list-style:none;margin-top:22px;display:grid;gap:22px}
.cases li{display:grid;gap:12px;padding-bottom:22px;border-bottom:1px solid var(--line)}
.cases img{width:100%;aspect-ratio:16/9;object-fit:cover;object-position:top;border:1px solid var(--line);border-radius:14px}
.cases .k{font:400 12.5px "Plex Mono",monospace;color:var(--mute)}
.cases h3{margin-top:2px}
.cases h3 a{text-decoration:none}.cases h3 a:hover{text-decoration:underline;text-decoration-color:var(--acc);text-decoration-thickness:3px}
.cases .res{font:500 13.5px "Plex Mono",monospace;margin-top:8px;padding-left:12px;border-left:3px solid var(--acc)}
.cases p{color:var(--ink-2);margin-top:6px}
@media (min-width:800px){.cases li{grid-template-columns:minmax(260px,400px) 1fr;gap:32px;align-items:center}}

/* FAQ : des réponses directes, sans script. */
.faq{border-top:1px solid var(--line);max-width:900px}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{list-style:none;cursor:pointer;padding:16px 40px 16px 0;position:relative;font-weight:800;font-size:18.5px;letter-spacing:-.015em;line-height:1.25}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";position:absolute;right:4px;top:11px;font:400 26px/1 "Plex Mono",monospace;color:var(--acc-d)}
.faq details[open] summary::after{content:"–"}
.faq .a{padding:0 0 18px;max-width:70ch;color:var(--ink-2)}
.faq .a p+p{margin-top:10px}
@media (min-width:700px){.faq summary{font-size:21px;padding:20px 48px 20px 0}.faq summary::after{top:15px}}

/* ---------- La bande noire : votre interlocuteur, puis le formulaire ---------- */
.band{background:var(--band);color:#fff;padding:36px 0 44px}
.band h2{max-width:20ch}
.band-g{display:grid;gap:26px}
.inter{display:grid;grid-template-columns:76px 1fr;gap:6px 14px;align-items:center;margin-top:20px}
.inter img{width:76px;height:76px;border-radius:14px;object-fit:cover;object-position:50% 18%}
.inter .k{font:400 12.5px "Plex Mono",monospace;color:#A8A8AE}
.inter b{display:block;font-size:20px;font-weight:800;letter-spacing:-.02em;line-height:1.2}
.band .rt{margin-top:14px;font-size:15.5px;color:#E9E9EC}
.band .rt a{text-decoration:none;color:inherit}.band .rt a:hover{text-decoration:underline}
.band .rt .stars{color:var(--acc)}
.inter ul{grid-column:1/-1;list-style:none;margin-top:10px}
.inter li{padding:8px 0;border-top:1px solid #2C2C2C;color:#D6D6DA;font-size:15.5px}
.inter li:last-child{border-bottom:1px solid #2C2C2C}
.bigtel{display:inline-block;margin-top:22px;font:500 clamp(30px,8.6vw,48px)/1 "Plex Mono",monospace;letter-spacing:-.02em;color:#fff;text-decoration:none;border-bottom:3px solid var(--acc);padding-bottom:6px}
.bigtel:hover{color:var(--acc)}
.band .meta{font:400 13px "Plex Mono",monospace;color:#A8A8AE;margin-top:16px;line-height:1.6}
.band .meta a{color:#fff}
.band .proof{margin-top:18px;padding-left:14px;border-left:3px solid var(--acc);font-size:16.5px;line-height:1.4;color:#E9E9EC;max-width:52ch}
.band .proof cite{display:block;font:400 12.5px "Plex Mono",monospace;font-style:normal;color:#A8A8AE;margin-top:6px}
.fcard{background:var(--paper);color:var(--ink);border-radius:var(--r);padding:18px}
.fcard h3{font-size:23px;letter-spacing:-.03em}
.fcard .s{font-size:14.5px;color:var(--ink-2);margin:6px 0 14px}
.f{margin-bottom:12px;border:0;min-width:0}
.f label,.f legend{display:block;font-weight:700;font-size:14.5px;margin-bottom:5px;padding:0}
.f .opt{font-weight:400;color:var(--mute)}
.f input[type=text],.f input[type=tel],.f input[type=email],.f input:not([type]),.f textarea{width:100%;border:1.5px solid #B9B9B1;border-radius:12px;padding:12px 14px;font-size:16px;background:#fff;min-height:50px}
.f textarea{min-height:110px;resize:vertical}
.f input:focus,.f textarea:focus{border-color:var(--ink);outline:3px solid var(--acc);outline-offset:1px}
.f.bad input,.f.bad textarea{border-color:#B3261E}
.f .err{color:#B3261E;font-size:13.5px;margin-top:4px;min-height:0}
.pills{display:flex;flex-wrap:wrap;gap:8px}
.pills label{margin:0;position:relative}
.pills input{position:absolute;opacity:0;inset:0;width:100%;height:100%;cursor:pointer}
.pills span{display:inline-flex;align-items:center;min-height:44px;padding:8px 14px;border:1.5px solid #B9B9B1;border-radius:999px;font-weight:600;font-size:14.5px}
.pills input:checked+span{background:var(--ink);border-color:var(--ink);color:#fff}
.pills input:focus-visible+span{outline:3px solid var(--acc);outline-offset:2px}
.chk{display:grid!important;grid-template-columns:22px 1fr;gap:10px;align-items:start;font-weight:400!important;font-size:13.5px!important;color:var(--ink-2);line-height:1.4}
.chk input{width:20px;height:20px;margin-top:1px;accent-color:var(--ink)}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.fcard .btn{width:100%;margin-top:4px}
.fstatus{font-size:14px;margin-top:10px;min-height:0}
.fstatus.is-error{color:#B3261E}.fstatus.is-info{color:var(--ink-2)}
.fok{display:none}
.is-sent .fbody{display:none}
.is-sent .fok{display:block;padding:8px 0}
.fok b{display:block;font-size:24px;font-weight:800;letter-spacing:-.03em;line-height:1.15}
.fok p{margin-top:8px;color:var(--ink-2)}
@media (min-width:860px){.band{padding:64px 0 72px}.band-g{grid-template-columns:1fr minmax(380px,460px);gap:56px;align-items:start}.fcard{padding:26px}.inter{grid-template-columns:96px 1fr}.inter img{width:96px;height:96px}}

/* ---------- Pied de page ---------- */
footer.site{background:var(--bg);border-top:1px solid var(--line);padding:30px 0 96px;font-size:15px}
.ft{display:grid;gap:22px}
.ft h2{font:500 12.5px "Plex Mono",monospace;letter-spacing:0;color:var(--mute);margin-bottom:8px;max-width:none}
.ft ul{list-style:none}
.ft li a{display:inline-block;padding:5px 0;text-decoration:none}.ft li a:hover{text-decoration:underline}
.ft .pres{max-width:26ch;color:var(--mute);margin-top:10px;font-size:14.5px;line-height:1.45}
.fb{margin-top:24px;padding-top:16px;border-top:1px solid var(--line);font:400 12.5px "Plex Mono",monospace;color:var(--mute);display:flex;flex-wrap:wrap;gap:6px 18px;justify-content:space-between;line-height:1.7}
.fb a{color:var(--ink)}
@media (min-width:800px){.ft{grid-template-columns:1fr 1.15fr 1fr 1.15fr;gap:36px}footer.site{padding:44px 0 40px}}

/* ---------- Barre fixe mobile : la fiche en une ligne ---------- */
.mbar{position:fixed;left:0;right:0;bottom:0;z-index:45;display:grid;grid-template-columns:40px 1fr 1fr;gap:8px;align-items:center;padding:8px 10px calc(8px + env(safe-area-inset-bottom));background:var(--bg);border-top:1px solid var(--ink);transform:translateY(110%);transition:transform .25s}
.mbar.on{transform:none}
.mbar img{width:40px;height:40px;border-radius:10px;object-fit:cover;object-position:38% 22%}
.mbar .btn{min-height:46px;padding:8px 8px;font-size:14.5px}
@media (min-width:1180px){.mbar{display:none}}
@media (prefers-reduced-motion:reduce){.mbar{transition:none}}

/* ---------- Bandeau cookies : une ligne, en bas d'écran ---------- */
.cookie{position:fixed;left:0;right:0;bottom:0;z-index:60;background:var(--band);color:#fff;display:none;padding:7px 10px calc(7px + env(safe-area-inset-bottom));font-size:13px;line-height:1.25}
.cookie.on{display:flex;align-items:center;gap:8px;justify-content:center}
.cookie p{flex:1 1 auto;min-width:0;color:#DDDDE0}
.cookie p a{color:#fff}
.cookie .btn{min-height:44px;padding:6px 13px;font-size:14px;flex:none}
.cookie .btn-acc{color:var(--ink)}
.cookie .lg{display:none}
@media (min-width:700px){.cookie{font-size:14px;padding:9px 20px}.cookie .lg{display:inline}.cookie p{flex:0 1 auto}}
body.has-cookie .mbar.on{bottom:58px}

/* v13.1 : compléments */
.hero+.sec:not(.w):not(.d):not(.o){padding-top:0;border-top:0}
.panel{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);padding:4px 18px}
.panel .tbl{margin-top:0}
.panel .tbl tr:last-child td,.panel .tbl tr:last-child th{border-bottom:0}
.frame.plain{border-radius:12px;border-bottom:1px solid var(--line);padding-top:28px}
.sec.d .frame.plain{border-color:#3A3A3A}
@media (min-width:800px){.panel{padding:8px 28px}}

/* Résultats mesurés en tuiles : ce qui est mesuré, la valeur, la source et la date en petit. */
.mz{list-style:none;display:grid;gap:12px}
.mz li{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);padding:18px 20px;display:flex;flex-direction:column;gap:8px}
.mz .k{font-size:15.5px;line-height:1.35;color:var(--ink-2)}
.mz .v{font:500 clamp(26px,6.4vw,34px)/1.05 "Plex Mono",monospace;letter-spacing:-.035em;color:var(--ink)}
.mz .s{font:400 12px/1.5 "Plex Mono",monospace;color:var(--mute);margin-top:auto;padding-top:6px}
.mz-none{border:1px dashed #BDBDB4;border-radius:var(--r);padding:18px 20px;color:var(--ink-2);max-width:70ch}
@media (min-width:720px){.mz{grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:18px}.mz li{padding:22px 24px}}
.mz+.avis,.mz+.in,.mz+.cta-row,.mz+.note,.res+.note,.res+.cta-row,.res+.in,.in+.avis,.plans+.note{margin-top:22px}
/* Sur fond noir. */
.sec.d h2,.sec.d h3{color:#fff}
.sec.d .mz li{background:var(--card-d);border-color:var(--line-d)}.sec.d .mz .k{color:#C9C9CE}.sec.d .mz .v{color:var(--acc)}.sec.d .mz .s{color:#9C9CA3}
.sec.d .mz-none{border-color:#3A3A3A;color:#C9C9CE}
.sec.d .avis li{background:var(--card-d);border:1px solid var(--line-d)}.sec.d .avis blockquote{color:#fff}.sec.d .avis cite b{color:#fff}.sec.d .avis cite span{color:#9C9CA3}.sec.d .avis .av{background:#fff;color:var(--ink)}.sec.d .avis .stars{color:var(--acc)}
.sec.d .in a,.sec.d .note a{color:#fff}.sec.d .note{color:#9C9CA3}
.sec.d .steps{border-color:var(--line-d)}.sec.d .steps li{border-color:var(--line-d)}.sec.d .steps span{color:#C9C9CE}.sec.d .steps li::before{color:var(--acc)}
.sec.d .txt p{color:#C9C9CE}.sec.d .txt p b{color:#fff}
/* Sur fond blanc : les cartes passent en papier. */
.sec.w .rows,.sec.w .plan:not(.hl),.sec.w .tier,.sec.w .panel,.sec.w .vcc,.sec.w .duo>div,.sec.w .res-c,.sec.w .mz li,.sec.w .shots figure,.sec.w .opt figure,.sec.w .dg{background:var(--bg);border-color:transparent}
.sec.w .rows>li+li{border-top-color:#DEDED6}
.sec.w .plan .tag{background:var(--paper)}
.sec.w .tin{background:var(--bg)}
@media (hover:hover){.sec.w .rows>li>a:hover{background:#EBEBE5}}
.budw+.sec{border-top:0}
.avis:has(li:only-child){grid-template-columns:minmax(0,620px)}
.por .steps{max-width:none}
.legal .note{margin-top:0}
/* Listes longues : deux colonnes sur grand écran (moins de texte en colonne étroite). */
@media (min-width:900px){
  .sec:not(.split) .sb>.ul:has(li:nth-child(5)){display:grid;grid-template-columns:1fr 1fr;column-gap:64px;max-width:none}
  .sec:not(.split) .sb>.ul:has(li:nth-child(5)) li{border-top:0;border-bottom:1px solid var(--line)}
  .sec:not(.split) .sb>.ul:has(li:nth-child(5)) li:nth-child(-n+2){border-top:1px solid var(--line)}
}
/* Captures de sites : un cadre d'écran (barre dessinée, sans image). */
.shots figure{position:relative;padding-top:26px}
.shots figure::before{content:"";position:absolute;left:0;right:0;top:0;height:26px;background:#ECECE6;border-bottom:1px solid var(--line)}
.shots figure::after{content:"";position:absolute;left:12px;top:9px;width:8px;height:8px;border-radius:50%;background:#C9C9C1;box-shadow:14px 0 0 #C9C9C1,28px 0 0 #C9C9C1}
.cases li{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);padding:16px 16px 20px;border-bottom:1px solid var(--line)}
.sec.w .cases li{background:var(--bg);border-color:transparent}
@media (min-width:800px){.cases li{padding:22px;gap:36px}}
/* Calcul interactif de la page prix : rien n'est enregistré ni envoyé. */
.calc-g{display:grid;gap:16px;margin-top:16px}
.calc-f{border:0;min-width:0}
.calc-f legend,.calc-f>label{display:block;font:500 12.5px "Plex Mono",monospace;color:#A8A8AE;margin-bottom:8px;padding:0}
.pills.dk span{border-color:#3A3A3A;color:#E2E2E6;background:transparent}
.pills.dk input:checked+span{background:#fff;border-color:#fff;color:var(--ink)}
.calc-in{position:relative;max-width:300px}
.calc-in input{width:100%;min-height:52px;border-radius:12px;border:1.5px solid #3A3A3A;background:#111;color:#fff;font:500 20px "Plex Mono",monospace;padding:10px 44px 10px 16px;-moz-appearance:textfield;appearance:textfield}
.calc-in input::-webkit-outer-spin-button,.calc-in input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.calc-in input:focus{border-color:#fff;outline:3px solid var(--acc);outline-offset:1px}
.calc-in input::placeholder{color:#77777F;font-size:15px}
.calc-in span{position:absolute;right:16px;top:50%;transform:translateY(-50%);font:500 18px "Plex Mono",monospace;color:#A8A8AE}
.calc-r{margin-top:18px;padding-top:16px;border-top:1px solid var(--line-d);font-size:17px;line-height:1.4;color:#DADADF;max-width:60ch}
.calc-r b{color:var(--acc);font-weight:800}
.calc-r.on{font-size:clamp(19px,4.6vw,24px);font-weight:700;letter-spacing:-.02em;color:#fff}
@media (min-width:800px){.calc-g{grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);gap:32px;align-items:end}}

/* ---------- Page prix : les trois formules de site en tuiles, le reste en lignes ---------- */
.tiers{list-style:none;display:grid;gap:14px}
.tier{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);padding:18px 18px 20px;display:grid;grid-template-columns:1fr auto;gap:0 12px;align-items:end}
.tier .k{font:500 12.5px "Plex Mono",monospace;color:var(--acc-d)}
.tier h3{font-size:23px;margin-top:6px}
.tier .k,.tier h3{grid-column:1}
.tier .pr{grid-column:2;grid-row:1/span 2;text-align:right;font:500 30px/1 "Plex Mono",monospace;letter-spacing:-.045em;white-space:nowrap}
.tier .pr small{display:block;font:400 12.5px/1.3 "Plex Mono",monospace;color:var(--mute);letter-spacing:0;margin-bottom:6px}
.tier .pr em{font:400 12px "Plex Mono",monospace;font-style:normal;color:var(--mute);letter-spacing:0;margin-left:6px}
.tier .tp{grid-column:1/-1;margin-top:14px;padding-top:12px;border-top:1px solid var(--line);font-weight:700;font-size:16px;line-height:1.35}
.tier .tx{grid-column:1/-1;margin-top:6px;color:var(--ink-2);font-size:15px}
.tin{margin-top:14px;padding:14px 18px;border-radius:14px;background:#E8E8E1;font-size:15.5px;color:var(--ink-2)}
.tin b{color:var(--ink)}
.tin a{font-weight:700;color:var(--ink);text-decoration:underline;text-decoration-color:var(--acc);text-decoration-thickness:2px;text-underline-offset:3px;white-space:nowrap}
.tiers+.rows{margin-top:14px}
.px .n{font-size:16px}
.pxf{display:grid;gap:16px;margin-top:16px}
.pxf .note{margin-top:0}
div.opt{display:grid;grid-template-columns:1fr 1fr;gap:12px;max-width:400px}
.opt figure{border:1px solid var(--line);border-radius:14px;overflow:hidden;background:var(--paper)}
.opt img{width:100%;aspect-ratio:3/2;object-fit:cover}
.opt figcaption{font:400 11.5px "Plex Mono",monospace;color:var(--mute);padding:7px 10px;border-top:1px solid var(--line)}
@media (min-width:860px){.tiers{grid-template-columns:repeat(3,1fr);gap:20px}.tier{padding:28px;display:flex;flex-direction:column;align-items:stretch}.tier .pr{text-align:left;font-size:42px;margin-top:18px;padding-top:18px;border-top:1px solid var(--line)}.tier .pr em{font-size:13px;margin-left:8px}.tier .tp{margin-top:18px;padding-top:16px;font-size:17px}.tin{margin-top:20px;padding:16px 22px}.tiers+.rows{margin-top:20px}.pxf{grid-template-columns:minmax(0,1fr) minmax(0,400px);gap:48px;align-items:start;margin-top:20px}.panel .tbl tbody th{width:24%}}
.calc{margin-top:24px;border:1px solid var(--line-d);border-radius:var(--r);padding:20px 20px 22px}
.calc .calc-t{display:block;font-size:19px;font-weight:800;letter-spacing:-.02em;color:#fff}
@media (min-width:800px){.calc{padding:26px 28px 28px;margin-top:28px}}

/* ---------- Contact ---------- */
.ways{list-style:none;margin-top:22px;border-top:1px solid var(--line)}
.ways li{display:grid;grid-template-columns:1fr auto;gap:4px 14px;align-items:center;padding:16px 0;border-bottom:1px solid var(--line)}
.ways b{font-size:20px;font-weight:800;letter-spacing:-.02em}
.ways span{color:var(--ink-2);font-size:15.5px;grid-column:1}
.ways a.v{grid-column:2;grid-row:1/span 2;font:500 15px "Plex Mono",monospace;text-align:right}
.hero-tel{display:inline-block;margin-top:16px;font:500 clamp(34px,10.5vw,84px)/1 "Plex Mono",monospace;letter-spacing:-.03em;text-decoration:none;border-bottom:4px solid var(--acc);padding-bottom:6px}
.hero-tel:hover{color:var(--acc-d)}

/* ---------- Zones : trois cercles ---------- */
.zn{list-style:none;counter-reset:z;margin-top:22px;border-top:1px solid var(--line)}
.zn>li{counter-increment:z;padding:20px 0;border-bottom:1px solid var(--line);display:grid;gap:8px}
.zn .zk{font:500 13px "Plex Mono",monospace;color:var(--acc-d)}
.zn .zk::before{content:"Cercle " counter(z) " · "}
.zn p{color:var(--ink-2);max-width:72ch}
@media (min-width:800px){.zn>li{grid-template-columns:300px 1fr;gap:8px 40px}.zn h3{grid-column:1}.zn .zk{grid-column:1}.zn .zt{grid-column:2;grid-row:1/span 3}}

/* ---------- Test en 13 points : la note, en très grand ---------- */
.dg{margin-top:18px;background:var(--paper);border:1.5px solid var(--ink);border-radius:var(--r);padding:16px}
.dg-top{display:flex;justify-content:space-between;gap:10px;font:500 12.5px "Plex Mono",monospace;color:var(--mute)}
.dg-bar{height:6px;background:#E4E4DD;border-radius:3px;margin-top:8px;overflow:hidden}
.dg-bar i{display:block;height:100%;width:0;background:var(--ink);transition:width .25s}
.dg ol{list-style:none}
.dg-q{padding:16px 0 4px}
.js .dg-q{display:none}.js .dg-q.cur{display:block}
.dg-g{font:500 12.5px "Plex Mono",monospace;color:var(--acc-d)}
.dg-q p{font-size:clamp(21px,5.6vw,30px);font-weight:800;letter-spacing:-.03em;line-height:1.15;margin-top:6px;min-height:3.45em}
.dg-btns{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:12px}
.dg-btns .btn{min-height:56px;font-size:17px}
.dg-btns .btn[aria-pressed="true"]{background:var(--ink);color:#fff;border-color:var(--ink)}
.dg-back{background:none;border:0;font:400 13px "Plex Mono",monospace;color:var(--mute);text-decoration:underline;cursor:pointer;margin-top:12px;padding:6px 0}
.dg-res{display:none}
.dg.done .dg-run{display:none}.dg.done .dg-res{display:block}
.dg-note{font:500 clamp(84px,30vw,200px)/.9 "Plex Mono",monospace;letter-spacing:-.06em;margin-top:6px}
.dg-note small{font-size:.36em;color:var(--mute);letter-spacing:-.02em}
.dg-msg{font-size:20px;font-weight:800;letter-spacing:-.02em;line-height:1.25;margin-top:10px;max-width:34ch}
.dg-miss{margin-top:16px}
.dg-miss h3{font:500 13px "Plex Mono",monospace;color:var(--mute);letter-spacing:0}
.dg-miss ul{list-style:none;margin-top:6px}
.dg-miss li{padding:9px 0 9px 26px;border-top:1px solid var(--line);position:relative}
.dg-miss li::before{content:"×";position:absolute;left:2px;top:6px;font:500 20px "Plex Mono",monospace;color:#B3261E}
.dg-form{margin-top:20px;padding-top:18px;border-top:1.5px solid var(--ink)}
.dg-form .fcard{padding:0;border-radius:0}
.dg-again{margin-top:14px}
@media (min-width:700px){.dg{padding:28px 32px}.dg-res-g{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:start}.dg-form{margin-top:0;padding-top:0;border-top:0}}
.noscript{font-size:14.5px;color:var(--ink-2);margin-top:10px}

/* ---------- Pages légales et 404 ---------- */
.legal{max-width:78ch}
.legal h2{font-size:26px;margin-top:34px;max-width:none}
.legal h3{font-size:19px;margin-top:22px}
.legal p,.legal li{color:var(--ink-2);margin-top:10px}
.legal ul{padding-left:20px}
.legal table{width:100%;border-collapse:collapse;margin-top:12px;font-size:15px}
.legal td,.legal th{border-bottom:1px solid var(--line);padding:8px 10px 8px 0;text-align:left;vertical-align:top}

/* ===== v13.1 (11/11) : vitrines, captures qui défilent, galeries, photos réelles ===== */
.avis li:only-child{grid-column:1/-1}
@media (min-width:900px){.avis li:only-child{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:22px 28px;padding:28px 32px}.avis li:only-child blockquote{font-size:19px}.avis li:only-child cite{margin-top:0;min-width:220px}}
.mz+.note,.note+.avis,.mz+.avis{margin-top:18px}
/* écran + téléphone */
.show{position:relative}
.show.has-m{padding-right:clamp(48px,13%,150px);padding-bottom:clamp(18px,4%,44px)}
.show-d{border-radius:14px;overflow:hidden;background:#fff;box-shadow:0 1px 0 rgba(0,0,0,.04),0 24px 60px -28px rgba(20,20,20,.45);border:1px solid rgba(0,0,0,.08)}
.bar{display:flex;align-items:center;gap:6px;height:30px;padding:0 12px;background:#EDEDE8;border-bottom:1px solid #DDDDD6}
.bar i{width:9px;height:9px;border-radius:50%;background:#CFCFC7}
.bar span{margin-left:10px;font:400 11.5px "Plex Mono",monospace;color:#66666D;background:#fff;border-radius:6px;padding:3px 12px;max-width:70%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.show-d img{width:100%;aspect-ratio:16/10;object-fit:cover;object-position:top}
.show-m{position:absolute;right:0;bottom:0;width:clamp(78px,21%,210px);border-radius:clamp(12px,2.4vw,26px);border:clamp(3px,.6vw,7px) solid #141414;overflow:hidden;background:#141414;box-shadow:0 22px 44px -18px rgba(0,0,0,.55)}
.show-m img{width:100%;aspect-ratio:1/2;object-fit:cover;object-position:top}
.sec.d .show-d{border-color:#2D2D2D}.sec.d .bar{background:#222;border-color:#2D2D2D}.sec.d .bar span{background:#111;color:#A8A8AE}.sec.d .bar i{background:#3A3A3A}
.showsec{padding-top:8px!important}
.showsec .show{max-width:1060px;margin:0 auto}
/* vitrines de la page Réalisations */
.vits{display:grid;gap:26px;margin-top:8px}
.vit{display:flex;flex-direction:column;gap:18px;text-decoration:none;color:inherit;background:var(--bg);border-radius:22px;padding:22px 22px 26px;transition:transform .25s ease,box-shadow .25s ease}
.vit .show{transition:transform .35s ease}
.vit:hover{box-shadow:0 18px 50px -30px rgba(20,20,20,.5)}
.vit:hover .show{transform:translateY(-4px)}
.vit .k{font:400 12.5px "Plex Mono",monospace;color:var(--mute)}
.vit h3{font-size:clamp(19px,2vw,23px);line-height:1.2;margin-top:4px}
.vit-r{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;margin-top:12px}
.vit-r b{font-size:clamp(30px,3.6vw,44px);line-height:1;font-weight:800;color:var(--acc);letter-spacing:-.03em}
.vit-r span{font-size:15px;color:var(--ink-2)}
.vit-l{display:inline-block;margin-top:14px;font-weight:700;font-size:15px;text-decoration:underline;text-decoration-color:var(--acc);text-decoration-thickness:2px;text-underline-offset:4px}
.vit-l::after{content:" →";color:var(--acc)}
@media (min-width:900px){.vits{grid-template-columns:1fr 1fr;gap:28px}.vit{padding:30px 30px 32px}}
@media (prefers-reduced-motion:reduce){.vit,.vit .show{transition:none}.vit:hover .show{transform:none}}
/* capture pleine page qui défile */
.gal{display:grid;gap:22px;margin-top:26px}
.scr{border-radius:14px;overflow:hidden;background:#fff;border:1px solid rgba(0,0,0,.08);box-shadow:0 24px 60px -32px rgba(20,20,20,.45)}
.scr-v{height:min(560px,70vh);overflow:hidden}
.scr-v img{width:100%;transition:transform 9s cubic-bezier(.45,.05,.4,1)}
.scr-v:hover img,.scr-v:focus img{transform:translateY(calc(-100% + min(560px,70vh)))}
.scr figcaption{font:400 12px "Plex Mono",monospace;color:var(--mute);padding:9px 14px;border-top:1px solid var(--line)}
@media (hover:none){.scr-v{overflow-y:auto;-webkit-overflow-scrolling:touch}.scr-v img{transition:none}.scr-v:hover img,.scr-v:focus img{transform:none}.scr figcaption{font-size:0}.scr figcaption::after{content:"Faites glisser dans l’écran : la page défile.";font-size:12px}}
@media (prefers-reduced-motion:reduce){.scr-v{overflow-y:auto}.scr-v img{transition:none}.scr-v:hover img,.scr-v:focus img{transform:none}}
.gal-s{display:grid;gap:16px;align-content:start}
.mini{border-radius:14px;overflow:hidden;border:1px solid var(--line);background:var(--paper)}
.mini img{width:100%;aspect-ratio:16/10;object-fit:cover;object-position:top}
.mini figcaption{font:400 12px "Plex Mono",monospace;color:var(--mute);padding:8px 12px;border-top:1px solid var(--line)}
@media (min-width:960px){.gal{grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:28px;align-items:start}}
/* téléphones */
.phones{display:flex;gap:18px;justify-content:center;align-items:flex-start}
.phones figure{flex:0 1 210px}
.phones img{width:100%;aspect-ratio:1/2;object-fit:cover;object-position:top;border-radius:26px;border:7px solid #141414;background:#141414;box-shadow:0 22px 44px -22px rgba(0,0,0,.5)}
.phones figure:nth-child(2){margin-top:44px}
.phones figcaption{font:400 12px "Plex Mono",monospace;color:var(--mute);text-align:center;margin-top:10px}
/* photos réelles */
.pho{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin-top:8px}
.pho figure{position:relative;border-radius:14px;overflow:hidden;background:#ddd}
.pho img{width:100%;height:100%;aspect-ratio:3/4;object-fit:cover}
.pho figcaption{position:absolute;left:10px;bottom:10px;background:rgba(20,20,20,.82);color:#fff;font:500 12px "Plex Mono",monospace;padding:5px 10px;border-radius:999px}
@media (min-width:900px){.pho{grid-template-columns:repeat(4,1fr);gap:16px}.pho:has(figure:nth-child(3):last-child){grid-template-columns:1fr 1fr 1.25fr}.pho:has(figure:nth-child(3):last-child) img{aspect-ratio:auto;min-height:300px}}
/* fiche projet en tuiles */
.kv{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin-top:22px}
.kv div{background:var(--paper);border:1px solid var(--line);border-radius:14px;padding:14px 16px}
.kv dt{font:400 11.5px "Plex Mono",monospace;color:var(--mute);text-transform:none}
.kv dd{font-weight:700;font-size:16px;line-height:1.3;margin-top:4px}
.sec.w .kv div{background:var(--bg);border-color:transparent}
@media (min-width:860px){.kv{grid-template-columns:repeat(3,1fr);gap:14px}}
.cartes{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:26px;max-width:860px}
.cartes img{width:100%;aspect-ratio:3/2;object-fit:cover;border-radius:10px;box-shadow:0 18px 40px -22px rgba(0,0,0,.5)}
.cartes img:nth-child(2){transform:translateY(14px)}
.duo-i{display:grid;gap:22px;align-items:center;margin-top:8px}
@media (min-width:860px){.duo-i{grid-template-columns:1.2fr 1fr;gap:34px}.duo-i:has(.show+.show){grid-template-columns:1fr 1fr}}
.tin{margin-bottom:26px}
.sec .avis:has(>li:only-child){grid-template-columns:1fr}
@media (min-width:900px){.sec .avis>li:only-child{grid-template-columns:auto minmax(0,1fr) minmax(200px,auto)}}
.cert{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 12px;margin-top:16px;padding:12px 16px;border-left:3px solid var(--acc);background:var(--paper);border-radius:0 12px 12px 0}
.cert b{font-weight:800}.cert span{font-size:14.5px;color:var(--mute)}
.sec.w .cert{background:var(--bg)}
.cv{display:grid;gap:30px;align-items:center}
.cv-i{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.cv-i img{width:100%;aspect-ratio:3/2;object-fit:cover;border-radius:10px;box-shadow:0 20px 44px -24px rgba(0,0,0,.55)}
.cv-i img:nth-child(even){transform:translateY(18px)}
.cv-t .lead{font-size:clamp(20px,2.2vw,25px);font-weight:700;line-height:1.25;letter-spacing:-.015em}
.cv-t .ul{margin-top:16px}.cv-p{margin-top:16px;font-size:16px}
@media (min-width:900px){.cv{grid-template-columns:1.15fr 1fr;gap:48px}}
.ex{margin-top:24px;padding:22px;border-radius:var(--r);background:var(--paper);border:1px solid var(--line)}
.sec.w .ex{background:var(--bg);border-color:transparent}
.ex .k{font:400 12px "Plex Mono",monospace;color:var(--mute)}.ex-t{font-weight:700;margin-top:6px;max-width:60ch}
.ex-i{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:16px}
.ex-i img{width:100%;aspect-ratio:3/4;object-fit:cover;border-radius:10px}
@media (max-width:600px){.ex-i{grid-template-columns:repeat(2,1fr)}}
.qr{display:grid;gap:14px;margin-top:24px;align-items:center}
.qr img{width:100%;max-width:420px;border-radius:12px;box-shadow:0 22px 44px -24px rgba(0,0,0,.5);transform:rotate(-2deg)}
@media (min-width:860px){.qr{grid-template-columns:420px 1fr;gap:34px}}
a.chk{display:grid;grid-template-columns:120px 1fr;gap:18px;align-items:center;margin-top:24px;padding:16px;border-radius:var(--r);background:var(--paper);border:1px solid var(--line);text-decoration:none;color:inherit;max-width:640px;transition:box-shadow .2s}
a.chk:hover{box-shadow:0 14px 40px -26px rgba(0,0,0,.5)}
a.chk img{width:100%;border-radius:6px;border:1px solid var(--line);box-shadow:0 8px 20px -12px rgba(0,0,0,.4)}
a.chk b{display:block;font-size:18px;margin-bottom:4px;text-decoration:underline;text-decoration-color:var(--acc);text-decoration-thickness:2px;text-underline-offset:4px}
a.chk span{color:var(--ink-2);font-size:15.5px}
.sec.w a.chk{background:var(--bg);border-color:transparent}
.duo-i .mz{grid-template-columns:1fr}
.duo-i.loc{align-items:stretch}.duo-i.loc .vit{background:var(--paper)}
.sec.w .duo-i.loc .vit{background:var(--bg)}
@media (min-width:860px){.duo-i.loc{grid-template-columns:1fr 1fr}}
.stop{margin-top:22px;padding:16px 20px;border-radius:14px;background:var(--ink);color:#EDEDE8;max-width:820px}
.stop b{color:#fff}
@media (min-width:960px){.duo-i.ads{grid-template-columns:1.15fr 1fr;align-items:start}}
.sec.d .inc li{color:#D7D7DB}.sec.d .inc b{color:#fff}.sec.d .inc svg{color:var(--acc)}
.sec.d .inc li{border-color:var(--line-d)}.sec.d .inc span{color:#BDBDC3}.sec.d .inc svg{background:var(--card-d);border-color:var(--line-d);stroke:var(--acc)}
.chkimg{display:block;max-width:380px;transform:rotate(-1.5deg);transition:transform .25s}
.chkimg:hover{transform:rotate(0) translateY(-3px)}
.chkimg img{width:100%;border-radius:6px;box-shadow:0 26px 50px -24px rgba(0,0,0,.5);border:1px solid var(--line)}
.lead{font-size:clamp(20px,2.2vw,25px);font-weight:700;line-height:1.25;letter-spacing:-.015em}
@media (min-width:860px){.duo-i.chkd{grid-template-columns:380px 1fr;gap:56px}}
.zch{list-style:none;display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin-top:22px}
.zch li{background:var(--paper);border:1px solid var(--line);border-radius:14px;padding:14px 16px;display:flex;flex-direction:column;gap:2px}
.zch b{font-size:17px;font-weight:800}.zch span{font:400 12.5px "Plex Mono",monospace;color:var(--mute)}
@media (min-width:860px){.zch{grid-template-columns:repeat(3,1fr);gap:14px}}
.vits,.duo-i,.gal,.cv{grid-template-columns:minmax(0,1fr)}
.vits>*,.duo-i>*,.gal>*,.cv>*,.vit,.show,.show-d{min-width:0}
@media (min-width:900px){.vits{grid-template-columns:repeat(2,minmax(0,1fr))}.cv{grid-template-columns:minmax(0,1.15fr) minmax(0,1fr)}}
@media (min-width:860px){.duo-i{grid-template-columns:minmax(0,1.2fr) minmax(0,1fr)}.duo-i:has(.show+.show),.duo-i.loc{grid-template-columns:repeat(2,minmax(0,1fr))}.duo-i.chkd{grid-template-columns:380px minmax(0,1fr)}}
@media (min-width:960px){.gal{grid-template-columns:minmax(0,1.35fr) minmax(0,1fr)}.duo-i.ads{grid-template-columns:minmax(0,1.15fr) minmax(0,1fr)}}
@media (max-width:600px){.vit{padding:16px 16px 20px}}
/* 11/11 : espaces entre blocs empilés (retours de Morgan) */
.ul+.mz,.ul+.mz-none,.ul+.duo-i,.ul+.ex,.ul+.qr,.ul+a.chk,.steps+.gal,.txt+.mz,.mz+.ul{margin-top:26px}
.hero-tel+.fiche{margin-top:30px}
.cta-row+.avis-h,.cta-row+.avis,.steps+.duo-i,.steps+.phones,.note+.cartes{margin-top:28px}

/* v13.1 · page StarLead Fidelity */
.fidshot{margin:0 0 30px}.fidshot img{width:100%;height:auto;border-radius:14px;border:1px solid var(--line,#ddd)}
.fidshot figcaption,.fid2 figcaption{font:500 13px/1.4 var(--mono,monospace);opacity:.75;margin-top:10px}
.fid2{align-items:start}.fid2 figure{margin:0}.fid2 img{width:100%;height:auto;border-radius:14px}
@media (min-width:860px){.duo-i.fid2{grid-template-columns:1fr 1.25fr}}
.fid1{display:grid;gap:34px}.fid1>*{min-width:0}.fid1 .show{max-width:920px}
@media (min-width:1000px){.fid1 .inc{grid-template-columns:repeat(4,minmax(0,1fr));column-gap:28px}}

/* v13.1 · flèche haut de page */
.ft{position:relative}
.totop{position:absolute;top:-4px;right:0;width:46px;height:46px;border-radius:50%;border:1px solid var(--line);background:var(--paper);display:grid;place-items:center;color:var(--ink);transition:background .2s,border-color .2s,transform .2s}
.totop svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.totop:hover{background:var(--acc);border-color:var(--acc);color:#fff;transform:translateY(-2px)}
.totop:focus-visible{outline:2px solid var(--acc);outline-offset:3px}
@media (prefers-reduced-motion:reduce){.totop,.totop:hover{transition:none;transform:none}}
/* v13.1 · ma fiche Google */
.duo-i.gbpme .phones{justify-content:flex-start}
.gbpme .phones figure{flex:0 1 250px}
@media (min-width:860px){.duo-i.gbpme{grid-template-columns:280px 1fr;gap:56px}}