/* FMMSC Gallery Mosaic v2.0 — scoped to the /galeri feature only. */
.fmmsc-gallery-mosaic-v2 {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  grid-template-rows: repeat(3, minmax(0, 1fr));
  grid-auto-flow: dense;
  width: 100%;
  aspect-ratio: 16 / 9;
  min-width: 0;
  gap: clamp(4px, .7vw, 10px);
  overflow: hidden;
  border-radius: clamp(10px, 1.3vw, 18px);
  isolation: isolate;
}
.fmmsc-gallery-mosaic-v2 > a {
  display: flex;
  min-width: 0;
  min-height: 0;
  position: relative;
  overflow: hidden;
  border-radius: 5px;
  text-decoration: none;
  align-items: stretch;
  justify-content: center;
}
.fmmsc-gallery-mosaic-v2 [data-col="1"] { grid-column-start: 1; }
.fmmsc-gallery-mosaic-v2 [data-col="2"] { grid-column-start: 2; }
.fmmsc-gallery-mosaic-v2 [data-col="3"] { grid-column-start: 3; }
.fmmsc-gallery-mosaic-v2 [data-col="4"] { grid-column-start: 4; }
.fmmsc-gallery-mosaic-v2 [data-row="1"] { grid-row-start: 1; }
.fmmsc-gallery-mosaic-v2 [data-row="2"] { grid-row-start: 2; }
.fmmsc-gallery-mosaic-v2 [data-row="3"] { grid-row-start: 3; }
.fmmsc-gallery-mosaic-v2 [data-width="2"] { grid-column-end: span 2; }
.fmmsc-gallery-mosaic-v2 [data-width="1"] { grid-column-end: span 1; }
.fmmsc-gallery-mosaic-v2 [data-height="2"] { grid-row-end: span 2; }
.fmmsc-gallery-mosaic-v2 [data-height="1"] { grid-row-end: span 1; }
.fmmsc-gallery-mosaic-v2-photo {
  background: #252a2d;
}
.fmmsc-gallery-mosaic-v2-photo img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .3s ease;
}
@media (hover: hover) and (prefers-reduced-motion: no-preference) {
  .fmmsc-gallery-mosaic-v2-photo:hover img { transform: scale(1.045); }
}
.fmmsc-gallery-mosaic-v2-video {
  background: linear-gradient(122deg, #131a20 0%, #25282e 63%, #451f24 100%);
  border: 1px solid rgba(255,255,255,.14);
  color: #fff;
  gap: clamp(10px, 1.4vw, 22px);
  align-items: center !important;
  justify-content: center;
  padding: clamp(10px, 1.5vw, 24px);
}
.fmmsc-gallery-mosaic-v2-play {
  flex: 0 0 auto;
  display: grid;
  place-items: center;
  width: clamp(38px, 5.5vw, 66px);
  height: clamp(28px, 3.8vw, 45px);
  border-radius: 12px;
  background: #e62a30;
  box-shadow: 0 6px 20px rgba(0,0,0,.2);
}
.fmmsc-gallery-mosaic-v2-play::after {
  content: '';
  display: block;
  width: 0;
  height: 0;
  border-top: 8px solid transparent;
  border-bottom: 8px solid transparent;
  border-left: 13px solid #fff;
  margin-left: 3px;
}
.fmmsc-gallery-mosaic-v2-video-copy {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 0;
}
.fmmsc-gallery-mosaic-v2-video-copy strong {
  color: #fff;
  font-size: clamp(12px, 1.4vw, 19px);
  font-weight: 800;
  line-height: 1.15;
}
.fmmsc-gallery-mosaic-v2-video-copy > span {
  color: rgba(255,255,255,.73);
  font-size: clamp(10px, .9vw, 13px);
  line-height: 1.3;
}
.fmmsc-gallery-mosaic-v2-video:hover {
  background: linear-gradient(122deg, #1a232b 0%, #303037 63%, #61272c 100%);
}
.fmmsc-gallery-mosaic-v2 a:focus-visible {
  outline: 3px solid #e82f37;
  outline-offset: -3px;
}
/* Under-populated albums should not leave large blank holes. */
.fmmsc-gallery-mosaic-v2.is-partial {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  grid-template-rows: none;
  grid-auto-rows: minmax(115px, 1fr);
  aspect-ratio: auto;
}
.fmmsc-gallery-mosaic-v2.is-partial > a { min-height: 135px; }
.fmmsc-gallery-mosaic-v2.is-partial .fmmsc-gallery-mosaic-v2-video { grid-column: span 2; }
@media (max-width: 680px) {
  .fmmsc-gallery-mosaic-v2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-template-rows: repeat(4, minmax(0, 1fr));
    aspect-ratio: 4 / 5;
    gap: 5px;
  }
  .fmmsc-gallery-mosaic-v2.has-video {
    grid-template-rows: repeat(5, minmax(0, 1fr));
    aspect-ratio: 4 / 6;
  }
  .fmmsc-gallery-mosaic-v2:not(.is-partial) > a {
    grid-column: auto !important;
    grid-row: auto !important;
  }
  .fmmsc-gallery-mosaic-v2:not(.is-partial) > .fmmsc-gallery-mosaic-v2-photo[data-mobile-wide="1"] {
    grid-column: span 2 !important;
  }
  .fmmsc-gallery-mosaic-v2.has-video:not(.is-partial) > .fmmsc-gallery-mosaic-v2-video {
    grid-column: span 2 !important;
  }
  .fmmsc-gallery-mosaic-v2.is-partial { aspect-ratio: auto; grid-template-rows: none; }
  .fmmsc-gallery-mosaic-v2.is-partial > a { min-height: 110px; }
  .fmmsc-gallery-mosaic-v2-video { padding: 8px; gap: 12px; }
  .fmmsc-gallery-mosaic-v2-play { width: 44px; height: 33px; border-radius: 9px; }
  .fmmsc-gallery-mosaic-v2-video-copy strong { font-size: 14px; }
  .fmmsc-gallery-mosaic-v2-video-copy > span { font-size: 11px; }
}
@media (prefers-reduced-motion: reduce) {
  .fmmsc-gallery-mosaic-v2-photo img { transition: none; }
}
