/* Ported from src/pages/catalogues.astro */
.bg-white { background: var(--color-surface); }

.catalogues-defilement-section .section-title { font-size: var(--text-2xl); font-weight: var(--fw-bold); color: var(--color-text); margin-bottom: var(--space-2); }
.catalogues-defilement-section .section-desc { color: var(--color-text-body); margin-bottom: var(--space-8); font-size: var(--text-base); }

/* ── 1. Bannières en défilement ────────────────────────────── */
.catalogues-defilement-section { padding: var(--space-16) 0; }
.catalogues-carousel-wrap { position: relative; overflow: hidden; }
.catalogues-carousel {
  display: flex; gap: var(--space-8); overflow-x: auto; scroll-snap-type: x mandatory;
  padding-bottom: var(--space-4); scrollbar-width: thin; scrollbar-color: var(--color-primary) var(--color-border);
}
.carousel-catalog-banner {
  flex: 0 0 100%; display: grid; grid-template-columns: 1fr 1.5fr; gap: var(--space-8);
  background: var(--color-surface); border-radius: var(--radius-md); padding: var(--space-8);
  border: 1px solid var(--color-border); box-shadow: var(--shadow-sm); scroll-snap-align: start;
  align-items: center; transition: border-color 0.2s ease, box-shadow 0.2s ease;
}
.carousel-catalog-banner:hover { border-color: #cbd5e1; box-shadow: var(--shadow-md); }
.banner-cover-wrap { position: relative; aspect-ratio: 5/7; border-radius: var(--radius-sm); overflow: hidden; box-shadow: var(--shadow-md); max-width: 260px; margin: 0 auto; width: 100%; }
.banner-cover-img { width: 100%; height: 100%; object-fit: cover; }
.pdf-indicator {
  position: absolute; inset: 0; background: rgba(243, 112, 33, 0.9); color: #fff;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: var(--space-2); font-weight: var(--fw-bold); opacity: 0; transition: opacity 0.2s ease;
}
.carousel-catalog-banner:hover .pdf-indicator { opacity: 1; }
.banner-text { display: flex; flex-direction: column; align-items: flex-start; gap: var(--space-3); }
.active-badge {
  background: rgba(0, 168, 80, 0.1); color: #00a850; border: 1px solid rgba(0, 168, 80, 0.2);
  font-size: var(--text-xs); font-weight: var(--fw-bold); padding: var(--space-1) var(--space-3);
  border-radius: var(--radius-full); text-transform: uppercase;
}
.banner-text h3 { font-size: var(--text-xl); font-weight: var(--fw-bold); line-height: 1.25; }
.catalog-pub-date { font-size: var(--text-sm); color: var(--color-text-muted); }
.btn-sm { padding: var(--space-2) var(--space-4); font-size: var(--text-xs); }

/* ── 2. Archives catalogues ───────────────────────────────── */
.archives-section { padding: var(--space-16) 0; }
.archives-section .section-title { font-size: var(--text-2xl); font-weight: var(--fw-bold); color: var(--color-text); margin-bottom: var(--space-2); }
.archives-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--space-6); }
.archive-cover-placeholder {
  background: var(--color-bg); aspect-ratio: 16/10; display: flex; flex-direction: column;
  align-items: center; justify-content: center; gap: var(--space-2); color: var(--color-text-muted);
  font-weight: var(--fw-semibold); font-size: var(--text-xs);
}
.archive-info { padding: var(--space-4); display: flex; flex-direction: column; gap: var(--space-2); flex: 1; }
.archive-info h3 { font-size: var(--text-sm); font-weight: var(--fw-bold); line-height: 1.3; }

/* ── Responsive ───────────────────────────────────────────── */
@media (max-width: 1023px) { .archives-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 767px) {
  .carousel-catalog-banner { grid-template-columns: 1fr; gap: var(--space-4); padding: var(--space-5); }
  .banner-cover-wrap { max-width: 180px; }
  .archives-grid { grid-template-columns: 1fr; }
}