/* ALTHOM paysage · feuille unique
   Monde : plan de chantier. Grille visible, angles vifs, traits d'encre 1px,
   jaune de signalisation pour l'action, orange sécurité pour les repères, bleu acier pour l'eau et les cotes. */

@font-face{font-family:'Barlow Condensed';font-weight:600;font-display:swap;src:url('/fonts/barlow-condensed-600.woff2') format('woff2')}
@font-face{font-family:'Barlow Condensed';font-weight:700;font-display:swap;src:url('/fonts/barlow-condensed-700.woff2') format('woff2')}
@font-face{font-family:'Barlow';font-weight:400;font-display:swap;src:url('/fonts/barlow-400.woff2') format('woff2')}
@font-face{font-family:'Barlow';font-weight:500;font-display:swap;src:url('/fonts/barlow-500.woff2') format('woff2')}
@font-face{font-family:'Barlow';font-weight:600;font-display:swap;src:url('/fonts/barlow-600.woff2') format('woff2')}
@font-face{font-family:'IBM Plex Mono';font-weight:500;font-display:swap;src:url('/fonts/ibm-plex-mono-500.woff2') format('woff2')}

:root{
  --fond:#F1F2F0; --fond-2:#E5E8E6; --blanc:#FFFFFF;
  --encre:#14181C; --encre-2:#424A51; --encre-3:#5D666D;
  --trait:#C3CACD; --grille:rgba(44,90,120,.11); --grille-f:rgba(44,90,120,.2);
  --acier:#2C5A78; --acier-f:#1D3E54; --acier-c:#DCE6EC;
  --jaune:#F5C200; --jaune-f:#D9AB00;
  --orange:#E85D0C; --orange-t:#A93D00; --orange-c:#FFF1E4;
  --sans:'Barlow',system-ui,-apple-system,'Segoe UI',sans-serif;
  --cond:'Barlow Condensed','Arial Narrow',sans-serif;
  --mono:'IBM Plex Mono',ui-monospace,monospace;
  --pas:24px;
  --wrap:1240px;
  --gout:clamp(20px,4vw,40px);
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-padding-top:90px}
body{margin:0;background:var(--fond);color:var(--encre);font:400 1.0625rem/1.6 var(--sans);font-feature-settings:"lnum";caret-color:var(--orange)}
img,svg{display:block;max-width:100%;height:auto}
a{color:var(--acier-f);text-decoration-thickness:1px;text-underline-offset:.2em}
a:hover{color:var(--orange-t)}
::selection{background:var(--jaune);color:var(--encre)}
:focus-visible{outline:3px solid var(--acier);outline-offset:2px}
html{scrollbar-color:var(--acier) var(--fond-2);scrollbar-width:thin}
h1,h2,h3{font-family:var(--cond);font-weight:700;line-height:1;letter-spacing:-.005em;text-wrap:balance;margin:0}
h1{font-size:clamp(2.6rem,6.2vw,5.4rem);text-transform:uppercase}
h2{font-size:clamp(2rem,3.6vw,3.1rem);text-transform:uppercase}
h3{font-size:1.6rem;font-weight:600}
p{margin:0 0 1em}
p:last-child{margin-bottom:0}
strong,b{font-weight:600}
.nw{white-space:nowrap}
.skip{position:absolute;left:-999px;top:0;background:var(--jaune);color:var(--encre);padding:10px 16px;z-index:100}
.skip:focus{left:8px;top:8px}
.ico{width:1.15em;height:1.15em;flex:none}
.wrap{max-width:var(--wrap);margin:0 auto;padding-inline:var(--gout)}
.mono{font-family:var(--mono);font-size:.8125rem;letter-spacing:.02em}

/* ---------- Grille visible ---------- */
.grille{background-color:var(--fond);background-image:
  linear-gradient(var(--grille-f) 1px,transparent 1px),linear-gradient(90deg,var(--grille-f) 1px,transparent 1px),
  linear-gradient(var(--grille) 1px,transparent 1px),linear-gradient(90deg,var(--grille) 1px,transparent 1px);
  background-size:calc(var(--pas)*5) calc(var(--pas)*5),calc(var(--pas)*5) calc(var(--pas)*5),var(--pas) var(--pas),var(--pas) var(--pas);
  background-position:-1px -1px}

/* ---------- Boutons ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.55em;min-height:46px;padding:.55em 1.2em;border:1.5px solid var(--encre);
  font:700 1.125rem/1 var(--cond);letter-spacing:.03em;text-transform:uppercase;text-decoration:none;color:var(--encre);background:transparent;cursor:pointer;
  transition:background-color .18s,color .18s,border-color .18s}
.btn--lg{min-height:56px;padding:.6em 1.5em;font-size:1.25rem}
.btn--jaune{background:var(--jaune);border-color:var(--encre)}
.btn--jaune:hover{background:var(--encre);color:var(--jaune)}
.btn--ligne:hover{background:var(--encre);color:var(--blanc)}
.btn--ligne-clair{color:var(--blanc);border-color:var(--blanc)}
.btn--ligne-clair:hover{background:var(--blanc);color:var(--encre)}
.btn[disabled]{opacity:.55;cursor:progress}
.lien-fl{display:inline-flex;align-items:center;gap:.4em;font:700 1.125rem/1 var(--cond);text-transform:uppercase;letter-spacing:.03em;color:var(--encre);text-decoration:none;border-bottom:2px solid var(--orange);padding-bottom:3px}
.lien-fl:hover{color:var(--orange-t)}

/* ---------- Note Google ---------- */
.note{display:inline-flex;align-items:center;gap:.6em;font-size:.9375rem;color:var(--encre);text-decoration:none}
.note__etoiles{display:inline-flex;gap:1px;color:var(--orange)}
.ico-star{width:15px;height:15px}
.note:hover span:last-child{text-decoration:underline}
.note--sombre{color:var(--blanc)}
.note--sombre .note__etoiles{color:var(--jaune)}

/* ---------- À compléter ---------- */
.a-completer{display:inline-block;font:500 .75rem/1.3 var(--mono);text-transform:uppercase;letter-spacing:.03em;color:var(--orange-t);background:var(--orange-c);border:1px dashed var(--orange);padding:.25em .55em;vertical-align:middle}
.foot .a-completer{background:transparent;color:#FFB27A;border-color:#FFB27A}
p.a-completer,div.a-completer{display:block;font-size:.8125rem;padding:.7em .9em;text-transform:none;line-height:1.5}

/* ---------- En-tête ---------- */
.head{position:sticky;top:0;z-index:50;background:var(--blanc);border-bottom:1.5px solid var(--encre)}
.head__in{display:flex;align-items:center;gap:24px;min-height:72px}
.logo{display:inline-flex;align-items:center;gap:10px;text-decoration:none;color:var(--encre);flex:none}
.logo__mark{display:grid;place-items:center;width:42px;height:42px;background:var(--jaune);border:1.5px solid var(--encre);font:700 1.375rem/1 var(--cond);letter-spacing:.02em}
.logo__txt{font:600 1.5rem/1 var(--cond);text-transform:uppercase;letter-spacing:.02em}
.logo__txt b{font-weight:700}
.logo--clair{color:var(--blanc)}
.nav{margin-left:auto}
.nav ul{display:flex;gap:4px;list-style:none;margin:0;padding:0}
.nav a{display:block;padding:10px 10px;font:600 1.125rem/1 var(--cond);text-transform:uppercase;letter-spacing:.04em;color:var(--encre);text-decoration:none;border-bottom:3px solid transparent}
.nav a:hover{border-bottom-color:var(--jaune);color:var(--encre)}
.nav a[aria-current]{border-bottom-color:var(--orange)}
.nav__extra{display:none}
.head__actions{display:flex;align-items:center;gap:14px}
.head__tel{display:inline-flex;align-items:center;gap:8px;font:600 1.25rem/1 var(--cond);letter-spacing:.03em;color:var(--encre);text-decoration:none;white-space:nowrap}
.head__tel .ico{color:var(--orange)}
.head__tel:hover{color:var(--orange-t)}
.burger{display:none;width:48px;height:48px;border:1.5px solid var(--encre);background:var(--blanc);color:var(--encre);cursor:pointer;place-items:center;padding:0}
.burger .ico{width:24px;height:24px}
.burger__f{display:none}
.burger[aria-expanded=true] .burger__o{display:none}
.burger[aria-expanded=true] .burger__f{display:block}

@media (max-width:1180px){
  .head__tel span{display:none}
  .head__tel{width:48px;height:48px;justify-content:center;border:1.5px solid var(--encre)}
  .head__tel .ico{width:22px;height:22px}
}
@media (max-width:1040px){
  .burger{display:grid}
  .nav{position:fixed;inset:73px 0 0 0;background:var(--blanc);padding:8px var(--gout) 120px;overflow:auto;transform:translateX(100%);visibility:hidden;transition:transform .32s cubic-bezier(.16,1,.3,1),visibility 0s .32s;margin:0}
  .nav.ouvert{transform:none;visibility:visible;transition:transform .32s cubic-bezier(.16,1,.3,1)}
  .nav ul{flex-direction:column;gap:0}
  .nav a{font-size:2rem;padding:16px 0;border-bottom:1px solid var(--trait)}
  .nav a[aria-current]{border-bottom:1px solid var(--trait);color:var(--orange-t)}
  .nav__extra{display:grid;gap:12px;margin-top:24px}
  .nav__extra .note{margin-top:8px}
  .head__devis{display:none}
  body.menu-ouvert{overflow:hidden}
}
@media (max-width:420px){.logo__txt{font-size:1.25rem}.logo__mark{width:38px;height:38px}}

/* ---------- Fil d'Ariane ---------- */
.fil{padding-top:18px}
.fil ol{display:flex;flex-wrap:wrap;gap:6px;list-style:none;margin:0;padding:0;font:500 .75rem/1.4 var(--mono);text-transform:uppercase;letter-spacing:.03em;color:var(--encre-3)}
.fil li+li::before{content:"/";margin-right:6px;color:var(--trait)}
.fil a{color:var(--encre-2);text-decoration:none}
.fil a:hover{color:var(--orange-t);text-decoration:underline}

/* ---------- Sections ---------- */
.section{padding:clamp(64px,9vw,112px) 0;border-top:1.5px solid var(--encre)}
.section--blanc{background:var(--blanc)}
.section--sans-trait{border-top:0}
.tete{display:grid;grid-template-columns:minmax(0,1fr);gap:16px;margin-bottom:clamp(32px,5vw,56px);max-width:62ch}
.tete p{color:var(--encre-2);font-size:1.125rem}
.prose{max-width:68ch}
.prose h2{font-size:clamp(1.75rem,3vw,2.4rem);margin:1.6em 0 .5em}
.prose h3{margin:1.4em 0 .4em}
.prose h2:first-child,.prose h3:first-child{margin-top:0}
.prose ul{padding-left:1.1em;margin:0 0 1em}
.prose li{margin-bottom:.35em}
.prose li::marker{color:var(--orange)}
.lead{font-size:clamp(1.125rem,1.6vw,1.3125rem);line-height:1.55;color:var(--encre-2);max-width:56ch}

/* ---------- Hero ---------- */
.hero{position:relative;border-bottom:1.5px solid var(--encre)}
.hero__in{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(32px,5vw,72px);align-items:center;padding-block:clamp(48px,7vw,96px)}
.hero h1 em{font-style:normal;background:linear-gradient(transparent 62%,var(--jaune) 62%,var(--jaune) 92%,transparent 92%)}
.hero .lead{margin-top:24px}
.hero__btns{display:flex;flex-wrap:wrap;gap:12px;margin-top:32px}
.hero__note{margin-top:22px}
.hero__plan{position:relative}
.hero--page .hero__in{grid-template-columns:minmax(0,1fr) minmax(0,420px)}
.hero--page h1{font-size:clamp(2.4rem,5.2vw,4.4rem)}
.hero--simple .hero__in{grid-template-columns:minmax(0,1fr)}

/* Fiche technique (cartouche) */
.fiche{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin:0;border:1.5px solid var(--encre);border-bottom:0;background:var(--blanc)}
.fiche>div{padding:18px 20px 20px;border-left:1px solid var(--trait)}
.fiche>div:first-child{border-left:0}
.fiche dt{font:500 .75rem/1.3 var(--mono);text-transform:uppercase;letter-spacing:.04em;color:var(--encre-3);margin-bottom:8px}
.fiche dd{margin:0;font:600 1.375rem/1.15 var(--cond);text-transform:uppercase;letter-spacing:.01em}
.fiche dd small{display:block;font:400 .875rem/1.4 var(--sans);text-transform:none;color:var(--encre-2);margin-top:4px;letter-spacing:0}
.fiche .note{font-size:inherit}

/* ---------- Index des services ---------- */
.index{list-style:none;margin:0;padding:0;border-top:1.5px solid var(--encre)}
.index li{border-bottom:1px solid var(--encre)}
.index a{display:grid;grid-template-columns:56px minmax(0,1.1fr) minmax(0,1.4fr) 32px;gap:24px;align-items:center;padding:26px 8px;color:var(--encre);text-decoration:none;transition:background-color .18s}
.index a:hover{background:var(--jaune);color:var(--encre)}
.index__ico{display:grid;place-items:center;width:56px;height:56px;border:1.5px solid var(--encre);background:var(--blanc)}
.index__ico .ico{width:26px;height:26px;color:var(--acier)}
.index__nom{font:700 clamp(1.5rem,2.4vw,2rem)/1.05 var(--cond);text-transform:uppercase}
.index__txt{color:var(--encre-2)}
.index a:hover .index__txt{color:var(--encre)}
.index__fl{width:28px;height:28px;transition:transform .2s}
.index a:hover .index__fl{transform:translateX(4px)}

/* ---------- Tableau technique ---------- */
.tab-wrap{overflow-x:auto;border:1.5px solid var(--encre);background:var(--blanc)}
.tab{width:100%;border-collapse:collapse;font-size:1rem;min-width:640px}
.tab th,.tab td{text-align:left;vertical-align:top;padding:16px 18px;border-bottom:1px solid var(--trait)}
.tab thead th{font:500 .75rem/1.3 var(--mono);text-transform:uppercase;letter-spacing:.04em;color:var(--blanc);background:var(--encre);border-bottom:0}
.tab tbody th{font:700 1.25rem/1.1 var(--cond);text-transform:uppercase;width:22%}
.tab tbody tr:last-child>*{border-bottom:0}
.tab td{color:var(--encre-2)}

/* ---------- Deux colonnes ---------- */
.duo{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(32px,6vw,88px);align-items:start}
.duo--7-5{grid-template-columns:minmax(0,7fr) minmax(0,5fr)}
.collant{position:sticky;top:100px}

/* Liste à coches */
.coches{list-style:none;margin:0 0 1.2em;padding:0;border-top:1px solid var(--trait)}
.coches li{display:flex;gap:12px;padding:12px 0;border-bottom:1px solid var(--trait)}
.coches .ico{color:var(--orange);margin-top:.2em}

/* Avis : thèmes */
.themes{display:flex;flex-wrap:wrap;gap:8px;list-style:none;margin:20px 0 0;padding:0}
.themes li{font:600 1.125rem/1 var(--cond);text-transform:uppercase;letter-spacing:.04em;padding:10px 14px;border:1.5px solid var(--encre);background:var(--blanc)}
.gros-chiffre{font:700 clamp(5rem,12vw,9rem)/.85 var(--cond);letter-spacing:-.02em}
.gros-chiffre small{font-size:.35em;letter-spacing:0;color:var(--encre-2)}

/* ---------- Plans SVG ---------- */
.plan{margin:0;border:1.5px solid var(--encre);background:var(--blanc)}
.plan svg{width:100%;height:auto}
.plan figcaption,.photo-vide figcaption{font:500 .6875rem/1.3 var(--mono);text-transform:uppercase;letter-spacing:.05em;color:var(--encre-3);padding:10px 14px;border-top:1px solid var(--trait)}
.eau{stroke-dasharray:6 5;animation:eau 2.8s cubic-bezier(.16,1,.3,1) both}
@keyframes eau{from{stroke-dashoffset:66}to{stroke-dashoffset:0}}
@media (prefers-reduced-motion:reduce){.eau{animation:none}*{scroll-behavior:auto!important;transition:none!important}}

/* Photo à fournir */
.photo-vide{margin:0;border:1.5px dashed var(--encre-3);aspect-ratio:4/3;display:grid;place-items:center;text-align:center}
.photo-vide>div{display:grid;justify-items:center;gap:10px;padding:20px}
.photo-vide .ico{width:34px;height:34px;color:var(--encre-3)}
.photo-vide__l{font-size:.9375rem;color:var(--encre-2);max-width:26ch}
.galerie{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}

/* ---------- Communes ---------- */
.villes{display:flex;flex-wrap:wrap;gap:0;list-style:none;margin:0;padding:0;border-top:1px solid var(--encre);border-left:1px solid var(--encre)}
.villes li{border-right:1px solid var(--encre);border-bottom:1px solid var(--encre);flex:1 1 160px}
.villes a{display:block;padding:16px 18px;font:700 1.375rem/1 var(--cond);text-transform:uppercase;color:var(--encre);text-decoration:none;background:var(--blanc)}
.villes a:hover{background:var(--jaune);color:var(--encre)}

/* ---------- FAQ ---------- */
.faq{border-top:1.5px solid var(--encre)}
.faq details{border-bottom:1px solid var(--encre)}
.faq summary{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:22px 4px;cursor:pointer;list-style:none;font:600 1.375rem/1.2 var(--cond)}
.faq summary::-webkit-details-marker{display:none}
.faq summary:hover{color:var(--orange-t)}
.faq__ico{transition:transform .2s;color:var(--orange)}
.faq details[open] .faq__ico{transform:rotate(90deg)}
.faq__r{padding:0 4px 24px;max-width:68ch;color:var(--encre-2)}

/* ---------- Bloc CTA ---------- */
.cta{background:var(--encre);color:var(--blanc);background-image:linear-gradient(rgba(255,255,255,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.06) 1px,transparent 1px);background-size:var(--pas) var(--pas)}
.cta__in{display:grid;grid-template-columns:minmax(0,1.3fr) auto;gap:40px;align-items:end;padding-block:clamp(56px,8vw,96px)}
.cta h2{color:var(--blanc)}
.cta p{color:#C9D1D6;margin-top:16px;max-width:52ch;font-size:1.125rem}
.cta__assur{display:flex;flex-wrap:wrap;gap:10px 24px;list-style:none;margin:24px 0 0;padding:0;color:#C9D1D6;font-size:.9375rem}
.cta__assur li{display:inline-flex;align-items:center;gap:8px}
.cta__assur .ico{color:var(--jaune)}
.cta__btns{display:grid;gap:12px}

/* ---------- Formulaire ---------- */
.form{display:grid;gap:18px;background:var(--blanc);border:1.5px solid var(--encre);padding:clamp(20px,3vw,32px)}
.form__ligne{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.champ{display:grid;gap:6px}
.champ label,.champ legend{font:500 .75rem/1.3 var(--mono);text-transform:uppercase;letter-spacing:.04em;color:var(--encre-2)}
.champ input,.champ select,.champ textarea{width:100%;font:400 1.0625rem/1.4 var(--sans);color:var(--encre);background:var(--fond);border:1.5px solid var(--encre);border-radius:0;padding:12px 14px;min-height:50px}
.champ textarea{min-height:130px;resize:vertical}
.champ input::placeholder,.champ textarea::placeholder{color:var(--encre-3)}
.champ input:focus,.champ select:focus,.champ textarea:focus{outline:3px solid var(--acier);outline-offset:1px;background:var(--blanc)}
.champ--rgpd{display:flex;gap:10px;align-items:flex-start;font-size:.875rem;color:var(--encre-2)}
.champ--rgpd input{width:20px;height:20px;min-height:0;margin-top:2px;accent-color:var(--encre);flex:none}
.pot{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.form__msg{padding:14px 16px;font-weight:500;border:1.5px solid}
.form__msg[hidden]{display:none}
.form__msg.ok{border-color:#2D6A3E;background:#E8F3EB;color:#1E4A2A}
.form__msg.err{border-color:var(--orange);background:var(--orange-c);color:var(--orange-t)}
.form__aide{font-size:.875rem;color:var(--encre-3)}

/* ---------- Pied ---------- */
.foot{background:var(--encre);color:#C9D1D6;font-size:.9375rem}
.foot__bande{height:10px;background:repeating-linear-gradient(-45deg,var(--jaune) 0 14px,var(--encre) 14px 28px)}
.foot__grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:40px;padding-block:64px 40px}
.foot__brand p{margin:18px 0;max-width:36ch}
.foot__h{font:500 .75rem/1.3 var(--mono);text-transform:uppercase;letter-spacing:.06em;color:var(--jaune);margin-bottom:16px}
.foot ul{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.foot a{color:var(--blanc);text-decoration:none}
.foot a:hover{color:var(--jaune);text-decoration:underline}
.foot__coord{line-height:1.7}
.foot__mono{display:flex;gap:8px;align-items:center;font:500 .8125rem/1.3 var(--mono)}
.foot__lien{display:inline-flex;gap:6px;align-items:center;margin-right:16px}
.foot__bas{display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px;padding-block:20px 28px;border-top:1px solid #343B41;font:500 .75rem/1.4 var(--mono);text-transform:uppercase;letter-spacing:.04em}
.foot__liens{display:flex;flex-wrap:wrap;gap:18px}

/* ---------- Barre mobile ---------- */
.mbar{display:none}
@media (max-width:760px){
  body{padding-bottom:64px}
  .mbar{display:grid;grid-template-columns:2fr 3fr;position:fixed;left:0;right:0;bottom:0;z-index:60;border-top:1.5px solid var(--encre);padding-bottom:env(safe-area-inset-bottom);background:var(--encre)}
  .mbar a{display:flex;align-items:center;justify-content:center;gap:8px;min-height:62px;font:700 1.25rem/1 var(--cond);text-transform:uppercase;letter-spacing:.04em;text-decoration:none}
  .mbar__tel{background:var(--encre);color:var(--blanc)}
  .mbar__devis{background:var(--jaune);color:var(--encre)}
  .mbar .ico{width:20px;height:20px}
}

/* ---------- Plan du site, 404 ---------- */
.plan-site{columns:2;column-gap:48px;list-style:none;padding:0;margin:0}
.plan-site li{break-inside:avoid;padding:10px 0;border-bottom:1px solid var(--trait)}

/* ---------- Responsive ---------- */
@media (max-width:980px){
  .hero__in,.hero--page .hero__in{grid-template-columns:minmax(0,1fr)}
  .hero__plan{max-width:560px}
  .fiche{grid-template-columns:repeat(2,minmax(0,1fr))}
  .fiche>div:nth-child(3){border-left:0}
  .fiche>div:nth-child(n+3){border-top:1px solid var(--trait)}
  .duo,.duo--7-5{grid-template-columns:minmax(0,1fr)}
  .collant{position:static}
  .cta__in{grid-template-columns:minmax(0,1fr);align-items:start}
  .cta__btns{grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}
  .foot__grid{grid-template-columns:1fr 1fr}
  .galerie{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:640px){
  body{font-size:1rem}
  .index a{grid-template-columns:44px minmax(0,1fr) 24px;gap:14px 16px;padding:20px 4px}
  .index__ico{width:44px;height:44px}
  .index__ico .ico{width:22px;height:22px}
  .index__txt{grid-column:2/3;grid-row:2;font-size:.9375rem}
  .index__fl{grid-column:3;grid-row:1}
  .fiche dd{font-size:1.2rem}
  .fiche>div{padding:14px 14px 16px}
  .form__ligne{grid-template-columns:1fr}
  .foot__grid{grid-template-columns:1fr;gap:32px}
  .galerie{grid-template-columns:1fr}
  .plan-site{columns:1}
  .hero__btns .btn{width:100%}
  .btn--lg{font-size:1.125rem;padding:.6em 1em}
  .tab{min-width:0}
  .tab thead{display:none}
  .tab thead.garder{display:block}
  .tab thead.garder tr{border:0}
  .tab thead.garder th{display:block;padding:12px 16px}
  .tab tr{display:block;border-bottom:1px solid var(--encre)}
  .tab tbody tr:last-child{border-bottom:0}
  .tab th,.tab td{display:block;width:auto!important;border-bottom:0;padding:6px 16px}
  .tab tbody th{padding-top:16px}
  .tab td:last-child{padding-bottom:16px}
  .tab td[data-l]::before{content:attr(data-l);display:block;font:500 .6875rem/1.3 var(--mono);text-transform:uppercase;letter-spacing:.04em;color:var(--encre-3);margin-bottom:2px}
}