/* ShuleXpert site base layout — Education template essentials (local fallback) */

html { scroll-behavior: smooth; }
body {
    margin: 0;
    color: #777;
    font-size: 14px;
    line-height: 1.625;
    overflow-x: hidden;
}
a { transition: all 0.3s ease; text-decoration: none; }
a:hover { text-decoration: none; }
ul { list-style: none; margin: 0; padding: 0; }
img { max-width: 100%; height: auto; }

/* No extra gap below header — banner slides under fixed nav */
#main-content {
    padding-top: 0 !important;
}

/* Banner */
.banner-area {
    position: relative;
    background-size: cover;
    background-position: center;
}
.banner-area .overlay.overlay-bg {
    position: absolute;
    inset: 0;
    background: rgba(4, 9, 30, 0.45);
    z-index: 1;
}
.banner-area .container,
.banner-area .about-content {
    position: relative;
    z-index: 2;
}
.banner-area.fullscreen,
.banner-area .fullscreen {
    min-height: 100vh;
    min-height: 560px;
    display: flex;
    align-items: center;
}
.banner-content h1 {
    color: #fff;
    font-size: 42px;
    font-weight: 800;
    line-height: 1.15;
    margin-bottom: 16px;
}
.about-banner {
    min-height: 220px;
    display: flex;
    align-items: flex-end;
    padding-top: 110px;
    padding-bottom: 36px;
}
.about-content h1 {
    color: #fff;
    font-size: 36px;
    font-weight: 800;
    margin-bottom: 10px;
}
.link-nav a,
.link-nav span {
    color: #fff;
    font-size: 13px;
}
.link-nav span.lnr { margin: 0 8px; opacity: 0.8; }

/* Feature strip */
.feature-area { padding: 0 0 28px; margin-top: -48px; position: relative; z-index: 3; }
.single-feature {
    background: #fff;
    border: 1px solid #eee;
    margin-bottom: 20px;
}
.single-feature .title {
    padding: 14px 18px;
}
.single-feature .title h4 { margin: 0; font-size: 16px; }
.single-feature .desc-wrap {
    padding: 18px;
    background: #fff;
}
.single-feature .desc-wrap p { margin-bottom: 10px; font-size: 13px; }
.single-feature .desc-wrap a { font-weight: 700; font-size: 13px; }

/* Sections */
.section-gap { padding: 48px 0 56px; }
.footer-area.section-gap { padding: 70px 0 40px; }
.menu-content .title h1 { font-size: 32px; font-weight: 800; margin-bottom: 12px; }
.menu-content .title p { font-size: 14px; }

/* Info / CTA */
.info-area-left img { width: 100%; border: 1px solid #f0dada; }
.info-area-right h1 { font-size: 30px; font-weight: 800; margin-bottom: 16px; }
.cta-one-area, .cta-two-area { padding: 70px 0; }
.cta-two-area .cta-left h1 { color: #fff; font-size: 28px; font-weight: 800; margin: 0; }
.cta-two-area .cta-right { text-align: right; display: flex; align-items: center; justify-content: flex-end; }

/* Footer */
.footer-area {
    color: #aaa;
    padding: 70px 0 30px;
}
.single-footer-widget { margin-bottom: 24px; }
.single-footer-widget h4 {
    color: #fff;
    font-size: 18px;
    font-weight: 800;
    margin-bottom: 18px;
}
.single-footer-widget ul li { margin-bottom: 8px; }
.single-footer-widget ul li a {
    color: #aaa;
    font-size: 13px;
}
.footer-bottom {
    border-top: 1px solid rgba(255,255,255,0.08);
    padding-top: 22px;
    margin-top: 20px;
}
.footer-social a {
    color: #aaa;
    margin-left: 14px;
    font-size: 16px;
}

/* Buttons */
.primary-btn {
    display: inline-block;
    line-height: 42px;
    padding: 0 28px;
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}
.ml-10 { margin-left: 10px; }
.mt-10 { margin-top: 10px; }
.mt-20 { margin-top: 20px; }
.mt-30 { margin-top: 30px; }
.mb-10 { margin-bottom: 10px; }
.pb-70 { padding-bottom: 50px; }
.pb-120 { padding-bottom: 36px; }
.text-white { color: #fff !important; }
.text-uppercase { text-transform: uppercase; }
.text-center { text-align: center; }

/* Course / module page helpers */
.course-details-area .right-contents ul {
    border: 1px solid #f0dada;
    background: #fff;
}
.course-details-area .right-contents ul li {
    border-bottom: 1px solid #f0dada;
    padding: 12px 16px;
}
.course-details-area .right-contents ul li:last-child { border-bottom: none; }
.course-details-area .right-contents ul li a {
    display: flex;
    justify-content: space-between;
    color: #333;
    font-size: 13px;
}

/* Contact */
.contact-page-area .address-wrap .single-contact-address {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    margin-bottom: 18px;
}
.form-area .form-control {
    border-radius: 0;
    min-height: 46px;
}

/* Nav base */
#header.sx-site-header .sx-nav-bar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: nowrap;
    width: 100%;
    gap: 16px;
}
#header.sx-site-header #logo {
    flex: 0 0 auto;
}
#nav-menu-container {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex: 1 1 auto;
    min-width: 0;
}
.nav-menu {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: nowrap;
}
.nav-menu > li { margin-left: 10px; position: relative; }
.nav-menu a {
    display: inline-block;
    padding: 0 8px;
    font-size: 12px;
    font-weight: 500;
    text-transform: uppercase;
}
.nav-menu ul {
    display: none;
    position: absolute;
    top: 100%;
    right: 0;
    min-width: 180px;
    background: #fff;
    box-shadow: 0 8px 24px rgba(0,0,0,0.15);
    padding: 8px 0;
    z-index: 1000;
}
.nav-menu li:hover > ul { display: block; }
.nav-menu ul li a {
    display: block;
    padding: 8px 14px;
    color: #333 !important;
    text-transform: none;
    font-size: 12px;
}

/* Header top utilities */
.header-top-left ul li { display: inline-block; margin-right: 12px; }
.header-top-right { text-align: right; }
.header-top-right a { margin-left: 14px; font-size: 12px; color: #fff; }
.header-top-right .text { margin-left: 4px; }

@media (max-width: 991px) {
    #nav-menu-container { display: none !important; }
    .banner-content h1 { font-size: 30px; }
    .cta-two-area .cta-right { justify-content: flex-start; margin-top: 16px; }
}