/* ========================================================= CRITICAL CSS — Inline in Only above-fold content: body, topbar, navbar Bootstrap loads async after this ========================================================= */ :root{ --primary:#e8622a; --primary-dark:#c4491a; --navy:#0c1f3f; --navy-light:#132a54; --text:#1a1a2e; --text-muted:#6b7280; --border:#e5e7eb; --bg:#f8f7f4; --card:#ffffff; --radius:12px; --radius-lg:18px; --font-head:'Playfair Display',Georgia,'Times New Roman',serif; --font-body:'Inter',system-ui,-apple-system,BlinkMacSystemFont,sans-serif; --shadow-sm:0 1px 3px rgba(0,0,0,.06),0 2px 8px rgba(0,0,0,.05); --shadow:0 2px 8px rgba(0,0,0,.08),0 8px 24px rgba(0,0,0,.06); --shadow-lg:0 4px 16px rgba(0,0,0,.1),0 16px 40px rgba(0,0,0,.08); } *,*::before,*::after{box-sizing:border-box} html{scroll-behavior:smooth;-webkit-text-size-adjust:100%} body{font-family:var(--font-body);background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased;line-height:1.65} a{text-decoration:none} img{max-width:100%;height:auto;display:block} /* Reading Progress */ #read-progress{position:fixed;top:0;left:0;height:3px;width:0;background:linear-gradient(90deg,var(--primary),#f59e0b);z-index:9999;pointer-events:none;transition:width .08s linear} /* Top Bar */ .ad-topbar{background:var(--navy);padding:.4rem 0;font-size:.72rem;color:#94a3b8} .ad-topbar a{color:#94a3b8;transition:color .15s}.ad-topbar a:hover{color:#fff} .ad-topbar .tb-wrap{display:flex;align-items:center;justify-content:space-between} .ad-topbar .tb-social a{margin-left:.75rem;font-size:.85rem} /* Navbar — critical for above-fold LCP */ .main-navbar{background:#fff!important;border-bottom:1px solid var(--border);transition:box-shadow .2s} .main-navbar.scrolled{box-shadow:0 2px 20px rgba(0,0,0,.08)!important} .main-navbar .navbar-brand{font-family:var(--font-head);font-size:1.1rem;font-weight:700;color:var(--navy)!important;display:flex;align-items:center;gap:.625rem} .main-navbar .navbar-brand .brand-tagline{font-size:.6rem;color:var(--text-muted);font-family:var(--font-body);display:block;line-height:1;margin-top:2px} .main-navbar .nav-link{font-size:.84rem;font-weight:500;color:var(--text-muted)!important;padding:.45rem .8rem!important;border-radius:8px;transition:color .15s,background .15s} .main-navbar .nav-link:hover,.main-navbar .nav-link.active{color:var(--navy)!important;background:#f3f4f6} .main-navbar .dropdown-menu{border:1px solid var(--border);border-radius:var(--radius-lg);padding:.5rem;box-shadow:var(--shadow-lg);margin-top:.5rem!important;min-width:220px} .main-navbar .dropdown-item{font-size:.82rem;border-radius:8px;padding:.45rem .875rem;color:var(--text);display:flex;align-items:center;gap:.625rem;transition:background .15s} .main-navbar .dropdown-item:hover{background:#f3f4f6;color:var(--navy)} .navbar-search-input{border:1.5px solid var(--border)!important;border-radius:20px!important;font-size:.8rem;width:180px;background:#f9fafb!important;padding:.38rem .875rem!important;transition:all .2s!important;font-family:var(--font-body)} .navbar-search-input:focus{border-color:var(--primary)!important;background:#fff!important;width:210px;box-shadow:0 0 0 3px rgba(232,98,42,.12)!important;outline:none} .navbar-search-btn{background:none;border:none;color:var(--text-muted);cursor:pointer;padding:.38rem .5rem}