.hne-exhibit-header {
    width: 100vw;
    position: relative;
    margin-block-start: 0;
    @media only screen and (max-width: 767px) {
        display: flex;
        flex-direction: column;
    }

    img {
        width: 100%;
        height: auto;
        object-fit: cover;
        display: block;
    }

    .background-image {
        order: 1;
    }

    .title-wrapper {
        width: 100%;
        padding: 20px 35px;
        order: 3;
        @media only screen and (min-width: 768px) {
            padding: unset;
            position: absolute;
            display: flex;
            order: unset;
            top: 50%;
            left: 35px;
            border: 46px solid var(--wp--preset--color--white);
            width: calc(100% - 162px);
            height: 50%;
            align-items: center;
            transform: translateY(-50%);
        }
        &.text-position-right {
            flex-direction: row-reverse;
            .title-content {
                padding-left: 50px;
            }
        }
        &.text-position-left {
            .title-content {
                @media only screen and (min-width: 580px) {
                    padding-right: 50px;
                }
            }
        }
        .title-content {
            background-color: var(--wp--preset--color--white);
            height: calc(100% + 2px);
            width: calc( 35% - 50px );
            min-width: 400px;
            max-width: 100%;
            position: relative;
            display: flex;
            flex-direction: column;

            .tag {
                font-size: var(--wp--preset--font-size--nav-button-text);
                text-transform: uppercase;
                line-height: 138.462%;
                letter-spacing: 0.91px;
            }
            .date {
                font-size: var(--wp--preset--font-size--p-2-manrope);
                font-weight: 500;
                line-height: 141.667%;
                letter-spacing: 0.48px;
                flex-grow: 1;
                display: flex;
                align-items: flex-end;
                padding-bottom: 12%;
            }
        }
        &.dark-purple {
            color: var(--wp--custom--light-pink);
            @media only screen and (max-width: 599px) {
                background-color: var(--wp--custom--dark-purple);
            }
            @media only screen and (min-width: 600px) {
                border-color: var(--wp--custom--dark-purple);
            }
            .title-content {
                background-color: var(--wp--custom--dark-purple);
                h1 {
                    color: var(--wp--preset--color--white);
                }
            }
        }
        &.neon-green {
            border-color: var(--wp--custom--neon-green);
            .title-content {
                background-color: var(--wp--custom--neon-green);
            }
        }

        h1 {
            font-family: var(--wp--preset--font-family--meno-display);
            font-size: clamp(29.768px, 1.861rem + ((1vw - 3.2px) * 1.737), 52px);
            font-style: italic;
            line-height: 126.923%;
        }
    }
    .image-caption {
        font-size: var(--wp--preset--font-size--nav-button-text);
        margin-top: 0.5rem;
        order: 2;
    }
}