/* Debrief de campagne - DA Marquages de pont */
.campagne .retour { color: var(--jaune); } .campagne .retour:hover { border-bottom: 1.5px solid var(--jaune); }
.campagne .surtitre .sep { color: var(--creme-2); opacity: .6; margin: 0 8px; }
.lien { border-bottom: 1.5px solid var(--jaune); } .lien:hover { color: var(--jaune); }

.chiffres-c { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border-top: 1.5px dashed rgba(246, 239, 230, .4); border-bottom: 1.5px dashed rgba(246, 239, 230, .4); }
.chiffres-c > div { padding: 24px 0 22px 20px; border-left: 1.5px dashed rgba(246, 239, 230, .25); position: relative; min-width: 0; }
.chiffres-c > div:first-child { border-left: 0; padding-left: 0; }
.chiffres-c > div::before { content: ""; position: absolute; top: -1.5px; left: 20px; width: 38px; border-top: 3px solid var(--jaune); }
.chiffres-c > div:first-child::before { left: 0; }
.chiffres-c .gros { font: 800 clamp(2.2rem, 6vw, 4rem)/.92 var(--f-titre); overflow-wrap: anywhere; }

.bloc-c { margin-top: 52px; }
.front-c { font: 700 clamp(1.2rem, 2.6vw, 1.6rem)/1.2 var(--f-titre); text-transform: uppercase; letter-spacing: .02em; margin-bottom: 12px; }
.theatre { display: flex; height: 16px; border: 1.5px solid rgba(246, 239, 230, .4); }
.theatre span { flex: 0 0 auto; flex-basis: 0; } .theatre .b { background: #6cc4ff; } .theatre .n { background: #b9aca4; } .theatre .r { background: var(--rouge); }
.theatre span + span { border-left: 2px solid var(--pont); }
.note-c { font: 400 .85rem/1.5 var(--f-texte); color: var(--creme-2); margin-top: 10px; }

.soirees { display: flex; align-items: flex-end; gap: 6px; height: 170px; margin-top: 8px; border-bottom: 1.5px dashed rgba(246, 239, 230, .35); padding-top: 20px; }
.soiree { flex: 1 1 0; min-width: 0; max-width: 46px; height: 100%; display: flex; flex-direction: column; justify-content: flex-end; position: relative; }
.barre-s { display: block; height: var(--h, 0%); min-height: 2px; background: var(--creme-2); transform-origin: bottom; animation: monte-s .8s cubic-bezier(.2, .7, .2, 1) both; }
.val-s { font: 700 .78rem/1 var(--f-titre); text-align: center; margin-bottom: 4px; }
.gain { position: absolute; top: -18px; left: 0; right: 0; text-align: center; font: 700 .72rem/1 var(--f-mono); }
.gain.plus { color: var(--jaune); } .gain.moins { color: var(--rouge); }
.date-s { position: absolute; bottom: -20px; left: 0; right: 0; text-align: center; font: 500 .55rem/1 var(--f-mono); color: var(--creme-2); white-space: nowrap; }
.bloc-c .soirees + .note-c { margin-top: 30px; }
@keyframes monte-s { from { transform: scaleY(0); } to { transform: none; } }

.forts { list-style: none; display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 22px 28px; }
.fort { border-left: 3px solid var(--jaune); padding-left: 12px; }
.fort-titre { font: 500 .64rem/1.3 var(--f-mono); letter-spacing: .16em; text-transform: uppercase; color: var(--creme-2); }
.fort-val { font: 800 2rem/1.05 var(--f-titre); margin-top: 6px; }
.fort-date { font: 400 .82rem/1.3 var(--f-texte); color: var(--creme-2); margin-top: 4px; }

.archives { list-style: none; display: grid; gap: 12px; }
.archive { border-left: 3px solid var(--creme-2); padding-left: 12px; }
.archive-nom { font: 800 1.4rem/1 var(--f-titre); text-transform: uppercase; }
.archive-info { font: 500 .72rem/1.4 var(--f-mono); letter-spacing: .1em; text-transform: uppercase; color: var(--creme-2); margin-top: 4px; }

@media (max-width: 720px) { .chiffres-c { grid-template-columns: repeat(2, minmax(0, 1fr)); } .chiffres-c > div:nth-child(3) { border-left: 0; padding-left: 0; } .chiffres-c > div:nth-child(3)::before { left: 0; } .chiffres-c > div:nth-child(n+3) { border-top: 1.5px dashed rgba(246, 239, 230, .25); } }
@media (prefers-reduced-motion: reduce) { .barre-s { animation: none; } }

/* film de la campagne */
.film { margin: 8px 0 0; border: 1.5px solid rgba(246, 239, 230, .3); max-width: 900px; }
.film img { display: block; width: 100%; height: auto; }

/* Brin d'Actu (journal de la semaine) - DA Marquages de pont, facon une de journal (reprend la mise en page du debrief de campagne) */
.gazette .manchette { font: 500 .78rem/1 var(--f-mono); letter-spacing: .24em; text-transform: uppercase; color: var(--jaune); margin-top: 18px;
  padding: 8px 0; border-top: 3px solid var(--jaune); border-bottom: 1.5px dashed rgba(246, 239, 230, .4); display: table; }
.titre-brin { font: 800 clamp(2rem, 6vw, 3.8rem)/.92 var(--f-titre); text-transform: uppercase; max-width: 18ch; margin-top: 14px; }
.resume-brin { font: 500 1rem/1.5 var(--f-mono); letter-spacing: .06em; color: var(--creme); margin-top: 14px; }
.gazette .sous-titre { margin-top: 8px; }
.editions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 18px; }
.edition { font: 500 .74rem/1 var(--f-mono); letter-spacing: .14em; text-transform: uppercase; color: var(--creme); background: none;
  border: 1.5px solid rgba(246, 239, 230, .4); padding: 8px 12px; cursor: pointer; }
.edition:hover { border-color: var(--creme); }
.edition[aria-current="true"] { background: var(--jaune); color: #1c1620; border-color: var(--jaune); }
.colonnes-g { display: grid; grid-template-columns: 1fr 1fr; gap: 0 28px; margin-top: 10px; }
.zones-g { list-style: none; margin-top: 8px; display: flex; flex-wrap: wrap; gap: 6px 8px; padding: 0; }
.zones-g li { font: 700 1rem/1 var(--f-titre); text-transform: uppercase; letter-spacing: .03em; padding: 6px 9px; border: 1.5px solid; }
.zones-g.prises li { color: #6cc4ff; border-color: rgba(108, 196, 255, .6); }
.zones-g.perdues li { color: var(--rouge); border-color: rgba(255, 90, 78, .6); }
.zones-g li.vide { border: 0; padding: 6px 0; color: var(--creme-2); font: 400 .9rem var(--f-texte); text-transform: none; }
.faits-g { list-style: none; margin-top: 16px; padding: 0; font: 400 .95rem/1.5 var(--f-texte); color: var(--creme-2); }
.faits-g li::before { content: "› "; color: var(--jaune); }
.forts .fort.vide { font: 400 1rem/1.5 var(--f-texte); color: var(--creme-2); }
.lien-bouton { background: none; border: 0; padding: 0; font: inherit; color: var(--creme); border-bottom: 1.5px solid var(--jaune); cursor: pointer; }
.lien-bouton:hover { color: var(--jaune); }
@media (max-width: 560px) { .colonnes-g { grid-template-columns: 1fr; gap: 16px; } }

.gazette .front-c { margin-top: 18px; }
.gazette .forts { margin-top: 22px; }