/* ===== Chrono Protect — feuille de style partagée (pages éditoriales) ===== */
:root{
  --papier:#F7F6F2; --papier-2:#EFEDE6; --blanc:#FDFCFA;
  --noir:#0E0F11; --noir-2:#17191C; --encre:#15171A;
  --plomb:#5C6067; --plomb-clair:#9AA0A8;
  --or:#B8944A; --or-vif:#D4AC57; --or-sombre:#8A6E2E;
  --trait:#D9D5CB; --trait-fort:#BFB9AB;
  --trait-or:rgba(184,148,74,.34); --trait-sombre:rgba(247,246,242,.14);
  --display:'Spectral',Georgia,serif;
  --corps:'Archivo',system-ui,sans-serif;
  --mono:'IBM Plex Mono',monospace;
  --gouttiere:clamp(20px,5vw,68px);
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{background:var(--papier);color:var(--encre);font-family:var(--corps);
  font-weight:400;font-size:16.5px;line-height:1.68;-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
:focus-visible{outline:2px solid var(--or);outline-offset:3px}
.enveloppe{max-width:1220px;margin:0 auto;padding:0 var(--gouttiere)}
.accent{color:var(--or-sombre);font-weight:500}

/* ---- en-tête ---- */
.entete{position:fixed;inset:0 0 auto 0;z-index:80;background:rgba(247,246,242,.93);
  backdrop-filter:blur(12px);border-bottom:1px solid var(--trait-or)}
.entete__interieur{display:flex;align-items:center;justify-content:space-between;gap:24px;height:76px}
.marque{display:flex;align-items:center;gap:12px}
.marque__embleme{width:34px;height:37px;flex-shrink:0;display:block}
.marque__bloc{display:flex;flex-direction:column;line-height:1}
.marque__nom{font-family:var(--display);font-weight:500;font-size:18px;letter-spacing:.11em;
  text-transform:uppercase;white-space:nowrap}
.marque__sous{font-family:var(--mono);font-size:9px;letter-spacing:.28em;text-transform:uppercase;
  color:var(--or-sombre);margin-top:3px;white-space:nowrap}
.nav{display:flex;align-items:center;gap:30px}
.nav a{font-size:14.5px;color:var(--plomb);transition:color .2s}
.nav a:hover{color:var(--or-sombre)}
.bouton{display:inline-flex;align-items:center;justify-content:center;font-family:var(--mono);
  font-size:11.5px;letter-spacing:.13em;text-transform:uppercase;padding:14px 26px;
  border:1px solid var(--noir);color:var(--noir);background:transparent;
  transition:background .25s,color .25s,border-color .25s;white-space:nowrap}
.bouton:hover{background:var(--noir);color:var(--or-vif)}
.bouton--plein{background:var(--noir);color:var(--or-vif);border-color:var(--noir)}
.bouton--plein:hover{background:var(--or);color:var(--noir);border-color:var(--or)}
.bouton--or{background:var(--or);color:var(--noir);border-color:var(--or)}
.bouton--or:hover{background:var(--or-vif);border-color:var(--or-vif)}
.bouton--clair{border-color:var(--trait-or);color:var(--or-vif)}
.bouton--clair:hover{background:var(--or);color:var(--noir);border-color:var(--or)}
.bascule{display:none;background:none;border:1px solid var(--trait-fort);color:var(--encre);
  padding:10px 14px;cursor:pointer;font-family:var(--mono);font-size:11.5px}

/* ---- fil d'ariane + tête d'article ---- */
.fil-ariane{font-family:var(--mono);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--plomb);padding-top:118px}
.fil-ariane a:hover{color:var(--or-sombre)}
.art-tete{padding:26px 0 52px;border-bottom:1px solid var(--trait-or)}
.art-cat{font-family:var(--mono);font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;
  color:var(--or-sombre);margin-bottom:18px}
.art-tete h1{font-family:var(--display);font-weight:400;font-size:clamp(2rem,4.4vw,3.35rem);
  line-height:1.13;letter-spacing:-.012em;max-width:18em}
.art-chapeau{margin-top:22px;max-width:44em;font-size:18px;color:var(--plomb)}
.art-meta{margin-top:26px;font-family:var(--mono);font-size:10.5px;letter-spacing:.12em;
  text-transform:uppercase;color:var(--plomb-clair);display:flex;flex-wrap:wrap;gap:18px}

/* ---- corps d'article ---- */
.art-corps{padding:52px 0 84px;max-width:44em}
.art-corps h2{font-family:var(--display);font-weight:500;font-size:clamp(1.45rem,2.6vw,1.95rem);
  line-height:1.26;margin:52px 0 18px;letter-spacing:-.008em}
.art-corps h2:first-child{margin-top:0}
.art-corps h3{font-family:var(--display);font-weight:500;font-size:1.24rem;margin:34px 0 12px}
.art-corps p{margin-bottom:18px;color:#2A2E34}
.art-corps ul,.art-corps ol{margin:0 0 20px 1.1em;color:#2A2E34}
.art-corps li{margin-bottom:9px}
.art-corps strong{font-weight:600;color:var(--encre)}
.art-corps a:not(.bouton){border-bottom:1px solid var(--or);color:var(--or-sombre)}

/* encadré de faits — pensé pour être cité tel quel */
.faits{background:var(--noir);color:var(--papier);padding:32px 34px;margin:40px 0;
  border-left:3px solid var(--or)}
.faits h4{font-family:var(--mono);font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;
  color:var(--or-vif);margin-bottom:18px;font-weight:500}
.faits ul{list-style:none;margin:0;display:grid;gap:12px}
.faits li{padding-left:20px;position:relative;color:var(--papier);font-size:15.5px;line-height:1.6}
.faits li::before{content:"—";position:absolute;left:0;color:var(--or)}

.encadre{background:var(--papier-2);border:1px solid var(--trait-or);padding:26px 28px;margin:36px 0}
.encadre p:last-child{margin-bottom:0}
.encadre__t{font-family:var(--mono);font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;
  color:var(--or-sombre);margin-bottom:14px}

.tableau{width:100%;border-collapse:collapse;margin:32px 0;font-size:15px}
.tableau th{background:var(--noir);color:var(--or-vif);font-family:var(--mono);font-size:10.5px;
  letter-spacing:.12em;text-transform:uppercase;font-weight:500;padding:14px 16px;text-align:left}
.tableau td{padding:14px 16px;border-bottom:1px solid var(--trait);vertical-align:top;color:#2A2E34}
.tableau tr:nth-child(even) td{background:var(--blanc)}

.figure{margin:38px 0}
.figure img{border:1px solid var(--trait-or);width:100%}
.figure figcaption{margin-top:11px;font-family:var(--mono);font-size:10.5px;letter-spacing:.12em;
  text-transform:uppercase;color:var(--plomb)}

/* ---- appel de fin ---- */
.appel{background:var(--noir);color:var(--papier);padding:84px 0;text-align:center;
  border-top:2px solid var(--or)}
.appel h2{font-family:var(--display);font-weight:400;font-size:clamp(1.8rem,3.6vw,2.6rem);
  line-height:1.18;max-width:15em;margin:0 auto}
.appel h2 em{font-style:italic;color:var(--or-vif)}
.appel p{margin:20px auto 0;max-width:36em;color:var(--plomb-clair)}
.appel__actions{display:flex;flex-wrap:wrap;gap:14px;justify-content:center;margin-top:34px}

/* ---- liste d'articles ---- */
.grille-art{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--trait);
  margin-top:50px}
.carte{background:var(--papier);padding:32px 28px 36px;display:flex;flex-direction:column;
  border-top:2px solid transparent;transition:background .3s,border-color .3s}
.carte:hover{background:var(--blanc);border-top-color:var(--or)}
.carte__cat{font-family:var(--mono);font-size:10.5px;letter-spacing:.15em;text-transform:uppercase;
  color:var(--or-sombre)}
.carte h3{font-family:var(--display);font-weight:500;font-size:1.3rem;line-height:1.3;margin:15px 0 12px}
.carte p{font-size:15px;color:var(--plomb);line-height:1.6;flex:1}
.carte__lire{margin-top:20px;font-family:var(--mono);font-size:10.5px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--or-sombre)}

/* ---- pied ---- */
.pied{background:var(--noir-2);color:var(--papier);padding:54px 0 30px;font-size:14.5px}
.pied .marque__sous{color:var(--or-vif)}
.pied__grille{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:44px}
.pied__desc{color:var(--plomb-clair);max-width:30em;margin-top:18px;line-height:1.72}
.pied h4{font-family:var(--mono);font-size:10.5px;letter-spacing:.17em;text-transform:uppercase;
  color:var(--or-vif);margin-bottom:18px;font-weight:500}
.pied ul{list-style:none;display:grid;gap:11px}
.pied a{color:var(--plomb-clair);transition:color .2s}
.pied a:hover{color:var(--or-vif)}
.pied__bas{margin-top:42px;padding-top:22px;border-top:1px solid var(--trait-or);display:flex;
  flex-wrap:wrap;gap:16px;justify-content:space-between;font-family:var(--mono);font-size:10.5px;
  letter-spacing:.1em;color:var(--plomb);text-transform:uppercase}

@media (max-width:980px){
  .grille-art{grid-template-columns:repeat(2,1fr)}
  .pied__grille{grid-template-columns:1fr 1fr;gap:36px}
}
@media (max-width:760px){
  .nav,.entete .bouton{display:none}
  .bascule{display:block}
  .nav.est-ouvert{display:flex;flex-direction:column;align-items:flex-start;gap:20px;
    position:absolute;top:76px;left:0;right:0;background:var(--papier);
    border-bottom:1px solid var(--or);padding:26px var(--gouttiere) 32px}
  .nav.est-ouvert .bouton{display:inline-flex}
  .fil-ariane{padding-top:100px}
  .appel{padding:64px 0}
  .grille-art{grid-template-columns:1fr}
  .faits{padding:26px 24px}
  .pied__grille{grid-template-columns:1fr}
  .tableau{font-size:14px}
  .tableau th,.tableau td{padding:11px 12px}
}