.swiper-container {
            width: 100%;
            overflow: hidden;
        }

        .swiper-slide {
            width: 100%;
            height: 150px;
        }

        .breadcrumb-title {
            font-size: 40px
        }

        @media (max-width: 768px) {
            .swiper-slide {
                height: 400px;
            }
        }

        @media (max-width: 576px) {
            .swiper-slide {
                height: 300px;
            }
            .breadcrumb-title {
                font-size: 20px
            }
        }

        /* For desktop */
        @media (min-width: 1025px) {
            #desktopPerdanaCarousel {
                display: block;
            }
        }

        /* For mobile */
        @media (max-width: 1024px) {
            #mobilePerdanaCarousel {
                display: block;
            }

            .text-custom {
                font-size: 16px !important;
            }
        }

        /* Menata lingkaran dan ikon */
        .icon-circle {
            display: flex;
            align-items: center;
            justify-content: center;
            width: 40px;
            height: 40px;
            border-radius: 50%;
            background-color: white;
            margin: 0 auto;
        }

        .icon-circle i {
            color: #1B8E2D;
            font-size: 18px;
        }

        .search-icon-btn {
            background-color: transparent;
            border: none;
            padding: 0;
        }

        .form-control:focus {
            border-color: transparent !important;
            box-shadow: none !important;
        }

        .carousel-control-prev{
            left:-120px !important
        }

        .carousel-control-next{
            right: -120px !important
        }

        button:focus {
            outline: none !important;
            box-shadow: none !important;
            border-color: transparent !important;
        }

        .search-icon-btn {
            background-color: transparent;
            border: none !important;
            padding: 0;
        }

        .search-icon-btn:hover,
        .search-icon-btn:focus {
            outline: none !important;
            box-shadow: none !important;
            border: none !important;
        }

        .card-nav {
            flex: 1;
            text-align: center;
            color: white;
        }

        #buttonContainer {
            white-space: nowrap;
            overflow-x: auto;
            padding: 10px 0;
        }

        .nav-btn {
            min-width: auto;
            border-radius: 30px !important;
            background-color: rgba(255, 255, 255, 0.2) !important;
            transition: background-color 0.3s, color 0.3s;
            text-decoration: none !important;
        }

        .nav-btn:hover {
            outline: none !important;
            box-shadow: none !important;
            border-color: transparent !important;
        }

        .btn-link {
            outline: none !important;
            box-shadow: none !important;
            border-color: transparent !important;
            text-decoration: none !important;
        }

        .btn-link:hover {
            outline: none !important;
            box-shadow: none !important;
            border-color: transparent !important;
            text-decoration: none !important;
        }

        .nav-item {
            text-decoration: none !important;
            outline: none;
        }

        .nav-item:focus,
        .nav-item:active {
            outline: none;
            text-decoration: none;
        }

        /* Hover efek tanpa underline */
        .nav-item:hover {
            text-decoration: none;
            color: white;
        }

        .logo-akronim {
            display: none;
        }

        .logo-full,
        .logo-akronim {
            transition: opacity 0.3s ease-in-out;
        }

        .navbar.scrolled .logo-full {
            display: none;
        }

        .navbar.scrolled .logo-akronim {
            display: inline;
        }

        .ranking-number {
            font-size: 2rem;
            font-weight: bold;
            color: white;
        }

        .card-title {
            font-size: 16px !important;
            font-weight: 100 !important;
            color: white;
        }

        .d-flex.align-items-center {
            display: flex;
            align-items: center;
        }

        .me-2 {
            margin-right: 5px;
        }

        a {
            text-decoration: none !important;
            outline: none !important;
        }

        a:focus {
            outline: none !important;
        }

        .card:hover,
        .card:focus {
            text-decoration: none !important;
            outline: none !important;
        }

        /* @media (max-width: 576px) {
            h4 {
                font-size: 16px !important;
            }

            /* Hide carousel on mobile */
            /* #topWatchCarousel {
                display: none;
            } */

            /* Show swiper on mobile */
            /* .swiper-container {
                display: block !important;
            } */

            /* .card-title {
                font-size: 14px !important;
                font-weight: 50 !important;
                color: white;
            }
        } */

        @media (min-width: 768px) {
            h4 {
                font-size: 1.5rem;
            }

            /* Hide swiper on desktop */
            .swiper-container {
                display: none;
            }

            /* Show carousel on desktop */
            #topWatchCarousel {
                display: block !important;
            }

            .card-title {
                font-size: 16px !important;
                font-weight: 50 !important;
                color: white;
            }
        }

        #desktopPerdanaCarousel,
        #mobilePerdanaCarousel {
            display: none;
        }

        /* For desktop */
        @media (min-width: 1025px) {
            #desktopPerdanaCarousel {
                display: block;
            }
        }

        /* For mobile */
        @media (max-width: 1024px) {
            #mobilePerdanaCarousel {
                display: block;
            }

            .text-custom {
                font-size: 16px !important;
            }
        }

        .navbar {
            z-index: 1030;
            margin-bottom: 0;
            padding: 0;
            padding-bottom: 0;
            position: fixed;
            width: 100%;
        }

        .carousel {
            padding-top: 0;
            margin-top: 0;
        }

        @media (max-width: 576px) {
            .container {
                width: 100%;
            }

            img.logo-img{
                max-width: 70%;
            }

            #accessibility-widget{
                display: none;
            }

        /* <?php  //if($viewData["style"] == "landing-program"): ?> */
        /* Untuk Mobile (max 576px) */
            .custom-margin {
                margin-block : 70px;
            }

            .carousel-inner {
                display: flex;
                flex-wrap: wrap;
            }

            .carousel-item-inner {
                flex: 0 0 50%;
                max-width: 50%;
            }

            .card {
                width: 100%;
            }

            .card-img {
                height: auto;
            }

            
            .carousel-control-prev,
            .carousel-control-next {
                width: 5%;
            }

            #accessibility-widget {
                display: none;
            }

            
            h4 {
                font-size: 16px !important;
            }

            /* Hide carousel on mobile */
            .carousel-hidden{
                display: none;
            }

            /* Show swiper on mobile */
            .swiper-container {
                display: block !important;
            }

            .card-title {
                font-size: 14px !important;
                font-weight: 50 !important;
                color: white;
            }
        }

        /* Untuk Desktop */
        @media (min-width: 768px) {
            .carousel-item-inner {
                flex: 0 0 25%;
                max-width: 25%;
            }
        }
        /* <?php // endif; ?> */