/* =========================================================
   Sommaire Castres — castres_sommaire.css
   Grille 4 × 3 vignettes 260×174 px
   ========================================================= */

/* ===== En-tête ===== */
.castres-som-header {
  background: #2b3a4a;
  color: #fff;
  max-width: 1120px;
  padding: 16px 24px 12px;
  margin: 12px auto 0;
  border-radius: 10px;
}

.castres-som-header-inner {
  max-width: 1120px;
  margin: 0 auto;
  text-align: center;
}

.castres-som-header-cat {
  display: block;
  font-size: .85rem;
  letter-spacing: .12em;
  text-transform: uppercase;
  opacity: .72;
  margin-bottom: 6px;
}

.castres-som-header-title {
  margin: 0;
  font-size: clamp(1.35rem, 2.3vw, 1.9rem);
  font-weight: 600;
  line-height: 1.12;
}

/* ===== Intro ===== */
.castres-som-intro {
  max-width: 1120px;
  margin: 18px auto 22px;
  padding: 0 18px;
  color: #3a4452;
  font-size: clamp(.97rem, .2vw + .93rem, 1.06rem);
  line-height: 1.55;
}

/* ===== Grille ===== */
.castres-som-grille {
  max-width: 1120px;
  margin: 0 auto 28px;
  padding: 0 18px;

  display: grid;
  grid-template-columns: repeat(4, 1fr);

  gap: 16px;
}

/* ===== Vignette ===== */
.castres-som-vignette {
  display: block;
  text-decoration: none;
  color: inherit;
  border-radius: 10px;
  overflow: hidden;
  background: #fff;
  border: 1px solid #ddd7cc;
  box-shadow: 0 4px 12px rgba(0,0,0,.08);
  transition: transform .22s ease, box-shadow .22s ease;
}

.castres-som-vignette:hover,
.castres-som-vignette:focus-visible {
  transform: translateY(-3px);
  box-shadow: 0 8px 20px rgba(0,0,0,.13);
}

/* ===== Image ===== */
.castres-som-figure {
  margin: 0;

  overflow: hidden;

  aspect-ratio: 260 / 155;

  background: #e8e4dc;
}

.castres-som-figure img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform .45s ease;
}

.castres-som-vignette:hover .castres-som-figure img,
.castres-som-vignette:focus-visible .castres-som-figure img {
  transform: scale(1.05);
}

/* ===== Légende ===== */
.castres-som-caption {
  padding: 8px 11px 9px;

  display: flex;
  flex-direction: column;

  gap: 2px;
}

.castres-som-caption strong {
  font-size: clamp(.95rem, .18vw + .9rem, 1.02rem);
  line-height: 1.25;
  color: #1f2933;
}

.castres-som-caption span {
  font-size: .88rem;
  line-height: 1.35;
  color: #5a6472;
}

/* ===== Responsive ===== */
@media (max-width: 900px) {
  .castres-som-grille {
    grid-template-columns: repeat(3, 1fr);
  }
}

@media (max-width: 640px) {
  .castres-som-grille {
    grid-template-columns: repeat(2, 1fr);
    gap: 14px;
  }
}

@media (max-width: 380px) {
  .castres-som-grille {
    grid-template-columns: 1fr;
  }
}

@media (prefers-reduced-motion: reduce) {
  .castres-som-vignette,
  .castres-som-figure img {
    transition: none;
  }
}