/* Collage grids + fullscreen lightbox */

.collage-section{margin:2.5rem 0 3rem}
.collage-section h2{
  font-family:var(--as-font-display,Syne,system-ui,sans-serif);
  font-size:clamp(1.2rem,2.5vw,1.45rem);margin:0 0 1.25rem;font-weight:700;
}
.collage-grid{
  display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:.85rem;
}
.collage-cell{
  position:relative;padding:0;margin:0;border:none;cursor:pointer;overflow:hidden;
  border-radius:14px;background:color-mix(in srgb,var(--as-text) 8%,transparent);
  grid-column:span 4;aspect-ratio:4/3;
  transition:transform .22s ease, box-shadow .22s;
}
@media(min-width:720px){
  .collage-cell:nth-child(8n+1){grid-column:span 8;grid-row:span 2;aspect-ratio:auto;min-height:220px}
  .collage-cell:nth-child(8n+5){grid-column:span 6}
  .collage-cell:nth-child(8n+7){grid-column:span 6}
}
.collage-section__hint{font-size:.8rem;opacity:.55;margin:1rem 0 0;letter-spacing:.02em}

.collage-cell:hover{transform:scale(1.02);box-shadow:0 16px 40px rgba(0,0,0,.35);z-index:1}
.collage-cell img{width:100%;height:100%;object-fit:cover;display:block}
.collage-cell__shade{
  position:absolute;inset:0;background:linear-gradient(180deg,transparent 40%,rgba(0,0,0,.75));
  opacity:0;transition:opacity .2s;
}
.collage-cell:hover .collage-cell__shade,.collage-cell:focus-visible .collage-cell__shade{opacity:1}
.collage-cell__label{
  position:absolute;left:0;right:0;bottom:0;padding:.45rem .55rem;font-size:.72rem;line-height:1.25;
  color:#fff;text-align:left;font-weight:600;
}
.collage-cell:focus-visible{outline:2px solid var(--as-accent);outline-offset:2px}

.collage-grid--travel .collage-cell:nth-child(5n+2){grid-row:span 2}

.media-lightbox{
  position:fixed;inset:0;z-index:120;display:grid;grid-template-rows:1fr auto;
  background:rgba(4,6,12,.94);backdrop-filter:blur(8px);
}
.media-lightbox[hidden]{display:none!important}
.media-lightbox__stage{
  display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:.5rem;
  padding:1rem min(2rem,4vw);min-height:0;
}
.media-lightbox__img-wrap{
  display:grid;place-items:center;min-height:0;max-height:calc(100vh - 140px);
}
.media-lightbox__img{max-width:100%;max-height:calc(100vh - 140px);object-fit:contain;border-radius:8px}
.media-lightbox__nav{
  width:2.75rem;height:2.75rem;border-radius:50%;border:1px solid rgba(255,255,255,.25);
  background:rgba(255,255,255,.08);color:#fff;font-size:1.6rem;cursor:pointer;line-height:1;
}
.media-lightbox__nav:hover{background:rgba(255,255,255,.18)}
.media-lightbox__meta{
  padding:.85rem min(2rem,4vw) 1.25rem;border-top:1px solid rgba(255,255,255,.1);
  color:#f0f0f0;max-width:720px;margin:0 auto;width:100%;
}
.media-lightbox__title{font-family:var(--as-font-display,Syne,system-ui,sans-serif);font-size:1.15rem;margin:0 0 .35rem}
.media-lightbox__caption{font-size:.9rem;opacity:.85;margin:0 0 .65rem;line-height:1.5}
.media-lightbox__counter{font-size:.75rem;opacity:.55;margin-bottom:.5rem}
.media-lightbox__close{
  position:absolute;top:1rem;right:1rem;width:2.5rem;height:2.5rem;border-radius:50%;
  border:1px solid rgba(255,255,255,.25);background:rgba(0,0,0,.4);color:#fff;font-size:1.25rem;cursor:pointer;
}
.media-lightbox__link{color:var(--as-accent)!important;font-weight:600}

.travel-feature{
  display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:clamp(1.25rem,3vw,2.5rem);
  align-items:start;margin:0;
}
@media(max-width:800px){.travel-feature{grid-template-columns:1fr}}
.travel-feature__viewer{
  position:relative;border-radius:18px;overflow:hidden;aspect-ratio:4/3;
  background:color-mix(in srgb,var(--as-text) 8%,transparent);cursor:pointer;padding:0;border:0;width:100%;
  box-shadow:0 24px 60px rgba(0,0,0,.35);
  transition:transform .2s ease, box-shadow .2s;
}
.travel-feature__viewer:hover{transform:translateY(-2px);box-shadow:0 28px 70px rgba(0,0,0,.4)}
.travel-feature__viewer img{width:100%;height:100%;object-fit:cover}
.travel-feature__thumbs{display:flex;flex-wrap:wrap;gap:.45rem;margin-top:.65rem}
.travel-feature__thumb{
  width:72px;height:54px;padding:0;border:2px solid transparent;border-radius:8px;overflow:hidden;cursor:pointer;opacity:.7;
}
.travel-feature__thumb.is-active,.travel-feature__thumb:hover{opacity:1;border-color:var(--as-accent)}
.travel-feature__thumb img{width:100%;height:100%;object-fit:cover}
