/* For 2K resolutions (2048 x 1152, 2048 x 1536) */
@media screen and (min-width: 2048px) {
  body {
    zoom: 1.4;
  }
}

/* ===== Gallery rows: 4x2, auto-scroll on desktop ===== */
:root{
  --gallery-card-w: 260px;   /* картын өргөн — 4 нь яг багтана */
  --gallery-card-h: 170px;   /* картын өндөр */
  --gallery-gap: 1.25rem;
}

.gallery__row{
  overflow: hidden;
  width: 100%;
  margin-bottom: var(--gallery-gap);
}
.gallery__track{
  display: flex;
  gap: var(--gallery-gap);
  will-change: transform;
}

/* карт жижигхэн, тойрог булантай */
.gallery__card{
  position: relative;
  width: var(--gallery-card-w);
  height: var(--gallery-card-h);
  border-radius: 1rem;
  overflow: hidden;
  flex: 0 0 var(--gallery-card-w);
}
.gallery__img{ width:100%; height:100%; object-fit:cover; transition:transform .4s; }
.gallery__card:hover .gallery__img{ transform: scale(1.06); }

.gallery__shadow{
  position:absolute; inset:0;
  background: linear-gradient(180deg, hsla(0,0%,0%,0) 60%, hsla(0,0%,0%,.6) 100%);
}
.gallery__data{ position:absolute; left:.9rem; bottom:.7rem; color:#fff; }
.gallery__title{ font-size: var(--h4-font-size,1rem); }

/* marquee animations */
@keyframes scroll-left { from { transform: translateX(0); } to { transform: translateX(calc(-50% - var(--gallery-gap)/2)); } }
@keyframes scroll-right{ from { transform: translateX(calc(-50% - var(--gallery-gap)/2)); } to { transform: translateX(0); } }

.row--left .gallery__track{ animation: scroll-left var(--speed,30s) linear infinite; }
.row--right .gallery__track{ animation: scroll-right var(--speed,30s) linear infinite; }
.gallery__row:hover .gallery__track{ animation-play-state: paused; }  /* hover хийхэд зогсооно */

/* 4 карт дэлгэцэнд зэрэг харагдахаар container-ийг төвд */
.gallery .container{ max-width: calc(4 * var(--gallery-card-w) + 3 * var(--gallery-gap)); }

/* ---------- Lightbox ---------- */
.lightbox{
  position: fixed; inset:0; background: rgba(0,0,0,.82);
  display: grid; place-items: center; opacity:0; pointer-events:none; transition: opacity .25s;
}
.lightbox.show{ opacity:1; pointer-events:auto; }
.lightbox__img{ max-width: 92vw; max-height: 82vh; border-radius: 1rem; }
.lightbox__close{
  position:absolute; top:1rem; right:1rem; font-size:1.75rem; color:#fff; background:transparent; border:none; cursor:pointer;
}
.lightbox__nav{
  position:absolute; top:50%; transform: translateY(-50%);
  background: hsla(0,0%,100%,.15); border:none; color:#fff; font-size:2rem;
  width:44px; height:44px; border-radius:.75rem; cursor:pointer;
}
.lightbox__nav.prev{ left:1rem; } .lightbox__nav.next{ right:1rem; }

/* ---------- Responsive ---------- */
/* Tablet: 3 багана, marquee арай удаан эсвэл унтраах */
@media (max-width: 1150px){
  :root{ --gallery-card-w: 220px; --gallery-card-h: 150px; }
  .gallery .container{ max-width: calc(3 * var(--gallery-card-w) + 2 * var(--gallery-gap)); }
}

/* Mobile: animation-ыг OFF, цэвэр grid болгож үзүүлэх (motion багасгана) */
@media (max-width: 768px){
  .gallery__row{ overflow: visible; }
  .gallery__track{ animation: none !important; flex-wrap: wrap; justify-content: center; }
  .gallery__card{ width: 45vw; height: 30vw; max-width: 220px; max-height: 150px; }
  .gallery .container{ max-width: 100%; }
}
@media (max-width: 480px){
  .gallery__card{ width: 88vw; height: 58vw; }
}