/* ==========================================================================
   Gallery page
   Ported from the Astro static design (Astro scoped attributes removed).
   ========================================================================== */


/* --- Gallery page --- */
.gallery{padding-bottom:var(--section-y)}
.filters{margin-bottom:var(--space-xl);scrollbar-width:none;gap:.5rem;padding-bottom:.25rem;display:flex;overflow-x:auto}
.filter{border:1px solid var(--color-line-strong);border-radius:var(--radius-pill);min-height:2.75rem;color:var(--navy-900);transition:background-color var(--dur-2) ease, color var(--dur-2) ease, border-color var(--dur-2) ease;flex:none;align-items:center;gap:.5rem;padding:.5rem 1.1rem;font-size:.9375rem;font-weight:600;display:inline-flex}
.filter:hover{border-color:var(--navy-900)}
.filter[aria-pressed=true]{background:var(--navy-900);color:#fff;border-color:var(--navy-900)}
.filter__n{opacity:.85;font-variant-numeric:tabular-nums;font-size:.75rem}
.grid{grid-template-columns:repeat(2,1fr);grid-auto-rows:clamp(9rem,26vw,15rem);grid-auto-flow:dense;gap:clamp(.4rem,.9vw,.9rem);display:grid}
.grid__item--feature{grid-area:span 2/span 2}
.grid__item--tall{grid-row:span 2}
.grid__link{height:100%;display:block;position:relative}
.grid__link img{object-fit:cover;width:100%;height:100%}
.grid__cap{color:#fff;opacity:0;transition:opacity var(--dur-2) ease, transform var(--dur-3) var(--ease-out);background:linear-gradient(#0000,#111b2599);justify-content:space-between;align-items:center;gap:1rem;padding:2.5rem 1rem .9rem;font-size:.875rem;font-weight:600;display:flex;position:absolute;inset:auto 0 0;transform:translateY(6px)}
.grid__link:hover .grid__cap,.grid__link:focus-visible .grid__cap{opacity:1;transform:none}
@media (hover:none){.grid__cap{opacity:1;padding-top:2rem;transform:none}
}
@media (width>=64rem){.grid{grid-template-columns:repeat(4,1fr);grid-auto-rows:clamp(12rem,17vw,20rem)}
}
@media (width>=100rem){.grid{grid-template-columns:repeat(5,1fr)}
}
