  *, *::before, *::after { box-sizing: border-box; }
    body { font-family: 'Inter', sans-serif; background-color: #0d0d14; color: #e2e4ec; margin: 0; }

    /* Navbar */
    .site-nav { background:#0d0d14; border-bottom:1px solid #1e1e2e; padding:0 20px; height:60px; display:flex; align-items:center; justify-content:space-between; position:sticky; top:0; z-index:300; }
    .nav-logo { display:flex; align-items:center; gap:10px; text-decoration:none; flex-shrink:0; }
    .nav-logo-icon { width:32px; height:32px; background:linear-gradient(135deg,#7c5ff5,#ec4899); border-radius:8px; display:flex; align-items:center; justify-content:center; font-size:16px; }
    .nav-logo-text { font-size:1rem; font-weight:700; color:#fff; letter-spacing:-0.3px; }
    .nav-links { display:flex; align-items:center; gap:6px; }
    .nav-link { font-size:0.85rem; font-weight:500; color:#9ca3af; text-decoration:none; padding:6px 12px; border-radius:6px; transition:color .14s,background .14s; }
    .nav-link:hover { color:#fff; background:#1c1c2c; }
    .nav-btn { font-size:0.82rem; font-weight:600; color:#fff; background:linear-gradient(135deg,#7c5ff5,#ec4899); border:none; padding:7px 16px; border-radius:7px; cursor:pointer; text-decoration:none; margin-left:4px; transition:opacity .14s; white-space:nowrap; }
    .nav-btn:hover { opacity:.88; color:#fff; }

    /* Hamburger */
    .hamburger { display:none; flex-direction:column; justify-content:center; align-items:center; width:36px; height:36px; gap:5px; background:none; border:none; cursor:pointer; padding:4px; border-radius:6px; transition:background .14s; }
    .hamburger:hover { background:#1c1c2c; }
    .hamburger span { display:block; width:20px; height:2px; background:#9ca3af; border-radius:2px; transition:all .22s ease; transform-origin:center; }
    .hamburger.open span:nth-child(1) { transform:translateY(7px) rotate(45deg); }
    .hamburger.open span:nth-child(2) { opacity:0; transform:scaleX(0); }
    .hamburger.open span:nth-child(3) { transform:translateY(-7px) rotate(-45deg); }

    /* Mobile drawer */
    .mobile-menu { display:none; position:fixed; top:60px; left:0; right:0; background:#0d0d14; border-bottom:1px solid #1e1e2e; padding:12px 20px 20px; z-index:250; flex-direction:column; gap:4px; box-shadow:0 8px 32px rgba(0,0,0,0.5); }
    .mobile-menu.open { display:flex; }
    .mobile-menu .nav-link { font-size:0.95rem; padding:10px 14px; border-radius:8px; color:#e2e4ec; }
    .mobile-menu .nav-link:hover { background:#13131f; }
    .mobile-menu .nav-btn { margin:8px 0 0; text-align:center; padding:11px 16px; font-size:0.9rem; border-radius:9px; display:block; }

        /* Footer */
    .site-footer { text-align:center; padding:28px 16px; font-size:0.8rem; color:#4b5563; border-top:1px solid #1e1e2e; background:#0d0d14; }
    .footer-links { display:flex; justify-content:center; gap:20px; margin-top:8px; flex-wrap:wrap; }
    .footer-links a { color:#4b5563; text-decoration:none; font-size:0.78rem; transition:color .14s; }
    .footer-links a:hover { color:#9ca3af; }
.single-blog {
    margin-top: 50px;
}
.single-blog p, .single-blog a, .single-blog h2, .single-blog h3, .single-blog li{
    color: #9ca3af;
    font-family: 'Inter', sans-serif; 
}
.single-blog h2 {
    font-size: 1.5rem;
}
.single-blog h3 {
    font-size: 1.5rem;
}
.single-blog a{
    font-weight: 700;
}
       @media (max-width:700px) {
      .nav-links { display:none; }
      .hamburger { display:flex; } 
    }
    @media (max-width:380px) {
      .site-nav { padding:0 14px; }
    
    }