:root {
    --primary: #003366;
    --accent: #df216a;
    --nav-text: #4a39e9;
}


body, html {
    padding-top: 140 px;
    margin: 0;
    padding: 0;
    width: 100%;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}


.navbar {
    position: fixed !important; 
    top: 0;
    width: 100%;
    z-index: 1000;
    background-color: #f1f1f3 !important;
    border-bottom: 4px solid #4a39e9;
    padding: 0.5rem 1rem !important; 
}


.navbar-nav .nav-link {
    color: var(--nav-text) !important;
    font-weight: 600;
    font-size: 0.85rem; 
    text-transform: uppercase;
    padding: 0.5rem 0.75rem !important;
    letter-spacing: 0.5px;
    transition: 0.3s;
}

.navbar-nav .nav-link:hover {
    color: #2a1ac9 !important; 
    background-color: rgba(74, 57, 233, 0.05); 
    border-radius: 4px;
}


.btn-custom {
    background-color: var(--primary);
    color: white;
    border-radius: 20px;
    padding: 0.4rem 1.2rem;
    font-size: 0.85rem;
    transition: 0.3s;
}

.btn-custom:hover {
    background-color: #002244;
    color: white;
}

/* Memastikan carousel banner rapi */
.carousel-inner img {
    width: 100%;
    height: 450px;
    object-fit: cover;
}


@media (max-width: 1200px) {
    .navbar-nav .nav-link {
        font-size: 0.75rem; 
        padding: 0.5rem 0.5rem !important;
    }
}

       
        .video-container {
            height: 100dvh;
            overflow: hidden;
            position: relative;
            background-color: #d2d7e6;
        }

        .video-container iframe {
            position: absolute;
            top: 0px;
            left: 0;
            width: 100%;
            height: calc(100% + 120px);
            pointer-events: none;
            border: none;
        }

        @media (max-width: 768px) {
            .video-container iframe {
                top: -50px;
                height: calc(100% + 100px);
                transform: scale(2.0);
                /* Scale disesuaikan agar tidak terlalu blur */
            }
        }

        @keyframes marquee {
            0% {
                transform: translateX(100%);
            }

            100% {
                transform: translateX(-100%);
            }
        }

        .animate-marquee {
            display: flex;
            white-space: nowrap;
            animation: marquee 15s linear infinite;
        }

       
        .bg-marquee {
            background: linear-gradient(90deg, #3729d6, #76c893);
        }


        .img-slider {
            width: 100%;
            height: 400px;
           
            object-fit: cover;
            
            object-position: center;
        }

       
        @media (max-width: 768px) {
            .img-slider {
                height: 200px;
            }
        }


       
        .news-card {
            background: #fff;
            border-radius: 15px;
            transition: 0.3s;
            text-decoration: none;
            color: #333;
            display: block;
            box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
        }

        .news-card:hover {
            transform: translateY(-5px);
            box-shadow: 0 10px 20px rgba(0, 0, 0, 0.15);
        }

        .news-img {
            height: 100%;
            object-fit: cover;
            transition: 0.5s;
        }

        .news-card:hover .news-img {
            transform: scale(1.05);
        }

        .tag-badge {
            background: rgba(118, 200, 147, 0.1);
            color: #76c893;
            font-size: 0.7rem;
            padding: 4px 10px;
            border-radius: 20px;
        }

      
        .gradient-green {
            background: linear-gradient(135deg, #76c893 0%, #1b4332 100%);
            color: white;
        }
	.modal-fullscreen-custom {
			background-color: #3729d6;
		}

		body.modal-open {
			overflow: hidden;
		
		}