/* ═══ Comité Digital·Humans — feuille commune aux trois actes ═══
   Jetons relevés dans le Studio en production (Studio_jetons_reels.css).
   Motif « L'incipit » du handoff Claude Design du 06/08. */
:root{
  --ink:#0A0A0B; --ink-2:#141416; --ink-3:#1C1C1F;
  --bone:#F5F2EC; --bone-2:#E5E1D8; --bone-3:#B5B0A4; --bone-4:#6F6B62;
  --brass:#C8A97E; --brass-2:#B89968; --brass-3:#8B764D;
  --hair:#C8A97E3D; --hair-2:#C8A97E1F; --hair-3:#C8A97E14;
  --vert:#8FA98A;
  --serif:"Cormorant Garamond",Georgia,"Times New Roman",serif;
  --sans:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  --mono:"JetBrains Mono","Menlo","Consolas",monospace;
  --ease:cubic-bezier(.4,0,.2,1);
}
*{box-sizing:border-box;margin:0}
body{background:var(--ink);color:var(--bone-3);font-family:var(--mono);
 font-weight:300;font-size:13px;line-height:1.75;-webkit-font-smoothing:antialiased}
.wrap{max-width:1180px;margin:0 auto;padding:0 28px 90px}

/* ── En-tête, repris du Studio ── */
.bandeau{display:flex;align-items:center;gap:28px;flex-wrap:wrap;
 padding:20px 0;border-bottom:1px solid var(--hair);margin-bottom:34px}
.marque{font-family:var(--serif);font-size:23px;color:var(--bone);line-height:1.1}
.marque em{font-style:italic;color:var(--brass)}
.devise{font-family:var(--mono);font-size:8.5px;letter-spacing:.22em;
 text-transform:uppercase;color:var(--bone-4);margin-top:3px}
.nav{display:flex;gap:26px;margin-left:auto;flex-wrap:wrap}
.nav a{font-family:var(--mono);font-size:10px;letter-spacing:.2em;text-transform:uppercase;
 color:var(--bone-4);text-decoration:none;padding-bottom:5px;border-bottom:1px solid transparent}
.nav a:hover{color:var(--bone-2)}
.nav a.on{color:var(--bone);border-color:var(--brass)}

/* ── Sur-titre d'acte, motif du Studio : Nº 01 · SECTION ── */
.acte{font-family:var(--mono);font-size:10px;letter-spacing:.24em;text-transform:uppercase;
 color:var(--brass-3);margin-bottom:14px}
h1{font-family:var(--serif);font-weight:300;font-size:clamp(2.1rem,4.4vw,3rem);
 line-height:1.05;letter-spacing:-.01em;color:var(--bone);margin-bottom:10px}
h1 em{font-style:italic;color:var(--brass)}
h2{font-family:var(--serif);font-style:italic;font-weight:400;font-size:1.5rem;
 color:var(--bone-2);margin:0 0 6px}
.chapo{color:var(--bone-4);font-size:12.5px;max-width:74ch;margin-bottom:20px}
.section{margin-top:52px}

/* ── Cartes ── */
.carte{border:1px solid var(--hair);background:var(--ink-2);padding:22px 24px}
.carte-t{font-family:var(--mono);font-size:9.5px;letter-spacing:.2em;text-transform:uppercase;
 color:var(--bone-4);margin-bottom:16px}

/* ── Motif libellé / valeur, repris de « Project State » ── */
.lv{display:grid;grid-template-columns:1fr auto;gap:14px;align-items:baseline;
 padding:13px 0;border-bottom:1px solid var(--hair-2)}
.lv:last-child{border-bottom:none}
.lv-l{font-family:var(--mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--bone-4)}
.lv-v{font-family:var(--serif);font-style:italic;font-size:19px;color:var(--bone);text-align:right}
.lv-v.mono{font-family:var(--mono);font-style:normal;font-size:11px;letter-spacing:.16em;text-transform:uppercase}
.pastille{display:inline-block;width:6px;height:6px;border-radius:50%;margin-right:8px;vertical-align:middle}

/* ── L'INCIPIT — motif central du handoff ──
   Deux lignes visibles, volume déclaré, dépli sur place.
   Rien n'est tronqué : l'incipit masque, il ne coupe pas. */
.incipit{border-bottom:1px solid var(--hair-2);padding:15px 0}
.incipit:last-child{border-bottom:none}
.inc-h{display:flex;align-items:baseline;gap:14px;margin-bottom:9px}
.inc-l{font-family:var(--mono);font-size:9.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--bone-4)}
.inc-a{margin-left:auto;font-family:var(--mono);font-size:9px;letter-spacing:.16em;
 text-transform:uppercase;color:var(--brass-3);cursor:pointer;white-space:nowrap;
 background:none;border:none;padding:0;display:flex;align-items:center;gap:7px}
.inc-a:hover{color:var(--brass)}
.inc-a i{font-style:normal;display:inline-block;transition:transform .3s var(--ease)}
.inc-a.on i{transform:rotate(90deg)}
.inc-p{max-height:6.4em;overflow:hidden;transition:max-height .5s var(--ease);
 font-size:12px;line-height:2;color:var(--bone-3);max-width:70ch}
.inc-p.on{max-height:520px;border-left:1px solid var(--hair);padding-left:16px}
.inc-p.nul{max-height:0}
.inc-nc{font-family:var(--mono);font-size:9.5px;letter-spacing:.16em;
 text-transform:uppercase;color:var(--bone-4)}
.hach{background:repeating-linear-gradient(135deg,var(--hair-3) 0 1px,transparent 1px 7px);
 border:1px dashed var(--hair-2);padding:3px 10px;display:inline-block}

/* ── Grilles ── */
.g2{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:20px}
.g3{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:1px;
 background:var(--hair-2);border:1px solid var(--hair)}
.g3>div{background:var(--ink-2);padding:18px 20px}

.nd{font-family:var(--mono);font-size:9.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--bone-4)}
.err{color:var(--bone-4);font-style:italic;padding:20px 0}
@media (max-width:720px){
  .wrap{padding:0 15px 70px}
  .nav{margin-left:0;gap:16px;width:100%;margin-top:12px}
  .lv{grid-template-columns:1fr}
  .lv-v{text-align:left}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}

/* Lien Arbitrer — ajoute le 10/08. Signale par un point laiton quand des
   decisions attendent, pour que Sam le voie sans avoir a cliquer. */
.nav a.arb { position: relative; }
.nav a.arb #nb-arb {
  display: inline-block; margin-left: 7px; padding: 1px 6px;
  font-size: 10px; letter-spacing: 0; border-radius: 9px;
  background: #C8A97E; color: #0E0E10; font-weight: 600;
  vertical-align: 1px;
}
.nav a.arb #nb-arb:empty { display: none; }