.thumbnail-gallery {width:100%;margin:0}
.thumbnail-gallery__inner {width:90%;max-width:1440px;margin-inline:auto;padding:4em 0;}
.thumbnail-gallery__heading {font-family:"Yalla",sans-serif;margin:0 0 2.75em;text-align:center;font-size:clamp(.85rem,2vw,1.125rem);text-transform:uppercase; letter-spacing:.075em;   color:#662c1f}
.thumbnail-gallery__grid {display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:3.5em 2em;align-items:start;}
.thumbnail-gallery__item {display:flex;justify-content:center;}
.thumbnail-gallery__image {display:block;width:100%;height:100%;object-fit:cover;transition:transform .25s ease,opacity .25s ease;}

.thumbnail-gallery__link:hover .thumbnail-gallery__image,.thumbnail-gallery__link:focus .thumbnail-gallery__image {transform:scale(1.05);}
.thumbnail-gallery__item--more .thumbnail-gallery__link:hover .thumbnail-gallery__image,.thumbnail-gallery__item--more .thumbnail-gallery__link:focus .thumbnail-gallery__image {transform:scale(1.05);filter:brightness(.35);}

.thumbnail-gallery__link {display:block;position:relative;width:clamp(100px,9vw,140px);aspect-ratio:1;overflow:hidden;text-decoration:none;}
.thumbnail-gallery__link::after {content:"";position:absolute;inset:0;background:rgba(102,44,31,.6);opacity:0;transition:opacity .25s ease;pointer-events:none;z-index:1;}
.thumbnail-gallery__link:hover::after,.thumbnail-gallery__link:focus::after {opacity:1;}
.thumbnail-gallery__more {position:absolute;inset:0;display:flex;align-items:center;justify-content:center;padding:.5em;color:#fff;font-size:.9em;font-weight:700;line-height:1.1;text-align:center;text-transform:uppercase;letter-spacing:.03em;pointer-events:none;z-index:2;}


.thumbnail-gallery__item[hidden] {display:none;}
.thumbnail-gallery__item--more .thumbnail-gallery__link {position:relative;}
.thumbnail-gallery__item--more .thumbnail-gallery__image {filter:brightness(.45);}
.thumbnail-gallery__more {position:absolute;inset:0;display:flex;align-items:center;justify-content:center;padding:.5em;color:#fff;font-size:.9em;font-weight:700;line-height:1.1;text-align:center;text-transform:uppercase;letter-spacing:.03em;pointer-events:none;}
.thumbnail-gallery__item--more .thumbnail-gallery__link:hover .thumbnail-gallery__image,.thumbnail-gallery__item--more .thumbnail-gallery__link:focus .thumbnail-gallery__image {transform:scale(1.05);filter:brightness(.35);}

.thumbnail-lightbox[hidden] {display:none !important}
.thumbnail-lightbox {position:fixed;inset:0;z-index:99999;display:flex;align-items:center;justify-content:center;background:rgba(0,0,0,.9);padding:3em;}
.thumbnail-lightbox__content {display:flex;flex-direction:column;align-items:center;justify-content:center;max-width:calc(100vw - 10em);max-height:calc(100vh - 6em);}
.thumbnail-lightbox__image {display:block;max-width:100%;max-height:calc(100vh - 8em);width:auto;height:auto;object-fit:contain;}
.thumbnail-lightbox__caption {margin:1em 0 0;color:#fff;text-align:center;max-width:60ch;}
.thumbnail-lightbox__close,.thumbnail-lightbox__prev,.thumbnail-lightbox__next {position:absolute;border:0;background:transparent;color:#fff;cursor:pointer;line-height:1;}
.thumbnail-lightbox__close {top:.5em;right:.75em;font-size:2.5em;}
.thumbnail-lightbox__prev,.thumbnail-lightbox__next {top:50%;transform:translateY(-50%);font-size:4em;padding:.25em;}
.thumbnail-lightbox__prev {left:.25em;}
.thumbnail-lightbox__next {right:.25em;}
.thumbnail-lightbox__close:focus-visible,.thumbnail-lightbox__prev:focus-visible,.thumbnail-lightbox__next:focus-visible {outline:2px solid #fff;outline-offset:4px;}
.thumbnail-lightbox-open {overflow:hidden;}

@media screen and (max-width:1023px) {.thumbnail-gallery__grid {grid-template-columns:repeat(4,minmax(0,1fr));gap:3em 1.75em;}}

@media screen and (max-width:600px) {.thumbnail-gallery__inner {padding:3em 0;}.thumbnail-gallery__grid {grid-template-columns:repeat(3,minmax(0,1fr));gap:2.25em 1.25em;}.thumbnail-gallery__link {width:clamp(72px,22vw,96px);}
.thumbnail-lightbox {padding:3.5em 1em 2em;}.thumbnail-lightbox__content {max-width:100%;}.thumbnail-lightbox__prev,.thumbnail-lightbox__next {font-size:3em;}.thumbnail-lightbox__prev {left:0;}.thumbnail-lightbox__next {right:0;}
}

