/* ═══════════════════════════════════════════════════════════════════
   /agregation-2027 et /commentaires/<slug> — mission agregation-2027
   -------------------------------------------------------------------
   Chargée APRÈS glossaire/notion.css, dont elle garde les tokens et la
   grammaire (colonne en Spectral, marge collante des pages de chapitre).
   Deuxième passe, sur demande de Fabio : ne plus être un bloc de texte.
   Le rythme vient d'intervalles franchement contrastés (serré dans un
   groupe, large entre deux sections), et chaque contenu prend la forme de
   ce qu'il est : une fiche d'épreuve, deux colonnes qui s'opposent, une
   citation, quatre exigences équivalentes, une frise, un tableau de
   traductions. Aucune carte-par-défaut, aucun sur-titre, aucun filet
   latéral coloré.
   Mouvement (commentaires/agregation.js) : la frise se trace, la marge
   suit la lecture. Tout est visible sans script ; les états « éteints »
   n'existent que sous html.js-ag.
   ═══════════════════════════════════════════════════════════════════ */

::selection{background:rgba(216,173,76,.32);color:#fff8e8;}

.nt--ag,.nt--cm{--ag-sec:clamp(80px,11vh,132px);--ag-in:clamp(26px,3.6vh,38px);--ag-t:6.4em;}
.nt--ag .nt-col,.nt--cm .nt-col{max-width:760px;}

/* ── la tête ── */
.nt--ag .nt-h1,.nt--cm .nt-h1{text-wrap:balance;}
.nt--ag .nt-h1{max-width:16ch;}
.ag-meta{margin:14px 0 0;font-family:var(--f-ui);font-size:.88rem;line-height:1.6;color:var(--muted);}
.nt--ag .nt-chapo,.nt--cm .nt-chapo{max-width:62ch;}

/* ── la fiche de l'épreuve : une grille de faits, pas des cartes ── */
.ag-fiche{margin:clamp(34px,5vh,48px) 0 0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));
  border-top:1px solid var(--line-strong);}
.ag-fiche>div{padding:16px 16px 18px 0;border-bottom:1px solid var(--border);}
.ag-fiche>div:nth-child(3n+2),.ag-fiche>div:nth-child(3n+3){padding-left:18px;border-left:1px solid var(--border);}
.ag-fiche dt{font-family:var(--f-ui);font-size:.72rem;font-weight:600;letter-spacing:.09em;
  text-transform:uppercase;color:var(--muted);}
.ag-fiche dd{margin:7px 0 0;font-family:'Fraunces',serif;font-weight:500;font-size:1.2rem;line-height:1.25;
  color:var(--text);font-variant-numeric:lining-nums tabular-nums;}
.ag-fiche dd small{display:block;margin-top:5px;font-family:var(--f-ui);font-size:.8rem;line-height:1.45;
  font-weight:400;color:var(--muted);}
.ag-fiche .ag-attente dd{color:var(--gold);}
.ag-fiche a{color:var(--gold);text-decoration:none;border-bottom:1px solid rgba(216,173,76,.45);}
.ag-fiche a:hover{border-bottom-color:var(--gold);}

/* ── le rythme des sections ── */
.nt--ag .nt-essai>.nt-sec,.nt--cm .nt-essai>.nt-sec{margin-top:var(--ag-sec);padding-top:clamp(24px,3.2vh,32px);
  border-top:1px solid var(--border);scroll-margin-top:80px;}
.nt--ag .nt-essai>.nt-sec:first-child{margin-top:clamp(56px,8vh,84px);}
.nt--ag .nt-sec h2,.nt--cm .nt-sec h2{font-size:clamp(1.55rem,2.9vw,2rem);margin-bottom:24px;text-wrap:balance;}
.nt--ag .nt-essai p,.nt--cm .nt-essai p{max-width:68ch;}
.nt--ag .nt-essai h3,.nt--cm .nt-essai h3{font-family:'Fraunces',serif;font-weight:700;font-size:1.1rem;
  letter-spacing:-.01em;line-height:1.32;color:var(--text);margin:0 0 10px;text-wrap:balance;}
.nt-corps p.ag-note{margin-top:30px;padding-top:16px;border-top:1px solid var(--border);
  font-family:var(--f-ui);font-size:.9rem;line-height:1.65;color:var(--ink-soft);}

/* Le bouton dans un paragraphe : la règle des liens de paragraphe
   (.nt-corps .nt-sec p a, dorée et soulignée) le repeindrait. */
.nt-corps .nt-sec p a.nt-btn{color:#fff;border-bottom:0;}
.nt-corps p.ag-suite{margin-top:30px;}

/* ── deux colonnes qui s'opposent ou se complètent ── */
.ag-deux{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(24px,3.4vw,44px);margin-top:var(--ag-in);}
.ag-deux-col h3{padding-bottom:11px;border-bottom:1px solid var(--line-strong);margin-bottom:14px!important;}
.ag-points{list-style:none;display:flex;flex-direction:column;gap:14px;}
.ag-points li{position:relative;padding-left:22px;font-family:var(--f-serif);font-size:1rem;line-height:1.64;color:var(--text);}
/* des marques DESSINÉES, pas des glyphes : un point d'or pour ce qui est,
   un trait pour ce qui n'est pas */
.ag-points li::before{content:'';position:absolute;left:2px;top:.64em;width:8px;height:8px;border-radius:50%;background:var(--gold);}
.ag-points--non li{color:var(--ink-soft);}
.ag-points--non li::before{top:.86em;width:10px;height:1.5px;border-radius:0;background:var(--muted);}
.nt-corps .ag-points a{color:var(--gold);text-decoration:none;border-bottom:1px solid rgba(216,173,76,.45);}
.nt-corps .ag-points a:hover{border-bottom-color:var(--gold);}
.nt-corps .ag-points a.nt-q{color:inherit;border-bottom:1px dotted rgba(216,173,76,.6);}
.nt-corps .ag-points a.nt-q:hover{color:var(--gold);border-bottom-style:solid;}
.nt-corps .ag-points a.nt-q q::before,.nt-corps .ag-points a.nt-q q::after{color:var(--gold);}

/* ── la citation mise en avant ── */
.ag-citation{position:relative;overflow:hidden;margin:var(--ag-in) 0;padding:clamp(24px,3.4vw,38px) clamp(24px,3.4vw,40px);
  background:var(--emphase);border-radius:18px;box-shadow:inset 0 0 0 1px rgba(216,173,76,.22);}
.ag-citation::after{content:'';position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(ellipse at 20% 120%,var(--candle) 0%,transparent 60%);}
.ag-citation>*{position:relative;z-index:1;}
.nt-corps .ag-citation blockquote{margin:0;padding:0;border:0;font-family:var(--f-serif);font-style:italic;
  font-size:clamp(1.32rem,2.7vw,1.72rem);line-height:1.42;color:var(--text);text-wrap:pretty;}
.ag-citation figcaption{margin-top:18px;font-family:var(--f-ui);font-size:.82rem;line-height:1.55;color:var(--muted);max-width:60ch;}

/* ── quatre exigences équivalentes : une grille réglée ── */
.ag-exig,.cm-reproches{list-style:none;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));
  column-gap:clamp(24px,3.4vw,44px);margin:var(--ag-in) 0;}
.ag-exig li,.cm-reproches li{padding:20px 0 24px;border-top:1px solid var(--line-strong);}
.nt-corps .ag-exig p,.nt-corps .cm-reproches p{margin:0;font-size:.98rem;line-height:1.66;}
.nt-corps .ag-exig p.ag-src{margin-top:12px;font-family:var(--f-ui);font-size:.74rem;font-weight:600;
  letter-spacing:.07em;text-transform:uppercase;color:var(--muted);}

/* ── LA FRISE DE L'ŒUVRE — le geste de la page ──
   Un filet d'or se trace le long des textes à mesure qu'on lit (--draw,
   écrit par agregation.js) ; chaque texte que la ligne de lecture atteint
   prend l'or. Par défaut (sans script) : tracée, tout allumé. L'extinction
   se dit par la COULEUR, jamais par l'opacité (muted ≈ 8:1 sur le fond). */
.ag-frise{--draw:1;list-style:none;position:relative;margin:var(--ag-in) 0 0;}
.ag-frise::before,.ag-frise::after{content:'';position:absolute;left:calc(var(--ag-t) + 13px);top:12px;bottom:18px;width:1px;}
.ag-frise::before{background:var(--line-strong);}
.ag-frise::after{width:2px;margin-left:-.5px;background:linear-gradient(to bottom,var(--gold),var(--gold-deep));
  transform:scaleY(var(--draw));transform-origin:top;}
.ag-frise>li{position:relative;display:grid;grid-template-columns:var(--ag-t) 26px minmax(0,1fr);align-items:start;
  padding-bottom:clamp(22px,3vh,30px);}
.ag-frise>li::before{content:'';grid-column:2;grid-row:1;justify-self:center;margin-top:.52em;width:11px;height:11px;
  border-radius:50%;background:var(--gold);box-shadow:0 0 0 4px var(--bg);position:relative;z-index:1;
  transition:background-color .45s cubic-bezier(.16,1,.3,1),box-shadow .45s cubic-bezier(.16,1,.3,1);}
.ag-frise time{grid-column:1;grid-row:1;padding-right:6px;text-align:right;font-family:'Fraunces',serif;font-style:italic;
  font-weight:500;font-size:.98rem;line-height:1.55;color:var(--gold);font-variant-numeric:lining-nums tabular-nums;
  transition:color .45s cubic-bezier(.16,1,.3,1);}
.ag-frise-c{grid-column:3;grid-row:1;min-width:0;}
.nt-corps .ag-frise h3{font-size:1.04rem;margin:0 0 6px;color:var(--text);transition:color .45s cubic-bezier(.16,1,.3,1);}
.nt-corps .ag-frise p{margin:0;font-size:.96rem;line-height:1.62;color:var(--ink-soft);}
.nt-corps .ag-frise p.ag-acces{margin-top:8px;font-family:var(--f-ui);font-size:.8rem;line-height:1.55;color:var(--muted);}
.nt-corps .ag-frise p.ag-acces a{display:inline-block;padding:3px 0;}
.js-ag .ag-frise>li:not(.on) time{color:var(--muted);}
.js-ag .ag-frise>li:not(.on)::before{background:var(--bg);box-shadow:0 0 0 4px var(--bg),inset 0 0 0 1.5px var(--line-strong);}
.js-ag .nt-corps .ag-frise>li:not(.on) h3{color:var(--ink-soft);}

/* ── les portes d'entrée : des lignes, pas des cartes ── */
.ag-portes{list-style:none;}
.ag-portes li{border-top:1px solid var(--border);}
.ag-portes li:last-child{border-bottom:1px solid var(--border);}
#entrer .ag-portes li:last-child{border-bottom:0;}
.ag-portes a{display:grid;grid-template-columns:minmax(0,1fr) 14px;gap:3px 14px;align-items:center;padding:13px 2px;
  color:var(--text);text-decoration:none;}
.ag-portes .t{grid-column:1;font-family:var(--f-serif);font-size:1rem;line-height:1.4;transition:color .2s;}
.ag-portes .d{grid-column:1;font-family:var(--f-ui);font-size:.8rem;line-height:1.45;color:var(--muted);}
.ag-portes a::after{content:'';grid-column:2;grid-row:1/3;width:7px;height:7px;border-top:1.5px solid var(--gold);
  border-right:1.5px solid var(--gold);transform:rotate(45deg);transition:transform .25s cubic-bezier(.16,1,.3,1);}
.ag-portes a:hover .t,.ag-portes a:focus-visible .t{color:var(--gold);}
.ag-portes a:hover::after,.ag-portes a:focus-visible::after{transform:translateX(4px) rotate(45deg);}

/* ── les commentaires guidés ── */
.ag-com{list-style:none;display:flex;flex-direction:column;gap:12px;margin-top:var(--ag-in);}
.ag-com a{position:relative;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px 20px;align-items:center;
  padding:22px 24px;border-radius:16px;background:var(--emphase);box-shadow:inset 0 0 0 1px rgba(216,173,76,.22);
  color:var(--text);text-decoration:none;transition:box-shadow .2s;}
.ag-com a:hover,.ag-com a:focus-visible{box-shadow:inset 0 0 0 1px var(--gold),0 14px 34px -18px rgba(0,0,0,.7);}
.ag-com .k{grid-column:1;font-family:var(--f-ui);font-size:.8rem;line-height:1.45;color:var(--muted);}
.ag-com .t{grid-column:1;font-family:'Fraunces',serif;font-weight:700;font-size:1.22rem;line-height:1.3;text-wrap:balance;}
.ag-com .go{grid-column:2;grid-row:1/3;font-family:var(--f-ui);font-size:.86rem;font-weight:600;color:var(--gold);white-space:nowrap;}

/* ── la marge : le sommaire qui suit la lecture ── */
.ag-toc{list-style:none;display:flex;flex-direction:column;}
.ag-toc a{display:flex;gap:11px;align-items:baseline;padding:5px 0;font-family:var(--f-ui);font-size:.86rem;line-height:1.4;
  color:var(--ink-soft);text-decoration:none;transition:color .2s;}
.ag-toc a::before{content:'';flex:none;width:6px;height:6px;border-radius:50%;background:var(--line-strong);transform:translateY(-1px);
  transition:background-color .25s,transform .35s cubic-bezier(.16,1,.3,1);}
.ag-toc .n{flex:none;min-width:1.7em;font-family:'Fraunces',serif;font-style:italic;font-weight:500;color:var(--gold);}
.ag-toc a:hover{color:var(--gold);}
.ag-toc a.on{color:var(--text);}
.ag-toc a.on::before{background:var(--gold);transform:translateY(-1px) scale(1.6);}
.ch-marge{scrollbar-width:thin;scrollbar-color:rgba(216,173,76,.35) transparent;}
.nt-som--plain a::before{content:none;}
@media(min-width:1100px){
  .nt--ag .nt-som,.nt--cm .nt-som{display:none;}
}
@media(max-width:1099px){
  .ch-marge .ag-marge-nav{display:none;}
}

/* ════ le commentaire guidé ════ */

/* l'extrait : le texte sous les yeux, dont les moments s'éclairent */
.cm-extrait{margin-top:clamp(44px,6.5vh,64px);padding:clamp(22px,3.2vw,34px);background:var(--surface);
  border:1px solid var(--border);border-radius:18px;}
.nt-corps h2.cm-extrait-t{font-family:'Fraunces',serif;font-weight:900;font-size:1.25rem;letter-spacing:-.01em;margin:0 0 16px;}
.nt-corps .cm-extrait blockquote.cm-texte{margin:0;padding:0;border:0;font-style:normal;font-size:1.06rem;line-height:1.82;color:var(--text);}
.nt-corps blockquote.cm-texte p{margin:0 0 16px;}
.nt-corps .cm-extrait blockquote cite{margin-top:16px;padding-top:14px;border-top:1px solid var(--border);}
.nt-corps .cm-extrait blockquote cite a{display:block;margin-left:0;width:max-content;}
/* « Revoir ce moment dans l'extrait », en tête de chaque moment : le lien
   remonte à l'extrait et y éclaire le passage commenté (agregation.js). */
.nt-corps .nt-sec p.cm-rappel{margin:-8px 0 20px;font-family:var(--f-ui);font-size:.82rem;line-height:1.5;}
.nt-corps .nt-sec p.cm-rappel a{display:inline-block;padding:3px 0;color:var(--gold);border-bottom:1px solid rgba(216,173,76,.45);}
.nt-corps .nt-sec p.cm-rappel a:hover{border-bottom-color:var(--gold);}
.cm-m{margin-right:.32em;font-family:'Fraunces',serif;font-style:italic;font-weight:500;color:var(--gold);font-variant-numeric:lining-nums;}
.cm-seg{border-radius:3px;-webkit-box-decoration-break:clone;box-decoration-break:clone;
  transition:background-color .5s cubic-bezier(.16,1,.3,1),box-shadow .5s cubic-bezier(.16,1,.3,1);}
.cm-seg.on{background:rgba(216,173,76,.14);box-shadow:0 0 0 3px rgba(216,173,76,.14);}
.nt-corps .cm-extrait p.cm-note{margin:14px 0 0;font-family:var(--f-ui);font-size:.8rem;line-height:1.6;color:var(--muted);}

/* le problème en deux questions, et la thèse */
.cm-questions{list-style:none;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(20px,3vw,36px);margin:var(--ag-in) 0;}
.cm-questions li{padding-top:16px;border-top:1px solid var(--line-strong);}
.nt-corps .cm-questions p{margin:0;font-size:.98rem;line-height:1.64;color:var(--ink-soft);}
.nt-corps .cm-questions p.q{margin-bottom:10px;font-family:'Fraunces',serif;font-style:italic;font-weight:500;
  font-size:1.2rem;line-height:1.36;color:var(--text);text-wrap:balance;}
.nt-corps p.cm-these{position:relative;overflow:hidden;margin:var(--ag-in) 0;padding:24px 26px;border-radius:16px;
  background:var(--emphase);box-shadow:inset 0 0 0 1px rgba(216,173,76,.22);font-size:1.14rem;line-height:1.72;max-width:none;}
.cm-plan{list-style:none;margin:18px 0 0;}
.cm-plan li{border-top:1px solid var(--border);}
/* Pas de filet sous la dernière ligne : la section suivante ouvre déjà sur
   le sien, et les deux faisaient un double trait (vu à la capture). */
.cm-plan a{display:grid;grid-template-columns:2.2em minmax(0,1fr);gap:6px;padding:11px 0;color:var(--text);text-decoration:none;
  font-family:var(--f-serif);font-size:1rem;line-height:1.55;transition:color .2s;}
.cm-plan .n{font-family:'Fraunces',serif;font-style:italic;font-weight:500;color:var(--gold);}
.cm-plan a:hover{color:var(--gold);}

/* les traductions : un vrai tableau */
.cm-table-wrap{margin:var(--ag-in) 0;overflow-x:auto;}
.cm-table{width:100%;border-collapse:collapse;font-family:var(--f-serif);font-size:.95rem;line-height:1.55;}
.cm-table caption{caption-side:top;text-align:left;padding-bottom:12px;font-family:var(--f-ui);font-size:.82rem;color:var(--muted);}
.cm-table th,.cm-table td{text-align:left;vertical-align:top;padding:15px 16px 15px 0;border-top:1px solid var(--border);}
.cm-table thead th{padding-top:0;border-top:0;border-bottom:1px solid var(--line-strong);font-family:var(--f-ui);font-size:.74rem;
  font-weight:600;letter-spacing:.07em;text-transform:uppercase;color:var(--muted);}
.cm-table tbody th{width:26%;font-family:'Fraunces',serif;font-weight:700;font-size:1rem;color:var(--text);}
.cm-table td{color:var(--ink-soft);}
.cm-table td:nth-child(3){color:var(--text);}
.cm-table td[lang="de"]{font-style:italic;}
.cm-table .note{display:block;margin-top:7px;font-family:var(--f-ui);font-size:.8rem;font-weight:400;line-height:1.5;color:var(--muted);}

@media(max-width:720px){
  .ag-deux,.ag-exig,.cm-reproches,.cm-questions{grid-template-columns:1fr;}
  .ag-fiche{grid-template-columns:repeat(2,minmax(0,1fr));}
  .ag-fiche>div:nth-child(n){padding-left:0;border-left:0;}
  .ag-fiche>div:nth-child(2n){padding-left:16px;border-left:1px solid var(--border);}
  .nt--ag,.nt--cm{--ag-t:4.6em;}
  .ag-frise time{font-size:.9rem;}
  /* le tableau se replie en fiches : l'en-tête reste lisible aux lecteurs d'écran */
  .cm-table thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;}
  .cm-table tr{display:block;padding:14px 0 6px;border-top:1px solid var(--line-strong);}
  .cm-table th,.cm-table td{display:block;width:auto;padding:4px 0 10px;border:0;}
  .cm-table tbody th{width:auto;}
  .cm-table td::before{content:attr(data-l);display:block;margin-bottom:2px;font-family:var(--f-ui);font-size:.72rem;font-style:normal;
    font-weight:600;letter-spacing:.07em;text-transform:uppercase;color:var(--muted);}
}
