/* CARIBIAN · módulo: Galería a sangre
   Al pasar a PHP este CSS no cambia. */
.galeria{--sbg:#fff;background:#fff;padding:clamp(80px,14vw,130px) 0 0}
.galeria .head{text-align:center;margin-bottom:36px}
.mosaic{display:grid;grid-template-columns:repeat(2,1fr);grid-auto-rows:44vw;gap:0}
.mosaic figure{overflow:hidden;position:relative}
.mosaic img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--ease)}
.mosaic figure:hover img{transform:scale(1.06)}
.m1{grid-column:1/3}
.m2{grid-row:span 2}
.m3,.m4,.m5,.m6{grid-row:span 1}
@media (min-width:720px){
  .mosaic{grid-template-columns:repeat(4,1fr);grid-auto-rows:min(22vw,340px)}
  .m1{grid-column:1/3;grid-row:1/3}
  .m2{grid-column:3;grid-row:1}
  .m3{grid-column:4;grid-row:1/3}
  .m4{grid-column:3;grid-row:2}
  .m5{grid-column:1/3;grid-row:3}
  .m6{grid-column:3/5;grid-row:3}
}