.block-agenda
    &--grid,
    &--large
        .event
            display: flex
            flex-direction: column
            position: relative
            &-content
                a 
                    @include stretched-link
            &-dates 
                @extend .meta
                margin-top: $spacing0
                @include media-breakpoint-down(md)
                    font-size: $h4-size
                    line-height: $h4-line-height
                    font-weight: $h4-weight
        .media
            order: -1
            img
                aspect-ratio: 1
                object-fit: cover
                margin-bottom: half($spacing0)
    &--grid .events
        @include grid(2, md)
        .event
            @include media-breakpoint-down(desktop)
                + .event 
                    margin-top: $spacing1
                &-dates
                    text-align: right
            &-content 
                h2
                    @extend .h3
            &-description
                margin-top: $spacing0
    &--large
        .event
            flex-direction: row
            grid-gap: $grid-gutter
            &-content
                flex: 1
                .more
                    @include icon("arrow-right", after)
                    margin-top: $spacing1
                    &::after
                        margin-left: half($spacing0)
            @include media-breakpoint-up(desktop)
                .media
                    width: col(4, 8)
                &-dates
                    font-size: $h3-size-desktop
                    line-height: $h3-line-height
                    font-weight: $h3-weight
                    margin-bottom: $spacing2
                &-content h2
                    font-size: $h2-size-desktop
                    line-height: $h2-line-height
                    font-weight: $h2-weight
            @include media-breakpoint-down(desktop)
                flex-direction: column
                grid-gap: 0
                .media
                    margin-left: calc(-#{$grid-gutter-sm} /2)
                    margin-right: calc(-#{$grid-gutter-sm} /2)
                    aspect-ratio: 1
                .media:empty
                    display: none

.block-agenda--large 
    @include in-page-with-sidebar
        .events .event .media:empty
            display: none

.block-agenda--grid 
    @include in-page-without-sidebar
        .events
            @include grid(3, desktop)