.elementor-246 .elementor-element.elementor-element-b33ddc1{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;--z-index:1000;}/* Start custom CSS for html, class: .elementor-element-c9ec371 */:root {
    --primary: #003366; 
    --secondary: #d32f2f; 
    --accent: #27ae60; 
}

/* --- BRANDING --- */
.brand-identity .logo-link { display: flex; align-items: center; text-decoration: none; }
.brand-identity img { height: 65px; margin-right: 15px; }
.school-name-wrapper { display: flex; flex-direction: column; }
.school-name { font-size: 20px; font-weight: 800; color: var(--primary); text-transform: uppercase; line-height: 1.1; }
.school-tagline { font-size: 11px; color: #666; font-weight: 500; margin-top: 2px; }

/* --- MAIN NAVIGATION --- */
.main-nav { background: #fff; padding: 10px 0; position: sticky; top: 0; z-index: 1000; box-shadow: 0 2px 10px rgba(0,0,0,0.05); }
.header-container { max-width: 1240px; margin: 0 auto; display: flex; justify-content: space-between; align-items: center; padding: 0 20px; }
.nav-links { list-style: none; display: flex; align-items: center; gap: 20px; margin: 0; padding: 0; }
.nav-links > li { position: relative; list-style: none; }
.nav-links a { text-decoration: none; color: #333; font-weight: 600; font-size: 14px; }

/* --- SUBMENU (DROPDOWN) FIX --- */
.submenu {
    display: none; 
    position: absolute;
    top: 100%;
    left: 0;
    background: #ffffff !important;
    min-width: 230px;
    box-shadow: 0 10px 25px rgba(0,0,0,0.1);
    z-index: 9999;
    padding: 10px 0 !important; /* Internal padding for the box */
    margin: 0 !important;
    border-top: 3px solid var(--primary);
    list-style: none !important;
}

.submenu li {
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
}

.submenu li a {
    padding: 12px 20px !important; /* Space inside each link */
    display: block !important;
    width: 100%;
    color: #444 !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    border-bottom: 1px solid #f0f0f0;
    transition: background 0.2s ease;
}

.submenu li:last-child a { border-bottom: none; }

.submenu li a:hover {
    background: #f8f9fa !important;
    color: var(--secondary) !important;
    padding-left: 25px !important; /* Slight shift effect on hover */
}

/* Desktop Hover Trigger */
@media (min-width: 993px) {
    .dropdown:hover .submenu { display: block; }
}

/* --- TOP BAR & TICKER --- */
.top-bar { background: #f8f9fa; padding: 8px 0; border-bottom: 1px solid #eee; }
.top-bar-centered { display: flex; justify-content: center; align-items: center; gap: 40px; }
.notice-ticker-full { background: #fdf2f2; border-top: 2px solid var(--secondary); height: 40px; display: flex; align-items: center; width: 100%; }
.ticker-label { background: var(--secondary); color: #fff; padding: 0 25px; height: 100%; display: flex; align-items: center; font-weight: bold; clip-path: polygon(0 0, 85% 0, 100% 100%, 0% 100%); }

/* --- MOBILE RESPONSIVENESS --- */
.menu-toggle { display: none !important; }

@media (max-width: 992px) {
    .top-bar-centered { flex-direction: column; gap: 10px; }
    
    .nav-links {
        display: none !important;
        flex-direction: column;
        position: absolute;
        top: 100%;
        left: 0;
        width: 100%;
        background: #fff !important;
        padding: 10px 0 !important;
        box-shadow: 0 10px 20px rgba(0,0,0,0.1);
    }

    .menu-toggle:checked ~ .nav-links { display: flex !important; }

    /* Mobile Dropdown Behavior */
    .dropdown .submenu {
        position: static !important;
        display: none;
        background: #f9f9f9 !important;
        width: 100%;
        box-shadow: none;
        border-top: 1px solid #eee;
    }
    
    .dropdown:hover .submenu { display: block; }
    
    .menu-icon { display: block !important; cursor: pointer; padding: 10px; }
    .menu-icon span, .menu-icon span::before, .menu-icon span::after {
        display: block; background: #333; height: 2px; width: 25px; position: relative;
    }
    .menu-icon span::before { content: ""; position: absolute; top: 8px; width: 100%; height: 2px; background: #333; }
    .menu-icon span::after { content: ""; position: absolute; top: -8px; width: 100%; height: 2px; background: #333; }
}

/* Utils */
.portal-buttons { display: flex; gap: 10px; }
.portal-btn { padding: 4px 12px; border-radius: 4px; text-decoration: none; color: #fff !important; font-size: 12px; }
.portal-btn.student { background: var(--accent); }
.portal-btn.login { background: var(--secondary); }
.nav-cta { background: var(--primary); color: #fff !important; padding: 8px 18px; border-radius: 4px; }/* End custom CSS */