/* ==========================================================
   Fonds Burdigala — « La gazette du bien commun »
   Charte : rouge Burdigala sur pierre blonde
   ========================================================== */
:root{
  --fx-color-fond:#f4ecdf;            /* pierre blonde */
  --fx-color-surface:#fbf7f0;         /* papier de registre */
  --fx-color-texte:#2a1a1c;           /* encre de nuit */
  --fx-color-texte-secondaire:#5e4a46;/* encre passée */
  --fx-color-accent:#781428;          /* rouge Burdigala — couleur principale */
  --fx-color-accent-2:#e9c27e;        /* pierre dorée (contrepoint lumineux) */
  --fx-color-garonne:#3d5a5b;         /* eau de Garonne */
  --fx-color-contraste:#4a0e1a;       /* lie de vin (aplat profond) */
  --fx-color-sur-contraste:#fbf7f0;
  --fx-color-sur-accent:#fbf7f0;
  --fx-color-marque:#781428;          /* bordeaux du monogramme */
  --fx-color-bordure:#2a1a1c;
  --fx-color-filet:#d8c8b0;           /* joint de pierre */
  --fx-font-display:"Fraunces", Georgia, "Times New Roman", serif;
  --fx-font-body:"Public Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
  --fx-font-mono:"DM Mono", ui-monospace, Menlo, monospace;

  --rule:6px solid var(--fx-color-accent);
  --gap:clamp(14px,2vw,28px);
  --pad:clamp(16px,4vw,56px);
  --max:1360px;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{
  margin:0;background:var(--fx-color-fond);color:var(--fx-color-texte);
  font-family:var(--fx-font-body);font-size:1.0625rem;line-height:1.6;
  overflow-x:hidden;
}
img,svg{max-width:100%;display:block}
h1,h2,h3,h4{font-family:var(--fx-font-display);font-weight:800;line-height:1.02;margin:0;letter-spacing:-.02em;
  font-variation-settings:"opsz" 144,"SOFT" 0,"WONK" 1}
p{margin:0 0 1em}
em{font-style:italic}
h1 em,h2 em,h3 em{font-weight:500}
a{color:inherit;text-decoration-line:underline;text-decoration-color:var(--fx-color-accent);
  text-decoration-thickness:1.5px;text-underline-offset:.2em;transition:text-decoration-thickness .15s}
a:hover{text-decoration-thickness:4px}
:focus-visible{outline:3px solid var(--fx-color-accent);outline-offset:3px}
.on-dark :focus-visible,.on-dark:focus-visible{outline-color:var(--fx-color-accent-2)}
.wrap{max-width:var(--max);margin-inline:auto;padding-inline:var(--pad)}
.sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:12px;top:-60px;z-index:100;background:var(--fx-color-accent);color:var(--fx-color-sur-accent);padding:10px 16px;font-weight:600}
.skip:focus{top:12px}

/* ---------- Petits éléments typographiques ---------- */
.kicker{font-family:var(--fx-font-mono);font-weight:400;font-size:.8125rem;letter-spacing:.09em;text-transform:uppercase;line-height:1.35;
  display:inline-flex;align-items:center;gap:.6em;margin:0 0 1rem}
.kicker::before{content:"";width:.7em;height:.7em;background:currentColor;flex:none}
.kicker--plain::before{display:none}
.mono{font-family:var(--fx-font-mono);font-size:.875rem;letter-spacing:.03em}
.lede{font-size:clamp(1.125rem,1.4vw,1.3rem);line-height:1.55;max-width:38em}
.muted{color:var(--fx-color-texte-secondaire)}
.glyph{font-family:var(--fx-font-display);font-weight:400;font-variation-settings:"opsz" 144}
.stamp{display:inline-block;font-family:var(--fx-font-mono);font-size:.8125rem;letter-spacing:.08em;text-transform:uppercase;
  border:2px solid currentColor;padding:.3em .7em;transform:rotate(-2deg);white-space:nowrap}

/* ---------- Boutons ---------- */
.btn{display:inline-flex;align-items:center;gap:.7em;min-height:52px;padding:.8em 1.4em;
  background:var(--fx-color-accent);color:var(--fx-color-sur-accent);font-weight:600;text-decoration:none;
  border:2px solid var(--fx-color-accent);font-size:1.0625rem;cursor:pointer;font-family:var(--fx-font-body);
  transition:background .15s,color .15s,border-color .15s}
.btn:hover{background:var(--fx-color-contraste);border-color:var(--fx-color-contraste);color:var(--fx-color-sur-contraste)}
.btn .arr{transition:transform .2s}
.btn:hover .arr{transform:translateX(4px)}
.btn--light{background:var(--fx-color-surface);color:var(--fx-color-texte);border-color:var(--fx-color-surface)}
.btn--light:hover{background:var(--fx-color-accent-2);border-color:var(--fx-color-accent-2);color:var(--fx-color-texte)}
.btn--yellow{background:var(--fx-color-accent-2);color:var(--fx-color-texte);border-color:var(--fx-color-accent-2)}
.btn--yellow:hover{background:var(--fx-color-surface);border-color:var(--fx-color-surface);color:var(--fx-color-texte)}
.textlink{font-weight:600;display:inline-flex;align-items:center;min-height:44px}

/* ---------- En-tête façon titre de journal ---------- */
.topline{display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap;padding-block:.55rem;
  font-family:var(--fx-font-mono);font-size:.8125rem;letter-spacing:.06em;text-transform:uppercase;color:var(--fx-color-texte-secondaire)}
.topline a{color:var(--fx-color-accent)}
.bar{display:flex;align-items:center;justify-content:space-between;gap:1.5rem;padding-block:1rem 1.1rem;
  border-top:var(--rule);border-bottom:1px solid var(--fx-color-texte);position:relative;
  box-shadow:0 4px 0 -2px var(--fx-color-fond),0 5px 0 -2px var(--fx-color-texte)}
.masthead .bar{border-bottom-width:1px}
.brand{display:flex;align-items:center;gap:.8rem;text-decoration:none;min-height:44px}
.brand-mark{display:flex;align-items:center;justify-content:center;white-space:nowrap;letter-spacing:-.04em;width:52px;height:52px;background:var(--fx-color-accent);
  font-family:var(--fx-font-display);font-weight:900;font-size:2rem;line-height:1;color:var(--fx-color-sur-accent);flex:none;
  font-variation-settings:"opsz" 144,"SOFT" 0}
.brand-mark i{font-style:normal;color:var(--fx-color-accent-2)}
.brand-name{font-family:var(--fx-font-display);font-weight:800;font-size:1.35rem;line-height:.95;letter-spacing:-.02em}
.nav ul{list-style:none;margin:0;padding:0;display:flex;gap:clamp(.5rem,1.6vw,1.6rem);flex-wrap:wrap}
.nav a{display:inline-flex;align-items:center;min-height:44px;font-weight:600;text-decoration:none;
  border-bottom:3px solid transparent;padding-top:3px}
.nav a:hover{border-bottom-color:var(--fx-color-accent)}
.nav a[aria-current="page"]{border-bottom-color:var(--fx-color-accent);color:var(--fx-color-accent)}
.nav .nav-cta a{background:var(--fx-color-accent);color:var(--fx-color-sur-accent);padding:0 1rem;border-bottom:0;padding-top:0}
.nav .nav-cta a:hover{background:var(--fx-color-contraste)}
.menu-btn{display:none}

@media (max-width:980px){
  .js .menu-btn{display:inline-flex;align-items:center;gap:.6em;min-height:48px;padding:0 1.1rem;border:2px solid var(--fx-color-accent);
    background:var(--fx-color-surface);color:var(--fx-color-accent);font:600 1rem var(--fx-font-body);cursor:pointer;position:relative;z-index:60}
  .js .menu-btn::before{content:"";width:18px;height:10px;border-block:2px solid currentColor}
  .js body.menu-open .menu-btn::before{height:0;border-bottom:0}
  .js .nav{display:none}
  .js body.menu-open .nav{display:flex;position:fixed;inset:0;z-index:50;background:var(--fx-color-fond);
    padding:110px var(--pad) 40px;overflow:auto;flex-direction:column}
  .js body.menu-open{overflow:hidden}
  .js body.menu-open .nav ul{flex-direction:column;gap:0;border-top:var(--rule)}
  .js body.menu-open .nav li{border-bottom:1px solid var(--fx-color-texte)}
  .js body.menu-open .nav a{font-family:var(--fx-font-display);font-weight:800;font-size:clamp(2rem,8vw,3rem);min-height:64px;width:100%;border:0;letter-spacing:-.02em}
  .js body.menu-open .nav .nav-cta a{background:none;color:var(--fx-color-accent);padding:0}
  .nav ul{gap:.25rem 1rem}
}

/* ---------- Une (accueil) ---------- */
.une{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:var(--gap);padding-block:clamp(28px,5vw,64px) clamp(32px,5vw,72px)}
.une-text{grid-column:1 / span 7;display:flex;flex-direction:column;justify-content:space-between;gap:2rem}
.une h1{font-size:clamp(2.6rem,6.4vw,6.2rem);line-height:.94;letter-spacing:-.035em}
.une h1 em{color:var(--fx-color-accent)}
.une .lede{margin-top:1.6rem;columns:2 16em;column-gap:var(--gap);max-width:none}
.une .lede::first-letter{font-family:var(--fx-font-display);font-weight:900;float:left;font-size:3.6em;line-height:.82;padding:.06em .1em 0 0;color:var(--fx-color-accent)}
.une-actions{display:flex;flex-wrap:wrap;align-items:center;gap:.6rem 1.6rem;border-top:1px solid var(--fx-color-texte);padding-top:1.2rem}
.cover{grid-column:8 / span 5;background:var(--fx-color-accent);position:relative;min-height:520px;display:flex;flex-direction:column;
  justify-content:space-between;padding:clamp(18px,2.4vw,32px);overflow:hidden;color:var(--fx-color-sur-accent)}
.cover-art{position:absolute;left:-10%;bottom:-6%;width:100%;color:var(--fx-color-accent-2);pointer-events:none}
.cover-num{position:relative;font-family:var(--fx-font-display);font-weight:900;font-size:clamp(6rem,13vw,12rem);line-height:.8;letter-spacing:-.06em;
  text-align:right;font-variation-settings:"opsz" 144,"SOFT" 0}
.cover-num span{font-size:.45em;letter-spacing:0;vertical-align:.9em;margin-left:.04em;color:var(--fx-color-accent-2)}
.cover-cap{position:relative;background:var(--fx-color-surface);color:var(--fx-color-texte);padding:1rem 1.1rem;max-width:22rem;margin-left:auto;font-size:1rem;border-top:4px solid var(--fx-color-accent-2)}
.cover-cap p{margin:0}
.cover-cap strong{color:var(--fx-color-accent)}
.cover .kicker{position:relative}

/* ---------- Sommaire ---------- */
.sommaire{border-top:var(--rule);border-bottom:1px solid var(--fx-color-texte)}
.sommaire-head{display:flex;justify-content:space-between;align-items:baseline;gap:1rem;padding-block:.8rem;border-bottom:1px solid var(--fx-color-texte)}
.sommaire-head h2{font-size:1.5rem}
.sommaire ol{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,1fr)}
.sommaire li + li{border-left:1px solid var(--fx-color-texte)}
.sommaire a{display:grid;grid-template-columns:auto 1fr;align-content:start;gap:.2rem 1rem;padding:1.2rem clamp(.8rem,1.5vw,1.4rem);text-decoration:none;height:100%;
  transition:background .15s}
.sommaire a:hover{background:var(--fx-color-surface)}
.sommaire .n{min-width:1.45em;font-family:var(--fx-font-display);font-weight:900;font-size:2.6rem;line-height:.9;color:var(--fx-color-accent);grid-row:span 2}
.sommaire .t{font-family:var(--fx-font-display);font-weight:700;font-size:1.25rem;line-height:1.1}
.sommaire .d{font-size:.9375rem;color:var(--fx-color-texte-secondaire);line-height:1.4}

/* ---------- Sections & grille modulaire ---------- */
.section{padding-block:clamp(48px,7vw,104px)}
.section-head{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:var(--gap);align-items:end;margin-bottom:clamp(24px,3vw,40px);
  border-bottom:1px solid var(--fx-color-texte);padding-bottom:1.1rem}
.section-head h2{grid-column:1 / span 8;font-size:clamp(2.2rem,4.6vw,4.2rem)}
.section-head .side{grid-column:9 / span 4;margin:0;color:var(--fx-color-texte-secondaire);font-size:1rem}
.section-head .kicker{grid-column:1 / -1;margin:0;color:var(--fx-color-accent)}

.mosaic{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:var(--gap)}
.tile{position:relative;padding:clamp(20px,2.4vw,34px);border-top:var(--rule);background:var(--fx-color-surface);
  display:flex;flex-direction:column;gap:.2rem}
.tile h3{font-size:clamp(1.6rem,2.4vw,2.2rem);margin-bottom:.8rem}
.tile p:last-child{margin-bottom:0}
.tile .textlink{margin-top:auto}
.tile--blue{background:var(--fx-color-accent);color:var(--fx-color-sur-accent);border-top-color:var(--fx-color-contraste)}
.tile--blue a{text-decoration-color:var(--fx-color-accent-2)}
.tile--yellow{background:var(--fx-color-accent-2);border-top-color:var(--fx-color-texte)}
.tile--yellow a{text-decoration-color:var(--fx-color-accent)}
.tile--ink{background:var(--fx-color-garonne);color:var(--fx-color-sur-contraste);border-top-color:var(--fx-color-texte)}
.tile--ink a{text-decoration-color:var(--fx-color-accent-2)}
.tile--paper{background:transparent;border:1px solid var(--fx-color-texte);border-top:var(--rule)}
.s-8{grid-column:span 8}.s-7{grid-column:span 7}.s-6{grid-column:span 6}.s-5{grid-column:span 5}.s-4{grid-column:span 4}.s-3{grid-column:span 3}.s-12{grid-column:span 12}
.row-2{grid-row:span 2}

/* trame de points (similigravure) */
.dots{position:absolute;pointer-events:none;
  background-image:radial-gradient(circle,currentColor 38%,transparent 41%);background-size:12px 12px;
  -webkit-mask-image:linear-gradient(135deg,#000 10%,transparent 75%);mask-image:linear-gradient(135deg,#000 10%,transparent 75%)}

/* circuit */
.circuit{list-style:none;margin:1.4rem 0 1.6rem;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;counter-reset:c;position:relative}
.circuit li{position:relative;padding:1.1rem 1.1rem 0 0;border-top:2px solid currentColor}
.circuit li::before{counter-increment:c;content:"0" counter(c);font-family:var(--fx-font-mono);font-size:.8125rem;letter-spacing:.08em;display:block;margin-bottom:.4rem}
.circuit li::after{content:"→";position:absolute;top:-.95rem;right:.4rem;font-family:var(--fx-font-display);font-size:1.4rem;line-height:1;
  background:inherit;padding:0 .2rem}
.circuit li:last-child::after{content:"✳"}
.circuit .g{font-family:var(--fx-font-display);font-weight:900;font-size:clamp(2.4rem,4vw,3.6rem);line-height:1;display:block;margin-bottom:.5rem;color:var(--fx-color-accent-2)}
.circuit strong{font-family:var(--fx-font-display);font-weight:700;font-size:1.25rem;display:block;line-height:1.1;margin-bottom:.4rem}
.circuit p{font-size:.9688rem;line-height:1.45;margin:0}
.tile--blue .circuit li::after{background:var(--fx-color-accent)}

.tile-statement{position:relative;margin-top:auto;font-family:var(--fx-font-display);font-weight:700;font-size:clamp(1.5rem,2.4vw,2.2rem);line-height:1.08;letter-spacing:-.015em;max-width:18em;border-top:1px solid currentColor;padding-top:1rem}
.tile-statement + .textlink{margin-top:.6rem;position:relative}
.dots--tile{color:var(--fx-color-accent-2);right:0;bottom:0;width:60%;height:70%;opacity:.4;
  -webkit-mask-image:radial-gradient(circle at 100% 100%,#000 0,transparent 70%);mask-image:radial-gradient(circle at 100% 100%,#000 0,transparent 70%)}
.bigquote{font-family:var(--fx-font-display);font-weight:800;font-size:clamp(2rem,3.2vw,3rem);line-height:.95;letter-spacing:-.03em;margin:0 0 1.2rem;color:var(--fx-color-accent)}
.bigglyph{font-family:var(--fx-font-display);font-weight:300;font-size:clamp(4rem,7vw,6rem);line-height:.8;margin-bottom:.8rem;font-variation-settings:"opsz" 144}
.tile--blue .bigquote,.tile--ink .bigquote{color:var(--fx-color-sur-accent)}
.tile--yellow .bigquote{color:var(--fx-color-texte)}
.tile--paper .bigglyph,.tile:not([class*="tile--"]) .bigglyph{color:var(--fx-color-accent)}

/* ---------- Agenda (module + page) ---------- */
.agenda-list{list-style:none;margin:0;padding:0;border-top:var(--rule)}
.agenda-row{display:grid;grid-template-columns:minmax(80px,1.2fr) 6fr 2.4fr;gap:var(--gap);align-items:center;padding-block:1.4rem;border-bottom:1px solid var(--fx-color-texte)}
.agenda-row .n{font-family:var(--fx-font-display);font-weight:900;font-size:clamp(2.6rem,5vw,4.6rem);line-height:.8;color:var(--fx-color-accent);letter-spacing:-.04em}
.agenda-row h3{font-size:clamp(1.5rem,2.6vw,2.3rem)}
.agenda-row p{margin:.4rem 0 0;color:var(--fx-color-texte-secondaire);max-width:40em}
.agenda-row .stamp{justify-self:end;color:var(--fx-color-accent)}
.acc-btn{all:unset;box-sizing:border-box;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:1rem;width:100%;min-height:48px;
  font-family:var(--fx-font-display);font-weight:800;font-size:clamp(1.5rem,2.6vw,2.3rem);line-height:1.05;letter-spacing:-.02em}
.acc-btn:focus-visible{outline:3px solid var(--fx-color-accent);outline-offset:4px}
.acc-btn .pm{flex:none;width:40px;height:40px;border:2px solid currentColor;display:grid;place-items:center;font-family:var(--fx-font-mono);font-size:1.3rem;font-weight:400}
.acc-btn[aria-expanded="true"] .pm{background:var(--fx-color-accent);border-color:var(--fx-color-accent);color:var(--fx-color-sur-accent)}
.acc-panel{grid-column:2 / -1;padding-top:.6rem}
.acc-panel p{color:var(--fx-color-texte);max-width:42em}
.acc-panel dl{display:grid;grid-template-columns:auto 1fr;gap:.3rem 1.2rem;margin:.8rem 0 0;font-size:1rem}
.acc-panel dt{font-family:var(--fx-font-mono);font-size:.8125rem;text-transform:uppercase;letter-spacing:.08em;padding-top:.2em}
.acc-panel dd{margin:0}

/* ---------- Portraits ---------- */
.portrait{background:var(--fx-color-surface);border-top:var(--rule);display:flex;flex-direction:column}
.portrait-art{position:relative;aspect-ratio:4/3;background:var(--fx-color-accent-2);overflow:hidden;display:grid;place-items:center;color:var(--fx-color-accent)}
.portrait-art .dots{inset:0;-webkit-mask-image:radial-gradient(circle at 50% 50%,transparent 26%,#000 27%,transparent 78%);mask-image:radial-gradient(circle at 50% 50%,transparent 26%,#000 27%,transparent 78%)}
.portrait-art .disc{position:relative;width:46%;aspect-ratio:1;border-radius:50%;background:var(--fx-color-surface);display:grid;place-items:center;
  font-family:var(--fx-font-display);font-size:clamp(3rem,5vw,4.6rem);line-height:1}
.portrait:nth-child(2) .portrait-art{background:var(--fx-color-accent);color:var(--fx-color-accent-2)}
.portrait:nth-child(2) .disc{color:var(--fx-color-accent)}
.portrait:nth-child(3) .portrait-art{background:var(--fx-color-garonne);color:var(--fx-color-sur-contraste)}
.portrait:nth-child(3) .disc{color:var(--fx-color-garonne)}
.portrait-body{padding:1.3rem clamp(18px,2vw,28px) 1.6rem}
.portrait-body h3{font-size:1.75rem;margin-bottom:.6rem}
.portrait-body .kicker{margin-bottom:.6rem;color:var(--fx-color-accent)}
.note{font-family:var(--fx-font-mono);font-size:.875rem;letter-spacing:.02em;border-left:6px solid var(--fx-color-accent);padding:.6rem 0 .6rem 1rem;margin-top:var(--gap);color:var(--fx-color-texte)}

/* ---------- Ressources ---------- */
.res-list{list-style:none;margin:0;padding:0;border-top:var(--rule)}
.res-list li{display:grid;grid-template-columns:3.2rem 1fr auto;gap:1rem;align-items:center;padding-block:1.1rem;border-bottom:1px solid var(--fx-color-texte)}
.res-ico{width:2.6rem;height:3.2rem;border:2px solid var(--fx-color-accent);position:relative;background:var(--fx-color-surface);
  clip-path:polygon(0 0,70% 0,100% 22%,100% 100%,0 100%)}
.res-ico::after{content:"";position:absolute;left:18%;right:18%;top:45%;height:30%;
  background:repeating-linear-gradient(var(--fx-color-accent) 0 2px,transparent 2px 6px)}
.res-list strong{font-family:var(--fx-font-display);font-weight:700;font-size:1.25rem;display:block;line-height:1.15}
.res-list span.muted{font-size:.9375rem}
.res-list .res-act{font-weight:600;white-space:nowrap}

/* ---------- Lettre d'information & formulaires ---------- */
.letter{background:var(--fx-color-accent);color:var(--fx-color-sur-accent);position:relative;overflow:hidden}
.letter .dots{color:var(--fx-color-accent-2);left:-60px;bottom:-60px;width:min(620px,90vw);height:520px;
  -webkit-mask-image:radial-gradient(circle at 0 100%,#000 0,transparent 66%);mask-image:radial-gradient(circle at 0 100%,#000 0,transparent 66%);opacity:.4}
.letter-in{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:var(--gap);padding-block:clamp(48px,7vw,96px);position:relative}
.letter-text{grid-column:1 / span 6}
.letter-text h2{font-size:clamp(2.4rem,5vw,4.6rem);margin-bottom:1rem}
.letter-text h2 em{color:var(--fx-color-accent-2)}
.letter-form{grid-column:8 / span 5;background:var(--fx-color-surface);color:var(--fx-color-texte);padding:clamp(20px,2.4vw,32px);border-top:6px solid var(--fx-color-accent-2);align-self:start}
.letter-form :focus-visible{outline-color:var(--fx-color-accent)}

.form{display:grid;gap:1.1rem}
.form .two{display:grid;grid-template-columns:1fr 1fr;gap:1.1rem}
.field label,.field legend{display:block;font-weight:600;margin-bottom:.35rem;font-size:1rem}
.field .hint{display:block;font-weight:400;font-size:.875rem;color:var(--fx-color-texte-secondaire);margin-top:.1rem}
.field input,.field select,.field textarea{width:100%;min-height:50px;padding:.7rem .85rem;font:inherit;font-size:1rem;color:var(--fx-color-texte);
  background:var(--fx-color-fond);border:2px solid var(--fx-color-texte);border-radius:0}
.field textarea{min-height:150px;resize:vertical}
.field input:focus-visible,.field select:focus-visible,.field textarea:focus-visible{outline:3px solid var(--fx-color-accent);outline-offset:2px;background:var(--fx-color-surface)}
.field fieldset{border:0;margin:0;padding:0}
.choices{display:flex;flex-wrap:wrap;gap:.5rem}
.choices label{display:inline-flex;align-items:center;gap:.5rem;min-height:44px;padding:.3rem .9rem;border:2px solid var(--fx-color-texte);font-weight:500;cursor:pointer;margin:0}
.choices input{width:18px;height:18px;min-height:0;accent-color:var(--fx-color-accent);margin:0}
.choices label:has(input:checked){background:var(--fx-color-accent-2)}
.form .small{font-size:.875rem;color:var(--fx-color-texte-secondaire);margin:0}
.hp{position:absolute!important;left:-10000px!important;width:1px;height:1px;overflow:hidden}
.confirm{background:var(--fx-color-accent-2);color:var(--fx-color-texte);border:2px solid var(--fx-color-accent);padding:1rem 1.2rem;margin-bottom:1.2rem}
.confirm strong{font-family:var(--fx-font-display);font-size:1.4rem;display:block;margin-bottom:.2rem;color:var(--fx-color-accent)}
.confirm:focus-visible{outline:3px solid var(--fx-color-texte);outline-offset:3px}
.confirm p{margin:0}

/* ---------- Bandeau « s'engager » ---------- */
.engage{display:grid;grid-template-columns:repeat(3,1fr);border-top:var(--rule);border-bottom:1px solid var(--fx-color-texte)}
.engage a{display:flex;flex-direction:column;gap:.4rem;padding:clamp(20px,2.6vw,36px);text-decoration:none;min-height:200px;transition:background .15s,color .15s}
.engage a + a{border-left:1px solid var(--fx-color-texte)}
.engage .kicker{color:var(--fx-color-accent)}
.engage .t{font-family:var(--fx-font-display);font-weight:800;font-size:clamp(1.8rem,3vw,2.8rem);line-height:1;letter-spacing:-.02em}
.engage .d{color:var(--fx-color-texte-secondaire);margin-top:auto}
.engage .t::after{content:" →";color:var(--fx-color-accent)}
.engage a:hover{background:var(--fx-color-accent);color:var(--fx-color-sur-accent)}
.engage a:hover .d,.engage a:hover .kicker,.engage a:hover .t::after{color:var(--fx-color-sur-accent)}

/* ---------- En-tête de pages intérieures ---------- */
.page-head{padding-block:clamp(32px,5vw,72px) clamp(28px,4vw,56px);display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:var(--gap);align-items:end}
.page-head .kicker{grid-column:1 / -1;margin:0;color:var(--fx-color-accent)}
.page-head h1{grid-column:1 / span 8;font-size:clamp(2.6rem,6.6vw,6.4rem);line-height:.94;letter-spacing:-.035em}
.page-head h1 em{color:var(--fx-color-accent)}
.page-head .lede{grid-column:1 / span 7;margin:0}
.page-head .aside{grid-column:9 / span 4;grid-row:2 / span 2;align-self:end;font-family:var(--fx-font-mono);font-size:.875rem;border-top:var(--rule);padding-top:.8rem;margin:0}
.page-head .aside dt{text-transform:uppercase;letter-spacing:.08em;color:var(--fx-color-texte-secondaire);font-size:.8125rem}
.page-head .aside dd{margin:0 0 .6rem}

/* Article sur colonnes */
.article{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:var(--gap)}
.article-side{grid-column:1 / span 3}
.article-body{grid-column:4 / span 8;max-width:44em}
.article-body h2{font-size:clamp(1.8rem,3vw,2.6rem);margin:2.4rem 0 1rem}
.article-body h2:first-child{margin-top:0}
.article-body h3{font-family:var(--fx-font-body);font-weight:700;font-size:1.1875rem;letter-spacing:0;line-height:1.3;margin:1.6rem 0 .4rem}
.article-body ul{padding-left:1.2em}
.article-body li{margin-bottom:.4rem}
.article-body li::marker{color:var(--fx-color-accent)}
.pull{font-family:var(--fx-font-display);font-weight:800;font-size:clamp(1.8rem,3.4vw,3rem);line-height:1;letter-spacing:-.025em;
  border-top:var(--rule);border-bottom:1px solid var(--fx-color-texte);padding:1.2rem 0;margin:2.4rem 0}
.pull em{color:var(--fx-color-accent)}

/* Schéma du circuit (page Comprendre) */
.flow{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;border-top:var(--rule);border-bottom:1px solid var(--fx-color-texte)}
.flow > div{position:relative;padding:clamp(18px,2vw,28px);min-height:300px;display:flex;flex-direction:column;overflow:hidden}
.flow > div + div{border-left:1px solid var(--fx-color-texte)}
.flow > div:nth-child(1){background:var(--fx-color-surface)}
.flow > div:nth-child(1) .g{color:var(--fx-color-accent)}
.flow > div:nth-child(2){background:var(--fx-color-accent-2)}
.flow > div:nth-child(3){background:var(--fx-color-accent);color:var(--fx-color-sur-accent)}
.flow > div:nth-child(3) .g{color:var(--fx-color-accent-2)}
.flow > div:nth-child(4){background:var(--fx-color-garonne);color:var(--fx-color-sur-contraste)}
.flow .g{font-family:var(--fx-font-display);font-weight:900;font-size:clamp(3.4rem,6vw,5.6rem);line-height:.85;margin-bottom:auto;letter-spacing:-.04em;position:relative}
.flow h3{font-size:clamp(1.4rem,2vw,1.9rem);margin:1.4rem 0 .5rem;position:relative}
.flow p{margin:0;font-size:1rem;line-height:1.45;position:relative}
.flow .step{font-family:var(--fx-font-mono);font-size:.8125rem;letter-spacing:.08em;text-transform:uppercase;margin-bottom:1rem;position:relative}
.flow .dots{inset:-10px -10px auto auto;width:50%;height:50%;opacity:.3;-webkit-mask-image:radial-gradient(circle at 100% 0,#000,transparent 70%);mask-image:radial-gradient(circle at 100% 0,#000,transparent 70%)}
.article-side{position:sticky;top:1.5rem;align-self:start}
.article-side .kicker{color:var(--fx-color-accent)}

.criteria{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--gap)}
.faq details{border-bottom:1px solid var(--fx-color-texte)}
.faq details:first-of-type{border-top:var(--rule)}
.faq summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:1rem;align-items:center;padding-block:1.1rem;min-height:56px;
  font-family:var(--fx-font-display);font-weight:700;font-size:clamp(1.25rem,2vw,1.6rem);line-height:1.15}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font-family:var(--fx-font-mono);font-weight:400;flex:none;width:36px;height:36px;border:2px solid currentColor;display:grid;place-items:center}
.faq details[open] summary::after{content:"–";background:var(--fx-color-accent);border-color:var(--fx-color-accent);color:var(--fx-color-sur-accent)}
.faq details > div{padding-bottom:1.2rem;max-width:44em}

/* Contact */
.contact-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:var(--gap)}
.contact-cards{grid-column:1 / span 5;display:grid;gap:var(--gap);align-content:start}
.contact-form{grid-column:7 / span 6;background:var(--fx-color-surface);padding:clamp(20px,2.6vw,36px);border-top:var(--rule)}
.contact-form h2{font-size:clamp(1.8rem,3vw,2.6rem);margin-bottom:1.2rem}
.coord{font-family:var(--fx-font-display);font-weight:700;font-size:clamp(1.3rem,2.2vw,1.9rem);line-height:1.15;overflow-wrap:anywhere}
.coord a{text-decoration-thickness:2px}

/* Mentions */
.legal dl{display:grid;grid-template-columns:minmax(10rem,14rem) 1fr;margin:0;border-top:var(--rule)}
.legal dt,.legal dd{padding:.9rem 0;border-bottom:1px solid var(--fx-color-filet);margin:0}
.legal dt{font-family:var(--fx-font-mono);font-size:.8125rem;text-transform:uppercase;letter-spacing:.08em;padding-right:1rem;padding-top:1.05rem}
.todo{font-family:var(--fx-font-mono);font-size:.875rem;background:var(--fx-color-surface);border:1px dashed var(--fx-color-texte-secondaire);padding:.15em .5em;color:var(--fx-color-texte-secondaire)}

/* ---------- Pied de page ---------- */
.foot{background:var(--fx-color-contraste);color:var(--fx-color-sur-contraste);margin-top:0}
.foot a{text-decoration-color:var(--fx-color-accent-2)}
.foot-title{font-family:var(--fx-font-display);font-weight:900;font-size:clamp(3rem,11vw,10.5rem);line-height:.82;letter-spacing:-.05em;
  margin:0;padding-block:clamp(36px,5vw,64px) clamp(20px,3vw,36px);border-bottom:1px solid rgba(251,247,240,.22);font-variation-settings:"opsz" 144,"SOFT" 0}
.foot-title i{font-style:normal;color:var(--fx-color-accent-2)}
.foot-grid{display:grid;grid-template-columns:2fr 1.4fr 1fr 1fr;gap:var(--gap);padding-block:clamp(28px,4vw,48px)}
.foot h2{font-family:var(--fx-font-mono);font-weight:400;font-size:.8125rem;letter-spacing:.09em;text-transform:uppercase;margin-bottom:.8rem;color:var(--fx-color-accent-2)}
.foot ul{list-style:none;margin:0;padding:0}
.foot li a{display:inline-flex;min-height:40px;align-items:center}
.foot address{font-style:normal}
.foot address a{display:inline-flex;min-height:36px;align-items:center}
.foot-base{display:flex;justify-content:space-between;flex-wrap:wrap;gap:.6rem 1.4rem;padding-block:1rem 1.6rem;border-top:1px solid rgba(251,247,240,.22);
  font-family:var(--fx-font-mono);font-size:.8125rem;color:var(--fx-color-filet)}
.foot-base a{color:var(--fx-color-filet)}

/* ---------- 404 ---------- */
.lost{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:var(--gap);padding-block:clamp(40px,7vw,100px)}
.lost .big{grid-column:1 / span 5;font-family:var(--fx-font-display);font-weight:900;font-size:clamp(7rem,20vw,16rem);line-height:.8;color:var(--fx-color-accent);letter-spacing:-.06em}
.lost > div{grid-column:7 / span 6}
.lost h1{font-size:clamp(2.2rem,4.6vw,4rem);margin-bottom:1rem}

/* ---------- Apparition douce ---------- */
@media (prefers-reduced-motion:no-preference){
  .cover-art circle{animation:ink .9s ease-out both}
  .une-text,.cover{animation:rise .7s ease-out both}
  .cover{animation-delay:.12s}
  @keyframes rise{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
  @keyframes ink{from{opacity:0}to{opacity:1}}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
}

/* ---------- Responsive ---------- */
@media (max-width:1100px){
  .s-8,.s-7{grid-column:span 12}
  .s-5,.s-4,.s-3{grid-column:span 6}
  .row-2{grid-row:auto}
  .t-full{grid-column:span 12}
  .une-text{grid-column:1 / -1}
  .cover{grid-column:1 / -1;min-height:420px}
  .cover-art{width:70%;left:-6%;bottom:-20%}
  .sommaire ol{grid-template-columns:repeat(2,1fr)}
  .sommaire li:nth-child(3){border-left:0}
  .sommaire li:nth-child(n+3){border-top:1px solid var(--fx-color-texte)}
  .letter-text,.letter-form{grid-column:1 / -1}
  .flow{grid-template-columns:repeat(2,1fr)}
  .flow > div:nth-child(3){border-left:0}
  .flow > div:nth-child(n+3){border-top:1px solid var(--fx-color-texte)}
  .contact-cards,.contact-form{grid-column:1 / -1}
  .foot-grid{grid-template-columns:1fr 1fr}
}
@media (max-width:760px){
  body{font-size:1.0625rem}
  .s-5,.s-4,.s-3,.s-6{grid-column:span 12}
  .section-head h2,.section-head .side{grid-column:1 / -1}
  .page-head h1,.page-head .lede,.page-head .aside{grid-column:1 / -1;grid-row:auto}
  .article-side,.article-body{grid-column:1 / -1}
  .circuit{grid-template-columns:1fr 1fr;row-gap:1.6rem}
  .agenda-row{grid-template-columns:1fr;gap:.6rem}
  .agenda-row .stamp{justify-self:start}
  .acc-panel{grid-column:1 / -1}
  .criteria{grid-template-columns:1fr}
  .engage{grid-template-columns:1fr}
  .engage a + a{border-left:0;border-top:1px solid var(--fx-color-texte)}
  .engage a{min-height:0}
  .form .two{grid-template-columns:1fr}
  .lost .big,.lost > div{grid-column:1 / -1}
  .legal dl{grid-template-columns:1fr}
  .legal dt{border-bottom:0;padding-bottom:0}
  .res-list li{grid-template-columns:2.8rem 1fr}
  .res-list .res-act{grid-column:2}
  .topline span{display:none}
  .topline{justify-content:flex-end}
}
@media (max-width:520px){
  .sommaire ol{grid-template-columns:1fr}
  .sommaire li + li{border-left:0;border-top:1px solid var(--fx-color-texte)}
  .circuit{grid-template-columns:1fr}
  .flow{grid-template-columns:1fr}
  .flow > div + div{border-left:0;border-top:1px solid var(--fx-color-texte)}
  .flow > div{min-height:0}
  .flow .g{margin-bottom:0}
  .foot-grid{grid-template-columns:1fr}
  .brand-name{font-size:1.15rem}
  .brand-mark{width:46px;height:46px;font-size:1.75rem}
  .cover{min-height:380px}
  .cover-art{width:100%;left:-18%;bottom:-14%}
  .une .lede{columns:1}
}