.imagebox {
    padding: 20px 16px;
    margin: 0 auto;
    max-width: 1140px;
    width: 100%;
    box-sizing: border-box;
    color: var(--color-primary);
}
.gallery-wrap {
    display: flex;
    flex-direction: row;
    width: 100%;
    height: 40vh;
    gap: 5px;
}
.image {
    flex: 1;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    border-radius: 12px;
    position: relative;
    transition: flex 0.8s ease;
}
.image:hover {
    flex: 4;
}
.image-text {
    position: absolute;
    bottom: 10%;
    left: 50%;
    transform: translateX(-50%) translateY(10px);
    z-index: 2;
    pointer-events: none;
    white-space: normal;
    line-height: 1.2;
    width: 90%;
    max-width: 100%;
    background: rgba(0, 0, 0, 0.6);
    color: var(--color-orange);
    padding: 4px 10px;
    border-radius: 6px;
    font-size: 2rem;
    opacity: 0;
    transition: opacity 0.3s ease, transform 0.3s ease;
}
.image:hover .image-text {
    opacity: 1;
    transform: translateX(-50%) translateY(0);
}
/*Bilder 2008*/
.image08-1 {
    background-image: url("../../projekte/2008/image1.png");
}
.image08-2 {
    background-image: url("../../projekte/2008/image2.png");
}
.image08-3 {
    background-image: url("../../projekte/2008/image3.png");
}
.image08-4 {
    background-image: url("../../projekte/2008/image4.png");
}
.image08-5 {
    background-image: url("../../projekte/2008/image5.png");
}
.image08-6 {
    background-image: url("../../projekte/2008/image6.png");
}
.image08-7 {
    background-image: url("../../projekte/2008/image7.png");
}
.image08-8 {
    background-image: url("../../projekte/2008/image8.png");
}
.image08-9 {
    background-image: url("../../projekte/2008/image9.png");
}
.image08-10 {
    background-image: url("../../projekte/2008/image10.png");
}
.image08-11 {
    background-image: url("../../projekte/2008/image11.png");
}
.image08-12 {
    background-image: url("../../projekte/2008/image12.png");
}
/*Bilder 1998*/
.image98-1 {
    background-image: url("../../projekte/1998/image1.png");
}
.image98-2 {
    background-image: url("../../projekte/1998/image2.png");
}
.image98-3 {
    background-image: url("../../projekte/1998/image1.jpg");
}
.image98-4 {
    background-image: url("../../projekte/1998/image2.jpg");
}
.image98-5 {
    background-image: url("../../projekte/1998/image3.jpg");
}
.image98-6 {
    background-image: url("../../projekte/1998/image4.jpg");
}
.image98-7 {
    background-image: url("../../projekte/1998/image5.jpg");
}
.image98-8 {
    background-image: url("../../projekte/1998/image6.jpg");
}
.image98-9 {
    background-image: url("../../projekte/1998/image7.jpg");
}
.image98-10 {
    background-image: url("../../projekte/1998/image8.jpg");
}
.image98-11 {
    background-image: url("../../projekte/1998/image9.jpg");
}
.image98-12 {
    background-image: url("../../projekte/1998/image10.jpg");
}
.image98-13 {
    background-image: url("../../projekte/1998/image11.jpg");
}
.image98-14 {
    background-image: url("../../projekte/1998/image12.jpg");
}
.image98-15 {
    background-image: url("../../projekte/1998/image13.jpg");
}
.image98-16 {
    background-image: url("../../projekte/1998/image14.jpg");
}
.image98-17 {
    background-image: url("../../projekte/1998/image15.jpg");
}
/*Bilder 1997*/
.image97-1 {
    background-image: url("../../projekte/1997/image1.png");
}
.image97-2 {
    background-image: url("../../projekte/1997/image2.png");
}
.image97-3 {
    background-image: url("../../projekte/1997/image3.png");
}
.image97-4 {
    background-image: url("../../projekte/1997/image4.png");
}
.image97-5 {
    background-image: url("../../projekte/1997/image5.png");
}
.image97-6 {
    background-image: url("../../projekte/1997/image6.png");
}
.image97-7 {
    background-image: url("../../projekte/1997/image7.png");
}
/*Bilder 1996*/
.image96-1 {
    background-image: url("../../projekte/1996/image1.png");
}
.image96-2 {
    background-image: url("../../projekte/1996/image2.png");
}
.image96-3 {
    background-image: url("../../projekte/1996/image3.png");
}
.image96-4 {
    background-image: url("../../projekte/1996/image4.png");
}
.image96-5 {
    background-image: url("../../projekte/1996/image5.png");
}
.image96-6 {
    background-image: url("../../projekte/1996/image6.png");
}
.image96-7 {
    background-image: url("../../projekte/1996/image7.png");
}
.image96-8 {
    background-image: url("../../projekte/1996/image8.png");
}
/*Bilder 1995*/
.image95-1 {
    background-image: url("../../projekte/1995/image1.png");
}
.image95-2 {
    background-image: url("../../projekte/1995/image2.png");
}
.image95-3 {
    background-image: url("../../projekte/1995/image3.png");
}
.image95-4 {
    background-image: url("../../projekte/1995/image4.png");
}
.image95-5 {
    background-image: url("../../projekte/1995/image5.png");
}
.image95-6 {
    background-image: url("../../projekte/1995/image6.png");
}
.image95-7 {
    background-image: url("../../projekte/1995/image7.png");
}
.image95-8 {
    background-image: url("../../projekte/1995/image8.png");
}
/*Bilder 1994*/
.image94-1 {
    background-image: url("../../projekte/1994/image1.png");
}
.image94-2 {
    background-image: url("../../projekte/1994/image2.png");
}
.image94-3 {
    background-image: url("../../projekte/1994/image3.png");
}
.image94-4 {
    background-image: url("../../projekte/1994/image4.png");
}
.image94-5 {
    background-image: url("../../projekte/1994/image5.png");
}
/* ✅ Responsive Anpassung */
@media (max-width: 768px) {
    .imagebox .fs-1 {
        font-size: 0.9rem !important;
    }
    .gallery-wrap {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        gap: 2px;
        height: auto;
        overflow: visible;
        position: relative;
    }
    .image {
        width: 100%;
        aspect-ratio: 1 / 1;
        background-position: center;
        background-size: contain;
        background-repeat: no-repeat;
        border-radius: 8px;
        overflow: hidden;
        transition: transform 0.4s ease;
        transform-origin: center center;
        position: relative;
        z-index: 1;
    }
    .image.active {
        position: relative;
        width: 150%;
        transform: scale(1.08) rotate(-2deg) translateY(-5px);
        z-index: 10;
    }
    .image-text {
        font-size: 0.7rem;
        padding: 3px 8px;
        line-height: 1.1;
    }
}