
.agenda-opening-lap__card {
    position: relative;
    display: flex;
    align-items: center;
    gap: 5.25rem; /* 84px */
    width: 100%;
    max-width: 78.625rem; /* 1258px */
    min-height: 20.4375rem; /* 327px */
    padding: 1.0625rem 1.0625rem 1.0625rem 2.9375rem; /* 17 / 17 / 17 / 47 */
    margin-inline: auto;
    border: 0.0625rem solid transparent; /* 1px — the gradient ring */
    border-radius: 24px;
    overflow: hidden; /* clips the chevron artwork to the rounded corners */
    background:
        linear-gradient(115deg, #0d227f 0%, #000c97 45%, #0d227f 100%) padding-box,
        linear-gradient(90deg, #4863f2 0%, var(--orange) 100%) border-box;
}

.agenda-opening-lap__lines {
    position: absolute;
    top: -0.0625rem; /* -1px */
    left: 25.325625rem; /* 405.21px -> Figma's 406.21 */
    z-index: 0;
    display: block;
    width: 48.75rem; /* 780px */
    height: 20.4375rem; /* 327px */
    pointer-events: none;
}

.agenda-opening-lap__lines img {
    display: block;
    width: 100%;
    height: 100%;
}

.agenda-opening-lap__body {
    position: relative;
    z-index: 1;
    flex: 1 1 36.0625rem; /* 577px */
    min-width: 0;
}

.agenda-opening-lap__tag {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem; /* 6px */
    margin: 0;
    padding: 0.4375rem 0.6875rem; /* 7px 11px */
    border: 0.0625rem solid rgba(255, 255, 255, 0.4);
    border-radius: 6.25rem; /* 100px — full pill */
    color: var(--white);
    letter-spacing: 0.4px;
}

.agenda-opening-lap__title {
    max-width: 36.0625rem; /* 577px */
    margin: 1rem 0 0; /* 16px — badge ends 38, title starts 54 */
    color: var(--white);
}
.agenda-opening-lap__cta {
    min-width: 13.75rem; /* 220px */
    margin-top: 2rem; /* 32px — title ends 157.5, button starts 189.5 */
    font-size: var(--fontSizeExtraLarge);
    line-height: 1;    
    --btnPadding: 1.315rem 1.5rem;
}
.agenda-opening-lap__cta i{
    color: var(--orange);
}

.agenda-opening-lap__cta-icon {
    width: 1rem; /* 16px */
    height: 1rem;
    filter: brightness(0) invert(1);
    transition: var(--transitionDefault);
}

.agenda-opening-lap__cta:where(:hover, :focus) .agenda-opening-lap__cta-icon {
    filter: none;
}
.agenda-opening-lap__media {
    position: relative;
    z-index: 1;
    align-self: flex-start;
    flex: 1 1 33.1875rem; /* 531px */
    min-width: 0;
    aspect-ratio: 531 / 291;
    border-radius: 0.75rem; /* 12px */
    overflow: hidden;
}
.agenda-opening-lap__video {
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
}
.agenda-opening-lap__media .wistia_responsive_wrapper {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    aspect-ratio: 16 / 9;
    width: 100%;
    height: auto;
    pointer-events: none;
}

.agenda-opening-lap__media .wistia_embed {
    display: block;
    width: 100%;
    height: 100%;
    border: 0;
}

.agenda-opening-lap__play {
    position: absolute;
    inset: 0;
    z-index: 2; /* above the embed */
    display: flex;
    align-items: flex-end;
    justify-content: flex-end;
    width: 100%;
    height: 100%;
    padding: 1.5rem; /* 24px — Figma's icon inset */
    border: 0;
    background: transparent;
    cursor: pointer;
}

/* Figma's icon box: 60 at 1920, 48 from 1366 down. */
.agenda-opening-lap__play img {
    display: block;
    flex: none;
    width: 3.75rem; /* 60px */
    height: 3.75rem;
    transition: var(--transitionDefault);
}

/* Scale the icon, not the overlay — the overlay is the full panel now. */
.agenda-opening-lap__play:where(:hover, :focus) img {
    transform: scale(1.06);
}

.agenda-opening-lap__cta:focus-visible,
.agenda-opening-lap__play:focus-visible {
    outline: 0.125rem solid var(--orange);
    outline-offset: 0.25rem;
}

@media screen and (max-width: 1600px) {
    .agenda-opening-lap__card {
        gap: 5.75rem; /* 92px — 594 - 502 */
        max-width: 68.5rem; /* 1096px */
        min-height: 17.25rem; /* 276px */
        /* 1 + 39 + 1040 + 15 + 1 = 1096; 1 + 15 + 244 + 15 + 1 = 276 */
        padding: 0.9375rem 0.9375rem 0.9375rem 2.4375rem; /* 15 / 15 / 15 / 39 */
        border-radius: 20px;
    }

    .agenda-opening-lap__lines {
        left: 23.706875rem; /* 379.31px -> Figma's 380.31 */
        width: 40.9375rem; /* 655px */
        height: 17.25rem; /* 276px */
    }

    .agenda-opening-lap__body {
        flex-basis: 31.375rem; /* 502px */
    }

    .agenda-opening-lap__title {
        max-width: 31.375rem; /* 502px */
    }

    .agenda-opening-lap__cta {
        min-width: 11.9375rem; /* 191px */
    }

    .agenda-opening-lap__media {
        flex-basis: 27.875rem; /* 446px */
        aspect-ratio: 446 / 244;
        border-radius: 0.625rem; /* 10px */
    }
    .agenda-opening-lap__play img {
        width: 3rem; /* 48px */
        height: 3rem;
    }
}

@media screen and (max-width: 1199px) {
    .agenda-opening-lap__card {
        gap: 0; /* the two columns are flush at this tier */
        max-width: 51.125rem; /* 818px */
        min-height: 16.1875rem; /* 259px */
        /* 1 + 23 + 782 + 11 + 1 = 818; 1 + 11 + 235 + 11 + 1 = 259 */
        padding: 0.6875rem 0.6875rem 0.6875rem 1.4375rem; /* 11 / 11 / 11 / 23 */
        border-radius: 16px;
    }

    .agenda-opening-lap__lines {
        left: 19.636875rem; /* 314.19px -> Figma's 315.19 */
        width: 28.8125rem; /* 461px */
        height: 16.1875rem; /* 259px */
    }

    .agenda-opening-lap__body {
        flex-basis: 27.0625rem; /* 433px */
    }

    .agenda-opening-lap__title {
        max-width: 27.0625rem; /* 433px */
    }

    /* title ends 133.5, button starts 157.5 */
    .agenda-opening-lap__cta {
        min-width: 9.9375rem; /* 159px */
        margin-top: 1.5rem; /* 24px */
        --btnPadding: 14px 10px;
    }

    .agenda-opening-lap__media {
        flex-basis: 21.8125rem; /* 349px */
        aspect-ratio: 349 / 190;
        border-radius: 0.5rem; /* 8px */
    }

    /* icon inset 24 -> 16 */
    .agenda-opening-lap__play {
        padding: 1rem; /* 16px */
    }
    .agenda-opening-lap__tag {
        padding: 5px 11px;
        letter-spacing: -0.4px;
        --btnPadding: 14px 10px;
        gap: 1px;
    }
}

@media screen and (max-width: 991px) {
    .agenda-opening-lap__card {
        gap: 2.375rem; /* 38px — 344 - 306 */
        max-width: none; /* fills the container */
    }

    .agenda-opening-lap__body {
        flex-basis: 45%; 
    }

    .agenda-opening-lap__title {
        max-width: inherit;
    }

    .agenda-opening-lap__media {
        flex-basis: 21.25rem; /* 340px */
        aspect-ratio: 340 / 185;
        border-radius: 0.4375rem; /* 7px — measured */
    }
}

@media screen and (max-width: 767px) {
    .agenda-opening-lap__card {
        flex-direction: column;
        align-items: stretch;
        gap: 1.5rem; /* 24px — button ends 148, image starts 172 */
        min-height: 27.1875rem; /* 435px */
        /* 1 + 17 + 401 + 15 + 1 = 435 */
        padding: 1.0625rem 1.0625rem 0.9375rem; /* 17 / 17 / 15 */
    }

    /* Figma crops this variant to the card's own width, so it starts at x=0. */
    .agenda-opening-lap__lines {
        left: -0.0625rem; /* -1px -> Figma's 0 */
        width: 20.4375rem; /* 327px */
        height: 20.3125rem; /* 325px */
    }

    .agenda-opening-lap__body,
    .agenda-opening-lap__media {
        flex: none;
        align-self: stretch;
    }

    .agenda-opening-lap__title {
        max-width: 100%; /* 291px */
    }

    /* 6/12 in Figma at this tier, less the 1px border. */
    .agenda-opening-lap__tag {
        padding: 0.3125rem 0.6875rem; /* 5px 11px */
        font-size: 14px;
        line-height: 18px;
    }

    .agenda-opening-lap__cta {
        min-height: 3.25rem; /* 52px */
        --btnPadding: 12px 20px;
    }
    .agenda-opening-lap__media {
        aspect-ratio: 291 / 183;
        border-radius: 0.375rem; /* 6px — measured */
    }

    .agenda-opening-lap__media .wistia_responsive_wrapper {
        width: auto;
        height: 100%;
    }
}