/* responsive.css — breakpoints and mobile specific overrides */

/* default smaller adjustments for 1024 and below */
@media (max-width: 1024px) {
    .hero-content { grid-template-columns:1fr; text-align:center; padding:0 2rem; }
    .hero-image { order:-1; }
    .hero-buttons { justify-content:center; }
    .stats-container { grid-template-columns: repeat(2,1fr); }
    .contact-grid { grid-template-columns:1fr; }
    .slider-controls { padding: 0 0.5rem; }
}

/* Tablet specific (760px - 960px) */
@media (max-width: 960px) and (min-width: 760px) {
    .nav-menu { gap:1.5rem; }
    .nav-menu a { font-size:0.85rem; }
    .enroll-btn { padding:.7rem 1.5rem; font-size:.9rem; }
    .logo-name { font-size:1.3rem; }
    .logo-tagline { font-size:.65rem; }

    .dropdown-menu { min-width: 90vw; max-width: 90vw; left:50%; right:auto; }
}

/* 961 - 1200 adjustments */
@media (max-width: 1200px) and (min-width: 961px) {
    .dropdown-menu { min-width:600px; max-width:700px; }
    .dropdown-menu-grid { gap:1rem; }
    .course-category { padding:0.8rem; }
    .category-courses li a { font-size:0.8rem; padding:0.4rem 0.6rem; }
}

/* Mobile (<=768px) */
@media (max-width: 768px) {
    .nav-menu {
        position:fixed; left:-100%; top:80px; flex-direction:column; background:var(--white); width:100%; text-align:center;
        transition:0.3s; box-shadow:0 10px 27px rgba(0,0,0,0.1); padding:2rem 1rem; gap:1.5rem;
        max-height: calc(100vh - 80px); overflow-y:auto;
    }
    .nav-menu.active { left:0; }
    .hamburger { display:flex; }

    /* Mobile Dropdown Overrides */
    .dropdown { width:100%; }
    .dropdown-toggle { width:100%; justify-content:center; padding:.5rem; }
    .dropdown-menu {
        position:relative; top:0; left:0 !important; right:0; transform:none !important; width:100%; min-width:auto; max-width:100%;
        box-shadow:none; margin-top:.5rem; background:var(--light); max-height:0; overflow:hidden; transition: max-height .3s ease, padding .3s ease; padding:0; border-radius:10px;
    }
    .dropdown.active .dropdown-menu { max-height:600px; padding:1rem; overflow-y:auto; transform:none !important; }
    .dropdown-menu-grid { grid-template-columns:1fr; gap:1rem; width:100%; }
    .course-category { background:var(--white); width:100%; margin:0; }
    .category-header { font-size:0.95rem; text-align:left; }
    .category-courses li a { padding:0.7rem 0.8rem; background:var(--light); margin-bottom:.3rem; border-radius:6px; font-size:0.9rem; width:100%; text-align:left; display:block; }
    .category-courses li a:hover { background:var(--primary); color:var(--white); padding-left:1rem; box-shadow:0 2px 8px rgba(0,0,0,0.1); }

    .hero { padding:4rem 2rem; }
    .hero-text h1 { font-size:2.5rem; }
    .hero-text p { font-size:1.1rem; }
    .hero-buttons { flex-direction:column; }

    .slider-controls { display:none; }
    .slider-dots { bottom:1rem; }
    .slider-dot { width:10px; height:10px; }
    .slider-dot.active { width:25px; }

    .stats-container { grid-template-columns:1fr; gap:2rem; }
    .features-grid { grid-template-columns:1fr; }
    .section { padding:3rem 1.5rem; }
    .section-title { font-size:2rem; }
    .courses-grid { grid-template-columns:1fr; }
    .modal-content { padding:2rem 1.5rem; }
    .contact-form { padding:2rem; }
    .nav-container { padding:1.2rem 1.5rem; }

    .logo-img { height:40px; }
    .logo-name { font-size:1.2rem; }
    .logo-tagline { font-size:0.6rem; }
}