/* Mise en page : colonne éditoriale alignée à gauche, fiches à étiquettes mono, une seule couleur d'accent (safran). */
:root{
  --paper:#F4F6F7; --surface:#FFFFFF; --ink:#11233A; --muted:#566578; --rule:#D3DAE1;
  --safran:#D98A1F; --safran-ink:#8F5208;
  --f-display:"Gloock", "Georgia", "Times New Roman", serif;
  --f-body:"Source Serif 4", "Georgia", "Times New Roman", serif;
  --f-mono:"IBM Plex Mono", ui-monospace, "SFMono-Regular", Menlo, monospace;
  --step--1:0.875rem; --step-0:1.0625rem; --step-1:1.3rem; --step-2:1.75rem; --step-3:2.5rem; --step-4:clamp(2.4rem, 6vw, 4.25rem);
  --wrap:68rem; --gutter:clamp(1rem, 4vw, 2.5rem);
}
@media (prefers-color-scheme: dark){ :root:not([data-theme="light"]){
  --paper:#0D1826; --surface:#132235; --ink:#E7ECF1; --muted:#9BA9B9; --rule:#26384C;
  --safran:#E8A23F; --safran-ink:#F1B861; color-scheme:dark; } }
:root[data-theme="dark"]{
  --paper:#0D1826; --surface:#132235; --ink:#E7ECF1; --muted:#9BA9B9; --rule:#26384C;
  --safran:#E8A23F; --safran-ink:#F1B861; color-scheme:dark; }

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0; background:var(--paper); color:var(--ink); font-family:var(--f-body); font-size:var(--step-0); line-height:1.6}
a{color:inherit; text-decoration-color:var(--safran); text-decoration-thickness:2px; text-underline-offset:3px}
a:hover{color:var(--safran-ink)}
:focus-visible{outline:2px solid var(--safran); outline-offset:3px}
h1,h2,h3{font-family:var(--f-display); font-weight:400; line-height:1.12; text-wrap:balance; margin:0}
h1{font-size:var(--step-4); letter-spacing:-0.01em}
h2{font-size:var(--step-3)}
h3{font-size:var(--step-1); font-family:var(--f-body); font-weight:600}
p{margin:0; max-width:65ch}
.wrap{max-width:var(--wrap); margin-inline:auto; padding-inline:var(--gutter)}
.label{font-family:var(--f-mono); font-size:0.75rem; letter-spacing:0.12em; text-transform:uppercase; color:var(--muted)}
.skip{position:absolute; left:-999px}
.skip:focus{left:1rem; top:1rem; background:var(--surface); padding:.5rem 1rem; z-index:10}

/* En-tête */
.site-header{border-bottom:1px solid var(--rule); background:var(--paper)}
.site-header .wrap{display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:.75rem 2rem; padding-block:1.1rem}
.brand{display:flex; flex-direction:column; text-decoration:none; line-height:1.15}
.brand b{font-family:var(--f-display); font-weight:400; font-size:1.35rem}
.brand span{font-family:var(--f-mono); font-size:.68rem; letter-spacing:.14em; text-transform:uppercase; color:var(--muted)}
.nav{display:flex; gap:.25rem 1.25rem; flex-wrap:wrap; align-items:center; font-size:.95rem}
.nav a{text-decoration:none; padding-block:.25rem; border-bottom:2px solid transparent}
.nav a[aria-current="page"]{border-bottom-color:var(--safran)}
.btn{display:inline-block; font-family:var(--f-body); font-weight:600; font-size:.95rem; text-decoration:none; padding:.6rem 1.1rem; border:1.5px solid var(--ink); color:var(--ink); background:transparent; cursor:pointer; border-radius:2px}
.btn:hover{background:var(--ink); color:var(--paper)}
.btn-safran{background:var(--safran); border-color:var(--safran); color:#1A1206}
.btn-safran:hover{background:var(--safran-ink); border-color:var(--safran-ink); color:#fff}
.nav .btn{padding:.4rem .9rem}

/* Sections */
main section{padding-block:clamp(2.75rem, 7vw, 5rem)}
main section + section{border-top:1px solid var(--rule)}
.lead{font-size:var(--step-1); line-height:1.5; color:var(--ink)}
.stack{display:flex; flex-direction:column; gap:1.1rem}
.hero .stack{gap:1.5rem}
.hero h1 em{font-style:italic; color:var(--safran-ink)}
.actions{display:flex; flex-wrap:wrap; gap:.75rem}

/* Bande des poissons de roche */
.poissons{border-block:1px solid var(--rule); background:var(--surface); overflow-x:auto}
.poissons p{max-width:none; white-space:nowrap; font-family:var(--f-mono); font-size:.8rem; letter-spacing:.16em; text-transform:uppercase; padding-block:.9rem; color:var(--muted)}
.poissons i{font-style:normal; color:var(--safran-ink); padding-inline:.6rem}

/* Grilles */
.cols{display:grid; grid-template-columns:repeat(auto-fit, minmax(16rem, 1fr)); gap:2rem 2.5rem}
.cols > *{min-width:0}
.split{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,2fr); gap:1.5rem 3rem}
@media (max-width:760px){ .split{grid-template-columns:1fr} }
.pillar{display:flex; flex-direction:column; gap:.6rem; padding-top:1rem; border-top:3px solid var(--ink)}
.pillar a{margin-top:auto; font-weight:600}

/* Agenda */
.agenda{display:flex; flex-direction:column}
.event{display:grid; grid-template-columns:9.5rem minmax(0,1fr); gap:.4rem 1.5rem; padding-block:1.25rem; border-top:1px solid var(--rule)}
.event:last-child{border-bottom:1px solid var(--rule)}
.event time{font-family:var(--f-mono); font-size:.9rem; font-variant-numeric:tabular-nums; color:var(--safran-ink)}
.event h3{margin-bottom:.2rem}
.event p{color:var(--muted)}
@media (max-width:560px){ .event{grid-template-columns:1fr} }

/* Tableau des éditions */
.table-wrap{overflow-x:auto}
table{border-collapse:collapse; width:100%; min-width:26rem; font-variant-numeric:tabular-nums}
th,td{text-align:left; padding:.8rem 1rem .8rem 0; border-bottom:1px solid var(--rule); vertical-align:top}
th{font-family:var(--f-mono); font-weight:400; font-size:.72rem; letter-spacing:.12em; text-transform:uppercase; color:var(--muted)}
td:first-child{font-family:var(--f-mono); font-size:.9rem; white-space:nowrap}
tr.next td{color:var(--safran-ink); font-weight:600}
.tag{display:inline-block; font-family:var(--f-mono); font-size:.68rem; letter-spacing:.1em; text-transform:uppercase; border:1px solid currentColor; padding:.05rem .4rem; margin-left:.5rem; border-radius:2px; font-weight:400}

/* Fiche (bureau, contact) */
.fiche{display:grid; grid-template-columns:minmax(0,12rem) minmax(0,1fr); border-top:1px solid var(--rule)}
.fiche > *{padding-block:.9rem; border-bottom:1px solid var(--rule); min-width:0; overflow-wrap:anywhere}
.fiche dt{font-family:var(--f-mono); font-size:.75rem; letter-spacing:.12em; text-transform:uppercase; color:var(--muted); padding-top:1.05rem}
.fiche dd{margin:0}
@media (max-width:560px){ .fiche{grid-template-columns:1fr} .fiche dt{border-bottom:0; padding-bottom:0} }
.copy{font-family:var(--f-mono); font-size:.75rem; margin-left:.6rem; padding:.15rem .5rem; border:1px solid var(--rule); background:var(--surface); color:var(--ink); cursor:pointer; border-radius:2px}

/* Formulaire */
form{display:grid; grid-template-columns:1fr 1fr; gap:1.1rem 1.5rem; max-width:44rem}
form .full{grid-column:1 / -1}
@media (max-width:560px){ form{grid-template-columns:1fr} }
.field{display:flex; flex-direction:column; gap:.35rem; min-width:0}
.field label, fieldset legend{font-weight:600; font-size:.95rem}
.field small{color:var(--muted); font-size:.85rem}
input,select,textarea{font:inherit; font-size:1rem; color:var(--ink); background:var(--surface); border:1px solid var(--rule); border-bottom:2px solid var(--muted); padding:.6rem .7rem; border-radius:2px; width:100%}
input:focus,select:focus,textarea:focus{outline:none; border-bottom-color:var(--safran)}
textarea{min-height:7rem; resize:vertical}
.check{display:flex; gap:.6rem; align-items:flex-start; font-size:.92rem}
.check input{width:auto; margin-top:.3rem}
.hidden-field{position:absolute; left:-9999px}
.notice{padding:1rem 1.2rem; background:var(--surface); border-left:3px solid var(--safran); max-width:44rem}

/* Pied de page */
.site-footer{border-top:1px solid var(--rule); background:var(--surface); font-size:.92rem}
.site-footer .wrap{display:flex; flex-wrap:wrap; justify-content:space-between; gap:1rem 2rem; padding-block:2rem}
.site-footer p{color:var(--muted)}
.site-footer nav{display:flex; flex-wrap:wrap; gap:.5rem 1.25rem}

@media (prefers-reduced-motion: reduce){ *{transition:none!important; animation:none!important} }
