/*
Theme Name: Annida Institute Complete
Theme URI: https://annidainstitute.com/
Author: Annida Institute
Description: Complete responsive WordPress theme for Annida Institute — Bangla-first Islamic education website.
Version: 2.0.0
Text Domain: annida-institute
*/
:root{--navy:#14213d;--orange:#fca311;--ink:#182230;--muted:#667085;--light:#f7f8fb;--white:#fff;--border:#e7eaf0;--radius:18px;--shadow:0 12px 35px rgba(20,33,61,.09)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:system-ui,-apple-system,"Segoe UI","Noto Sans Bengali",Arial,sans-serif;color:var(--ink);background:#fff;line-height:1.7}a{color:inherit;text-decoration:none}img{max-width:100%;height:auto}.container{width:min(1140px,92%);margin:auto}
.site-header{position:sticky;top:0;z-index:99;background:rgba(255,255,255,.96);backdrop-filter:blur(12px);border-bottom:1px solid var(--border)}.header-inner{min-height:78px;display:flex;align-items:center;gap:22px}.site-brand{display:flex;align-items:center;gap:12px;min-width:190px}.site-brand img{max-height:54px;width:auto}.brand-name{font-weight:800;color:var(--navy);font-size:20px}.main-nav{margin-left:auto;display:flex;align-items:center;gap:5px}.main-nav a{padding:9px 11px;font-weight:650;font-size:14px;color:#293449;border-radius:10px}.main-nav a:hover{background:#f4f6fa;color:var(--navy)}.nav-cta{background:var(--orange)!important;color:#111827!important;padding:10px 16px!important}.login-link{border:1px solid var(--navy)}.language-switch{font-size:13px!important;color:var(--navy)!important}.menu-toggle{display:none;border:0;background:none;font-size:27px;color:var(--navy)}
.hero{background:linear-gradient(135deg,var(--navy),#20365f);color:#fff;padding:90px 0 85px;position:relative;overflow:hidden}.hero:after{content:"";position:absolute;width:360px;height:360px;border-radius:50%;right:-130px;top:-150px;background:rgba(252,163,17,.12)}.hero-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:55px;align-items:center;position:relative;z-index:1}.eyebrow{display:inline-block;color:var(--orange);font-weight:800;letter-spacing:.08em;font-size:13px;margin-bottom:14px}.hero h1{font-size:clamp(40px,5vw,66px);line-height:1.12;margin:0 0 18px}.hero p{font-size:19px;color:#e8edf7;max-width:690px;margin:0 0 28px}.hero-actions{display:flex;gap:12px;flex-wrap:wrap}.btn{display:inline-flex;align-items:center;justify-content:center;border-radius:11px;padding:12px 20px;font-weight:800;border:1px solid transparent;transition:.2s}.btn-primary{background:var(--orange);color:#111827}.btn-primary:hover{transform:translateY(-1px)}.btn-light{background:#fff;color:var(--navy)}.hero-card{background:#fff;color:var(--ink);border-radius:24px;padding:28px;box-shadow:0 20px 55px rgba(0,0,0,.2)}.hero-card .big{font-size:24px;font-weight:850;color:var(--navy);margin:0 0 8px}.hero-card p{font-size:15px;color:var(--muted);margin:0 0 18px}.hero-card .offer{border-left:4px solid var(--orange);padding-left:15px}.hero-card .offer strong{display:block;color:var(--navy);font-size:18px}
.section{padding:78px 0}.section-alt{background:var(--light)}.section-head{text-align:center;max-width:750px;margin:0 auto 36px}.section-head h2{font-size:34px;line-height:1.25;color:var(--navy);margin:0 0 9px}.section-head p{color:var(--muted);margin:0}.features{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.feature,.course-card,.blog-card{background:#fff;border:1px solid var(--border);border-radius:var(--radius);padding:24px;box-shadow:var(--shadow)}.feature-icon{width:48px;height:48px;border-radius:13px;background:#fff3dc;color:#9a6100;display:grid;place-items:center;font-size:23px;margin-bottom:14px}.feature h3{font-size:18px;color:var(--navy);margin:0 0 5px}.feature p{color:var(--muted);font-size:14px;margin:0}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}.course-card{padding:0;overflow:hidden}.course-thumb{background:linear-gradient(135deg,var(--navy),#263d68);min-height:145px;display:flex;align-items:center;justify-content:center;color:#fff;font-weight:850;font-size:22px;text-align:center;padding:20px}.course-body{padding:22px}.course-body h3{color:var(--navy);margin:0 0 7px;font-size:20px}.course-body p{color:var(--muted);font-size:14px;margin:0 0 16px}.course-meta{font-size:13px;color:#596273;margin-bottom:16px}
.why-grid{display:grid;grid-template-columns:1fr 1fr;gap:45px;align-items:center}.why-box{background:var(--navy);color:#fff;border-radius:24px;padding:38px}.why-box h3{font-size:30px;margin:0 0 10px}.why-box p{color:#e6ebf4}.check-list{display:grid;gap:12px;padding:0;margin:22px 0 0;list-style:none}.check-list li:before{content:"✓";color:var(--orange);font-weight:900;margin-right:10px}
.gallery-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.gallery-placeholder{min-height:170px;border-radius:16px;background:linear-gradient(135deg,#eef1f6,#dfe5ee);display:grid;place-items:center;color:#6a7384;font-weight:700}
.blog-card{padding:0;overflow:hidden}.blog-img{height:150px;background:#e9edf4}.blog-body{padding:20px}.blog-body h3{margin:0 0 7px;color:var(--navy);font-size:19px}.blog-body p{color:var(--muted);font-size:14px;margin:0 0 13px}
.cta{background:var(--navy);color:#fff;text-align:center;padding:65px 0}.cta h2{font-size:34px;margin:0 0 10px}.cta p{color:#dfe6f2;margin:0 auto 22px;max-width:700px}
.site-footer{background:#0d172b;color:#dbe3ef;padding:55px 0 20px}.footer-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1.2fr;gap:35px}.site-footer h3{color:#fff;font-size:17px;margin:0 0 12px}.site-footer p,.site-footer li{font-size:14px;color:#aebbd0}.site-footer ul{list-style:none;margin:0;padding:0;display:grid;gap:6px}.footer-brand{font-size:24px;font-weight:850;color:#fff}.footer-bottom{border-top:1px solid rgba(255,255,255,.12);margin-top:35px;padding-top:17px;display:flex;justify-content:space-between;gap:15px;font-size:13px;color:#98a7bd}.footer-accent{color:var(--orange)}
.page-hero{background:var(--navy);color:#fff;padding:48px 0}.page-hero h1{margin:0;font-size:42px}.content-area{padding:55px 0}.content-area h2,.content-area h3{color:var(--navy)}
@media(max-width:900px){.hero-grid,.why-grid{grid-template-columns:1fr}.features,.cards{grid-template-columns:repeat(2,1fr)}.gallery-grid{grid-template-columns:repeat(2,1fr)}.footer-grid{grid-template-columns:repeat(2,1fr)}.main-nav{display:none;position:absolute;left:0;right:0;top:78px;background:#fff;border-bottom:1px solid var(--border);padding:12px;flex-direction:column;align-items:stretch;box-shadow:var(--shadow)}.main-nav.open{display:flex}.main-nav a{padding:12px 14px}.menu-toggle{display:block;margin-left:auto}}
@media(max-width:600px){.header-inner{min-height:68px}.site-brand img{max-height:45px}.brand-name{font-size:17px}.hero{padding:60px 0}.hero h1{font-size:39px}.hero p{font-size:17px}.section{padding:55px 0}.section-head h2,.cta h2{font-size:29px}.features,.cards,.gallery-grid,.footer-grid{grid-template-columns:1fr}.footer-bottom{display:block}.footer-bottom div+div{margin-top:8px}}
/* =========================
   ANNIDA HERO IMAGE
========================= */

.hero {
    background: linear-gradient(135deg, #14213d 0%, #20365f 100%);
    color: #fff;
    padding: 80px 0;
    overflow: hidden;
}

.hero-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    align-items: center;
    gap: 55px;
}

.hero-content {
    position: relative;
    z-index: 2;
}

.hero .eyebrow {
    color: #fca311;
    font-weight: 800;
    letter-spacing: .06em;
}

.hero h1 {
    font-size: clamp(42px, 5vw, 72px);
    line-height: 1.12;
    margin: 18px 0;
    color: #fff;
}

.hero p {
    font-size: 20px;
    line-height: 1.8;
    color: #e8edf7;
    max-width: 680px;
}

.hero-actions {
    display: flex;
    gap: 14px;
    margin-top: 30px;
    flex-wrap: wrap;
}

.btn-light {
    background: #fff;
    color: #14213d;
}

.hero-features {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 10px;
    margin-top: 45px;
}

.hero-features div {
    border-left: 2px solid rgba(252,163,17,.8);
    padding-left: 14px;
}

.hero-features strong {
    display: block;
    font-size: 15px;
    color: #fff;
}

.hero-features span {
    display: block;
    font-size: 13px;
    color: #cbd5e7;
    margin-top: 4px;
}

.hero-image {
    position: relative;
}

.hero-image img {
    display: block;
    width: 100%;
    max-width: 680px;
    margin: 0 auto;
    border-radius: 28px;
    box-shadow: 0 25px 70px rgba(0,0,0,.30);
}


/* MOBILE */

@media (max-width: 850px) {

    .hero {
        padding: 55px 0;
    }

    .hero-grid {
        grid-template-columns: 1fr;
        gap: 35px;
    }

    .hero h1 {
        font-size: 44px;
    }

    .hero p {
        font-size: 17px;
    }

    .hero-features {
        grid-template-columns: repeat(2, 1fr);
    }

    .hero-image {
        order: -1;
    }

}