/* ==========================================================
   Shital Academy - Menu + Responsive Fix
   Aa file style.css na PACHI load karvi (bootstrap.min.css ane
   style.css ni niche), jethi badha overrides apply thay.
   ========================================================== */

/* ---------- Base / global responsive ---------- */
html {
    scroll-padding-top: 90px;          /* sticky menu niche heading na chhupay */
    -webkit-text-size-adjust: 100%;
}

html, body {
    max-width: 100%;
    overflow-x: hidden;                /* horizontal scroll nahi */
}

img, video, svg, canvas, iframe, embed, object {
    max-width: 100%;
}

img, video {
    height: auto;
}

table { max-width: 100%; }

/* Lamba words / uppercase headings screen bahar na jay */
h1, h2, h3, h4, h5, h6, p, a, li, td, th {
    overflow-wrap: break-word;
    word-wrap: break-word;
}

/* Headings: fixed 26px ne badle device pramane size */
h1, .h1 { font-size: clamp(1.6rem, 1.1rem + 2.2vw, 2.4rem); line-height: 1.25; }
h2, .h2 { font-size: clamp(1.4rem, 1.05rem + 1.6vw, 2rem);  line-height: 1.25; }
h3, .h3 { font-size: clamp(1.25rem, 1rem + 1.1vw, 1.6rem);  line-height: 1.3; }
h4, .h4 { font-size: clamp(1.1rem, 0.95rem + 0.7vw, 1.35rem); line-height: 1.3; }

.display-1, .display-2, .display-3,
.display-4, .display-5, .display-6 {
    font-size: clamp(1.8rem, 1.2rem + 3vw, 3.2rem);
    line-height: 1.2;
}

/* ==========================================================
   NAVBAR (MENU) - solid, clean, attractive
   ========================================================== */
.navbar,
.navbar.navbar-light,
.navbar.bg-white,
.navbar.bg-light,
.navbar.bg-transparent {
    background-color: #ffffff !important;   /* transparent problem fix */
    opacity: 1 !important;
    box-shadow: 0 4px 18px rgba(16, 55, 65, .10);
    
    z-index: 1030;                          /* carousel / content ni upar */
}

.navbar.sticky-top { z-index: 1030; }

/* Brand / logo */
.navbar-brand {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-right: 1rem;
    padding-top: 6px;
    padding-bottom: 6px;
    max-width: 75%;
}

.navbar-brand img {
    max-height: 58px;
    width: auto;
    height: auto;
}

.navbar-brand h1 {
    margin: 0;
    font-size: clamp(1.05rem, 0.9rem + 1.1vw, 1.6rem);
    line-height: 1.15;
    color: var(--primary);
}

/* Menu links (desktop) */
.navbar .navbar-nav .nav-link {
    position: relative;
    color: var(--dark);
    font-weight: 600;
    font-size: 15px;
    letter-spacing: .3px;
    padding: 26px 14px;
    transition: color .3s ease;
}

/* hover par niche red line animation */
.navbar .navbar-nav .nav-link::before {
    content: "";
    position: absolute;
    left: 14px;
    right: 14px;
    bottom: 16px;
    height: 2px;
    background: var(--primary);
    transform: scaleX(0);
    transform-origin: left;
    transition: transform .3s ease;
}

.navbar .navbar-nav .nav-link:hover::before,
.navbar .navbar-nav .nav-link.active::before,
.navbar .navbar-nav .nav-item:hover > .nav-link::before {
    transform: scaleX(1);
}

.navbar .navbar-nav .nav-link:hover,
.navbar .navbar-nav .nav-link:focus,
.navbar .navbar-nav .nav-link.active,
.navbar .navbar-nav .show > .nav-link {
    color: var(--primary);
}

/* Navbar ma button (Join Now / Contact vagere) */
.navbar .btn.btn-primary,
.navbar .btn-primary {
    border-radius: 50px;
    padding: 8px 22px;
    font-weight: 600;
    color: #fff;
    box-shadow: 0 6px 14px rgba(238, 28, 37, .25);
}

.navbar .btn.btn-primary:hover {
    background-color: var(--dark);
    border-color: var(--dark);
    transform: translateY(-1px);
}

/* Dropdown (sub-menu): solid white, shadow, rounded */
.navbar .dropdown-menu {
    background-color: #ffffff !important;
    opacity: 1;
    min-width: 220px;
    padding: 8px 0;
    border: 0;
    border-top: 3px solid var(--primary);
    border-radius: 0 0 12px 12px;
    box-shadow: 0 14px 30px rgba(16, 55, 65, .18);
    z-index: 1040;
}

.navbar .dropdown-item {
    padding: 10px 22px;
    font-weight: 500;
    color: var(--dark);
    white-space: normal;
    transition: background-color .25s ease, color .25s ease, padding-left .25s ease;
}

.navbar .dropdown-item:hover,
.navbar .dropdown-item:focus,
.navbar .dropdown-item.active {
    background-color: var(--light);
    color: var(--primary);
    padding-left: 28px;
}

/* Hamburger button */
.navbar-toggler {
    border: 1px solid var(--primary);
    border-radius: 8px;
    padding: 6px 10px;
    color: var(--primary);
}

.navbar-toggler:focus {
    box-shadow: 0 0 0 .2rem rgba(238, 28, 37, .25);
}

.navbar-light .navbar-toggler-icon {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='%23ee1c25' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2.5' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
}

/* Desktop: dropdown hover vakhate hidden hoy tyare click block na kare */
@media (min-width: 992px) {
    .navbar .nav-item .dropdown-menu {
        pointer-events: none;
        border-radius: 0 0 12px 12px;
    }

    .navbar .nav-item:hover .dropdown-menu,
    .navbar .nav-item .dropdown-menu.show {
        pointer-events: auto;
    }
}

/* Tablet + Mobile: slide-down solid menu */
@media (max-width: 991.98px) {
    .navbar {
        padding-top: 4px;
        padding-bottom: 4px;
    }

    .navbar-collapse {
        background-color: #ffffff;           /* mobile ma pan solid */
        margin-top: 8px;
        padding: 6px 16px 14px;
        border-radius: 0 0 14px 14px;
        max-height: calc(100vh - 90px);
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
    }

    .navbar .navbar-nav {
        margin-top: 8px;
        border-top: 1px solid #eee;
    }

    .navbar .navbar-nav .nav-link {
        padding: 13px 4px;
        font-size: 16px;
        border-bottom: 1px solid #f1f1f1;
    }

    .navbar .navbar-nav .nav-link::before { display: none; }

    .navbar .navbar-nav .nav-link.active {
        color: var(--primary);
        padding-left: 12px;
        border-left: 3px solid var(--primary);
    }

    .navbar .dropdown-menu {
        position: static !important;
        float: none;
        box-shadow: none;
        border: 0;
        border-left: 3px solid var(--primary);
        border-radius: 0;
        background-color: var(--light) !important;
        margin: 0 0 6px 10px;
        padding: 4px 0;
        transform: none !important;
    }

    .navbar .btn.btn-primary,
    .navbar .btn-primary {
        display: block;
        width: 100%;
        margin-top: 12px;
        text-align: center;
    }
}

@media (max-width: 575.98px) {
    .navbar-brand img { max-height: 44px; }
    .navbar-brand { max-width: 78%; }
}

/* ==========================================================
   HERO / CAROUSEL / PAGE HEADER
   ========================================================== */
.header-carousel .owl-carousel-item img {
    object-fit: cover;
}

@media (max-width: 991.98px) {
    .header-carousel .owl-nav {
        right: 3%;
    }

    .header-carousel .owl-nav .owl-prev,
    .header-carousel .owl-nav .owl-next {
        width: 38px;
        height: 38px;
        font-size: 18px;
        margin: 5px 0;
    }
}

@media (max-width: 575.98px) {
    .header-carousel .owl-carousel-item {
        min-height: 420px;
    }

    .header-carousel .owl-carousel-item h1 {
        font-size: 1.6rem;
    }

    .header-carousel .owl-nav {
        top: auto;
        bottom: 18px;
        right: 50%;
        transform: translateX(50%);
        flex-direction: row;
        gap: 10px;
    }

    .page-header { padding-top: 2.5rem !important; padding-bottom: 2.5rem !important; }
}

/* ==========================================================
   SECTIONS (facility, classes, team, testimonial, footer)
   ========================================================== */
@media (max-width: 767.98px) {
    .facility-item .facility-icon { width: 160px; }

    .team-item .team-text {
        width: 140px;
        height: 80px;
    }

    .testimonial-carousel {
        padding-left: 1rem;
        padding-right: 1rem;
    }

    .testimonial-carousel .owl-nav { display: none; }

    .classes-item:hover { margin-top: 0; }   /* touch ma jump na thay */

    .btn { white-space: normal; }
}

/* Touch devices ma sticky hover color problem na thay */
@media (hover: none) {
    .facility-item:hover .facility-icon::before,
    .facility-item:hover .facility-text::before {
        background: rgba(255, 255, 255, .9);
    }

    .facility-item:hover * { color: inherit !important; }
}

/* Footer */
@media (max-width: 767.98px) {
    .footer .copyright {
        text-align: center;
        padding: 18px 0;
    }

    .footer .footer-menu {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        gap: 6px 0;
        margin-top: 10px;
    }

    .footer .btn.btn-social {
        width: 40px;
        height: 40px;
    }
}

/* Back to top button */
@media (max-width: 575.98px) {
    .back-to-top {
        right: 16px;
        bottom: 16px;
    }
}

/* Forms: mobile par zoom na thay */
@media (max-width: 575.98px) {
    .form-control, .form-select {
        font-size: 16px;
    }
}

/* Animation ochi karva mangta users mate */
@media (prefers-reduced-motion: reduce) {
    * {
        animation-duration: .01ms !important;
        transition-duration: .01ms !important;
        scroll-behavior: auto !important;
    }
}