/*
   pikaplak ana sayfa hero'su: kapak mozaiği (sections/pk-gallery.liquid), iPhone Fotoğraflar ızgarası gibi.
   Masaüstü 8×3 (iki 2×2 büyük kutu), tablet 6×3, mobil 4×4 (tek büyük kutu). Yeni kapak üstte yeni bir katman
   olarak hafif büyükten yerine oturarak belirir; eski katman betik tarafından kaldırılır.
*/
.nk .pkg{background:#fff;padding:2px 0}
.nk .pkg__grid{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));grid-auto-flow:dense;gap:2px}
.nk .pkg__tile{position:relative;display:block;aspect-ratio:1;overflow:hidden;background:#eee8df;
  animation:pkg-in .8s ease both;animation-delay:calc(var(--i,0) * 45ms)}
.nk .pkg__tile--big{grid-column:2/span 2;grid-row:1/span 2}
.nk .pkg__tile--big + .pkg__tile--big{grid-column:6/span 2;grid-row:2/span 2}
@keyframes pkg-in{from{opacity:0}}

.nk .pkg__layer{position:absolute;inset:0;display:block;overflow:hidden;transition:opacity .9s ease,transform 1.1s cubic-bezier(.2,.7,.2,1)}
.nk .pkg__layer.is-entering{opacity:0;transform:scale(1.08)}
.nk .pkg__layer img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .6s cubic-bezier(.2,.7,.2,1)}
.nk .pkg__layer img.is-mock{transform:scale(1.73)}
.nk .pkg__tile:hover .pkg__layer img{transform:scale(1.05)}
.nk .pkg__tile:hover .pkg__layer img.is-mock{transform:scale(1.82)}
.nk .pkg__tile:focus-visible{outline:3px solid var(--c-primary,#7a4a26);outline-offset:-3px}

/* büyük kutular: yavaş yakınlaşma (Fotoğraflar'daki "Anılar" gibi) */
.nk .pkg__tile--big .pkg__layer{animation:pkg-kb 16s ease-in-out infinite alternate}
.nk .pkg__tile--big .pkg__layer.is-entering{animation:none}
@keyframes pkg-kb{from{scale:1}to{scale:1.07}}

@media (max-width:1000px){
  .nk .pkg__grid{grid-template-columns:repeat(6,minmax(0,1fr))}
  .nk .pkg__tile--big + .pkg__tile--big{grid-column:5/span 2}
  .nk .pkg__tile:nth-child(n+13){display:none}
}
@media (max-width:600px){
  .nk .pkg__grid{grid-template-columns:repeat(4,minmax(0,1fr))}
  .nk .pkg__tile--big{grid-column:1/span 2}
  .nk .pkg__tile--big + .pkg__tile--big{grid-column:auto;grid-row:auto}
  .nk .pkg__tile:nth-child(n+13){display:block}
  .nk .pkg__tile:nth-child(n+14){display:none}
}
@media (prefers-reduced-motion:reduce){
  .nk .pkg__tile,.nk .pkg__tile--big .pkg__layer{animation:none}
}