/* KosmoPlane ODV — pagina Galleria e visualizzatore foto */

.album-nav{display:flex;flex-wrap:wrap;gap:10px;margin-top:22px;}
.album-nav a{
  background:var(--paper);border:1px solid var(--line);border-radius:2px;
  padding:10px 16px;font-size:14.5px;font-weight:500;text-decoration:none;color:var(--ink);
  transition:border-color .2s ease,color .2s ease,transform .2s ease;
}
.album-nav a span{display:block;font-family:'IBM Plex Mono',monospace;font-size:11.5px;color:var(--ink-soft);margin-top:2px;}
.album-nav a:hover{border-color:var(--red);color:var(--red);transform:translateY(-2px);}

.album{scroll-margin-top:90px;}
.album + .album{padding-top:0;}
.album-date{font-family:'IBM Plex Mono',monospace;font-size:12.5px;color:var(--orange);display:block;margin-bottom:8px;}

.album-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;grid-auto-flow:dense;}
.album-item{display:block;position:relative;overflow:hidden;border-radius:2px;background:var(--sky-deep);aspect-ratio:1;}
.album-item.big{grid-column:span 2;grid-row:span 2;}
.album-item img{width:100%;height:100%;object-fit:cover;transition:transform .5s cubic-bezier(.2,.7,.3,1);}
.album-item:hover img{transform:scale(1.05);}
.album-item:focus-visible{outline:3px solid var(--orange);outline-offset:2px;}

.lightbox{
  position:fixed;inset:0;z-index:200;background:rgba(15,24,30,.94);
  display:flex;align-items:center;justify-content:center;padding:56px 76px;
}
.lightbox[hidden]{display:none;}
.lightbox figure{margin:0;max-width:100%;max-height:100%;display:flex;flex-direction:column;align-items:center;gap:14px;}
.lightbox img{max-width:100%;max-height:calc(100vh - 150px);object-fit:contain;border-radius:2px;box-shadow:0 20px 60px rgba(0,0,0,.5);}
.lightbox figcaption{color:#dfe9ec;font-size:15px;text-align:center;max-width:720px;}
.lightbox .lb-count{font-family:'IBM Plex Mono',monospace;font-size:12px;color:#8ba0ab;display:block;margin-top:4px;}
.lb-btn{
  position:absolute;width:48px;height:48px;border-radius:50%;border:none;
  background:rgba(251,250,246,.12);color:#fff;cursor:pointer;display:grid;place-items:center;
  transition:background .2s ease;
}
.lb-btn:hover{background:rgba(251,250,246,.26);}
.lb-btn:focus-visible{outline:3px solid var(--orange);outline-offset:2px;}
.lb-btn svg{width:22px;height:22px;}
.lb-close{top:14px;right:14px;}
.lb-prev{left:14px;top:50%;transform:translateY(-50%);}
.lb-next{right:14px;top:50%;transform:translateY(-50%);}
html.lb-open{overflow:hidden;}

@media (max-width:980px){
  .album-grid{grid-template-columns:repeat(3,1fr);}
}
@media (max-width:860px){
  .album-grid{grid-template-columns:repeat(2,1fr);gap:8px;}
  .lightbox{padding:64px 12px 88px;}
  .lightbox img{max-height:calc(100vh - 200px);}
  .lb-prev,.lb-next{top:auto;bottom:22px;transform:none;}
  .lb-prev{left:calc(50% - 62px);}
  .lb-next{right:calc(50% - 62px);}
}
