*{box-sizing:border-box;margin:0;padding:0}body{overflow-x:hidden}.gallery{grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:clamp(16px,4vw,32px);padding:clamp(16px,4vw,40px);list-style-type:none;display:grid}.thumbnail{cursor:pointer;transition:transform .4s,box-shadow .4s}.thumbnail:hover{transform:translateY(-6px)}.thumbnail img{aspect-ratio:4/3;object-fit:cover;border-radius:15px;width:100%;height:100%}.thumbnail:focus,.thumbnail:focus-visible{border:5px solid #0653fa}.popup{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#0009;flex-wrap:wrap;place-content:center;width:100vw;height:100vh;padding:24px;animation:.3s fadeIn;display:flex;position:fixed;top:0;left:0}.popup.hidden{display:none}.popup.fade-out{animation:.3s both fadeOut}.popup img{object-fit:contain;max-width:min(90vw,1100px);max-height:min(80vh,700px)}.popup_close{color:#fff;cursor:pointer;background-color:#0000;border:none;font-size:clamp(48px,6vw,96px);position:fixed;top:clamp(24px,4vw,64px);right:clamp(24px,4vw,64px)}.popup_arrow{color:#fff;cursor:pointer;opacity:.7;background:#0f172a99;border:none;border-radius:50%;width:clamp(48px,10vw,96px);height:clamp(48px,10vw,96px);font-size:clamp(32px,5vw,72px);line-height:1;transition:opacity .3s;position:absolute;top:50%;transform:translateY(-50%)}.popup_arrow:hover{opacity:1}.popup_arrow--left{left:clamp(8px,4vw,64px)}.popup_arrow--right{right:clamp(8px,4vw,64px)}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes fadeOut{0%{opacity:1}to{opacity:0}}@media (max-width:640px){.popup{padding:12px}.popup img{max-width:95vw}}