.projects__grid {
    display: flex;
    gap: 15px;

    & .projects__grid__column-1,
    .projects__grid__column-2 {
        display: flex;
        flex-direction: column;
        gap: 15px;

        & .projects__grid__item {
            position: relative;

            & img {
                width: 100%;
                height: 100%;
                object-fit: cover;
                transition: filter .5s ease;
            }

            & .projects__grid__item__info {
                position: absolute;
                top: 0;
                left: 0;
                width: 100%;
                height: 100%;
                display: flex;
                align-items: flex-end;
                padding: 1rem;
                box-sizing: border-box;
                opacity: 0;
                transition: opacity .4s ease;
            }

            & h2 {
                font-size: 24px;
                font-weight: normal;
                color: var(--white);
                text-transform: initial;
            }

            &:hover {
                & img {
                    filter: brightness(.5) contrast(1.5);
                }

                & .projects__grid__item__info {
                    opacity: 1;
                }
            }
        }




    }

    & .projects__grid__column-1 {
        width: 55%;

        & .projects__grid__item {
            max-height: 900px;
        }


    }

    & .projects__grid__column-2 {
        width: 45%;

        & .projects__grid__item {
            max-height: 635px;
        }
    }
}

@media screen and (max-width: 768px) {
    .projects__grid {
        gap: 5px;
        & .projects__grid__column-1,
        .projects__grid__column-2 {
            gap: 5px;
            & .projects__grid__item {
                & h2 {
                    font-size: 15px;
                }
            }
        }
    }
}