/* Mio Decor 8.64.17 — four-up desktop portfolio with editorial captions. */
#realizacje .container { position:relative; min-width:0; }
#realizacje.section { padding-bottom:26px; }
#realizacje .section-head { position:static; display:block; min-height:0; margin:0 0 22px; }
#realizacje .section-head .section-title { margin:0; text-align:center; color:#0e1116; }
#realizacje .section-title-inline .title-main { color:#0e1116; }
#realizacje .section-title-inline .title-accent { color:#5691b8; }
#realizacje .mio-gallery-viewport { position:relative; min-width:0; width:100%; }
#realizacje .gallery-track {
  display:flex; gap:14px; overflow-x:auto; overflow-y:hidden;
  width:100%; min-width:0; max-width:100%; margin:0; padding:0;
  scroll-snap-type:x mandatory; overscroll-behavior-x:contain;
  scrollbar-width:none; -webkit-overflow-scrolling:touch;
}
#realizacje .gallery-track::-webkit-scrollbar { display:none; }
#realizacje .gallery-track figure {
  flex:0 0 calc((100% - 42px)/4); min-width:0; width:calc((100% - 42px)/4);
  aspect-ratio:4/3; height:auto; margin:0; overflow:hidden; position:relative;
  border-radius:12px; background:#eef1f3; scroll-snap-align:start;
}
#realizacje .gallery-track img { display:block; width:100%; height:100%; object-fit:cover; }
#realizacje .gallery-item__caption {
  position:absolute; z-index:1; inset:auto 0 0;
  min-height:66px; display:flex; align-items:flex-end;
  padding:28px 15px 13px; color:#fff;
  font:500 13px/1.35 var(--mio-font-body);
  text-shadow:0 1px 4px rgba(0,0,0,.3);
  overflow-wrap:anywhere; background:linear-gradient(transparent,rgba(3,16,27,.75));
}
#realizacje .slider-arrows {
  position:absolute; inset-inline:-16px; top:50%; transform:translateY(-50%);
  display:flex; align-items:center; justify-content:space-between;
  pointer-events:none; z-index:3;
}
#realizacje .slider-arrows button {
  pointer-events:auto; display:grid; place-items:center; width:70px; height:70px;
  min-width:70px; padding:0; margin:0; border:0; border-radius:50%;
  background:transparent; box-shadow:none; cursor:pointer;
}
#realizacje .slider-arrows button img { display:block; width:70px; height:70px; object-fit:contain; }
#realizacje .slider-arrows button:disabled { cursor:default; opacity:1; }
#realizacje .slider-arrows button:focus-visible { outline:2px solid #174d75; outline-offset:-12px; }
@media (min-width:761px) and (max-width:1100px) {
  #realizacje .gallery-track figure {
    flex-basis:calc((100% - 14px)/2);
    width:calc((100% - 14px)/2);
  }
}
@media (max-width:760px) {
  #realizacje.section { padding-top:16px; padding-bottom:25px; }
  #realizacje .container { width:100%; max-width:none; margin:0; padding:0; }
  #realizacje .section-head { width:calc(100% - 32px); margin:0 auto 16px; padding:0; }
  #realizacje .section-head .section-title { font-size:20px; line-height:1.2; letter-spacing:-.55px; }
  #realizacje .section-title-inline .title-accent { color:#0e1116; }
  #realizacje .mio-gallery-viewport { overflow:hidden; }
  #realizacje .gallery-track { gap:6px; padding:0 0 0 clamp(14px,5.9vw,23px); scroll-padding-inline-start:clamp(14px,5.9vw,23px); }
  #realizacje .gallery-track figure {
    flex:0 0 min(66.6667vw,300px); width:min(66.6667vw,300px);
    height:auto; aspect-ratio:4/3; border-radius:7px;
  }
  #realizacje .gallery-track:not(.gallery-track--custom) figure:nth-child(5) { order:-1; }
  #realizacje .slider-arrows { left:clamp(21px,6.92vw,27px); right:-6px; top:50%; }
  #realizacje .gallery-item__caption { min-height:54px; padding:23px 11px 10px; font-size:11px; }
  #realizacje .slider-arrows button { width:70px; min-width:70px; height:70px; }
  #realizacje .slider-arrows button img { width:70px; height:70px; }
}
@media (prefers-reduced-motion:reduce) {
  #realizacje .gallery-track { scroll-behavior:auto; }
}

/* Mio Decor 8.64.18 — clickable gallery and accessible overlay. */
#realizacje .gallery-item__open {
  display:block; position:absolute; inset:0; width:100%;height:100%;margin:0;padding:0;
  border:0;background:transparent;cursor:zoom-in; text-align:left;
}
#realizacje .gallery-item__open img { display:block;width:100%;height:100%;object-fit:cover;transition:transform .35s ease; }
#realizacje .gallery-item__open:focus-visible {outline:3px solid #fff;outline-offset:-6px;z-index:3;}
#realizacje .gallery-item__zoom {display:grid;place-items:center;position:absolute;top:12px;right:12px;width:31px;height:31px;border-radius:50%;background:rgba(12,32,46,.68);color:#fff;opacity:0;transition:opacity .2s ease;pointer-events:none;}
#realizacje .gallery-item__zoom svg {width:16px;height:16px;stroke:currentColor;}
#realizacje .gallery-item__caption {pointer-events:none;}
@media (hover:hover) and (prefers-reduced-motion:no-preference) {
  #realizacje .gallery-item__open:hover img {transform:scale(1.035);}
  #realizacje .gallery-item__open:hover .gallery-item__zoom {opacity:1;}
}
#realizacje .gallery-item__open:focus-visible .gallery-item__zoom {opacity:1;}
.mio-lightbox[hidden] {display:none;}
body.mio-lightbox-open {overflow:hidden;}
.mio-lightbox {position:fixed;inset:0;z-index:999999;display:grid;place-items:center;padding:24px;isolation:isolate;}
.mio-lightbox__backdrop {position:absolute;inset:0;background:rgba(7,17,26,.93);cursor:zoom-out;}
.mio-lightbox__dialog {position:relative;display:flex;flex-direction:column;width:min(1300px,100%);max-height:calc(100dvh - 48px);min-width:0;color:#fff;outline:none;}
.mio-lightbox__top {display:flex;justify-content:space-between;align-items:center;gap:12px;padding-bottom:15px;font:600 15px/1.4 var(--mio-font-body);}
.mio-lightbox__top-right {display:flex;align-items:center;gap:17px;}
.mio-lightbox__counter {font:500 13px/1.4 var(--mio-font-body);color:#b7cbdb;}
.mio-lightbox__close {display:grid;place-items:center;width:42px;height:42px;border:1px solid rgba(255,255,255,.28);border-radius:50%;padding:0;background:rgba(255,255,255,.13);color:#fff;cursor:pointer;font:400 28px/1 var(--mio-font-body);}
.mio-lightbox__media {position:relative;display:flex;justify-content:center;align-items:center;min-height:0;flex:1;}
.mio-lightbox__image {display:block;max-width:100%;max-height:min(76dvh,840px);width:auto;height:auto;object-fit:contain;border-radius:8px;box-shadow:0 15px 60px rgba(0,0,0,.35);}
.mio-lightbox__prev,.mio-lightbox__next {position:absolute;z-index:2;top:50%;transform:translateY(-50%);display:grid;place-items:center;width:46px;height:46px;border:1px solid rgba(255,255,255,.25);border-radius:50%;background:rgba(6,27,42,.77);color:#fff;cursor:pointer;font:400 35px/1 var(--mio-font-body);}
.mio-lightbox__prev {left:13px;}.mio-lightbox__next {right:13px;}
.mio-lightbox__caption {margin:16px 0 0;text-align:center;font:500 15px/1.4 var(--mio-font-body);overflow-wrap:anywhere;}
.mio-lightbox__hint {padding-top:7px;text-align:center;color:#a9bfd0;font:400 11px/1.4 var(--mio-font-body);}
.mio-lightbox button:focus-visible {outline:3px solid #99d6ff;outline-offset:3px;}
.mio-lightbox button:hover {background:rgba(52,122,164,.85);}
@media (max-width:760px) {
  .mio-lightbox {padding:13px;}
  .mio-lightbox__dialog {max-height:calc(100dvh - 26px);}
  .mio-lightbox__top {font-size:13px;padding-bottom:12px;}
  .mio-lightbox__image {max-height:72dvh;border-radius:5px;}
  .mio-lightbox__prev,.mio-lightbox__next {width:39px;height:39px;font-size:30px;}
  .mio-lightbox__prev {left:2px;}.mio-lightbox__next {right:2px;}
  .mio-lightbox__caption {font-size:13px;}
  .mio-lightbox__hint {font-size:10px;}
  #realizacje .gallery-item__zoom {opacity:1;width:27px;height:27px;top:8px;right:8px;}
}
@media (prefers-reduced-motion:reduce) {
  #realizacje .gallery-item__open img,#realizacje .gallery-item__zoom {transition:none;}
}
