/*event archive*/
.event-archive-row {
    align-items: stretch;
}

.event-archive-row figure,
.event-archive-row img {
    min-height: 245px;
}

.event-archive-row h2 a {
    transition: all 0.2s ease;
}

.event-archive-row h2 a:hover {
    color: var(--primary-md);

    transition: all 0.2s ease;
}

.event-archive-row .bmg-event-date-time.wp-block-ymca-event-date-time {
    width: 30%;

    display: flex;
    gap: 30px;
}

/*single events*/
.event-single-row {
    max-height: 65vh;
    align-items: stretch;
}

.event-single-row-titles {
    justify-content: center;
}

.event-single-row .event-single-image {
    overflow: hidden;
}

.event-single-row .event-single-image figure,
.event-single-row .event-single-image img {
    width: 100%;
    min-width: 100%;
    height: 100%;
    object-fit: cover;
}

.event-single-row .bmg-event-date-time.wp-block-ymca-event-date-time {
    width: fit-content;
}

@media (max-width: 1200px) {
    .event-archive-row .bmg-event-date-time.wp-block-ymca-event-date-time {
        width: 45%;
    }
}

@media (max-width: 992px) {
    /*archive*/
    .event-archive-row .wp-block-group {
        flex-direction: column;
        align-items: start;
    }

    .event-archive-row h2 {
        font-size: 35px;
    }

    .event-archive-row .bmg-event-date-time.wp-block-ymca-event-date-time {
        width: 100%;
        padding-left: 0;
    }

    /*single*/
    .event-single-row-titles {
        padding: 30px !important;
    }

    .event-single-row-titles h1 {
        font-size: 40px;
    }

    .event-single-row-titles .ymca-icon__inner {
        width: 40px !important;
        height: 40px !important;
    }

    /* 65vh is a desktop composition device — it stops a tall featured image
       running away with the hero. Once the row stacks, that cap turns into a
       real clip risk inside the cover's overflow:hidden. */
    .event-single-row {
        flex-direction: column;
        max-height: none;
    }
}

/*single event body*/

/* templates/single-event.html gives wp:post-content layout:constrained, which
   both stops the prose going full-bleed AND restores core's 24px block gap:
   defaults.css:11 zeroes margin-block-start only for .is-layout-flow CHILDREN,
   and that selector needs the DIRECT parent to carry the class — a constrained
   parent doesn't match, so the global rule stays as-is for everything else.
   What follows is only what a uniform 24px can't express. */
.single-event .wp-block-post-content h2,
.single-event .wp-block-post-content h3,
.single-event .wp-block-post-content h4 {
    margin-block-start: 32px;
    margin-block-end: 10px;
    /* --letter-spacing-lg is -1px in the cachet pack, which runs adjacent
       letters together on uppercase headings — same fix as blog.css. */
    letter-spacing: 0;
    color: var(--camp-md);
}

.single-event .wp-block-post-content > :first-child {
    margin-block-start: 0;
}

.single-event .wp-block-post-content ul,
.single-event .wp-block-post-content ol {
    padding-inline-start: 24px;
}

.single-event .wp-block-post-content li + li {
    margin-block-start: 8px;
}