/* ============================================================
   THE HUMANS LAB — système partagé v48
   Deux ors : --or (plat, tous les accents), --or-metal (boutons).
   Huit paliers typographiques. Aucune autre taille.
   Ce fichier est chargé AVANT les styles propres à chaque page.
   ============================================================ */
:root{
  --encre:#181512;
  --papier:#FAF9F5;
  --papier-2:#F3F1EA;
  --or:#C9A13B;
  --or-fonce:#8a6a1f;
  --or-metal:linear-gradient(180deg,#f2d277 0%,#dcab41 44%,#a5741a 100%);
  --brume:#6E675C;
  --brume-clair:#a39c8e;
  --ligne:#DDD9D0;
  --ligne-noir:#2b261f;
  --max:1240px;

  --t-xs:.75rem;
  --t-sm:.875rem;
  --t-base:1.0625rem;
  --t-lg:1.25rem;
  --t-xl:1.5rem;
  --t-2xl:2rem;
  --t-3xl:2.75rem;
  --t-4xl:clamp(2.6rem,7vw,4.5rem);
}
*{margin:0;padding:0;box-sizing:border-box}
html,body{overflow-x:hidden;max-width:100%}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{
  background:var(--papier);
  color:var(--encre);
  font-family:'EB Garamond',Georgia,serif;
  font-size:var(--t-base);
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
}
.wrap{max-width:var(--max);margin:0 auto;padding:0 24px}
h1,h2,h3,h4{font-family:'Archivo',system-ui,sans-serif}

/* Liens de contenu : texte encre, soulignement or. L'or reste un accent. */
a{color:var(--encre);text-decoration:underline;text-decoration-color:var(--or);text-decoration-thickness:2px;text-underline-offset:3px}
a:hover{color:var(--or-fonce);text-decoration-color:var(--or-fonce)}
.btn,.logo,.nav a,.foot-nav a,.nav-cta,.carte,.menu-panneau a{text-decoration:none}
/* Fonds sombres : le texte du lien doit rester lisible. */
.strip a,.cta-fin a,footer a,.sombre a,.noir a,.audit-sec a,.secteur a,.hero-noir a{color:var(--papier);text-decoration-color:var(--or)}
.strip a:hover,.cta-fin a:hover,footer a:hover,.sombre a:hover,.noir a:hover,.audit-sec a:hover,.secteur a:hover,.hero-noir a:hover{color:var(--or);text-decoration-color:var(--or)}
::selection{background:var(--or);color:var(--encre)}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible{outline:3px solid var(--or);outline-offset:3px}

.eyebrow{font-family:'Montserrat',sans-serif;font-weight:700;font-size:var(--t-xs);letter-spacing:.14em;text-transform:uppercase;color:var(--or-fonce);display:block}
.strip .eyebrow,.cta-fin .eyebrow,.hero-noir .eyebrow,section.noir .eyebrow,.audit-sec .eyebrow,.sombre .eyebrow{color:var(--or)}

/* ---------- Boutons : un seul or métallique, réservé aux CTA ---------- */
.btn{font-family:'Archivo',sans-serif;font-weight:700;font-size:var(--t-sm);padding:15px 28px;border-radius:7px;letter-spacing:.01em;cursor:pointer;display:inline-block;border:1px solid #6b4a10;color:#2a1e08;background:var(--or-metal);box-shadow:inset 0 1px 0 rgba(255,244,200,.7),inset 0 -2px 5px rgba(80,52,8,.45),0 8px 20px rgba(24,21,18,.4);min-height:48px}
.btn:hover{filter:brightness(1.06);color:#2a1e08}
.btn-plein{color:#2a1e08;background:var(--or-metal);border-color:#6b4a10}
.btn-plein:hover{filter:brightness(1.06);color:#2a1e08}
.btn-ligne{color:var(--encre);background:none;border:1.5px solid var(--encre);box-shadow:none}
.btn-ligne:hover{border-color:var(--or);color:var(--or-fonce);filter:none}
.btn-ligne-clair{color:var(--papier);background:none;border:1.5px solid rgba(250,249,245,.4);box-shadow:none}
.btn-ligne-clair:hover{border-color:var(--or);color:var(--or);filter:none}

/* ---------- En-tête canonique ---------- */
header{border-bottom:1px solid var(--ligne-noir);background:var(--encre);position:sticky;top:0;z-index:20}
.nav{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:16px 24px;max-width:var(--max);margin:0 auto}
.logo{display:flex;align-items:center;gap:10px;color:var(--papier)}
.logo .signe{flex:none}
.logo .wm{font-family:'Archivo',sans-serif;font-weight:300;font-size:var(--t-base);letter-spacing:-.01em;color:var(--papier);white-space:nowrap}
.logo .wm b{font-weight:900}
.logo .w1{color:var(--papier)}
.nav-right{display:flex;align-items:center;gap:24px}
.nav a.link{font-family:'Archivo',sans-serif;font-size:var(--t-sm);font-weight:500;color:var(--papier);white-space:nowrap}
.nav a.link:hover{color:var(--or)}
.nav-cta{font-family:'Archivo',sans-serif;font-weight:700;font-size:var(--t-xs);letter-spacing:.03em;white-space:nowrap;padding:11px 18px;display:inline-block;color:#2a1e08;background:var(--or-metal);border:1px solid #6b4a10;border-radius:7px;box-shadow:inset 0 1px 0 rgba(255,244,200,.7),inset 0 -2px 5px rgba(80,52,8,.45);min-height:44px}
.nav-cta:hover{filter:brightness(1.06);color:#2a1e08}
.lang,.lang-link{font-family:'Archivo',sans-serif;font-size:var(--t-xs);font-weight:700;white-space:nowrap;border:1.5px solid var(--or);background:none;color:var(--or);padding:11px 14px;border-radius:99px;cursor:pointer;letter-spacing:.05em;min-height:44px;text-decoration:none;display:inline-flex;align-items:center}
.lang:hover,.lang-link:hover{background:var(--or);color:var(--encre)}

/* Menu mobile : disclosure natif, zéro JS */
.menu{display:none;position:relative}
.menu summary{list-style:none;cursor:pointer;color:var(--papier);font-family:'Archivo',sans-serif;font-weight:700;font-size:var(--t-xs);letter-spacing:.1em;text-transform:uppercase;padding:12px 4px;min-height:44px;display:flex;align-items:center;gap:8px}
.menu summary::-webkit-details-marker{display:none}
.menu summary::after{content:"";width:9px;height:9px;border-right:2px solid var(--or);border-bottom:2px solid var(--or);transform:rotate(45deg) translateY(-2px)}
.menu[open] summary::after{transform:rotate(-135deg) translateY(2px)}
.menu-panneau{position:absolute;right:0;top:calc(100% + 12px);background:var(--encre);border:1px solid var(--ligne-noir);border-radius:8px;padding:8px;min-width:230px;display:flex;flex-direction:column;box-shadow:0 18px 40px rgba(0,0,0,.5)}
.menu-panneau a{font-family:'Archivo',sans-serif;font-size:var(--t-sm);font-weight:500;color:var(--papier);padding:13px 14px;border-radius:5px;min-height:44px;display:flex;align-items:center}
.menu-panneau a:hover{background:#211d18;color:var(--or)}
/* Le hamburger prend le relais avant que le nav ne serre : avec nowrap, les
   quatre liens + le CTA + le sélecteur de langue demandent ~1100px pour tenir. */
@media(max-width:1100px){
  .nav a.link{display:none}
  .menu{display:block}
  .nav{gap:10px}
}

/* ---------- Pied de page canonique ---------- */
footer{background:var(--encre);padding:48px 0}
footer .wrap{display:flex;flex-direction:column;gap:26px;align-items:flex-start}
.foot-nav{display:flex;flex-direction:column;gap:13px;align-items:flex-start}
.foot-nav a{font-family:'Archivo',sans-serif;font-size:var(--t-sm);font-weight:500;color:var(--papier);letter-spacing:.01em;text-transform:none}
.foot-nav a:hover{color:var(--or)}
.foot-bas{display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap;width:100%;padding-top:26px;border-top:1px solid var(--ligne-noir)}
.foot-bas p,.foot-bas a,footer p{font-family:'Archivo',sans-serif;font-size:var(--t-xs);color:var(--brume-clair)}
.foot-bas a:hover{color:var(--or)}

/* ============================================================
   RYTHME DE BLOCS (v49) — deux types seulement, alternés.
   Papier respirant entre les blocs; jamais deux blocs collés
   du même type. L'or reste un accent : filet, étiquette, bordure.
   ============================================================ */
.bloc-beige{background:#F6EFDF;border:1px solid var(--or);border-radius:8px;padding:30px 32px;margin:34px 0}
.bloc-beige > :last-child{margin-bottom:0}
.bloc-beige .etiq{font-family:'Montserrat',sans-serif;font-weight:700;font-size:var(--t-xs);letter-spacing:.18em;text-transform:uppercase;color:var(--or-fonce);display:block;margin-bottom:14px}
.bloc-beige p,.bloc-beige li{color:#262019}
.bloc-beige h3{font-weight:800;font-size:var(--t-lg);letter-spacing:-.015em;margin-bottom:10px;color:var(--encre)}

.bloc-noir{background:var(--encre);border-radius:8px;padding:30px 32px;margin:34px 0;color:var(--papier)}
.bloc-noir > :last-child{margin-bottom:0}
.bloc-noir .etiq{font-family:'Montserrat',sans-serif;font-weight:700;font-size:var(--t-xs);letter-spacing:.18em;text-transform:uppercase;color:var(--or);display:block;margin-bottom:14px}
.bloc-noir h3{font-weight:800;font-size:var(--t-lg);letter-spacing:-.015em;margin-bottom:10px;color:var(--papier)}
.bloc-noir p,.bloc-noir li{color:#d8d2c7}
.bloc-noir b,.bloc-noir strong{color:var(--papier)}
.bloc-noir .chiffre{font-family:'Archivo',sans-serif;font-weight:900;font-size:var(--t-2xl);letter-spacing:-.03em;color:var(--or);line-height:1.1;display:block}

/* Trio alterné noir / beige / noir, comme la section Approche du document. */
.trio{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin:34px 0}
.trio > *{margin:0}
@media(max-width:820px){.trio{grid-template-columns:1fr;gap:16px}}

/* ============================================================
   LOCKUP BILINGUE — la ligne française est primaire, l'écho
   anglais se place dessous à exactement un tiers de la taille
   du parent (.333em hérite, donc juste à toutes les échelles),
   dans la même couleur atténuée.
   ============================================================ */
.echo{display:block;font-size:.333em;line-height:1.4;letter-spacing:.04em;font-weight:500;color:inherit;opacity:.55;margin-top:.55em;text-transform:none}
.dpa{white-space:nowrap}