/* --------------------------------------------------------------------------
   Exposiciones
   -------------------------------------------------------------------------- */
.cmr-carrusel { position: relative; display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: .5rem; }

.cmr-carrusel-flecha {
  display: grid;
  place-items: center;
  width: 2.4rem;
  height: 2.4rem;
  color: var(--verde);
  font-size: 1.2rem;
  transition: transform var(--transicion), opacity var(--transicion);
}

.cmr-carrusel-flecha:hover { transform: scale(1.15); }

/* El carril es scroll nativo con snap: el arrastre táctil y la inercia ya
   vienen dados, y las flechas solo empujan. */
.cmr-carrusel-carril {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: minmax(min(17rem, 78vw), 1fr);
  gap: 1.5rem;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scrollbar-width: none;
  padding-bottom: .5rem;
}

.cmr-carrusel-carril::-webkit-scrollbar { display: none; }

.cmr-carrusel-carril > * { scroll-snap-align: start; }

.cmr-rejilla-expos {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(17rem, 100%), 1fr));
  gap: 2.5rem 1.5rem;
}

.cmr-expo-lienzo {
  position: relative;
  display: block;
  aspect-ratio: 3 / 4;
  overflow: hidden;
  background: var(--papel);
}

.cmr-expo-lienzo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 500ms var(--transicion);
}

.cmr-expo-lienzo:hover img { transform: scale(1.04); }

/* La descripción vive bajo el velo y sube al pasar el cursor — o al enfocar
   con teclado, que es lo que arregla el `focus-within`. */
.cmr-expo-velo {
  position: absolute;
  inset: 0;
  display: grid;
  align-content: center;
  justify-items: center;
  gap: 1.2rem;
  padding: 1.5rem;
  text-align: center;
  color: var(--blanco);
  background: rgba(8, 68, 56, .88);
  opacity: 0;
  transition: opacity var(--transicion);
}

.cmr-expo-lienzo:hover .cmr-expo-velo,
.cmr-expo-lienzo:focus-visible .cmr-expo-velo,
.cmr-expo:focus-within .cmr-expo-velo { opacity: 1; }

.cmr-expo-velo p { font-size: .88rem; line-height: 1.55; }

.cmr-expo-cta {
  font-weight: 700;
  font-size: .72rem;
  letter-spacing: .14em;
  padding: .55rem 1.2rem;
  border: 1px solid var(--crema);
}

.cmr-expo-pie { display: grid; gap: .45rem; padding-top: 1.1rem; text-align: center; }

.cmr-expo-pie h4 { font-weight: 800; font-size: .7rem; letter-spacing: .12em; color: var(--gris); }

.cmr-expo-pie h3 { font-family: var(--serif); font-weight: 400; font-size: 1.3rem; color: var(--verde); }

.cmr-expo-pie h5 { font-weight: 800; font-size: .72rem; letter-spacing: .12em; color: var(--verde); }