.gallery {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 10px;
}

.gallery img {
    width: 100%;
    border-radius: 8px;
    cursor: pointer;
    transition: transform 0.2s;
}

.gallery img:hover {
    transform: scale(1.03);
}

/* Lightbox */
#lightbox {
display: none;
position: fixed;
top: 0;
left: 0;
width: 100vw;
height: 100vh;
background: rgba(0, 0, 0, 0.9);
z-index: 99999;
justify-content: center;
align-items: center;
}

#lightbox img {
max-width: 90%;
max-height: 90%;
object-fit: contain;
cursor: zoom-out;
}

#lightbox .close {
position: absolute;
top: 20px;
right: 30px;
color: white;
font-size: 40px;
cursor: pointer;
z-index: 100000;
}