/* Page d'un cycle (module cycle-page.php) : ouverture façon revue, « Les textes » en sommaire (volet éditorial sur ordinateur,
   chaque texte avec son image et son chapô sur téléphone et tablette), bascule vers la Chronologie, « Autres cycles ».
   Langue de la Pureté (docs/regles-design.md) : papier, aucun aplat, angles droits, section qui s'ouvre = filet fin + trait vert
   de 40 px, titre de page seul à porter l'équerre, Oswald 400 casse normale, vert rare ; aucune hiérarchie entre les textes
   (pas de numéros, même corps, filet seul entre eux). Maquette : staging/maquettes/page-cycle.html. */

/* La boucle du modèle Archives : remplacée par le sommaire */
html:not(#lrvx) body.lrv-cy .lrv-archive-inner > .oxy-post-loop { display: none; }
/* L'en-tête a son filet ; la section qui suit a le sien (filet + trait vert) : un seul. */
html:not(#lrvx) body.lrv-cy .lrv-archive-head { border-bottom: 0; }

/* Ouverture : grand titre, présentation en chapô (ordinateur). Même spécificité que l'ancienne règle à attribut data-lrv-arch,
   un cran au-dessus de la règle de base du modèle Archives (html:not(#lrvx) main.lrv-archive.lrv-archive …). */
@media (min-width: 1120px) {
  html:not(#lrvx) body.lrv-cy main.lrv-archive.lrv-archive .lrv-archive-title { font-size: clamp(48px, 4.4vw, 64px); line-height: 1.04; }
  html:not(#lrvx) body.lrv-cy main.lrv-archive.lrv-archive .lrv-archive-desc { font-size: 19px; line-height: 1.65; }
}
.lrv-cy-colo { margin: 18px 0 0; color: var(--lrv-grey, #55595c); font: 400 15px/1.4 var(--lrv-font-title, 'Oswald'), sans-serif; }
.lrv-cy-dot { display: inline-block; width: 5px; height: 5px; margin: 0 9px 2px; border: 1.5px solid var(--lrv-green, #547038); border-radius: 50%; vertical-align: middle; }

/* Sections (niveau 2) : filet fin + trait vert ; 64 px au-dessus, 36 px de retrait */
.lrv-cy-sec { position: relative; margin-top: 64px; padding: 36px 0 0; border-top: 1px solid rgba(36,33,36,.12); color: var(--lrv-ink, #242124); }
.lrv-cy-sec::before { content: ""; position: absolute; top: -1px; left: 0; width: 40px; height: 2px; background: var(--lrv-green, #547038); }
#lrv-cy-textes { margin-top: 36px; scroll-margin-top: 80px; }
.lrv-cy-sec a { color: inherit; text-decoration: none; }
.lrv-cy-sec img { display: block; width: 100%; height: 100%; object-fit: cover; }
.lrv-cy-head { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 6px 24px; margin-bottom: 8px; }
body.lrv-cy .lrv-cy-h { margin: 0; color: var(--lrv-ink, #242124); font: 400 30px/1.2 var(--lrv-font-title, 'Oswald'), sans-serif; letter-spacing: 0; text-transform: none; }

/* Bascule Sommaire · Chronologie (même dessin que Cartes · Planche · Sommaire des rubriques) */
.lrv-cy-switch { display: flex; gap: 22px; }
.lrv-cy-switch[hidden] { display: none; }
.lrv-cy-switch button { min-height: 44px; padding: 4px 0; border: 0; border-bottom: 2px solid transparent; background: none; color: var(--lrv-grey, #55595c); font: 400 18px var(--lrv-font-title, 'Oswald'), sans-serif; cursor: pointer; }
.lrv-cy-switch button[aria-pressed="true"] { color: var(--lrv-ink, #242124); border-bottom-color: var(--lrv-green, #547038); }
.lrv-cy-switch button:focus-visible { outline: 2px solid var(--lrv-green, #547038); outline-offset: 2px; }

/* Entrées du sommaire (communes) */
.lrv-cy-list { margin: 0; padding: 0; list-style: none; }
.lrv-cy-row { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 0 24px; padding: 16px 0 18px; border-top: 1px solid var(--lrv-line, #e4e4e2); }
.lrv-cy-list > li:first-child > .lrv-cy-row { border-top: 0; padding-top: 0; }
.lrv-cy-row:focus-visible { outline: 2px solid var(--lrv-green, #547038); outline-offset: 4px; }
.lrv-cy-body { display: block; min-width: 0; }
.lrv-cy-sur { display: block; margin: 0; color: var(--lrv-green, #547038); font: 400 15px/1.35 var(--lrv-font-title, 'Oswald'), sans-serif; }
.lrv-cy-sur i { font-family: var(--lrv-font-text, 'Lato'), sans-serif; }
body.lrv-cy .lrv-cy-t { margin: 3px 0 0; color: inherit; font: 400 22px/1.22 var(--lrv-font-title, 'Oswald'), sans-serif; letter-spacing: 0; text-transform: none; text-wrap: balance; transition: color .2s; }
.lrv-cy-row:hover .lrv-cy-t, .lrv-cy-row.is-cur .lrv-cy-t { color: var(--lrv-green, #547038); }
.lrv-cy-by { display: block; margin-top: 4px; color: var(--lrv-grey, #55595c); font-size: 14px; }
.lrv-cy-min { padding-top: 4px; color: var(--lrv-grey, #55595c); font: 400 15px var(--lrv-font-title, 'Oswald'), sans-serif; white-space: nowrap; }
.lrv-cy-thumb, .lrv-cy-ex, .lrv-cy-bym { display: none; }
.lrv-cy-bym { white-space: nowrap; } /* « · 14 min » d'un seul tenant quand la signature passe à la ligne */
.lrv-cy-grp { margin: 32px 0 10px; color: var(--lrv-green, #547038); font: 400 13px/1 var(--lrv-font-title, 'Oswald'), sans-serif; letter-spacing: .08em; text-transform: uppercase; }

/* Ordinateur : volet éditorial à gauche (texte survolé ou en cours de lecture), liste légère à droite */
.lrv-cy-view { display: none; }
@media (min-width: 1024px) {
  .lrv-cy-som { display: grid; grid-template-columns: minmax(0,5fr) minmax(0,6fr); gap: 56px; margin-top: 28px; align-items: start; }
  .lrv-cy-view { display: block; position: sticky; top: calc(var(--lrv-header-h, 72px) + 16px); }
  .lrv-cy-vin { transition: opacity .2s; }
  .lrv-cy-vin.is-fading { opacity: 0; }
  .lrv-cy-vpic { display: block; aspect-ratio: 16/9; overflow: hidden; background: var(--lrv-surface, #efeeec); outline: 1px solid rgba(36,33,36,.1); outline-offset: -1px; }
  .lrv-cy-view .lrv-cy-sur { margin-top: 18px; }
  .lrv-cy-vt { margin: 6px 0 12px; font: 400 32px/1.15 var(--lrv-font-title, 'Oswald'), sans-serif; text-wrap: balance; }
  .lrv-cy-vex { margin: 0; color: #3d3a3d; font-size: 17.5px; line-height: 1.6; display: -webkit-box; -webkit-line-clamp: 5; -webkit-box-orient: vertical; overflow: hidden; }
  .lrv-cy-vby { margin: 14px 0 0; color: var(--lrv-grey, #55595c); font-size: 14px; }
  .lrv-cy-go { display: inline-block; margin-top: 14px; color: var(--lrv-green, #547038) !important; border-bottom: 1px solid var(--lrv-green, #547038); font: 400 16px var(--lrv-font-title, 'Oswald'), sans-serif; }
}

/* Téléphone et tablette : chaque texte avec l'appareil du volet (image, film, titre, chapô, signature et temps) */
@media (max-width: 1023px) {
  .lrv-cy-lists { max-width: 680px; margin-top: 20px; }
  .lrv-cy-row { grid-template-columns: minmax(0,1fr); padding: 24px 0 26px; }
  .lrv-cy-list > li:first-child > .lrv-cy-row { padding-top: 4px; }
  .lrv-cy-min { display: none; }
  .lrv-cy-thumb { display: block; aspect-ratio: 16/9; overflow: hidden; margin-bottom: 14px; background: var(--lrv-surface, #efeeec); }
  body.lrv-cy .lrv-cy-t { margin: 4px 0 8px; font-size: 25px; line-height: 1.18; }
  .lrv-cy-ex { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; margin: 0 0 10px; color: #3d3a3d; font-size: 17px; line-height: 1.6; }
  .lrv-cy-bym { display: inline; }
}

/* Tablette : deux textes par rang (un texte par écran sur une colonne) ; filet seul entre les rangs */
@media (min-width: 768px) and (max-width: 1023px) {
  .lrv-cy-lists { max-width: none; }
  .lrv-cy-list { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); column-gap: 28px; }
  .lrv-cy-list > li:nth-child(2) > .lrv-cy-row { border-top: 0; padding-top: 4px; }
  body.lrv-cy .lrv-cy-t { font-size: 22px; line-height: 1.2; }
  .lrv-cy-ex { font-size: 16px; line-height: 1.55; }
}

/* Chronologie : construite par le script à partir des entrées ; films sur l'axe du temps, puis cartes trois par rang */
.lrv-cy-chrono[hidden], .lrv-cy-som[hidden] { display: none; }
.lrv-cy-strip { position: relative; display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0,1fr); gap: 10px; margin: 36px 0 0; padding-top: 30px; }
.lrv-cy-strip.is-few { grid-auto-columns: minmax(0,150px); }
.lrv-cy-strip::before { content: ""; position: absolute; top: 6px; left: 0; right: 0; height: 1px; background: rgba(36,33,36,.12); }
.lrv-cy-strip a { position: relative; display: block; }
.lrv-cy-strip a::before { content: ""; position: absolute; top: -29px; left: 0; width: 9px; height: 9px; border: 1.5px solid var(--lrv-green, #547038); border-radius: 50%; background: var(--lrv-paper, #f7f7f7); }
.lrv-cy-strip a:hover::before, .lrv-cy-strip a:focus-visible::before { background: var(--lrv-green, #547038); }
/* L'année coupe l'axe (fond papier) au lieu d'être barrée par lui */
.lrv-cy-yr { position: absolute; top: -30px; left: 13px; padding: 0 6px; background: var(--lrv-paper, #f7f7f7); color: var(--lrv-grey, #55595c); font: 400 14px/1 var(--lrv-font-title, 'Oswald'), sans-serif; }
.lrv-cy-sp { display: block; aspect-ratio: 3/4; overflow: hidden; background: var(--lrv-surface, #efeeec); }
.lrv-cy-st { display: block; margin-top: 8px; font: 400 15px/1.2 var(--lrv-font-title, 'Oswald'), sans-serif; }
.lrv-cy-cards { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 36px 28px; margin-top: 44px; }
.lrv-cy-cards + .lrv-cy-grp { margin-top: 48px; padding-top: 20px; border-top: 1px solid var(--lrv-line, #e4e4e2); }
.lrv-cy-grp + .lrv-cy-cards { margin-top: 16px; }
.lrv-cy-card { display: block; }
.lrv-cy-card .lrv-cy-thumb { display: block; aspect-ratio: 16/9; overflow: hidden; margin-bottom: 12px; background: var(--lrv-surface, #efeeec); }
.lrv-cy-card .lrv-cy-ex { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; margin: 8px 0 0; color: #3d3a3d; font-size: 16px; line-height: 1.55; }
.lrv-cy-card .lrv-cy-bym { display: inline; }
body.lrv-cy .lrv-cy-card .lrv-cy-t { margin: 4px 0 0; font-size: 23px; }
.lrv-cy-card:hover .lrv-cy-t { color: var(--lrv-green, #547038); }
@media (max-width: 1023px) {
  .lrv-cy-cards { grid-template-columns: repeat(2, minmax(0,1fr)); }
}
@media (max-width: 767px) {
  .lrv-cy-strip, .lrv-cy-strip.is-few { display: flex; overflow-x: auto; scrollbar-width: none; margin-right: -16px; padding-right: 16px; }
  .lrv-cy-strip::before { right: -16px; }
  .lrv-cy-strip a { flex: 0 0 108px; }
  .lrv-cy-cards { grid-template-columns: minmax(0,1fr); gap: 32px; }
}

/* Présentation repliée sur téléphone et tablette (script) : quatre lignes, fondu, « Lire la suite » */
/* main.lrv-archive : passe devant la règle de base du modèle (même spécificité, feuille Oxygen chargée après), active à toutes les largeurs depuis le 07/10 */
html:not(#lrvx) body.lrv-cy main.lrv-archive .lrv-archive-desc.is-clamp { max-height: var(--lrv-cy-clamp, 7em); margin-bottom: 0; overflow: hidden;
  -webkit-mask-image: linear-gradient(#000 55%, transparent); mask-image: linear-gradient(#000 55%, transparent); }
.lrv-cy-more { display: inline-flex; align-items: center; min-height: 44px; margin: 0 0 8px; padding: 0; border: 0; background: none; cursor: pointer;
  color: var(--lrv-green, #547038); font: 400 16px var(--lrv-font-title, 'Oswald'), sans-serif; text-decoration: underline; text-underline-offset: 4px; }
.lrv-cy-more::after { content: "↓"; margin-left: 6px; text-decoration: none; }
.lrv-cy-more:focus-visible { outline: 2px solid var(--lrv-green, #547038); outline-offset: 2px; }

/* Autres cycles : quatre par rang (deux sur téléphone) */
.lrv-cy-all { color: var(--lrv-grey, #55595c) !important; font-size: 15px; }
.lrv-cy-all:hover { color: var(--lrv-green, #547038) !important; }
.lrv-cy-ogrid { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 28px 24px; margin-top: 20px; }
.lrv-cy-oc { display: block; }
.lrv-cy-opic { display: block; aspect-ratio: 16/9; overflow: hidden; margin-bottom: 10px; background: var(--lrv-surface, #efeeec); }
.lrv-cy-oa { display: block; color: var(--lrv-green, #547038); font: 400 14px/1.3 var(--lrv-font-title, 'Oswald'), sans-serif; }
.lrv-cy-ot { display: block; font: 400 18px/1.25 var(--lrv-font-title, 'Oswald'), sans-serif; transition: color .2s; }
.lrv-cy-oc:hover .lrv-cy-ot { color: var(--lrv-green, #547038); }
@media (max-width: 767px) {
  .lrv-cy-sec { margin-top: 48px; }
  body.lrv-cy .lrv-cy-h { font-size: 26px; }
  .lrv-cy-ogrid { grid-template-columns: repeat(2, minmax(0,1fr)); gap: 20px 14px; }
  .lrv-cy-ot { font-size: 16px; }
}

/* Survol : zoom doux des images (Pureté), coupé si le lecteur limite les animations */
.lrv-cy-thumb img, .lrv-cy-sp img, .lrv-cy-opic img, .lrv-cy-vpic img { transition: transform .6s cubic-bezier(.2,.7,.2,1); }
.lrv-cy-card:hover .lrv-cy-thumb img, .lrv-cy-oc:hover .lrv-cy-opic img, .lrv-cy-strip a:hover img { transform: scale(1.04); }
@media (prefers-reduced-motion: reduce) {
  .lrv-cy-sec img, .lrv-cy-vin { transition: none !important; transform: none !important; }
}
