/* Acta — feuille de style
   Presse contemporaine : papier chaud, serif de presse, filets fins, un seul accent. */

@font-face {
    font-family: "Newsreader";
    src: url("/polices/newsreader-latin-opsz-normal.woff2") format("woff2-variations");
    font-weight: 200 800;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: "Newsreader";
    src: url("/polices/newsreader-latin-opsz-italic.woff2") format("woff2-variations");
    font-weight: 200 800;
    font-style: italic;
    font-display: swap;
}
@font-face {
    font-family: "Plex";
    src: url("/polices/ibm-plex-sans-latin-400-normal.woff2") format("woff2");
    font-weight: 400;
    font-display: swap;
}
@font-face {
    font-family: "Plex";
    src: url("/polices/ibm-plex-sans-latin-500-normal.woff2") format("woff2");
    font-weight: 500;
    font-display: swap;
}
@font-face {
    font-family: "Plex";
    src: url("/polices/ibm-plex-sans-latin-600-normal.woff2") format("woff2");
    font-weight: 600;
    font-display: swap;
}

:root {
    --papier: #faf7f1;
    --papier-fonce: #f1ece2;
    --encre: #1b1a18;
    --gris: #5d5952;
    --gris-clair: #8a857c;
    --filet: #d9d3c7;
    --accent: #9e1b1b;

    --serif: "Newsreader", "Iowan Old Style", Georgia, serif;
    --sans: "Plex", "Helvetica Neue", Arial, sans-serif;

    --mesure: 40rem;      /* colonne de lecture, environ 68 caractères */
    --large: 72rem;       /* largeur maximale de la page */
    --gouttiere: 1rem;
}

@media (min-width: 40rem) {
    :root { --gouttiere: 2rem; }
}

*, *::before, *::after { box-sizing: border-box; }

html {
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
}

body {
    margin: 0;
    background: var(--papier);
    color: var(--encre);
    font-family: var(--serif);
    font-optical-sizing: auto;
    font-size: 1.125rem;
    line-height: 1.6;
    text-rendering: optimizeLegibility;
    font-kerning: normal;
    font-variant-ligatures: common-ligatures;
}

@media (min-width: 48rem) {
    body { font-size: 1.25rem; }
}

a { color: inherit; }
img { max-width: 100%; height: auto; display: block; }

:focus-visible {
    outline: 2px solid var(--accent);
    outline-offset: 3px;
}

.evitement {
    position: absolute;
    left: -9999px;
}
.evitement:focus {
    left: var(--gouttiere);
    top: .5rem;
    background: var(--encre);
    color: var(--papier);
    padding: .4rem .8rem;
    font-family: var(--sans);
    font-size: .875rem;
    z-index: 10;
}

/* ------------------------------------------------------------ manchette */

.manchette {
    max-width: var(--large);
    margin: 0 auto;
    padding: 1.75rem var(--gouttiere) 0;
    text-align: center;
}

.titre-journal {
    margin: 0;
    font-family: var(--serif);
    font-weight: 600;
    font-size: clamp(3.75rem, 16vw, 7.5rem);
    font-variation-settings: "opsz" 72;
    line-height: .95;
    letter-spacing: .06em;
    text-transform: uppercase;
}
.titre-journal a { text-decoration: none; }

.devise {
    margin: .6rem 0 0;
    font-family: var(--sans);
    font-size: .75rem;
    font-weight: 500;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: var(--gris);
}

.manchette-corps {
    padding-bottom: 1.1rem;
    border-bottom: 3px double var(--encre);
}

.nav {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: .25rem 1.5rem;
    padding: .7rem 0;
    border-bottom: 1px solid var(--filet);
    font-family: var(--sans);
    font-size: .8125rem;
    font-weight: 500;
    letter-spacing: .06em;
    text-transform: uppercase;
}
.nav a {
    text-decoration: none;
    padding: .15rem 0;
}
.nav a:hover,
.nav a[aria-current] {
    color: var(--accent);
}
.nav a[aria-current] {
    box-shadow: inset 0 -2px 0 var(--accent);
}

/* Manchette compacte des pages intérieures */
.manchette-compacte {
    padding-top: 1rem;
}
.manchette-compacte .titre-journal {
    font-size: 2.25rem;
    letter-spacing: .08em;
}
.manchette-compacte .devise { display: none; }
.manchette-compacte .manchette-corps {
    padding-bottom: .7rem;
}

/* ------------------------------------------------------------ éléments communs */

.surtitre,
.ligne-rubrique {
    margin: 0 0 .5rem;
    font-family: var(--sans);
    font-size: .75rem;
    font-weight: 600;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--accent);
}
.surtitre a { text-decoration: none; }
.surtitre a:hover { text-decoration: underline; }
.surtitre-sep {
    margin: 0 .5em;
    color: var(--gris-clair);
}

.infos,
.dates {
    margin: 0;
    font-family: var(--sans);
    font-size: .8125rem;
    color: var(--gris);
}
.infos-sep { margin: 0 .5em; }

.brouillon {
    display: inline-block;
    margin-bottom: .6rem;
    padding: .1rem .5rem;
    border: 1px solid var(--accent);
    color: var(--accent);
    font-family: var(--sans);
    font-size: .6875rem;
    font-weight: 600;
    letter-spacing: .08em;
    text-transform: uppercase;
}
.ligne-rubrique .brouillon { margin: 0 0 0 .5rem; padding: 0 .35rem; }

.titre-zone {
    margin: 0 0 1rem;
    padding-top: .6rem;
    border-top: 2px solid var(--encre);
    font-family: var(--sans);
    font-size: .8125rem;
    font-weight: 600;
    letter-spacing: .1em;
    text-transform: uppercase;
}

.credit {
    font-family: var(--sans);
    font-size: .6875rem;
    letter-spacing: .02em;
    color: var(--gris-clair);
}
.credit a { text-decoration: none; }
.credit a:hover { text-decoration: underline; }

/* ------------------------------------------------------------ une */

.accueil {
    max-width: var(--large);
    margin: 0 auto;
    padding: 2rem var(--gouttiere) 3rem;
}

.zone-une { margin-bottom: 3rem; }

.une-titre {
    margin: 0 0 1rem;
    font-weight: 600;
    font-size: clamp(2.1rem, 6vw, 3.75rem);
    line-height: 1.05;
    letter-spacing: -.01em;
    text-wrap: balance;
}
.une-titre a { text-decoration: none; }
.une-titre a:hover { text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: .12em; }

.une-chapo {
    margin: 0 0 1rem;
    font-size: 1.25rem;
    line-height: 1.45;
    color: var(--gris);
}

/* Une sans image : composition typographique centrée */
.une.sans-image {
    max-width: 48rem;
    margin: 0 auto;
    padding: 1.5rem 0 2rem;
    text-align: center;
}
.une.sans-image .une-titre { font-size: clamp(2.3rem, 7vw, 4.5rem); }
.une.sans-image .une-chapo { max-width: 38rem; margin-inline: auto; font-size: 1.375rem; }

/* Une avec image : photo sur toute la largeur, puis titre et chapô côte à côte.
   La composition tient quelle que soit la longueur du titre ou du chapô. */
.une-visuel { margin: 0 0 1.5rem; }
.une-visuel img {
    width: 100%;
    max-height: 70vh;
    object-fit: cover;
    object-position: center top;   /* si la hauteur est limitée, on rogne le bas */
}
.une-visuel figcaption { margin-top: .35rem; text-align: right; }
@media (min-width: 56rem) {
    .une.avec-image .une-texte {
        display: grid;
        grid-template-columns: 7fr 5fr;
        gap: 2.5rem;
        align-items: start;
    }
    .une.avec-image .une-titre { margin-bottom: 0; }
    .une.avec-image .une-resume { padding-top: 1.6rem; }
}

.zone-secondaires {
    display: grid;
    gap: 2rem;
    margin-bottom: 3rem;
    padding-top: 1.5rem;
    border-top: 1px solid var(--filet);
}
@media (min-width: 48rem) {
    .zone-secondaires { grid-template-columns: repeat(3, 1fr); }
    .secondaire + .secondaire { border-left: 1px solid var(--filet); padding-left: 2rem; }
}
.secondaire-image { margin-bottom: .75rem; aspect-ratio: 3 / 2; object-fit: cover; width: 100%; }
.secondaire-titre {
    margin: 0 0 .5rem;
    font-size: 1.5rem;
    font-weight: 600;
    line-height: 1.15;
    text-wrap: balance;
}
.secondaire-titre a { text-decoration: none; }
.secondaire-titre a:hover { text-decoration: underline; }
.secondaire-chapo { margin: 0; font-size: 1.0625rem; line-height: 1.5; color: var(--gris); }

.zone-dernieres { max-width: 48rem; }

/* Listes d'articles : dernières publications, rubriques, archives */
.liste {
    list-style: none;
    margin: 0;
    padding: 0;
}
.ligne {
    display: grid;
    grid-template-columns: 6.5rem 1fr;
    gap: 1rem;
    padding: .9rem 0;
    border-bottom: 1px solid var(--filet);
}
.ligne:first-child { padding-top: 0; }
.ligne-date {
    font-family: var(--sans);
    font-size: .8125rem;
    color: var(--gris);
    padding-top: .15rem;
}
.ligne-rubrique { margin-bottom: .2rem; font-size: .6875rem; }
.ligne-titre {
    font-size: 1.3125rem;
    font-weight: 600;
    line-height: 1.25;
    text-decoration: none;
}
.ligne-titre:hover { text-decoration: underline; }
@media (max-width: 30rem) {
    .ligne { grid-template-columns: 1fr; gap: .2rem; }
}

/* Attente (aucun article) et page introuvable */
.attente {
    max-width: var(--mesure);
    margin: 4rem auto;
    padding: 0 var(--gouttiere);
    text-align: center;
    color: var(--gris);
}
.attente-titre {
    margin: 0 0 .5rem;
    font-size: 2rem;
    font-weight: 500;
    font-style: italic;
    color: var(--encre);
}

/* ------------------------------------------------------------ article */

.article { padding-bottom: 3rem; }

.titraille {
    max-width: calc(var(--mesure) + 8rem);
    margin: 0 auto;
    padding: 2.5rem var(--gouttiere) 0;
}
.titraille h1 {
    margin: 0 0 1.25rem;
    font-weight: 600;
    font-size: clamp(2.2rem, 6.5vw, 3.6rem);
    line-height: 1.06;
    letter-spacing: -.012em;
    text-wrap: balance;
}
.chapo {
    margin: 0 0 1.5rem;
    font-size: 1.3125rem;
    line-height: 1.45;
    color: #3b3833;
}
@media (min-width: 48rem) {
    .chapo { font-size: 1.5rem; }
}
.signature {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: .25rem 1.5rem;
    padding: .7rem 0;
    border-top: 1px solid var(--encre);
    border-bottom: 1px solid var(--filet);
}

.article-image {
    max-width: 60rem;
    margin: 2rem auto 0;
}
.article-image figcaption {
    max-width: calc(var(--mesure) + 8rem);
    margin: .5rem auto 0;
    padding: 0 var(--gouttiere);
    font-family: var(--sans);
    font-size: .8125rem;
    line-height: 1.45;
    color: var(--gris);
}
@media (min-width: 60rem) {
    .article-image figcaption { padding: 0; margin-left: 0; }
}

.texte {
    max-width: calc(var(--mesure) + 2 * var(--gouttiere));
    margin: 0 auto;
    padding: 2rem var(--gouttiere) 0;
    hyphens: auto;
    -webkit-hyphens: auto;
}
.texte > p,
.texte li { hanging-punctuation: first; }
.texte p { margin: 0 0 1.1em; }
.texte h2 {
    margin: 2.2em 0 .6em;
    font-size: 1.5rem;
    font-weight: 650;
    line-height: 1.2;
    hyphens: manual;
    text-wrap: balance;
}
.texte h3 {
    margin: 1.8em 0 .4em;
    font-family: var(--sans);
    font-size: 1rem;
    font-weight: 600;
}
.texte a {
    text-decoration-color: var(--filet);
    text-decoration-thickness: 1px;
    text-underline-offset: .15em;
}
.texte a:hover { text-decoration-color: var(--accent); }
.texte ul, .texte ol { padding-left: 1.25em; margin: 0 0 1.1em; }
.texte li { margin-bottom: .35em; }

.texte table {
    width: 100%;
    margin: 1.5em 0;
    border-collapse: collapse;
    font-family: var(--sans);
    font-size: .875rem;
}
.texte th, .texte td {
    padding: .5rem .5rem .5rem 0;
    border-bottom: 1px solid var(--filet);
    text-align: left;
    vertical-align: top;
}
.texte th { border-bottom-color: var(--encre); font-weight: 600; }

/* Renvois de notes */
a.footnote-ref {
    text-decoration: none;
    color: var(--accent);
    font-family: var(--sans);
    font-size: .7em;
    font-weight: 600;
    padding: 0 .1em;
}
sup { line-height: 0; }

/* L'essentiel */
.synthese {
    margin: 0 0 2rem;
    padding: 1rem 0 .5rem;
    border-top: 2px solid var(--encre);
    border-bottom: 1px solid var(--filet);
    font-family: var(--sans);
    font-size: .9375rem;
    line-height: 1.5;
}
.synthese-titre {
    margin: 0 0 .5rem !important;
    font-size: .75rem;
    font-weight: 600;
    letter-spacing: .1em;
    text-transform: uppercase;
}
.synthese ul { padding-left: 1.1em; }

/* Citation en exergue */
.exergue {
    margin: 2.2em 0;
    padding: 1.2rem 0 0;
    border-top: 1px solid var(--encre);
}
.exergue blockquote {
    margin: 0;
    font-size: 1.5rem;
    font-style: italic;
    line-height: 1.35;
    hyphens: manual;
}
.exergue blockquote p { margin: 0 0 .5em; }
.exergue figcaption {
    font-family: var(--sans);
    font-size: .8125rem;
    color: var(--gris);
}
.exergue figcaption::before { content: "— "; }

/* Citation simple (sans attribution) */
.texte > blockquote {
    margin: 1.5em 0;
    padding-left: 1.2em;
    border-left: 2px solid var(--filet);
    font-style: italic;
}

/* Encadré documentaire */
.encadre {
    margin: 2em 0;
    padding: 1.1rem 1.25rem .4rem;
    background: var(--papier-fonce);
    border-top: 3px solid var(--encre);
    font-size: .9375em;
    line-height: 1.55;
}
.encadre-titre {
    margin: 0 0 .6rem !important;
    font-family: var(--sans);
    font-size: .75rem;
    font-weight: 600;
    letter-spacing: .1em;
    text-transform: uppercase;
}
@media (max-width: 40rem) {
    .encadre { margin-inline: calc(-1 * var(--gouttiere)); padding-inline: var(--gouttiere); }
}

/* Annexes : notes, sources, corrections, articles liés */
.annexe {
    margin-top: 3rem;
    padding-top: .6rem;
    border-top: 2px solid var(--encre);
    font-family: var(--sans);
    font-size: .875rem;
    line-height: 1.55;
    hyphens: manual;
}
.annexe h2 {
    margin: 0 0 1rem;
    font-family: var(--sans);
    font-size: .8125rem;
    font-weight: 600;
    letter-spacing: .1em;
    text-transform: uppercase;
}
.annexe + .annexe { margin-top: 2rem; }
.annexe ol, .annexe ul { padding-left: 1.4em; }
.annexe li { margin-bottom: .5em; }
.annexe .footnote ol { margin: 0; }
.annexe .footnote p { margin: 0; }
.footnote-backref { text-decoration: none; color: var(--accent); margin-left: .25em; }
.consulte { color: var(--gris-clair); }
.corrections { list-style: none; padding-left: 0 !important; }
.correction-date { font-weight: 600; margin-right: .4em; }

.a-lire ul { list-style: none; padding: 0; }
.a-lire li { border-bottom: 1px solid var(--filet); padding: .5rem 0; margin: 0; }
.a-lire a { text-decoration: none; display: block; }
.lie-rubrique {
    display: block;
    font-size: .6875rem;
    font-weight: 600;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--accent);
}
.lie-titre { font-family: var(--serif); font-size: 1.1875rem; font-weight: 600; }
.a-lire a:hover .lie-titre { text-decoration: underline; }

/* ------------------------------------------------------------ rubriques et archives */

.liste-page {
    max-width: 48rem;
    margin: 0 auto;
    padding: 2.5rem var(--gouttiere) 3rem;
}
.liste-entete { margin-bottom: 2rem; }
.liste-entete h1 {
    margin: 0 0 .25rem;
    font-size: clamp(2.2rem, 6vw, 3rem);
    font-weight: 600;
    line-height: 1.1;
}
.liste-compte, .liste-intro {
    margin: 0;
    font-family: var(--sans);
    font-size: .875rem;
    color: var(--gris);
}

.onglets {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem 1.5rem;
    margin-top: 1.25rem;
    border-bottom: 1px solid var(--filet);
    font-family: var(--sans);
    font-size: .8125rem;
    font-weight: 500;
}
.onglets a { text-decoration: none; padding: .4rem 0; color: var(--gris); }
.onglets a:hover { color: var(--encre); }
.onglets a[aria-current] { color: var(--encre); box-shadow: inset 0 -2px 0 var(--accent); }

.groupe { margin-bottom: 2rem; }
.groupe-titre {
    margin: 0 0 .75rem;
    font-size: 1.75rem;
    font-weight: 500;
    font-variant-numeric: lining-nums;
}

.par-rubrique { margin-top: 3rem; }
.par-rubrique nav {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem 1.25rem;
    font-family: var(--sans);
    font-size: .875rem;
}

/* ------------------------------------------------------------ pied */

.pied {
    max-width: var(--large);
    margin: 0 auto;
    padding: 1.25rem var(--gouttiere) 2.5rem;
    border-top: 3px double var(--encre);
    font-family: var(--sans);
    font-size: .8125rem;
    color: var(--gris);
    text-align: center;
}
.pied p { margin: 0 0 .4rem; }
.pied-ligne { display: flex; flex-wrap: wrap; justify-content: center; gap: .25rem .75rem; }
.pied a { text-decoration: none; }
.pied a:hover { text-decoration: underline; }
.pied-site {
    font-family: var(--serif);
    font-weight: 600;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--encre);
}

@media print {
    .nav, .pied, .a-lire, .evitement { display: none; }
    body { background: #fff; font-size: 11pt; }
}

/* ------------------------------------------------------------ sommaire et chronologie */

.sommaire {
    margin: 0 0 2rem;
    border-top: 1px solid var(--encre);
    border-bottom: 1px solid var(--filet);
    font-family: var(--sans);
    font-size: .875rem;
    hyphens: manual;
}
.sommaire summary {
    cursor: pointer;
    padding: .6rem 0;
    font-size: .75rem;
    font-weight: 600;
    letter-spacing: .1em;
    text-transform: uppercase;
    list-style: none;
}
.sommaire summary::-webkit-details-marker { display: none; }
.sommaire summary::after { content: " +"; color: var(--accent); }
.sommaire details[open] summary::after { content: " −"; }
.sommaire-compte {
    margin-left: .5rem;
    font-weight: 400;
    letter-spacing: .02em;
    text-transform: none;
    color: var(--gris);
}
.sommaire ol { margin: 0 0 .9rem; padding-left: 1.4em; }
.sommaire li { margin-bottom: .3rem; }
.sommaire a { text-decoration: none; }
.sommaire a:hover { color: var(--accent); }
.texte h2[id] { scroll-margin-top: 1.5rem; }

.chronologie {
    list-style: none;
    margin: 1.5em 0 2em;
    padding: 0 !important;
    border-left: 2px solid var(--encre);
}
.chronologie li {
    position: relative;
    margin: 0;
    padding: 0 0 1.1rem 1.25rem;
}
.chronologie li::before {
    content: "";
    position: absolute;
    left: -6px;
    top: .45em;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: var(--papier);
    border: 2px solid var(--accent);
}
.chrono-date {
    display: block;
    font-family: var(--sans);
    font-size: .75rem;
    font-weight: 600;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: var(--accent);
}
.chrono-texte { display: block; line-height: 1.4; }

.a-verifier {
    margin-left: .5rem;
    padding: 0 .35rem;
    border: 1px solid var(--accent);
    color: var(--accent);
    font-size: .625rem;
    letter-spacing: .08em;
}

/* Renvois de notes accolés : 11, 8 plutôt que 118 */
sup[id^="fnref"] + sup[id^="fnref"]::before {
    content: ",";
    color: var(--accent);
    font-family: var(--sans);
    font-size: .7em;
}
