/* ============================================
   VAZEER CAPITALS — Shared Mobile-Responsive CSS
   Include in all HTML pages
   ============================================ */

/* COMPLIANCE BAR */
.ctb{position:fixed;top:0;left:0;right:0;z-index:10000;background:#0f172a;color:#94a3b8;font-size:0.72rem;font-weight:600;text-align:center;padding:7px 16px;display:flex;align-items:center;justify-content:center;gap:14px;flex-wrap:wrap;}
.rb{display:inline-flex;align-items:center;gap:4px;color:white;font-weight:700;font-size:0.7rem;}
.rb i{color:#e11d48;}

/* NAVBAR */
.navbar{position:fixed;left:0;right:0;z-index:9999;background:rgba(255,255,255,0.97);backdrop-filter:blur(20px);border-bottom:1px solid #e2e8f0;height:64px;display:flex;align-items:center;transition:top 0.3s;}
.navbar.scrolled{box-shadow:0 4px 20px rgba(0,0,0,.08);}
.nav-container{max-width:1300px;margin:0 auto;width:100%;padding:0 20px;display:flex;align-items:center;gap:8px;}
.nav-logo{font-size:1.3rem;font-weight:900;color:#1e293b;white-space:nowrap;margin-right:20px;text-decoration:none;}
.nav-logo span{color:#e11d48;}
.nav-links{display:flex;align-items:center;gap:3px;flex:1;}
.nav-link{padding:7px 12px;border-radius:8px;font-weight:600;font-size:0.85rem;color:#64748b;text-decoration:none;}
.nav-link:hover{color:#1e293b;background:#f8fafc;}
.nav-link.active{color:#e11d48;font-weight:700;}
.nav-actions{display:flex;align-items:center;gap:8px;margin-left:auto;}
.btn-outline{height:38px;padding:0 16px;border:1.5px solid #e2e8f0;border-radius:10px;font-weight:700;font-size:0.82rem;color:#1e293b;background:white;display:inline-flex;align-items:center;text-decoration:none;}
.btn-outline:hover{border-color:#e11d48;color:#e11d48;}
.btn-primary{height:38px;padding:0 18px;border:none;border-radius:10px;font-weight:800;font-size:0.82rem;color:white;background:#e11d48;display:inline-flex;align-items:center;gap:6px;text-decoration:none;}
.btn-primary:hover{background:#be123c;}
.hamburger{display:none;background:none;border:none;font-size:1.4rem;cursor:pointer;color:#1e293b;padding:5px;margin-left:auto;}

/* MOBILE MENU */
.mobile-menu{display:none;position:fixed;inset:0;background:white;z-index:9998;flex-direction:column;overflow-y:auto;}
.mobile-menu.open{display:flex;}
.mm-header{display:flex;align-items:center;justify-content:space-between;padding:18px 20px;border-bottom:1px solid #e2e8f0;flex-shrink:0;}
.mm-logo{font-size:1.3rem;font-weight:900;color:#1e293b;}
.mm-logo span{color:#e11d48;}
.mm-close{background:none;border:none;font-size:1.4rem;cursor:pointer;color:#64748b;padding:5px;}
.mm-links{flex:1;padding:8px 0;}
.mm-link{display:flex;align-items:center;gap:12px;padding:16px 22px;font-size:1rem;font-weight:700;color:#1e293b;border-bottom:1px solid #f8fafc;text-decoration:none;}
.mm-link:hover,.mm-link.active{color:#e11d48;background:#fff1f2;}
.mm-link i{width:22px;text-align:center;color:#94a3b8;font-size:0.95rem;}
.mm-link:hover i,.mm-link.active i{color:#e11d48;}
.mm-footer{padding:18px 20px;display:flex;flex-direction:column;gap:10px;border-top:1px solid #e2e8f0;flex-shrink:0;}
.mm-btn-login{width:100%;height:48px;border:1.5px solid #e2e8f0;border-radius:12px;font-weight:700;font-size:0.95rem;color:#1e293b;background:white;display:flex;align-items:center;justify-content:center;text-decoration:none;}
.mm-btn-open{width:100%;height:48px;background:#e11d48;color:white;border:none;border-radius:12px;font-weight:800;font-size:0.95rem;display:flex;align-items:center;justify-content:center;gap:8px;text-decoration:none;}
.mm-compliance{padding:12px 18px;background:#0f172a;font-size:0.66rem;color:#64748b;text-align:center;line-height:1.6;flex-shrink:0;}

/* PAGE HERO */
.page-hero{background:linear-gradient(135deg,#0f172a,#1e293b);padding:70px 0;text-align:center;}
.page-hero h1{font-size:2.8rem;font-weight:900;color:white;margin-bottom:14px;}
.page-hero h1 span{color:#e11d48;}
.page-hero p{color:#94a3b8;max-width:560px;margin:0 auto;line-height:1.8;font-size:1rem;}
.breadcrumb{display:flex;align-items:center;justify-content:center;gap:8px;margin-bottom:16px;font-size:0.8rem;color:#64748b;}
.breadcrumb a{color:#64748b;text-decoration:none;}

/* COMMON */
.c,.container{max-width:1300px;margin:0 auto;padding:0 24px;}
.sl,.section-label{font-size:0.7rem;font-weight:800;text-transform:uppercase;letter-spacing:3px;color:#e11d48;margin-bottom:12px;}
.st,.section-title{font-size:2.2rem;font-weight:900;color:#1e293b;line-height:1.2;margin-bottom:14px;}
.ss,.section-sub{font-size:1rem;color:#64748b;line-height:1.8;}
.text-center{text-align:center;}

/* FOOTER */
footer{background:#0f172a;color:#94a3b8;padding:60px 0 0;}
.footer-grid,.fg,.fg2{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:45px;margin-bottom:45px;}
.footer-link,.fl,.flink{display:block;font-size:0.875rem;font-weight:600;color:#64748b;margin-bottom:10px;text-decoration:none;}
.footer-link:hover,.fl:hover,.flink:hover{color:white;}
.footer-col-title{font-size:0.68rem;font-weight:800;text-transform:uppercase;letter-spacing:2px;color:#475569;margin-bottom:16px;}

/* =========== RESPONSIVE =========== */
@media(max-width:900px){
    .nav-links{display:none;}
    .hamburger{display:flex;}
    .btn-outline,.btn-primary{display:none;}
    .footer-grid,.fg,.fg2{grid-template-columns:1fr 1fr;}
}
@media(max-width:768px){
    .c,.container{padding:0 16px;}
    section{padding:55px 0 !important;}
    .page-hero{padding:50px 0;}
    .page-hero h1{font-size:2.1rem;}
    .page-hero p{font-size:0.9rem;}
    .st,.section-title{font-size:1.9rem;}
    /* Force single column on all 2-col grids in sections */
    .mission-grid,.ctg,.two-col{grid-template-columns:1fr !important;gap:30px !important;}
}
@media(max-width:600px){
    .page-hero h1{font-size:1.8rem;}
    .st,.section-title{font-size:1.65rem;}
    .footer-grid,.fg,.fg2{grid-template-columns:1fr;}
    .rb.hide-xs{display:none;}
    .ctb{padding:5px 10px;gap:8px;font-size:0.65rem;}
    .ctb span:first-child{display:none;}
}
@media(max-width:380px){
    .page-hero h1{font-size:1.55rem;}
}
