#pathway-activation #banner .banner-section {
    background-image: url(/content/dam/intelligentcontent/unbranded/pioneerhub/us/en/images/exploring-cancer-patients/pathway-activation/mobile/banner-bg.png);
}

#pathway-activation .head-content>p:not(:last-child) {
    margin-bottom: 10px;
}

#pathway-activation #numbered-flex .number-callout .content {
    padding-right: 50px;
}

#pathway-activation #numbered-flex .number-callout {
    padding: 41px 32.5px;
}

.grey-top-border {
    border-top: 1px solid #B6B7B9;
}

/* Mobile pathway carousel starts */

#mobile-carousel {
    background: #F4F7F7;
    max-width: 335px;
    margin: 32px auto;
    /* z-index: 0; */
}

#carousel-section .cmp-carousel-horizontal .cmp-image__image {
    height: auto;
    width: 100%;
}

#carousel-section .cmp-carousel__content.cmp-carousel__content--swipe {
    display: flex;
    width: auto !important;
    justify-content: flex-start;
    align-items: center;
    flex-wrap: nowrap;

}

#carousel-section .cmp-carousel__item--swipe {
    max-width: 844px;
    width: 100%;
    display: block;
    padding: 0;
    visibility: visible !important;
    cursor: auto;
}

#carousel-section .image {
    max-width: 100%;
    width: 100vw;
}

#pathway-activation .cmp-carousel__indicators {
    display: flex !important;
    gap: 8px;
    justify-content: center;
    bottom: 12px;
}

#pathway-activation .cmp-carousel__indicators .cmp-carousel__indicator {
    width: 8px;
    height: 8px;
    background: #B6B7B9;
    border: none;
}

#pathway-activation .cmp-carousel__indicators .cmp-carousel__indicator.cmp-carousel__indicator--active {
    background: #F58A68;
}

#pathway-activation .cmp-carousel__indicators li.cmp-carousel__indicator--active::after {
    display: none;
}

/* Mobile pathway carousel ends */

#pathway-activation .cmp-video__player {
    padding: 0;
}

#pathway-activation .cmp-video__content {
    padding: 0;
}

#pathway-activation .cmp-video__item-title {
    font-size: 20px;
    line-height: 26px;
    margin: 9px 0 0;
}

.cmp-carousel__content:has(.cmp-carousel__item.cmp-carousel__item--active[aria-label="Slide 1 of 8"]) .cmp-carousel__actions .cmp-carousel__action--previous,
.cmp-carousel__content:has(.cmp-carousel__item.cmp-carousel__item--active[aria-label="Slide 8 of 8"]) .cmp-carousel__actions .cmp-carousel__action--next,
.cmp-carousel__content:has(.cmp-carousel__item.cmp-carousel__item--active[aria-label="Slide 1 of 9"]) .cmp-carousel__actions .cmp-carousel__action--previous,
.cmp-carousel__content:has(.cmp-carousel__item.cmp-carousel__item--active[aria-label="Slide 9 of 9"]) .cmp-carousel__actions .cmp-carousel__action--next {
    visibility: hidden;
    pointer-events: none;
}

@media screen and (min-width: 991px) {
    #pathway-activation #banner .banner-section {
        background-image: url(/content/dam/intelligentcontent/unbranded/pioneerhub/us/en/images/exploring-cancer-patients/pathway-activation/desktop/banner-bg.png);
    }

    #pathway-activation #banner .banner-section .banner-content>p {
        max-width: 810px;
    }

    /* Desktop-carousel starts */

    #mobile-carousel {
        display: none;
    }

    #carousel-section #desktop-carousel .image {
        max-width: 825px;
        width: auto;
    }

    #carousel-section {
        margin: 40px 0;
    }

    #desktop-carousel {
        position: relative;
    }

    #desktop-carousel .cmp-carousel__actions {
        position: absolute;
        width: 100%;
        top: 50%;
        transform: translateY(-50%);
        display: flex;
        justify-content: space-between;
    }

    #desktop-carousel .cmp-carousel__actions span.cmp-carousel__action-text {
        display: none;
    }

    #desktop-carousel .cmp-carousel__actions span.cmp-carousel__action-icon:before {
        content: "";
        display: inline-block;
        width: 16px;
        height: 30px;
        background-image: url(/content/dam/intelligentcontent/unbranded/pioneerhub/us/en/images/exploring-cancer-patients/pathway-activation/desktop/carousel-arrow.svg);
        background-size: cover;
    }

    #desktop-carousel .cmp-carousel__actions button.cmp-carousel__action.cmp-carousel__action--next span.cmp-carousel__action-icon:before {
        transform: rotate(180deg);
    }

    #desktop-carousel .cmp-carousel__actions button.cmp-carousel__action {
        background: none;
        cursor: pointer;
    }



    /* #carousel-section #desktop-carousel:has(.cmp-carousel__item[aria-label="Slide 1 of 9"].cmp-carousel__item--active) .cmp-carousel__actions--swipe button.cmp-carousel__action.cmp-carousel__action--next {
        display: none;
    } */

    /* Desktop-carousel ends */

    #pathway-activation .cmp-video__item-title {
        font-size: 22px;
        line-height: 28px;
        margin: 22px 0 37px;
    }

    #pathway-activation #page-content .section-4 .section-head {
        padding-right: 30px;
    }

    #pathway-activation #numbered-flex .number-callout {
        padding: 58px 32.5px;
    }

    #pathway-activation #page-content .section-1 .section-head {
        margin-bottom: 28px;
    }

    #pathway-activation .section-1 .head-content>p:not(:last-child) {
        margin-bottom: 20px;
    }

    #pathway-activation .cmp-text .section-1 ul.list-section {
        margin-top: 8px;
    }

    #pathway-activation #animated-numbers-container {
        margin: 28px 0 64px;
    }
}

@media screen and (max-width:991px) {
    #pathway-activation #animated-numbers-container {
        padding-bottom: 32px;
    }

    /* Mobile carousel starts */

    #desktop-carousel {
        display: none;
    }

    #carousel-section #mobile-carousel .image img {
        max-width: 844px !important;
        width: 100%;
        display: block;
    }

    #carousel-section #mobile-carousel .cmp-carousel__item[aria-label="Slide 1 of 9"] .image:last-child img {
        max-width: 303px !important;
        margin: 0 0 0 15px;
    }

    #carousel-section #mobile-carousel .cmp-carousel__actions--swipe {
        display: none;
    }

    #carousel-section .cmp-carousel__content.cmp-carousel__content--swipe {
        max-height: 322px;
        pointer-events: none;
    }

    /* #carousel-section #mobile-carousel .cmp-carousel__item[aria-label="Slide 2 of 10"].cmp-carousel__item--active .image .cmp-image {
        display: flex;
        align-items: center;
        justify-content: center;
        transform: translateX(-18px);
    } */



    #mobile-carousel .cmp-carousel__actions {
        position: absolute;
        bottom: 13px;
        padding: 0 19px;
    }

    #mobile-carousel {
        position: relative;
    }

    #mobile-carousel .cmp-carousel__actions>button {
        width: 46px;
        height: 46px;
        cursor: pointer;
        background-image: url(/content/dam/intelligentcontent/unbranded/pioneerhub/us/en/images/exploring-cancer-patients/pathway-activation/mobile/next-button-white.svg);
        background-color: transparent;
    }

    #mobile-carousel .cmp-carousel__actions>button span.cmp-carousel__action-text {
        display: none;
    }

    #mobile-carousel .cmp-carousel__actions>button.cmp-carousel__action--previous {
        transform: rotate(180deg);
    }

    /* Mobile carousel ends */


    #pathway-activation #page-content {
        padding-bottom: 40px;
    }

    #pathway-activation #page-content .section-4 .section-head {
        padding-right: 20px;
    }

    #pathway-activation #page-content .section-4 .head-content {
        font-size: 16px;
        line-height: 24px;
    }

    #mobile-carousel .cmp-carousel__actions {
        display: flex;
        width: 100%;
        align-items: center;
        justify-content: space-between;
    }

    #mobile-carousel:has(.cmp-carousel__item.cmp-carousel__item--active[aria-label="Slide 1 of 9"]) {
        padding: 11px 0;
    }

    #mobile-carousel:has(.cmp-carousel__item.cmp-carousel__item--active[aria-label="Slide 1 of 9"]) .cmp-carousel__actions {
        display: none;
    }

    .cmp-carousel__item[aria-label="Slide 1 of 9"] .cmp-container .image:first-child {
        display: none;
    }
}

/* Mobile-carousel media query starts */

@media screen and (orientation: portrait) {
    #mobile-carousel .cmp-carousel__content .cmp-carousel__item:not(:first-child) {
        display: none;
    }

    .cmp-carousel__item[aria-label="Slide 1 of 9"] {
        display: block;
        visibility: visible;
    }

    #mobile-carousel .cmp-carousel__actions {
        display: none;
    }

    #carousel-section #mobile-carousel:has(.cmp-carousel__item[aria-label="Slide 1 of 9"].cmp-carousel__item--active) ol.cmp-carousel__indicators {
        display: none !important;
    }
}

@media screen and (max-width:991px) and (orientation: landscape) {
    #pathway-activation .sticky-nav-content {
        display: none;
    }

    #pathway-activation #header {
        position: fixed;
    }

    #pathway-activation #header.sticky-header {
        position: sticky;
    }

    #pathway-activation #main-section {
        margin-top: 85px;
    }

    body#pathway-activation:has(#header.sticky-header) #main-section {
        margin-top: 0px;
    }

}

@media screen and (orientation: landscape) {

    #mobile-carousel {
        max-width: 844px;
        padding: 0 !important;
    }

    .cmp-carousel__item[aria-label="Slide 1 of 9"] .cmp-container .image:last-child {
        display: none;
    }

    .cmp-carousel__item[aria-label="Slide 1 of 9"] .cmp-container .image:first-child {
        display: block;
    }

    #mobile-carousel .cmp-carousel__actions {
        display: flex !important;
    }

    #carousel-section .cmp-carousel__content.cmp-carousel__content--swipe {
        max-height: unset;
    }

    #mobile-carousel .cmp-carousel__content .cmp-carousel__item--active:not(:first-child) {
        display: block;
    }
}

/* Mobile-carousel media query ends */



/* Feedback Staging 1 - 28-08-25 */

#pathway-activation .cmp-carousel__indicators {
    z-index: 0 !important;
}

@media screen and (max-width:380px) {
    #carousel-section .image {
        width: auto !important;
    }

    #carousel-section #mobile-carousel .cmp-carousel__item[aria-label="Slide 1 of 9"] .image:last-child img {
        width: 90%;
    }
}