/* ============================================================
   CARL media zoom — click-to-enlarge lightbox for demo videos
   and browser-frame (.cbframe) screenshots only. Standalone
   images, mascots, icons, logo and nav are deliberately left
   static. Attached by rule in media-zoom.js.
   ============================================================ */
.mz-zoomable{position:relative;cursor:zoom-in}
.mz-cue{
  position:absolute;bottom:12px;right:12px;z-index:4;
  display:inline-flex;align-items:center;gap:6px;
  background:rgba(0,25,48,.74);color:#fff;border:1px solid rgba(255,255,255,.16);
  border-radius:9px;padding:6px 10px;cursor:zoom-in;
  font:700 11.5px/1 'Poppins',system-ui,sans-serif;letter-spacing:.02em;
  opacity:0;transform:translateY(5px);
  transition:opacity .3s cubic-bezier(0.16,1,0.3,1),transform .3s cubic-bezier(0.16,1,0.3,1);
  -webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);pointer-events:none;
}
.mz-zoomable:hover .mz-cue,
.mz-zoomable:focus-within .mz-cue{opacity:1;transform:none}
.mz-cue svg{width:14px;height:14px;flex:0 0 auto}
@media(hover:none){.mz-cue{opacity:.92;transform:none}}   /* touch: always show */

/* lightbox overlay (one shared node) */
.mz-lb{
  position:fixed;inset:0;z-index:10000;display:flex;align-items:center;justify-content:center;
  padding:28px;background:rgba(0,15,28,.9);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);
  opacity:0;visibility:hidden;transition:opacity .35s cubic-bezier(0.16,1,0.3,1),visibility .35s;
}
.mz-lb.open{opacity:1;visibility:visible}
.mz-lb__inner{position:relative;max-width:min(1120px,94vw);max-height:90vh;display:flex}
.mz-lb__inner img,.mz-lb__inner video{
  max-width:100%;max-height:90vh;width:auto;height:auto;display:block;
  border-radius:10px;box-shadow:0 24px 70px rgba(0,0,0,.55);background:#0a1622;
}
.mz-lb__close{
  position:absolute;top:-48px;right:-4px;width:42px;height:42px;border-radius:999px;
  border:1px solid rgba(255,255,255,.28);background:rgba(255,255,255,.08);color:#fff;
  cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .3s ease;
}
.mz-lb__close:hover{background:rgba(255,255,255,.2)}
body.mz-lb-open{overflow:hidden}

@media(max-width:600px){
  .mz-lb{padding:16px}
  .mz-lb__close{top:-46px;right:0}
  .mz-cue span{display:none}
}
@media(prefers-reduced-motion:reduce){
  .mz-lb{transition:opacity .001s}
  .mz-cue{transition:none}
}