/* Collections overview (/collections/): intro, the collections explorer (the homepage's block), « Un même verbe : révéler. » with the
   MX-08 eclipse, and « Toutes les collections » (mini shelves). Ported from the prototype
   (scripts/assets/collections-overview.css and the eclipse sign in editorial-components.css, ddf9b78).
   WP: the eclipse sign sits in a core/html block; eclipse.js plays it once (MX-08). */
.eclipse-sign { position: relative; display: block; width: min(640px, 100%); height: auto; margin: 0 auto 2.5rem; }
.eclipse-bronze { fill: var(--color-accent); }
.eclipse-noir { fill: var(--color-text); }
.eclipse-ring { fill: none; stroke: var(--color-text); stroke-width: 2; }
.collections-overview .batch-intro { max-width: 1120px; }
.collections-overview .batch-intro h1 { max-width: 1100px; }

.collections-reveal { width: min(100%, var(--reading-width)); margin: var(--chapter-gap) auto 0; text-align: center; }
.collections-reveal h2 { margin: 0 0 var(--heading-gap); font-family: var(--font-body); font-size: clamp(2.65rem, 5vw, 4.35rem); font-weight: 600; line-height: 1.08; }
.collections-reveal p { margin: 0; font-size: 20px; line-height: 1.65; }

.collections-all { margin-top: var(--chapter-gap); }
.collections-all > h2 { margin: 0 0 var(--heading-gap); font-family: var(--font-body); font-size: clamp(2.5rem, 4vw, 3.6rem); font-weight: 600; }
.collection-overview-list { border-top: 1px solid var(--color-accent); }
.collection-overview-row { display: grid; grid-template-columns: 160px minmax(190px, .8fr) minmax(300px, 1.5fr) 120px 155px; gap: 34px; align-items: center; padding: 30px 0; border-bottom: 1px solid var(--color-accent); }
.collection-overview-row { scroll-margin-top: 120px; }
.collection-mini-shelf { display: flex; align-items: flex-end; gap: 4px; width: 150px; min-height: 113px; padding: 0 0 1px 8px; border-bottom: 1px solid var(--color-accent); }
.collection-mini-spine { display: block; flex: 0 0 var(--mini-spine-width, 13px); height: 96px; background: var(--color-text); transform-origin: 50% 100%; transition: transform 180ms var(--ease-standard); }
.collection-mini-spine:nth-child(6n+1) { height: 102px; }
.collection-mini-spine:nth-child(6n+2) { height: 112px; }
.collection-mini-spine:nth-child(6n+3) { height: 84px; }
.collection-mini-spine:nth-child(6n+4) { height: 106px; }
.collection-mini-spine:nth-child(6n+5) { height: 78px; }
.collection-mini-spine:nth-child(6n) { height: 109px; }
.collection-mini-shelf--bronze .collection-mini-spine { background: var(--color-accent); }
.collection-mini-shelf--sable .collection-mini-spine { border: 1px solid var(--color-text); background: var(--color-surface-alt); }
.collection-mini-spine:hover, .collection-mini-spine:focus-visible { transform: translateY(-4px); }
.collection-mini-spine:focus-visible { outline: 2px solid var(--color-accent); outline-offset: 2px; }
.collection-overview-name h3 { margin: 0 0 8px; font-family: var(--font-body); font-size: 2.25rem; font-weight: 600; line-height: 1.08; }
.collection-overview-name h3 a:hover, .collection-overview-name h3 a:focus-visible { color: var(--color-accent); }
.collection-overview-name .collection-baseline { font-size: 1.35rem; }
.collection-overview-copy p { margin: 0 0 10px; line-height: 1.55; }
.collection-overview-copy .collection-latest { margin-bottom: 0; font-size: .96rem; }
.collection-overview-copy .collection-latest a { border-bottom: 1px solid var(--color-accent); }
.collection-overview-row > .collection-count { text-align: right; }
.collection-overview-row > .text-link { justify-self: end; border-bottom: 1px solid var(--color-accent); white-space: nowrap; }


@media (max-width: 1180px) {
  .collection-overview-row { grid-template-columns: 150px minmax(170px, .8fr) minmax(260px, 1.4fr) 100px 140px; gap: 24px; }
}

@media (max-width: 1023px) {
  .collection-overview-row { grid-template-columns: 160px minmax(180px, .8fr) minmax(0, 1.4fr); }
  .collection-overview-row > .collection-count { grid-column: 2; text-align: left; }
  .collection-overview-row > .text-link { grid-column: 3; justify-self: start; }
}

@media (max-width: 700px) {
  .collections-overview .batch-intro h1 { font-size: clamp(3.1rem, 14vw, 4.6rem); }
  .collections-reveal .eclipse-sign { margin-bottom: 1.7rem; }
  .collections-reveal h2 { font-size: 2.65rem; }
  .collections-reveal p { font-size: 18px; line-height: 1.6; }
  .collection-overview-row { grid-template-columns: 1fr; gap: 18px; padding: 32px 0; }
  .collection-mini-shelf { width: 150px; }
  .collection-overview-name h3 { font-size: 2.15rem; }
  .collection-overview-row > .collection-count, .collection-overview-row > .text-link { grid-column: 1; justify-self: start; text-align: left; }
}

@media (prefers-reduced-motion: reduce) {
  .collection-overview-name h3 { transition: none; }
}
