/* Les numéros spéciaux du Journal Officieux (un par vidéo) et le kiosque. S'ajoute à officieux.css. */

.fil { margin-bottom: 18px; font: 700 11px/1.5 var(--f-mono); letter-spacing: .12em; text-transform: uppercase; color: #6d665a; }
.fil a { color: var(--encre); text-decoration: none; border-bottom: 1px solid rgba(26, 23, 20, .3); }
.fil span { margin: 0 6px; opacity: .5; }

/* La une d'un numéro */
.une--speciale { text-align: left; }
.une--speciale .une__republique, .une__titre--petit { text-align: center; }
.une__titre--petit { margin: 6px 0 0; font: 900 clamp(34px, 6vw, 70px)/.95 var(--f-journal); letter-spacing: -.02em; }
.une-grille { display: grid; grid-template-columns: 1.5fr 1fr; gap: clamp(24px, 4vw, 48px); align-items: start; margin-top: 26px; padding-top: 22px; border-top: 1px solid var(--encre); }
.une__rubrique { display: inline-block; padding: 4px 8px; background: var(--encre); color: var(--papier); font: 700 11px/1 var(--f-mono); letter-spacing: .14em; text-transform: uppercase; }
.manchette { margin: 14px 0 0; font: 900 clamp(36px, 5.6vw, 76px)/.98 var(--f-journal); letter-spacing: -.025em; text-wrap: balance; }
.chapo { margin: 18px 0 0; font: 400 clamp(17px, 1.7vw, 20px)/1.55 var(--f-journal); color: #3d372f; }
.chapo::first-letter { float: left; margin: 6px 8px 0 0; font: 900 3.4em/.8 var(--f-journal); color: var(--rouge); }

/* Le vrai chiffre : l'encadré noir, la seule zone « sérieuse » de la une */
.vrai-chiffre { position: relative; padding: 22px 22px 18px; background: var(--encre); color: var(--os); transform: rotate(-.6deg); box-shadow: 8px 10px 0 rgba(26, 23, 20, .12); }
.vrai-chiffre__etiquette { display: block; color: var(--rouge); font: 700 11px/1 var(--f-mono); letter-spacing: .16em; text-transform: uppercase; }
.vrai-chiffre__val { display: block; margin-top: 10px; font: 400 clamp(64px, 8vw, 104px)/.9 var(--f-titre); color: var(--os); }
.vrai-chiffre p { margin: 12px 0 0; font: 400 16px/1.5 var(--f-journal); color: #d9d2c4; }
.vrai-chiffre .source { margin-top: 14px; color: #a39d92; }

/* Communiqué rédigé (plusieurs paragraphes) */
.communique__texte--long { font-size: clamp(17px, 1.6vw, 20px); }
.communique__texte--long p { margin: 0 0 .8em; }
.communique__texte--long p:last-child { margin-bottom: 0; font-style: italic; }

/* Les notes de version */
.notes { list-style: none; margin: 0; padding: 0; border-left: 2px solid var(--encre); }
.note { position: relative; display: grid; grid-template-columns: 76px 170px 1fr; gap: 4px 18px; align-items: baseline; padding: 18px 0 18px 22px; border-bottom: 1px dashed rgba(26, 23, 20, .3); }
.note::before { content: ""; position: absolute; left: -7px; top: 26px; width: 12px; height: 12px; background: var(--papier); border: 2px solid var(--encre); border-radius: 50%; }
.note__v { font: 700 15px/1 var(--f-mono); }
.note__date { font: 700 12px/1.3 var(--f-mono); letter-spacing: .06em; text-transform: uppercase; color: #6d665a; }
.note__tag { justify-self: start; grid-column: 3; grid-row: 1; padding: 3px 7px; border: 1.5px solid currentColor; font: 700 10.5px/1 var(--f-mono); letter-spacing: .12em; text-transform: uppercase; color: #2f6b3a; }
.note__tag--masque { color: #6d665a; }
.note__tag--renomme { color: #8a5a00; }
.note__tag--verrou { color: var(--encre); }
.note__tag--rupture { color: var(--papier); background: var(--rouge); border-color: var(--rouge); }
.note p { grid-column: 3; margin: 8px 0 0; font: 400 17px/1.55 var(--f-journal); }
.note .source { grid-column: 3; margin-top: 6px; color: #6d665a; }
.note--majeure { background: rgba(215, 25, 42, .06); }
.note--majeure::before { background: var(--rouge); border-color: var(--rouge); }
.note--majeure p { font-weight: 700; }

/* Vrai ou officieux ? */
.score-vo { text-align: right; }
.score-vo span { display: block; color: #6d665a; font: 700 10px/1 var(--f-mono); letter-spacing: .14em; text-transform: uppercase; }
.score-vo b { font: 400 44px/1 var(--f-titre); }
.vo { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 260px), 1fr)); gap: 18px; }
.vo__carte { position: relative; display: flex; flex-direction: column; padding: 18px 18px 16px; background: #FBF8F1; border: 1px solid rgba(26, 23, 20, .3); transition: transform .3s var(--ease), box-shadow .3s; }
.vo__carte:nth-child(odd) { transform: rotate(-.5deg); }
.vo__carte:nth-child(even) { transform: rotate(.45deg); }
.vo__num { color: var(--rouge); font: 700 10.5px/1 var(--f-mono); letter-spacing: .14em; text-transform: uppercase; }
.vo__carte > p { flex: 1; margin: 10px 0 14px; font: 400 17px/1.5 var(--f-journal); }
.vo__choix { display: flex; gap: 8px; }
.vo__btn { flex: 1; padding: 10px 8px; border: 1.5px solid var(--encre); background: transparent; color: var(--encre); cursor: pointer; font: 700 12px/1 var(--f-mono); letter-spacing: .12em; text-transform: uppercase; transition: background .15s, color .15s; }
.vo__btn:hover { background: var(--encre); color: var(--papier); }
.vo__carte.jouee .vo__btn { cursor: default; opacity: .35; }
.vo__carte.jouee .vo__btn:hover { background: transparent; color: var(--encre); }
.vo__carte.jouee .vo__btn.choisi { opacity: 1; background: var(--encre); color: var(--papier); }
.vo__verdict:empty { display: none; }
.vo__verdict { margin-top: 14px; padding-top: 12px; border-top: 1px dashed rgba(26, 23, 20, .4); animation: encre .5s ease both; }
.vo__verdict p { margin: 8px 0 0; font: 400 15px/1.5 var(--f-journal); }
.vo__verdict .source { margin-top: 4px; color: #6d665a; }
.vo__tampon { font-size: 12px; mix-blend-mode: multiply; }
.vo__carte.est-faux .vo__tampon { color: #6d665a; }
.vo__carte.juste { box-shadow: 0 0 0 2px #2f6b3a; }
.vo__carte.rate { box-shadow: 0 0 0 2px var(--rouge); }
.vo__fin { margin: 28px 0 0; padding: 18px 20px; border: 2px solid var(--encre); font: 400 18px/1.5 var(--f-journal); }

/* Le renvoi vers la vidéo */
.renvoi { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(24px, 4vw, 56px); align-items: center; margin-top: 12px; padding: clamp(28px, 4vw, 44px); background: var(--encre); color: var(--os); }
.renvoi h2 { margin: 0; font: 900 clamp(26px, 3vw, 38px)/1.1 var(--f-journal); letter-spacing: -.015em; }
.renvoi p { margin: 14px 0 22px; color: #cfc8ba; font: 400 17px/1.55 var(--f-journal); }
.renvoi .rubrique__num { color: var(--rouge); }
.renvoi .bouton { color: var(--os); }
.renvoi__image { position: relative; display: block; aspect-ratio: 16 / 9; overflow: hidden; }
.renvoi__image img { width: 100%; height: 100%; object-fit: cover; filter: grayscale(1) contrast(1.1) brightness(.8); transition: filter .5s, transform .8s var(--ease); }
.renvoi__image:hover img { filter: none; transform: scale(1.03); }
.renvoi__image .dossier__lecture { opacity: 1; transform: none; }

/* Les autres numéros */
.autres-numeros { margin-top: 40px; }
.autres-numeros__liste { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 240px), 1fr)); gap: 0; margin-top: 12px; border-top: 1px solid var(--encre); border-left: 1px solid var(--encre); }
.autres-numeros__liste a { padding: 16px 18px; border-right: 1px solid var(--encre); border-bottom: 1px solid var(--encre); color: var(--encre); text-decoration: none; font: 700 17px/1.3 var(--f-journal); transition: background .15s; }
.autres-numeros__liste a:hover { background: #F1EBDD; }
.autres-numeros__liste small { display: block; margin-bottom: 6px; color: var(--rouge); font: 700 10.5px/1 var(--f-mono); letter-spacing: .12em; text-transform: uppercase; }
.autres-numeros__liste .attente, .autres-numeros__liste .retour { font-weight: 400; font-style: italic; }

/* Le kiosque (officieux.html) */
.kiosque { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 220px), 1fr)); gap: 22px; }
.couv { position: relative; display: flex; flex-direction: column; padding: 12px 12px 14px; background: #FBF8F1; border: 1px solid rgba(26, 23, 20, .35); color: var(--encre); text-decoration: none; box-shadow: 4px 5px 0 rgba(26, 23, 20, .1); transition: transform .3s var(--ease), box-shadow .3s; }
.couv:nth-child(3n+1) { transform: rotate(-.8deg); }
.couv:nth-child(3n+2) { transform: rotate(.5deg); }
a.couv:hover { transform: translateY(-4px) rotate(0); box-shadow: 8px 12px 0 rgba(26, 23, 20, .14); }
.couv__haut { display: flex; justify-content: space-between; gap: 8px; padding-bottom: 6px; border-bottom: 1px solid var(--encre); font: 700 9.5px/1.2 var(--f-mono); letter-spacing: .1em; text-transform: uppercase; color: #6d665a; }
.couv__titre { margin: 8px 0; text-align: center; font: 900 25px/1 var(--f-journal); letter-spacing: -.02em; }
.couv__image { display: block; aspect-ratio: 16 / 9; overflow: hidden; border-top: 3px double var(--encre); padding-top: 6px; }
.couv__image img { width: 100%; height: 100%; object-fit: cover; filter: grayscale(1) contrast(1.15) sepia(.25); }
.couv__manchette { flex: 1; margin-top: 10px; font: 900 18px/1.15 var(--f-journal); letter-spacing: -.01em; text-wrap: balance; }
.couv__pied { margin-top: 12px; padding-top: 8px; border-top: 1px solid rgba(26, 23, 20, .3); color: var(--rouge); font: 700 10.5px/1 var(--f-mono); letter-spacing: .12em; text-transform: uppercase; }
.couv--attente { opacity: .62; }
.couv--attente .couv__pied { color: #6d665a; }
.couv__tampon { position: absolute; left: 50%; top: 44%; translate: -50% -50%; font-size: 13px; mix-blend-mode: multiply; white-space: nowrap; }
.kiosque-compte { color: #6d665a; font: 700 12px/1.4 var(--f-mono); letter-spacing: .1em; text-transform: uppercase; }

@media (max-width: 900px) {
  .une-grille, .renvoi { grid-template-columns: 1fr; }
  .note { grid-template-columns: 60px 1fr; }
  .note__tag, .note p, .note .source { grid-column: 1 / -1; grid-row: auto; }
}

/* Les liens du Journal sont rouges par défaut : couvertures, listes et fil restent à l'encre */
.journal-page a.couv, .journal-page .autres-numeros__liste a, .journal-page .fil a { color: var(--encre); }
.journal-page .renvoi .bouton { color: var(--os); }
