.elementor-1911 .elementor-element.elementor-element-f5c53f3{--display:flex;--gap:12px 12px;--row-gap:12px;--column-gap:12px;--padding-top:20px;--padding-bottom:20px;--padding-left:20px;--padding-right:20px;}.elementor-1911 .elementor-element.elementor-element-f5c53f3:not(.elementor-motion-effects-element-type-background), .elementor-1911 .elementor-element.elementor-element-f5c53f3 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#111820;}#elementor-popup-modal-1911{background-color:rgba(0,0,0,.8);justify-content:center;align-items:center;pointer-events:all;}#elementor-popup-modal-1911 .dialog-message{width:960px;height:auto;}#elementor-popup-modal-1911 .dialog-close-button{display:flex;}#elementor-popup-modal-1911 .dialog-widget-content{box-shadow:2px 8px 23px 3px rgba(0,0,0,0.2);}@media(max-width:1024px){#elementor-popup-modal-1911 .dialog-message{width:90vw;}}@media(max-width:767px){#elementor-popup-modal-1911 .dialog-message{width:94vw;}}/* Start custom CSS for container, class: .elementor-element-f5c53f3 *//* =========================================================
   VIDEO GALLERY
   ========================================================= */


/* =========================================
   CATEGORY ROW
   ========================================= */

.video-category {
    display: flex;
    flex-direction: row;
    align-items: stretch;

    width: 100%;
    min-width: 0;

    gap: 100px;
}


/* =========================================
   CATEGORY TITLE
   ========================================= */

.video-category__title {
    flex: 0 0 160px;

    width: 160px;
    min-width: 160px;

    display: flex;
    align-items: center;
    justify-content: center;

    margin: 0;
    padding: 0;
}

.video-category__heading {
    width: 100%;

    margin: 0 !important;
    padding: 0 !important;

    text-align: center;

    white-space: nowrap;
}

.video-category__heading .elementor-heading-title {
    margin: 0 !important;
    padding: 0 !important;

    font-size: 14px;
    line-height: 1.25;
    font-weight: 400;

    text-align: center;
}


/* =========================================
   VIDEO GRID
   ========================================= */

.video-category__grid {
    flex: 1 1 0;

    min-width: 0;

    display: grid;

    grid-template-columns: repeat(4, 160px);

    column-gap: 20px;
    row-gap: 20px;

    justify-content: start;
    align-items: start;
}


/* =========================================
   VIDEO CARD
   ========================================= */

.video-card {
    position: relative !important;

    width: 100%;
    min-width: 0;

    overflow: hidden !important;

    border-radius: 4px;

    cursor: pointer;
}

.video-card .elementor-widget-container {
    width: 100%;

    margin: 0 !important;
    padding: 0 !important;
}


/* =========================================
   CLICK LAYER
   Prevent Elementor inline playback
   ========================================= */

.video-card::before {
    content: "";

    position: absolute;

    inset: 0;

    z-index: 50;

    background: transparent;

    cursor: pointer;

    pointer-events: auto;
}


/* =========================================
   VIDEO THUMBNAIL WRAPPER
   ========================================= */

.video-card .elementor-wrapper {
    position: relative !important;

    width: 100% !important;
    max-width: none !important;

    aspect-ratio: 16 / 9 !important;

    margin: 0 !important;
    padding: 0 !important;

    overflow: hidden !important;
}


/* =========================================
   IMAGE OVERLAY
   ========================================= */

.video-card .elementor-custom-embed-image-overlay {
    position: absolute !important;

    inset: 0 !important;

    width: 100% !important;
    height: 100% !important;

    background-size: cover !important;
    background-position: center !important;
    background-repeat: no-repeat !important;

    overflow: hidden !important;
}


/* =========================================
   DARK OVERLAY
   ========================================= */

.video-card .elementor-custom-embed-image-overlay::before {
    content: "";

    position: absolute;

    inset: 0;

    background: rgba(0, 0, 0, 0.28);

    z-index: 1;

    pointer-events: none;

    transition: background 0.2s ease;
}


/* =========================================
   VIDEO TITLE
   ========================================= */

.video-card::after {
    content: attr(data-video-title);

    position: absolute;

    top: 50%;
    left: 10px;
    right: 10px;

    transform: translateY(-50%);

    z-index: 5;

    color: #fff;

    font-size: 16px;
    line-height: 1.15;
    font-weight: 700;

    text-align: center;

    text-shadow:
        0 1px 3px rgba(0, 0, 0, 0.95),
        0 2px 8px rgba(0, 0, 0, 0.65);

    opacity: 1;

    pointer-events: none;

    transition:
        opacity 0.18s ease,
        transform 0.18s ease;
}


/* =========================================
   PLAY BUTTON
   Hidden by default
   ========================================= */

.video-card .elementor-custom-embed-play {
    position: absolute !important;

    top: 50% !important;
    left: 50% !important;

    width: 52px !important;
    height: 52px !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    transform:
        translate(-50%, -50%)
        scale(0.82) !important;

    background: #fff !important;

    border-radius: 50% !important;

    opacity: 0 !important;
    visibility: hidden !important;

    z-index: 10 !important;

    pointer-events: none !important;

    transition:
        opacity 0.18s ease,
        visibility 0.18s ease,
        transform 0.18s ease !important;
}


/* =========================================
   HIDE ELEMENTOR DEFAULT ICON
   ========================================= */

.video-card .elementor-custom-embed-play i,
.video-card .elementor-custom-embed-play svg {
    display: none !important;
}


/* =========================================
   CUSTOM PLAY TRIANGLE
   ========================================= */

.video-card .elementor-custom-embed-play::before {
    content: "";

    display: block;

    width: 0;
    height: 0;

    border-top: 9px solid transparent;
    border-bottom: 9px solid transparent;
    border-left: 15px solid #26343b;

    margin-left: 4px;
}


/* =========================================
   DESKTOP HOVER
   ========================================= */

@media (hover: hover) and (pointer: fine) {

    .video-card:hover::after {
        opacity: 0;

        transform:
            translateY(-50%)
            scale(0.96);
    }

    .video-card:hover .elementor-custom-embed-play {
        opacity: 1 !important;
        visibility: visible !important;

        transform:
            translate(-50%, -50%)
            scale(1) !important;
    }

    .video-card:hover
    .elementor-custom-embed-image-overlay::before {
        background: rgba(0, 0, 0, 0.38);
    }
}


/* =========================================================
   TABLET
   768px – 1024px
   ========================================================= */

@media (min-width: 768px) and (max-width: 1024px) {

    .video-category {
        display: flex !important;
        flex-direction: row !important;
        align-items: stretch !important;

        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;

        height: auto !important;
        min-height: 0 !important;

        gap: 28px !important;

        padding: 0 20px !important;

        box-sizing: border-box !important;
    }


    /* Category title */

    .video-category__title {
        flex: 0 0 130px !important;

        width: 130px !important;
        min-width: 130px !important;
        max-width: 130px !important;

        display: flex !important;
        align-items: center !important;
        justify-content: center !important;

        margin: 0 !important;
        padding: 0 !important;
    }

    .video-category__heading {
        width: 100% !important;

        margin: 0 !important;
        padding: 0 !important;

        text-align: center !important;
    }

    .video-category__heading .elementor-heading-title {
        margin: 0 !important;
        padding: 0 !important;

        font-size: 14px !important;
        line-height: 1.25 !important;
        font-weight: 400 !important;

        text-align: center !important;

        white-space: normal !important;
    }


    /* Video grid */

    .video-category__grid {
        flex: 1 1 auto !important;

        width: auto !important;
        min-width: 0 !important;
        max-width: none !important;

        display: grid !important;

        grid-template-columns:
            repeat(3, minmax(0, 1fr)) !important;

        column-gap: 14px !important;
        row-gap: 14px !important;

        justify-content: stretch !important;
        justify-items: stretch !important;

        align-items: start !important;

        margin: 0 !important;
        padding: 0 !important;
    }

    .video-category__grid > .video-card,
    .video-category__grid > .elementor-element {
        width: 100% !important;
        min-width: 0 !important;
        max-width: none !important;

        margin: 0 !important;
        padding: 0 !important;
    }
}


/* =========================================================
   MOBILE
   Up to 767px
   ========================================================= */

@media (max-width: 767px) {

    .video-category {
        display: flex !important;
        flex-direction: column !important;

        align-items: stretch !important;
        justify-content: flex-start !important;

        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;

        gap: 16px !important;

        margin: 0 !important;
        padding: 0 16px !important;

        box-sizing: border-box !important;
    }


    /* Category title */

    .video-category__title {
        display: block !important;

        flex: none !important;

        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;

        margin: 0 !important;
        padding: 0 !important;
    }

    .video-category__heading {
        display: block !important;

        width: 100% !important;

        margin: 0 !important;
        padding: 0 !important;

        text-align: left !important;

        white-space: normal !important;
    }

    .video-category__heading .elementor-heading-title {
        margin: 0 !important;
        padding: 0 !important;

        font-size: 16px !important;
        line-height: 1.25 !important;
        font-weight: 400 !important;

        text-align: left !important;

        white-space: normal !important;
    }


    /* Video grid */

    .video-category__grid {
        display: grid !important;

        width: 100% !important;
        min-width: 0 !important;

        grid-template-columns:
            repeat(2, minmax(0, 1fr)) !important;

        column-gap: 10px !important;
        row-gap: 10px !important;

        margin: 0 !important;
        padding: 0 !important;

        box-sizing: border-box !important;
    }

    .video-category__grid > .video-card,
    .video-category__grid > .elementor-element {
        width: 100% !important;
        min-width: 0 !important;

        margin: 0 !important;
        padding: 0 !important;
    }

    .video-card::after {
        left: 8px;
        right: 8px;

        font-size: 14px;
    }
}


/* =========================================================
   SMALL MOBILE
   ========================================================= */

@media (max-width: 480px) {

    .video-category {
        gap: 14px !important;

        padding-left: 14px !important;
        padding-right: 14px !important;
    }

    .video-category__heading .elementor-heading-title {
        font-size: 15px !important;
    }

    .video-category__grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr)) !important;

        column-gap: 8px !important;
        row-gap: 8px !important;
    }

    .video-card::after {
        font-size: 13px;
    }
}


/* =========================================================
   VIDEO POPUP
   ========================================================= */


/* =========================================
   MODAL CONTENT
   ========================================= */

.video-modal {
    width: 100% !important;
    max-width: 960px !important;

    margin: 0 auto !important;
    padding: 18px !important;

    box-sizing: border-box;

    background: #111820;
}


/* =========================================
   TRANSCRIPT TOGGLE
   ========================================= */

.video-modal__toggle {
    align-self: flex-start;

    margin: 0 0 12px !important;
}

.video-modal__toggle .elementor-button {
    padding: 14px 24px;

    background: transparent !important;

    border: 2px solid #fff;
    border-radius: 0;

    color: #fff !important;

    font-size: 16px;
    line-height: 1.2;
    font-weight: 400;
}


/* =========================================
   VIDEO PLAYER
   ========================================= */

.video-modal__player {
    width: 100% !important;
    max-width: 100% !important;

    margin: 0 !important;
    padding: 0 !important;
}

.video-modal__player .elementor-widget-container {
    width: 100% !important;

    margin: 0 !important;
    padding: 0 !important;
}

.video-modal__video {
    display: block;

    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;

    aspect-ratio: 16 / 9;

    background: #000;

    object-fit: contain;
}


/* =========================================
   MODAL VIDEO TITLE
   ========================================= */

.video-modal__title {
    width: 100%;

    margin: 10px 0 !important;
}

.video-modal__title .elementor-heading-title {
    margin: 0 !important;
    padding: 0 !important;

    color: #fff !important;

    font-size: 16px;
    line-height: 1.3;
    font-weight: 600;
}


/* =========================================
   TRANSCRIPT
   ========================================= */

.video-modal__transcript {
    width: 100% !important;

    margin: 0 !important;
    padding: 0 !important;
}

.video-modal__transcript-inner {
    width: 100%;
    max-height: 220px;

    overflow-y: auto;

    padding: 12px;

    box-sizing: border-box;

    background: #fff !important;
    color: #111 !important;

    font-size: 18px !important;
    line-height: 1.45 !important;
    font-weight: 400 !important;
}

.video-modal__transcript-inner p {
    margin: 0 0 5px !important;

    color: #111 !important;

    font-size: inherit !important;
    line-height: inherit !important;
    font-weight: inherit !important;
}


/* =========================================
   TRANSCRIPT CLOSED STATE
   ========================================= */

.video-modal__transcript.is-hidden {
    display: none !important;
}


/* =========================================================
   POPUP TABLET
   ========================================================= */

@media (max-width: 1024px) {

    .video-modal {
        max-width: 90vw !important;

        padding: 16px !important;
    }
}


/* =========================================================
   POPUP MOBILE
   ========================================================= */

@media (max-width: 767px) {

    .video-modal {
        max-width: 94vw !important;

        padding: 12px !important;
    }

    .video-modal__toggle {
        margin-bottom: 10px !important;
    }

    .video-modal__toggle .elementor-button {
        padding: 11px 16px;

        font-size: 14px;
    }

    .video-modal__title {
        margin: 8px 0 !important;
    }

    .video-modal__title .elementor-heading-title {
        font-size: 15px;
    }

    .video-modal__transcript-inner {
        max-height: 180px;

        padding: 10px;

        font-size: 16px !important;
        line-height: 1.4 !important;
    }
}/* End custom CSS */
/* Start custom CSS *//* =========================================
   VIDEO CARD CLICK LAYER
   Prevent Elementor inline playback
   ========================================= */

.video-card::before {
    content: "";

    position: absolute;

    inset: 0;

    z-index: 50;

    background: transparent;

    cursor: pointer;

    pointer-events: auto;
}/* End custom CSS */