/* Mrągowo Bus 9.8.3 — Gallery Viewer SMART NAV
   Whole-photo fit with dynamic previous/next controls attached to the actual photo edges. */
.gallery-view-trigger{
  appearance:none;-webkit-appearance:none;border:0;padding:0;margin:0;width:100%;display:block;
  color:inherit;text-align:inherit;font:inherit;cursor:zoom-in;background:#06121b;
}
.gallery-view-trigger:focus-visible{outline:3px solid rgba(70,198,255,.72);outline-offset:-3px}
.gallery-view-hint{
  position:absolute;left:50%;bottom:12px;z-index:3;display:flex;align-items:center;gap:7px;
  padding:8px 11px;border-radius:999px;border:1px solid rgba(255,255,255,.14);
  background:rgba(2,15,24,.78);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  color:#eaf9ff;font-size:10px;font-weight:900;letter-spacing:.02em;
  opacity:0;transform:translate(-50%,10px) scale(.96);pointer-events:none;
  transition:opacity .22s ease,transform .32s cubic-bezier(.2,.8,.2,1)
}
.gallery-view-trigger:hover .gallery-view-hint,.gallery-view-trigger:focus-visible .gallery-view-hint{opacity:1;transform:translate(-50%,0) scale(1)}
.gallery-view-trigger:after{content:"";position:absolute;inset:0;z-index:2;pointer-events:none;background:linear-gradient(180deg,transparent 56%,rgba(1,12,20,.58));opacity:0;transition:opacity .24s ease}
.gallery-view-trigger:hover:after,.gallery-view-trigger:focus-visible:after{opacity:1}

.mb-gallery-viewer{
  width:100vw;max-width:none;height:100dvh;max-height:none;margin:0;padding:0;border:0;background:transparent;color:#eaf8ff;
  overflow:hidden;
}
.mb-gallery-viewer::backdrop{background:rgba(0,7,12,.76);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.mb-gallery-viewer[open]{display:block}
.mbgv-shell{position:relative;width:100%;height:100%;overflow:hidden;background:#020a10;isolation:isolate}
.mbgv-ambient{position:absolute;inset:-7%;z-index:-2;overflow:hidden;background:#020a10}
.mbgv-ambient img{width:100%;height:100%;object-fit:cover;filter:blur(52px) saturate(1.15) brightness(.42);transform:scale(1.12);opacity:.76;transition:opacity .45s ease}
.mbgv-shell:after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(circle at 50% 46%,rgba(7,28,40,.08),rgba(0,7,12,.72) 68%,rgba(0,4,8,.92))}

.mbgv-topbar{
  position:absolute;left:0;right:0;top:0;z-index:20;display:flex;align-items:center;justify-content:space-between;gap:18px;
  min-height:74px;padding:14px 18px 12px;background:linear-gradient(180deg,rgba(0,8,14,.93),rgba(0,8,14,.54),transparent);
  transition:opacity .28s ease,transform .32s ease
}
.mbgv-title{min-width:0;display:flex;align-items:center;gap:12px}.mbgv-title-mark{width:40px;height:40px;border-radius:13px;display:grid;place-items:center;background:linear-gradient(145deg,rgba(32,147,243,.22),rgba(70,235,175,.11));border:1px solid rgba(94,204,255,.16);font-size:18px}
.mbgv-title-copy{min-width:0}.mbgv-title-copy b{display:block;max-width:min(42vw,620px);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:14px}.mbgv-title-copy small{display:block;margin-top:3px;color:#79a0b3;font-size:10px}.mbgv-counter{color:#63dcb0;font-weight:900}
.mbgv-tools{display:flex;align-items:center;justify-content:flex-end;gap:7px;flex-wrap:wrap}.mbgv-btn{
  min-height:38px;border:1px solid rgba(98,198,240,.16);border-radius:12px;padding:0 11px;background:rgba(4,21,31,.64);color:#a9c9d8;font:800 10px/1 system-ui,sans-serif;cursor:pointer;backdrop-filter:blur(13px);-webkit-backdrop-filter:blur(13px);transition:background .18s ease,border-color .18s ease,color .18s ease,transform .18s ease
}.mbgv-btn:hover,.mbgv-btn:focus-visible,.mbgv-btn.active{background:rgba(25,122,191,.25);border-color:rgba(86,199,250,.45);color:#fff;transform:translateY(-1px);outline:0}.mbgv-btn.icon{width:40px;padding:0;font-size:16px}.mbgv-btn.close{font-size:22px;color:#eaf8ff}.mbgv-btn.slideshow.active{border-color:rgba(96,235,180,.52);background:rgba(23,139,96,.24);color:#8ff1c6}

.mbgv-stage-row{position:absolute;inset:0;z-index:5;display:grid;grid-template-columns:minmax(0,1fr);align-items:center;min-width:0;min-height:0;box-sizing:border-box;padding:76px 18px 112px;transition:padding .35s cubic-bezier(.2,.8,.2,1)}
.mbgv-stage{
  grid-column:1/-1;grid-row:1;
  position:relative;min-width:0;min-height:0;width:100%;height:100%;display:grid;place-items:center;overflow:hidden;touch-action:none;user-select:none;-webkit-user-select:none;
}
.mbgv-canvas{position:relative;min-width:0;min-height:0;width:100%;height:100%;display:grid;place-items:center;overflow:hidden;cursor:zoom-in;overscroll-behavior:none}
.mbgv-canvas.is-zoomed{cursor:grab}.mbgv-canvas.is-dragging{cursor:grabbing}
.mbgv-image{display:block;max-width:none;max-height:none;width:auto;height:auto;object-fit:contain;transform-origin:center center;will-change:transform,opacity,filter;box-shadow:0 28px 100px rgba(0,0,0,.38);border-radius:4px;user-select:none;-webkit-user-drag:none}
.mbgv-ghost{position:absolute;z-index:3;pointer-events:none}
.mbgv-nav{
  position:absolute;z-index:15;width:58px;height:58px;border-radius:999px;border:1px solid rgba(117,221,255,.38);
  background:rgba(2,18,29,.82);color:#f4fbff;font-size:27px;font-weight:900;line-height:1;cursor:pointer;
  display:grid;place-items:center;backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);
  box-shadow:0 12px 38px rgba(0,0,0,.34),0 0 0 1px rgba(255,255,255,.025) inset;
  opacity:.94;transition:opacity .18s ease,transform .18s ease,background .18s ease,border-color .18s ease,left .22s cubic-bezier(.2,.8,.2,1),top .22s cubic-bezier(.2,.8,.2,1)
}.mbgv-nav span{display:block;transform:translateY(-1px)}
.mbgv-nav:hover,.mbgv-nav:focus-visible{opacity:1;transform:scale(1.09);background:rgba(18,112,169,.88);border-color:rgba(123,226,255,.72);outline:0}
.mbgv-nav[hidden]{display:none!important}

.mbgv-zoomdock{
  position:absolute;left:50%;bottom:15px;z-index:12;display:flex;align-items:center;gap:5px;padding:5px;border:1px solid rgba(98,198,240,.14);border-radius:14px;background:rgba(2,17,27,.72);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);box-shadow:0 10px 35px rgba(0,0,0,.22);transition:opacity .25s ease,transform .3s ease;transform:translateX(-50%)
}.mbgv-zoomdock button{width:34px;height:34px;border:0;border-radius:10px;background:transparent;color:#c8e5f1;font-size:17px;cursor:pointer}.mbgv-zoomdock button:hover{background:rgba(71,184,232,.13);color:#fff}.mbgv-zoom-value{min-width:54px;text-align:center;font-size:10px;font-weight:900;color:#83d8fa}

.mbgv-info{
  position:absolute;z-index:24;top:76px;right:18px;bottom:112px;width:min(390px,34vw);padding:20px;overflow:auto;border:1px solid rgba(91,197,239,.17);border-radius:22px;background:rgba(3,18,28,.88);backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);box-shadow:0 24px 80px rgba(0,0,0,.34);
  opacity:0;transform:translateX(24px) scale(.98);pointer-events:none;transition:opacity .26s ease,transform .34s cubic-bezier(.2,.8,.2,1)
}.mbgv-shell.show-info .mbgv-info{opacity:1;transform:none;pointer-events:auto}.mbgv-info .section-kicker{margin:0 0 8px;color:#58d8a7;font-size:9px;font-weight:900;letter-spacing:.13em}.mbgv-info h2{margin:0 0 10px;font-size:24px;line-height:1.15}.mbgv-info-description{color:#9bb4c0;line-height:1.7;font-size:12px;white-space:pre-line}.mbgv-meta{display:grid;gap:8px;margin-top:18px;padding-top:16px;border-top:1px solid rgba(87,191,236,.12)}.mbgv-meta-row{display:flex;justify-content:space-between;gap:14px;font-size:10px}.mbgv-meta-row span{color:#708f9f}.mbgv-meta-row b{text-align:right;color:#d7eef7;font-weight:800}

.mbgv-filmstrip{
  position:absolute;left:0;right:0;bottom:0;z-index:18;height:104px;padding:10px 18px 13px;display:flex;align-items:center;gap:9px;overflow-x:auto;overflow-y:hidden;scrollbar-width:thin;scroll-behavior:smooth;background:linear-gradient(0deg,rgba(0,8,14,.94),rgba(0,8,14,.66),transparent);transition:opacity .28s ease,transform .34s ease
}.mbgv-thumb{position:relative;flex:0 0 108px;height:72px;padding:0;border:2px solid transparent;border-radius:12px;overflow:hidden;background:#071824;cursor:pointer;opacity:.58;transform:scale(.96);transition:opacity .22s ease,transform .25s cubic-bezier(.2,.8,.2,1),border-color .22s ease,box-shadow .22s ease}.mbgv-thumb:hover{opacity:.9;transform:scale(1)}.mbgv-thumb.active{opacity:1;transform:scale(1);border-color:#4fcaff;box-shadow:0 0 0 3px rgba(79,202,255,.1)}.mbgv-thumb img{width:100%;height:100%;object-fit:contain;display:block;background:#04111a}.mbgv-thumb span{position:absolute;right:5px;bottom:4px;padding:2px 5px;border-radius:5px;background:rgba(0,8,14,.7);color:#fff;font-size:8px;font-weight:900}

.mbgv-shell.is-focus .mbgv-topbar{opacity:0;transform:translateY(-18px);pointer-events:none}.mbgv-shell.is-focus .mbgv-filmstrip{opacity:0;transform:translateY(28px);pointer-events:none}.mbgv-shell.is-focus .mbgv-zoomdock{opacity:0;transform:translate(-50%,16px);pointer-events:none}.mbgv-shell.is-focus .mbgv-stage-row{padding:18px}.mbgv-shell.is-focus .mbgv-nav{opacity:.18}.mbgv-shell.is-focus .mbgv-stage-row:hover .mbgv-nav,.mbgv-shell.is-focus .mbgv-nav:hover{opacity:.92}.mbgv-shell.is-focus.show-info .mbgv-info{opacity:0;pointer-events:none}
.mbgv-shell.is-slideshow .mbgv-image{animation:mbgvKenBurns 5.3s linear both}.mbgv-shell.is-slideshow .mbgv-zoomdock{opacity:.4}
@keyframes mbgvKenBurns{from{transform:translate3d(0,0,0) scale(1)}to{transform:translate3d(0,-.8%,0) scale(1.055)}}

.mbgv-shortcuts{position:absolute;left:18px;bottom:112px;z-index:16;color:#668797;font-size:9px;opacity:.68;pointer-events:none;transition:opacity .25s}.mbgv-shell.is-focus .mbgv-shortcuts{opacity:0}

/* shared-element-like opening clone */
.mbgv-fly-clone{position:fixed;z-index:2147483647;pointer-events:none;margin:0;object-fit:cover;box-shadow:0 22px 80px rgba(0,0,0,.4);will-change:left,top,width,height,border-radius,opacity,transform}

@media(max-width:980px){
  .mbgv-stage-row{grid-template-columns:minmax(0,1fr);padding:72px 10px 112px}.mbgv-nav{width:48px;height:48px;font-size:22px}.mbgv-btn span.label{display:none}.mbgv-info{right:10px;left:10px;top:auto;bottom:112px;width:auto;max-height:45vh}.mbgv-title-copy b{max-width:38vw}.mbgv-shortcuts{display:none}
}
@media(max-width:700px){
  .mbgv-topbar{min-height:64px;padding:10px}.mbgv-title-mark{display:none}.mbgv-title-copy small{display:none}.mbgv-stage-row{grid-template-columns:minmax(0,1fr);padding:66px 0 92px}.mbgv-nav{width:44px;height:44px;border-radius:999px}.mbgv-filmstrip{height:86px;padding:8px 10px}.mbgv-thumb{flex-basis:82px;height:56px}.mbgv-zoomdock{bottom:8px}.mbgv-btn{min-height:36px;padding:0 9px}.mbgv-info{bottom:92px}.mbgv-tools .desktop-only{display:none}
}
@media(prefers-reduced-motion:reduce){
  .gallery-view-hint,.gallery-view-trigger:after,.mbgv-topbar,.mbgv-filmstrip,.mbgv-info,.mbgv-btn,.mbgv-nav,.mbgv-thumb,.mbgv-zoomdock{transition:none!important}.mbgv-shell.is-slideshow .mbgv-image{animation:none!important}.mbgv-fly-clone{display:none!important}
}


/* APEX 9.8.2 — strict whole-photo fit. The visible photo area is explicitly bounded
   between the top toolbar and filmstrip, so the initial view can never extend below the screen. */
.mbgv-stage-row{
  top:74px!important;right:0!important;bottom:104px!important;left:0!important;
  inset:auto 0 104px 0!important;height:auto!important;min-height:0!important;
  padding:8px 0 8px!important;box-sizing:border-box!important;overflow:hidden!important;
}
.mbgv-stage,.mbgv-canvas{height:100%!important;min-height:0!important;overflow:hidden!important}
.mbgv-image{flex:none!important;max-width:none!important;max-height:none!important}
.mbgv-shell.is-focus .mbgv-stage-row{top:10px!important;bottom:10px!important;inset:10px 0 10px 0!important;padding:0!important}
@media(max-width:980px){.mbgv-stage-row{top:72px!important;bottom:104px!important;inset:72px 0 104px 0!important}}
@media(max-width:700px){.mbgv-stage-row{top:64px!important;bottom:86px!important;inset:64px 0 86px 0!important;padding:5px 0!important}.mbgv-shell.is-focus .mbgv-stage-row{top:6px!important;bottom:6px!important;inset:6px 0 6px 0!important}}

/* ==============================================================
   APEX 9.8.4 — FINAL VIEWPORT FIT
   One source of truth for layout: CSS grid owns the available height.
   The photo itself uses native browser contain; JS never assigns a
   pixel fit size. This guarantees the whole photo is visible at FIT.
   ============================================================== */
html.gallery-viewer-open,
html.gallery-viewer-open body,
body.modal-open{overflow:hidden!important;overscroll-behavior:none!important}

.mb-gallery-viewer{
  position:fixed!important;
  inset:0!important;
  width:100vw!important;
  height:100dvh!important;
  max-width:none!important;
  max-height:none!important;
  margin:0!important;
  padding:0!important;
  overflow:hidden!important;
  box-sizing:border-box!important;
}

.mbgv-shell{
  position:relative!important;
  display:grid!important;
  grid-template-columns:minmax(0,1fr)!important;
  grid-template-rows:auto minmax(0,1fr) 96px!important;
  width:100%!important;
  height:100%!important;
  min-width:0!important;
  min-height:0!important;
  overflow:hidden!important;
}

/* Structural rows are no longer absolutely positioned. Their real
   rendered sizes automatically define the exact space left for photo. */
.mbgv-topbar{
  position:relative!important;
  inset:auto!important;
  grid-column:1!important;
  grid-row:1!important;
  width:100%!important;
  min-height:64px!important;
  box-sizing:border-box!important;
}

.mbgv-stage-row{
  position:relative!important;
  inset:auto!important;
  top:auto!important;right:auto!important;bottom:auto!important;left:auto!important;
  grid-column:1!important;
  grid-row:2!important;
  width:100%!important;
  height:100%!important;
  min-width:0!important;
  min-height:0!important;
  padding:8px 72px 8px!important;
  box-sizing:border-box!important;
  overflow:hidden!important;
  display:block!important;
}

.mbgv-stage{
  position:relative!important;
  width:100%!important;
  height:100%!important;
  min-width:0!important;
  min-height:0!important;
  overflow:hidden!important;
  display:block!important;
}

.mbgv-canvas{
  position:relative!important;
  width:100%!important;
  height:100%!important;
  min-width:0!important;
  min-height:0!important;
  overflow:hidden!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
}

/* THE RULE THAT MATTERS: at FIT the browser must keep both image
   dimensions inside the real canvas at the same time. */
.mbgv-image{
  display:block!important;
  width:auto!important;
  height:auto!important;
  max-width:100%!important;
  max-height:100%!important;
  object-fit:contain!important;
  object-position:center center!important;
  flex:0 1 auto!important;
  margin:auto!important;
}

.mbgv-filmstrip{
  position:relative!important;
  inset:auto!important;
  left:auto!important;right:auto!important;bottom:auto!important;top:auto!important;
  grid-column:1!important;
  grid-row:3!important;
  width:100%!important;
  height:96px!important;
  min-height:0!important;
  box-sizing:border-box!important;
  padding:9px 18px 11px!important;
}

.mbgv-thumb{height:68px!important}
.mbgv-thumb img{object-fit:contain!important;object-position:center center!important}
.mbgv-zoomdock{bottom:10px!important}

/* Slideshow must never crop the actual photo. The old Ken Burns scale
   was visually attractive but violated the whole-photo guarantee. */
.mbgv-shell.is-slideshow .mbgv-image{animation:none!important}

/* Focus uses the whole viewport, but still keeps the photo contained. */
.mbgv-shell.is-focus{
  grid-template-rows:0 minmax(0,1fr) 0!important;
}
.mbgv-shell.is-focus .mbgv-topbar,
.mbgv-shell.is-focus .mbgv-filmstrip{display:none!important}
.mbgv-shell.is-focus .mbgv-stage-row{
  grid-row:2!important;
  inset:auto!important;
  top:auto!important;bottom:auto!important;
  padding:8px 72px!important;
}

/* The gallery cards also show the COMPLETE source photo. */
.gallery-card-photo img{
  object-fit:contain!important;
  object-position:center center!important;
}

@media(max-width:980px){
  .mbgv-shell{grid-template-rows:auto minmax(0,1fr) 92px!important}
  .mbgv-stage-row{padding:7px 58px!important}
  .mbgv-filmstrip{height:92px!important;padding:8px 12px 10px!important}
  .mbgv-thumb{height:64px!important}
  .mbgv-shell.is-focus{grid-template-rows:0 minmax(0,1fr) 0!important}
  .mbgv-shell.is-focus .mbgv-stage-row{padding:7px 58px!important}
}

@media(max-width:700px){
  .mbgv-shell{grid-template-rows:auto minmax(0,1fr) 82px!important}
  .mbgv-topbar{min-height:58px!important}
  .mbgv-stage-row{padding:5px 48px!important}
  .mbgv-filmstrip{height:82px!important;padding:7px 8px 9px!important}
  .mbgv-thumb{height:56px!important}
  .mbgv-shell.is-focus{grid-template-rows:0 minmax(0,1fr) 0!important}
  .mbgv-shell.is-focus .mbgv-stage-row{padding:5px 48px!important}
}

/* ==============================================================
   APEX 9.8.5 — CENTERED VIEWPORT + FIXED EDGE NAVIGATION
   - the overlay paints the entire browser viewport with one background
   - FIT photo remains centered in the real viewport photo row
   - arrows are permanently fixed at the screen edges, 50% viewport height
   ============================================================== */
html.gallery-viewer-open,
html.gallery-viewer-open body,
body.modal-open{
  overflow:hidden!important;
  background:#020a10!important;
}

.mb-gallery-viewer{
  position:fixed!important;
  inset:0!important;
  left:0!important;right:0!important;top:0!important;bottom:0!important;
  width:auto!important;
  height:auto!important;
  min-width:100vw!important;
  min-height:100dvh!important;
  max-width:none!important;
  max-height:none!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  outline:0!important;
  background:#020a10!important;
  overflow:hidden!important;
  box-sizing:border-box!important;
}
.mb-gallery-viewer::backdrop{
  background:#020a10!important;
}

/* Fixed shell additionally protects against browser/dialog viewport quirks. */
.mbgv-shell{
  position:fixed!important;
  inset:0!important;
  left:0!important;right:0!important;top:0!important;bottom:0!important;
  width:auto!important;
  height:auto!important;
  min-width:100vw!important;
  min-height:100dvh!important;
  margin:0!important;
  background:#020a10!important;
  overflow:hidden!important;
}

/* Arrows no longer consume horizontal photo space. */
.mbgv-stage-row{
  padding:8px 24px!important;
}
.mbgv-shell.is-focus .mbgv-stage-row{
  padding:8px 24px!important;
}

/* One permanent navigation position: viewport edges + vertical center. */
.mbgv-nav{
  position:fixed!important;
  top:50%!important;
  bottom:auto!important;
  width:54px!important;
  height:64px!important;
  z-index:40!important;
  opacity:.96!important;
  transform:translateY(-50%)!important;
  transition:opacity .18s ease,transform .18s ease,background .18s ease,border-color .18s ease!important;
}
.mbgv-nav-prev{
  left:14px!important;
  right:auto!important;
}
.mbgv-nav-next{
  right:14px!important;
  left:auto!important;
}
.mbgv-nav:hover,.mbgv-nav:focus-visible{
  transform:translateY(-50%) scale(1.08)!important;
  opacity:1!important;
}
.mbgv-shell.is-focus .mbgv-nav,
.mbgv-shell.is-focus .mbgv-stage-row:hover .mbgv-nav,
.mbgv-shell.is-focus .mbgv-nav:hover{
  opacity:.96!important;
}

/* Explicit centering guard for every FIT image. */
.mbgv-stage,.mbgv-canvas{
  width:100%!important;
  height:100%!important;
  margin:0!important;
}
.mbgv-canvas{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
}
.mbgv-image{
  margin:auto!important;
  object-position:50% 50%!important;
}

@media(max-width:980px){
  .mbgv-stage-row,.mbgv-shell.is-focus .mbgv-stage-row{padding:7px 18px!important}
  .mbgv-nav{width:46px!important;height:58px!important}
  .mbgv-nav-prev{left:8px!important}.mbgv-nav-next{right:8px!important}
}
@media(max-width:700px){
  .mbgv-stage-row,.mbgv-shell.is-focus .mbgv-stage-row{padding:5px 10px!important}
  .mbgv-nav{width:40px!important;height:54px!important;font-size:22px!important}
  .mbgv-nav-prev{left:5px!important}.mbgv-nav-next{right:5px!important}
}
