/* =========================================================
   Galeria zdjęć — nadbudowa nad style.css i produkty.css
   ========================================================= */

.pbar__nav{
  margin-left:auto; display:flex; gap:clamp(14px,2.4vw,28px);
}
.pbar__nav a{
  font-size:.86rem; color:var(--txt-light); text-decoration:none;
  border-bottom:1px solid rgba(255,204,0,.4);
  transition:color .3s, border-color .3s;
}
.pbar__nav a:hover{ color:var(--gold); border-color:var(--gold); }

.pchip em{
  font-style:normal; margin-left:.45em; opacity:.6;
  font-size:.9em; font-variant-numeric:tabular-nums;
}

/* ---------- siatka ---------- */
.ggrid{
  columns:4 240px;
  column-gap:clamp(10px,1.4vw,16px);
  padding-block:clamp(28px,5vh,52px);
}
.gtile{
  display:block; width:100%; padding:0; margin:0 0 clamp(10px,1.4vw,16px);
  border:1px solid var(--linen-3); border-radius:6px;
  background:var(--linen-2); overflow:hidden; cursor:zoom-in;
  break-inside:avoid;
  transition:border-color .3s, box-shadow .3s, transform .3s;
}
.gtile[hidden]{ display:none; }
.gtile img{ display:block; width:100%; height:auto; }
.gtile:hover{
  border-color:var(--gold);
  box-shadow:0 20px 44px -28px rgba(30,24,12,.5);
  transform:translateY(-2px);
}
.gtile:focus-visible{ outline:2px solid var(--gold); outline-offset:3px; }

/* ---------- lightbox ---------- */
.glight{
  position:fixed; inset:0; z-index:120;
  display:grid; place-items:center;
  background:rgba(10,8,5,.94);
  backdrop-filter:blur(8px);
  padding:clamp(44px,7vh,80px) clamp(52px,8vw,110px);
}
.glight[hidden]{ display:none; }
.glight__img{
  max-width:100%; max-height:100%;
  border-radius:4px;
  box-shadow:0 40px 90px -40px rgba(0,0,0,.9);
}
.glight__close,
.glight__nav{
  position:absolute;
  display:grid; place-items:center;
  background:rgba(246,241,230,.08);
  border:1px solid rgba(246,241,230,.28);
  color:var(--linen);
  cursor:pointer;
  transition:background-color .25s, border-color .25s, color .25s;
}
.glight__close{
  top:clamp(14px,2.4vh,26px); right:clamp(14px,2.4vw,26px);
  width:44px; height:44px; border-radius:50%;
  font-size:1.5rem; line-height:1;
}
.glight__nav{
  top:50%; transform:translateY(-50%);
  width:46px; height:64px; border-radius:6px;
  font-size:1.9rem; line-height:1;
}
.glight__nav--prev{ left:clamp(8px,1.6vw,22px); }
.glight__nav--next{ right:clamp(8px,1.6vw,22px); }
.glight__close:hover,
.glight__nav:hover{ background:var(--gold); border-color:var(--gold); color:#141005; }

.glight__count{
  position:absolute; bottom:clamp(14px,2.4vh,26px); left:50%;
  transform:translateX(-50%); margin:0;
  font-size:.78rem; letter-spacing:.18em; color:var(--txt-light-2);
  font-variant-numeric:tabular-nums;
}

@media (max-width:760px){
  .ggrid{ columns:2 150px; }
  .glight{ padding:64px 10px; }
  .glight__nav{ width:40px; height:54px; font-size:1.6rem; }
}
@media (prefers-reduced-motion:reduce){
  .gtile{ transition:none; }
  .gtile:hover{ transform:none; }
}
