/* INSEGNE BRESCIA - v65 - lightbox delle foto dei lavori (landing e galleria) */
:root{
  --ib-ease: cubic-bezier(.22,.8,.24,1);
  --ib-ease-out: cubic-bezier(.16,1,.3,1);
  --ib-fast: .18s; --ib-med: .32s; --ib-slow: .6s;
  --ib-orange: #ff8a00;
}
/* =========================================================
   Lightbox (foto di un lavoro)
   ========================================================= */
.ib-lb{
  position:fixed; inset:0; z-index:100000; display:flex; flex-direction:column;
  background:rgba(5,7,14,.93); -webkit-backdrop-filter:blur(8px); backdrop-filter:blur(8px); color:#fff; font-family:'Montserrat',system-ui,sans-serif;
  opacity:0; visibility:hidden; transition:opacity var(--ib-med) var(--ib-ease), visibility 0s linear var(--ib-med);
}
.ib-lb.is-open{ opacity:1; visibility:visible; transition:opacity var(--ib-med) var(--ib-ease); }
.ib-lb-top{ display:flex; align-items:center; gap:16px; padding:14px clamp(14px,3vw,28px); }
.ib-lb-title{ flex:1; min-width:0; }
.ib-lb-title strong{ display:block; font-size:clamp(15px,1.6vw,20px); font-weight:800; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.ib-lb-title span{ display:block; font-size:12.5px; opacity:.7; margin-top:2px; }
.ib-lb-count{ font-size:13px; font-weight:700; opacity:.8; font-variant-numeric:tabular-nums; }
.ib-lb-btn{
  appearance:none; border:1px solid rgba(255,255,255,.18); background:rgba(255,255,255,.06); color:#fff;
  width:46px; height:46px; border-radius:50%; display:grid; place-items:center; cursor:pointer;
  transition:background-color var(--ib-fast) linear, transform var(--ib-med) var(--ib-ease);
}
.ib-lb-btn:hover{ background:rgba(255,255,255,.16); }
.ib-lb-btn:focus-visible{ outline:3px solid var(--ib-orange); outline-offset:2px; }
.ib-lb-btn svg{ width:20px; height:20px; }
.ib-lb-stage{ position:relative; flex:1; min-height:0; display:flex; align-items:center; justify-content:center; padding:0 clamp(8px,6vw,90px); touch-action:pan-y; }
.ib-lb-img{
  max-width:100%; max-height:100%; object-fit:contain; border-radius:6px;
  box-shadow:0 30px 80px rgba(0,0,0,.5);
  opacity:0; transform:scale(.985); transition:opacity var(--ib-med) var(--ib-ease), transform var(--ib-slow) var(--ib-ease-out);
}
.ib-lb-img.is-ready{ opacity:1; transform:none; }
.ib-lb-prev, .ib-lb-next{ position:absolute; top:50%; transform:translateY(-50%); }
.ib-lb-prev{ left:clamp(8px,2vw,24px); }
.ib-lb-next{ right:clamp(8px,2vw,24px); }
.ib-lb-prev:hover{ transform:translateY(-50%) translateX(-2px); }
.ib-lb-next:hover{ transform:translateY(-50%) translateX(2px); }
.ib-lb-bottom{ display:flex; justify-content:center; padding:12px 16px 18px; min-height:24px; }
.ib-lb-link{ color:#fff; font-size:13px; font-weight:700; letter-spacing:.04em; text-decoration:none; border-bottom:1px solid rgba(255,138,0,.8); padding-bottom:2px; }
.ib-lb-link:hover{ color:var(--ib-orange); }
.ib-lb-spinner{ position:absolute; width:34px; height:34px; border-radius:50%; border:3px solid rgba(255,255,255,.15); border-top-color:var(--ib-orange); animation:ib-spin .9s linear infinite; }
@keyframes ib-spin{ to{ transform:rotate(360deg); } }
@media (max-width: 760px){
  .ib-lb-prev, .ib-lb-next{ top:auto; bottom:-58px; transform:none; }
  .ib-lb-prev:hover, .ib-lb-next:hover{ transform:none; }
  .ib-lb-prev{ left:calc(50% - 56px); }
  .ib-lb-next{ right:calc(50% - 56px); }
  .ib-lb-bottom{ padding-top:70px; }
}
html.ib-lb-lock, html.ib-lb-lock body{ overflow:hidden!important; }

@media (prefers-reduced-motion: reduce){
  .ib-lb, .ib-lb-img{ transition:none!important; }
}
