body { background-color: #fcfcfc; color: #333; }

        /* ===== ELEMENTOR OVERRIDES & FIXES ===== */
        /* Defeats Elementor's default "height: auto" rule which creates blank spaces */
        .hero-img-container img {
            width: 100% !important;
            height: 100% !important;
            max-width: 100% !important;
            max-height: 100% !important;
            object-fit: cover !important;
            /* Centers the crop prioritizing the upper 15% to safely keep human heads/bodies in frame */
            object-position: center 15% !important; 
            margin: 0 !important;
            padding: 0 !important;
            display: block !important;
        }

        /* ===== HERO SECTION: CONTINUOUS TRANSPARENT MAGNIFIER SLIDER ===== */
        
        /* 1. Base Layer */
        #hero-image-container {
            position: absolute;
            inset: 0;
            z-index: 0;
        }

        /* 2. Magnified Layer (Clipped to match the glass slider) */
        .magnified-layer {
            position: absolute;
            inset: 0;
            z-index: 10;
            pointer-events: none;
            /* Matches glass slider duration exactly */
            animation: slideClip 6s infinite alternate ease-in-out;
        }
        
        .magnified-scale {
            width: 100%;
            height: 100%;
            /* Magnifies the images inside the slider */
            transform: scale(1.15); 
            transform-origin: center center;
        }

        /* 3. The Visual Glass Slider Frame (Clear & Sleek) */
        .glass-panel {
            width: 20%; /* Increased width for desktop */
            position: absolute;
            top: 0;
            height: 100%;
            z-index: 20;
            background: transparent; /* Completely clear */
            border-left: 2px solid rgba(207, 181, 59, 0.6); 
            border-right: 2px solid rgba(207, 181, 59, 0.6);
            box-shadow: inset 0 0 15px rgba(255,255,255,0.05), 0 0 25px rgba(207, 181, 59, 0.2);
            animation: slideGlass 6s infinite alternate ease-in-out;
            pointer-events: none;
        }

        /* Desktop Keyframes */
        @keyframes slideGlass {
            0% { left: 0%; }       
            100% { left: 80%; }  /* 100% - 20% width */
        }
        @keyframes slideClip {
            0% { clip-path: polygon(0% 0%, 20% 0%, 20% 100%, 0% 100%); }
            100% { clip-path: polygon(80% 0%, 100% 0%, 100% 100%, 80% 100%); }
        }

        /* Mobile Keyframes */
        @media (max-width: 768px) {
            .glass-panel {
                width: 35%; /* Increased width for mobile */
                animation: slideGlassMob 6s infinite alternate ease-in-out;
            }
            .magnified-layer {
                animation: slideClipMob 6s infinite alternate ease-in-out;
            }
        }
        @keyframes slideGlassMob {
            0% { left: 0%; }
            100% { left: 65%; } /* 100% - 35% width */
        }
        @keyframes slideClipMob {
            0% { clip-path: polygon(0% 0%, 35% 0%, 35% 100%, 0% 100%); }
            100% { clip-path: polygon(65% 0%, 100% 0%, 100% 100%, 65% 100%); }
        }

        /* Miscellaneous utilities */
        .bg-dotted-map {
            background-color: #ffffff;
            background-image: radial-gradient(#cbd5e1 1px, transparent 1px);
            background-size: 30px 30px;
            position: relative;
        }
        .bg-dotted-map::before {
            content: '';
            position: absolute;
            inset: 0;
            background: radial-gradient(circle at center, transparent 0%, #ffffff 90%);
            pointer-events: none;
        }

        /* Animations */
        .card-course { transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1); }
        .card-course:hover { transform: translateY(-5px); }
        .accordion-content { display: grid; grid-template-rows: 0fr; transition: grid-template-rows 0.4s ease-out; }
        .accordion-content.is-open { grid-template-rows: 1fr; }
        .accordion-inner { overflow: hidden; }
        .is-open + div > .accordion-icon, .accordion-btn[aria-expanded="true"] .accordion-icon {
            transform: rotate(180deg);
            color: #cfb53b;
        }

        html, body {
            max-width: 100vw !important;
            overflow-x: hidden !important;
        }