/* ─── polices auto-hébergées (aucun appel à Google) ─── */
@font-face{font-family:Manrope;src:url(/assets/polices/manrope-500.woff2) format('woff2');font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:Manrope;src:url(/assets/polices/manrope-600.woff2) format('woff2');font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:Manrope;src:url(/assets/polices/manrope-800.woff2) format('woff2');font-weight:800;font-style:normal;font-display:swap}
@font-face{font-family:'Source Sans 3';src:url(/assets/polices/source-sans-3-400.woff2) format('woff2');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'Source Sans 3';src:url(/assets/polices/source-sans-3-600.woff2) format('woff2');font-weight:600;font-style:normal;font-display:swap}
body{container-type:inline-size}

/* ══════════════════════════════════════════════════════════════════════
   PROTOTYPE NAVIGABLE — berdinplus.com
   v3.0 · 09/09/2026 — contractant général, savoir-faire · jetons de Berdin_Plus_charte_graphique_v1.pdf
   Positionnement : contractant général. Un contrat, un prix, une date.
   ══════════════════════════════════════════════════════════════════════ */
:root{
  --kaki:#515A42; --kaki-profond:#3A4130; --vert-pale:#E0E7DA; --chaux:#F5F7F3;
  --noir:#1D1D1B; --gris-perle:#D9D9D9; --papier:#F4F3EF;
  --gris-mute:#64675E;               /* corrigé — #8A8A8A de la charte ne passe pas AA */
  --fond:#FFFFFF; --fond-2:var(--chaux); --fond-3:var(--papier);
  --encre:var(--noir); --encre-2:var(--gris-mute); --trait:var(--gris-perle);
  --accent:var(--kaki); --accent-encre:#FFFFFF; --accent-clair:#A9BC85;
  --sombre:var(--kaki-profond); --sur-sombre:#FFFFFF; --sur-sombre-2:#B9C1A8;
  --alerte:#8C4A2F; --alerte-fond:#F6EBE6;
  --titre:'Manrope',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  --texte:'Source Sans 3',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  --motif:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='72' height='72' viewBox='0 0 72 72'%3E%3Cpath d='M14 8h3.4v5.2h5.2v3.4h-5.2v5.2H14v-5.2H8.8v-3.4H14z' fill='%23515A42' opacity='.07'/%3E%3Cpath d='M50 44h3.4v5.2h5.2v3.4h-5.2v5.2H50v-5.2h-5.2v-3.4H50z' fill='%23515A42' opacity='.07'/%3E%3C/svg%3E");
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
  --fond:#15170F; --fond-2:#1C1F16; --fond-3:#22261B; --encre:#EFF0EA; --encre-2:#A9AC9F;
  --trait:#3A3F31; --accent:#9FAC85; --accent-encre:#15170F; --accent-clair:#A9BC85;
  --sombre:#0E1009; --sur-sombre:#EFF0EA; --sur-sombre-2:#A9AC9F;
  --alerte:#D9A88F; --alerte-fond:#2C1E17;
  --motif:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='72' height='72' viewBox='0 0 72 72'%3E%3Cpath d='M14 8h3.4v5.2h5.2v3.4h-5.2v5.2H14v-5.2H8.8v-3.4H14z' fill='%239FAC85' opacity='.07'/%3E%3Cpath d='M50 44h3.4v5.2h5.2v3.4h-5.2v5.2H50v-5.2h-5.2v-3.4H50z' fill='%239FAC85' opacity='.07'/%3E%3C/svg%3E");
}}
:root[data-theme="dark"]{
  --fond:#15170F; --fond-2:#1C1F16; --fond-3:#22261B; --encre:#EFF0EA; --encre-2:#A9AC9F;
  --trait:#3A3F31; --accent:#9FAC85; --accent-encre:#15170F; --accent-clair:#A9BC85;
  --sombre:#0E1009; --sur-sombre:#EFF0EA; --sur-sombre-2:#A9AC9F;
  --alerte:#D9A88F; --alerte-fond:#2C1E17;
  --motif:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='72' height='72' viewBox='0 0 72 72'%3E%3Cpath d='M14 8h3.4v5.2h5.2v3.4h-5.2v5.2H14v-5.2H8.8v-3.4H14z' fill='%239FAC85' opacity='.07'/%3E%3Cpath d='M50 44h3.4v5.2h5.2v3.4h-5.2v5.2H50v-5.2h-5.2v-3.4H50z' fill='%239FAC85' opacity='.07'/%3E%3C/svg%3E");
}
*{box-sizing:border-box}
body{margin:0;background:var(--fond-3);color:var(--encre);font-family:var(--texte);font-size:17px;line-height:1.6;-webkit-font-smoothing:antialiased}
h1,h2,h3,h4{font-family:var(--titre);font-weight:800;letter-spacing:-.025em;line-height:1.13;text-wrap:balance;margin:0}
h1{font-size:clamp(1.85rem,3.6cqw,2.8rem)} h2{font-size:clamp(1.42rem,2.4cqw,1.95rem)}
h3{font-size:1.16rem;font-weight:600;letter-spacing:-.012em} h4{font-size:.98rem;font-weight:600;letter-spacing:0}
p{margin:0} a{color:inherit}
:focus-visible{outline:2.5px solid var(--accent);outline-offset:2px;border-radius:2px}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

/* ─── entête site ─── */
.entete{border-bottom:1px solid var(--trait);background:var(--fond);position:relative;z-index:20}
.entete-in{max-width:1180px;margin:0 auto;padding:.6rem 1.2rem;display:flex;align-items:center;gap:1.4rem}
.logo{display:flex;align-items:baseline;gap:.09em;font-family:var(--titre);font-weight:800;font-size:1.8rem;letter-spacing:-.03em;line-height:1;white-space:nowrap;text-decoration:none;color:var(--encre)}
.logo .p{color:var(--accent);font-size:.7em}
.logo-sig{font-size:.48rem;letter-spacing:.32em;color:var(--encre-2);font-weight:500;text-transform:uppercase;margin-top:.28rem;font-family:var(--titre)}
.nav{display:flex;gap:1.15rem;flex:1;flex-wrap:wrap}
.nav a{font-family:var(--titre);font-weight:600;font-size:.85rem;color:var(--encre-2);text-decoration:none;padding:.15rem 0}
.nav a:hover{color:var(--encre)}
.nav a.on{color:var(--encre);box-shadow:inset 0 -2px 0 var(--accent)}
.tel-h{font-family:var(--titre);font-weight:800;font-size:.94rem;white-space:nowrap;text-decoration:none}
.burger{display:none;background:none;border:1px solid var(--trait);border-radius:2px;padding:.4rem .55rem;cursor:pointer;font-family:var(--titre);font-weight:600;font-size:.8rem;color:var(--encre)}
@container (max-width:820px){
  .nav{display:none;position:absolute;top:100%;left:0;right:0;background:var(--fond);border-bottom:1px solid var(--trait);flex-direction:column;gap:0;padding:.4rem 1.2rem 1rem}
  .nav.ouvert{display:flex}
  .nav a{padding:.62rem 0;border-bottom:1px solid var(--trait);font-size:.98rem}
  .burger{display:block;order:3}
  .tel-h{display:none}
}

/* ─── structure ─── */
.page{padding:0}
.env{max-width:1180px;margin:0 auto;padding:0 1.2rem}
section{padding:3.2rem 0}section.serre{padding:2.2rem 0}
.f2{background:var(--fond-2)}
.hero{background:linear-gradient(180deg,var(--chaux) 0%,var(--fond) 100%)}
:root[data-theme="dark"] .hero{background:linear-gradient(180deg,var(--fond-2) 0%,var(--fond) 100%)}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .hero{background:linear-gradient(180deg,var(--fond-2) 0%,var(--fond) 100%)}}.f3{background:var(--fond-3)}.motif{background-image:var(--motif)}
.surtitre{font-family:var(--titre);font-weight:600;font-size:.71rem;letter-spacing:.15em;text-transform:uppercase;color:var(--accent);margin-bottom:.65rem}
.chapo{font-size:1.08rem;color:var(--encre-2);max-width:62ch;margin-top:.9rem}
.pile{display:flex;flex-direction:column;gap:1rem}
.pile-l{display:flex;flex-direction:column;gap:1.8rem}
.deux{display:grid;grid-template-columns:1.55fr 1fr;gap:2.3rem;align-items:start}
.deux.eq{grid-template-columns:1fr 1fr}
@container (max-width:820px){.deux,.deux.eq{grid-template-columns:1fr;gap:1.6rem}}
.colle{position:sticky;top:1rem}
@container (max-width:820px){.colle{position:static}}
hr.sep{border:0;border-top:1px solid var(--trait);margin:2rem 0}
.fil{font-family:var(--titre);font-weight:600;font-size:.79rem;color:var(--encre-2);display:flex;gap:.45rem;flex-wrap:wrap;margin-bottom:.85rem}
.fil a{color:var(--accent);text-decoration:none}.fil a:hover{text-decoration:underline}

/* ─── boutons ─── */
.btn{display:inline-flex;align-items:center;gap:.5rem;font-family:var(--titre);font-weight:600;font-size:.93rem;padding:.72rem 1.3rem;background:var(--accent);color:var(--accent-encre);border:1.5px solid var(--accent);border-radius:2px;cursor:pointer;text-decoration:none}
.btn:hover{background:var(--kaki-profond);border-color:var(--kaki-profond);color:#fff}
.btn.creux{background:none;color:var(--encre);border-color:var(--trait)}
.btn.creux:hover{background:none;border-color:var(--accent);color:var(--accent)}
.btn.plein{width:100%;justify-content:center}
.btns{display:flex;gap:.65rem;flex-wrap:wrap}

.filet{border-left:3px solid var(--accent);padding-left:1.05rem}
.sombre{background:var(--sombre);color:var(--sur-sombre);padding:1.9rem 1.8rem;border-radius:2px}
.sombre h2,.sombre h3{color:var(--sur-sombre)}.sombre p{color:var(--sur-sombre-2)}
.sombre .surtitre{color:var(--accent-clair)}
.sombre b{color:#fff}

.g{display:grid;gap:1.1rem}
.g2{grid-template-columns:repeat(auto-fit,minmax(270px,1fr))}
.g3{grid-template-columns:repeat(auto-fit,minmax(232px,1fr))}
.g4{grid-template-columns:repeat(auto-fit,minmax(182px,1fr))}
@container (max-width:560px){.g2,.g3,.g4{grid-template-columns:1fr}}

.carte{background:var(--fond);border:1px solid var(--trait);border-radius:2px;overflow:hidden;display:flex;flex-direction:column;text-decoration:none;color:inherit}
a.carte:hover{border-color:var(--accent)}
a.carte:hover h3{color:var(--accent)}
.carte-c{padding:1rem 1.1rem 1.15rem;display:flex;flex-direction:column;gap:.48rem;flex:1}
.meta{font-family:var(--titre);font-weight:600;font-size:.77rem;color:var(--encre-2);display:flex;gap:.4rem;flex-wrap:wrap;align-items:center}
.meta b{color:var(--encre);font-weight:800}
.pt{color:var(--accent)}

.photo{background:var(--vert-pale);background-image:var(--motif);aspect-ratio:4/3;display:flex;align-items:flex-end;padding:.55rem .65rem}
.photo.h{aspect-ratio:16/9}.photo.v{aspect-ratio:3/4}
:root[data-theme="dark"] .photo{background-color:#242A1C}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .photo{background-color:#242A1C}}
.photo::after{content:attr(data-l);font-family:var(--titre);font-weight:600;font-size:.63rem;letter-spacing:.1em;text-transform:uppercase;color:var(--kaki);background:var(--fond);padding:.18rem .42rem;border-radius:2px}
:root[data-theme="dark"] .photo::after{color:var(--accent)}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .photo::after{color:var(--accent)}}

.et{display:inline-block;font-family:var(--titre);font-weight:600;font-size:.68rem;letter-spacing:.09em;text-transform:uppercase;padding:.26rem .52rem;border:1px solid var(--trait);border-radius:2px;color:var(--encre-2)}
.et.k{border-color:var(--accent);color:var(--accent)}
.et.pleine{background:var(--accent);border-color:var(--accent);color:var(--accent-encre)}

.tab{width:100%;border-collapse:collapse;font-size:.93rem}
.tab th{font-family:var(--titre);font-weight:600;font-size:.7rem;letter-spacing:.1em;text-transform:uppercase;color:var(--encre-2);text-align:left;padding:.52rem .65rem;border-bottom:1.5px solid var(--trait)}
.tab td{padding:.58rem .65rem;border-bottom:1px solid var(--trait);vertical-align:top}
.tab td.n{font-family:var(--titre);font-weight:600;font-variant-numeric:tabular-nums;white-space:nowrap}
.tab tr:last-child td{border-bottom:0}
.sx{overflow-x:auto}

.chiffre{font-family:var(--titre);font-weight:800;font-size:2.4rem;letter-spacing:-.04em;color:var(--accent);line-height:1;font-variant-numeric:tabular-nums}
.chiffre.xl{font-size:3.2rem}
@container (max-width:560px){.chiffre.xl{font-size:2.4rem}}

/* coupe à 45° — charte §13 */
.avap{position:relative;aspect-ratio:16/10;overflow:hidden;border:1px solid var(--trait);border-radius:2px;user-select:none;--p:52%}
.avap-c{position:absolute;inset:0}
.av{background:#4A4A44;background-image:var(--motif)}
.ap{background:var(--kaki);background-image:var(--motif);clip-path:polygon(calc(var(--p) + 9%) 0,100% 0,100% 100%,calc(var(--p) - 9%) 100%)}
.avap-d{position:absolute;inset:0;display:block}
.avap-t{position:absolute;top:.7rem;font-family:var(--titre);font-weight:800;font-size:.67rem;letter-spacing:.12em;text-transform:uppercase;color:#fff;background:rgba(0,0,0,.45);padding:.28rem .55rem;border-radius:2px}
.avap-t.g{left:.7rem}.avap-t.d{right:.7rem}
.avap-cur{position:absolute;inset:0;width:100%;margin:0;-webkit-appearance:none;appearance:none;background:none;cursor:ew-resize}
.avap-cur::-webkit-slider-thumb{-webkit-appearance:none;width:34px;height:34px;border-radius:50%;background:#fff;border:3px solid var(--kaki);cursor:ew-resize;box-shadow:0 2px 10px rgba(0,0,0,.35)}
.avap-cur::-moz-range-thumb{width:34px;height:34px;border-radius:50%;background:#fff;border:3px solid var(--kaki)}
.avap-cur:focus-visible{outline:3px solid #fff;outline-offset:-3px}
.leg{font-size:.82rem;color:var(--encre-2);margin-top:.5rem}

/* formulaires */
.champ{display:flex;flex-direction:column;gap:.3rem;margin-bottom:.85rem}
.champ label{font-family:var(--titre);font-weight:600;font-size:.84rem}
.champ small,.aide{font-size:.79rem;color:var(--encre-2)}
input[type=text],input[type=number],input[type=email],input[type=tel],select,textarea{font-family:var(--texte);font-size:16px;padding:.6rem .68rem;border:1.5px solid var(--trait);border-radius:2px;background:var(--fond);color:var(--encre);width:100%}
input:focus,select:focus,textarea:focus{border-color:var(--accent);outline:none}
.choix{display:grid;gap:.48rem}
.choix label{display:flex;gap:.62rem;align-items:flex-start;padding:.7rem .82rem;border:1.5px solid var(--trait);border-radius:2px;cursor:pointer;font-size:.94rem}
.choix label:hover{border-color:var(--accent)}
.choix input{margin:.26rem 0 0;flex-shrink:0}
.choix label:has(input:checked){border-color:var(--accent);background:var(--vert-pale)}
:root[data-theme="dark"] .choix label:has(input:checked){background:#242A1C}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .choix label:has(input:checked){background:#242A1C}}
.etapes{display:flex;gap:.32rem;margin-bottom:1.5rem}
.etapes i{height:4px;flex:1;background:var(--trait);border-radius:2px}
.etapes i.on{background:var(--accent)}

.res{background:var(--vert-pale);border-left:3px solid var(--accent);padding:1.1rem 1.25rem;border-radius:2px}
:root[data-theme="dark"] .res{background:#242A1C}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .res{background:#242A1C}}
.avert{background:var(--alerte-fond);border-left:3px solid var(--alerte);padding:.82rem 1rem;border-radius:2px;font-size:.91rem}
.avert b{color:var(--alerte)}
.src{font-size:.79rem;color:var(--encre-2)}.src::before{content:"↳ "}
.verif{display:inline-flex;align-items:center;gap:.4rem;font-family:var(--titre);font-weight:600;font-size:.73rem;color:var(--encre-2);border:1px solid var(--trait);padding:.28rem .58rem;border-radius:2px}
.verif b{color:var(--accent)}
.pl{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:.55rem}
.pl li{padding-left:1.5rem;position:relative;font-size:.97rem}
.pl li::before{content:"";position:absolute;left:0;top:.5em;width:11px;height:11px;background:var(--accent);clip-path:polygon(38% 0,62% 0,62% 38%,100% 38%,100% 62%,62% 62%,62% 100%,38% 100%,38% 62%,0 62%,0 38%,38% 38%)}
.enc{border:1px solid var(--trait);padding:1.1rem;border-radius:2px}

/* pied */
.pied{background:var(--kaki-profond);color:#fff;padding:2.5rem 0 1.5rem;background-image:var(--motif)}
.pied a{color:#D5DAC9;text-decoration:none;font-size:.88rem}
.pied a:hover{color:#fff;text-decoration:underline}
.pied h4{font-size:.72rem;letter-spacing:.13em;text-transform:uppercase;margin-bottom:.65rem;color:#A8B196}
.pied-bas{border-top:1px solid rgba(255,255,255,.14);margin-top:1.9rem;padding-top:1rem;font-size:.78rem;color:#A8B196;display:flex;gap:1rem;flex-wrap:wrap;justify-content:space-between}

/* schéma des deux façons de faire */
.schema{width:100%;height:auto;display:block;margin-top:1rem}
.schema text{font-family:var(--titre);font-weight:600}
.tab.comp td:last-child,.tab.comp th:last-child{background:var(--vert-pale)}
:root[data-theme="dark"] .tab.comp td:last-child,:root[data-theme="dark"] .tab.comp th:last-child{background:#242A1C}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .tab.comp td:last-child,:root:not([data-theme="light"]) .tab.comp th:last-child{background:#242A1C}}
.tab.comp td:last-child{font-weight:600}

/* ─── titres rétrogradés : même apparence, niveau corrigé ─── */
.t3{font-size:1.16rem;font-weight:600;letter-spacing:-.012em}
.t4{font-size:.98rem;font-weight:600;letter-spacing:0}
.t5,.t6{font-size:.9rem;font-weight:600;letter-spacing:0}
/* ─── images ─── */
.visuel{display:block;width:100%;height:auto;background:var(--fond-2);border-radius:2px}
figure{margin:0}
figure figcaption{font-size:.79rem;color:var(--encre-2);margin-top:.4rem}
.carte .visuel{border-radius:0}
.avap-c img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.saut{position:absolute;left:-9999px}
.saut:focus{left:1rem;top:1rem;position:fixed;z-index:99;background:var(--accent);color:var(--accent-encre);padding:.6rem 1rem;border-radius:2px;font-family:var(--titre);font-weight:600}
@media print{.entete,.pied,.btns{display:none}}
/* ─── bandeau de mesure d'audience ─── */
.cookies{position:fixed;left:0;right:0;bottom:0;z-index:70;background:var(--kaki-profond);color:#fff;border-top:3px solid var(--accent);box-shadow:0 -6px 24px rgba(0,0,0,.18)}
.cookies-in{max-width:1180px;margin:0 auto;padding:1rem 1.2rem;display:flex;gap:1.4rem;align-items:center;flex-wrap:wrap}
.cookies p{font-size:.9rem;line-height:1.5;color:#D5DAC9;flex:1;min-width:280px;margin:0}
.cookies a{color:#fff;text-decoration:underline}
.cookies-bt{display:flex;gap:.6rem;flex-shrink:0}
.cookies .btn{padding:.58rem 1.15rem;font-size:.88rem}
.cookies .btn.creux{color:#fff;border-color:rgba(255,255,255,.45);background:none}
.cookies .btn.creux:hover{border-color:#fff;color:#fff}
.cookies .btn:not(.creux){background:#fff;border-color:#fff;color:var(--kaki-profond)}
.cookies .btn:not(.creux):hover{background:var(--vert-pale);border-color:var(--vert-pale);color:var(--kaki-profond)}
@media (max-width:560px){.cookies-bt{width:100%}.cookies .btn{flex:1;justify-content:center}}
@media print{.cookies{display:none}}
