.promo {
    text-align: center;
    padding: 2vh 5vw;

    h1 {
        padding: 2vh 0;
    }

    .promo-grid {
        color: aliceblue;

        @media(min-width: 1200px) {
            display: flex;
            grid-template-columns: repeat(2, minmax(0, 100%));
        }

        justify-content: center;
        gap: 1vw;
        display: grid;

        .box {
            flex: 1;
            box-sizing: border-box;

            margin: 2vh 0;
            text-align: left;
            padding: 5vh 5vw 5vh max(2vw, 2vh);

            outline: black solid 1px;
            background-size: cover;
            background-position: center;
            backdrop-filter: brightness(1);
            &::before {
                content: "";
                position: absolute;
                inset: 0;
                background: rgba(0, 0, 0, 0.7);
                z-index: -1;
            }

            button {
                color: aliceblue;
                border-style: solid;
                border-color: aliceblue;
                backdrop-filter: blur(5px);
                background-color: rgb(0 0 0 / 0.2);
                border-width: 0.2vh;
                border-radius: 0.5vh;
                margin: 2vh 1vw 0 0;
                padding: max(1vh, 1vw) max(3vh, 3vw);
            }
        }
    }

    .blog {
        background-image: url("../home/images/blog-background.png");
    }

    .events {
        background-image: url("../exotic-fruits/images/events promo bg.webp");
    }

    .instagram {
        background-image: url("../events/images/instagram-background.png");
    }

    .tiktok {
        background-image: url("../events/images/tiktok-background.png");
    }

    .exotic-fruits-button-bg {
        background-image: url("images/exotic-fruits-background.jpg");
    }

    .japanese-fruits-button-bg {
        background-image: url("../japanese-fruits/images/japanese fruits.webp");
    }
}