.gallery { padding: clamp(2rem, 5vw, 5rem) var(--section-gutter); }
.gallery-grid { display: grid; grid-template-columns: repeat(var(--base-cols, 3), minmax(0, 1fr)); gap: var(--gap, 1rem); }
.gallery-item { position: relative; aspect-ratio: 4 / 3; overflow: hidden; background: var(--secondary-color); }
.gallery-item img { width: 100%; height: 100%; object-fit: cover; transition: transform .45s ease; }
.gallery-item:hover img { transform: scale(1.025); }
.gallery-item-overlay { position: absolute; inset: auto 0 0; padding: 1rem; background: linear-gradient(transparent, color-mix(in srgb, var(--dark-background-color) 88%, transparent)); }
@media (max-width: 800px) { .gallery-grid { grid-template-columns: 1fr; } }