.region-next-event {
    padding: var(--gap3) 0;
    background-color: rgb(246 165 0 / 10%);
}

.region-next-event > .ctnr {
    align-items: center;
    gap: var(--gap2);
}

.region-next-event .content {
    flex: 1 1 50%;
}

.region-next-event h2.before {
    font-size: 32px;
    margin-bottom: var(--gap1);
}

.region-next-event h2.before .region {
    color: var(--secondary-400);
}

.region-next-event .event-title {
    color: var(--primary-400);
    font: 600 24px var(--f1);
    margin-bottom: var(--gap1);
}

.region-next-event .infos {
    display: flex;
    flex-direction: column;
    gap: var(--gap05);
    margin-bottom: var(--gap2);
}

.region-next-event .infos .meta {
    align-items: center;
    gap: var(--gap05);
    color: var(--grey-500);
    font-size: 14px;
    line-height: 150%;
}

.region-next-event .infos .meta svg {
    flex-shrink: 0;
    width: 16px;
    height: 16px;
}

.region-next-event .content .lm_button.secondary {
    background: var(--secondary-400);
    color: var(--primary-500);
}

.region-next-event .content .lm_button.secondary:hover {
    background: var(--secondary-300);
}

.region-next-event .visual {
    flex: 1 1 44%;
}

.region-next-event .visual .img {
    display: block;
    width: 100%;
    height: auto;
    aspect-ratio: 5 / 3;
    object-fit: cover;
}

@media (max-width: 767px) {

    .region-next-event > .ctnr {
        flex-direction: column;
    }

    .region-next-event .visual {
        order: -1;
    }
}