/* JobsHub Blog shared layout — header/footer/responsive */
* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; overflow-x: hidden; }
body { font-family:'Poppins',Arial,sans-serif; background:var(--bg); color:var(--white); line-height:1.6; }
.container { width:90%; max-width:1200px; margin:0 auto; padding:10px; }
.header { position:sticky; top:0; z-index:999; background:rgba(17,24,39,.72); backdrop-filter:blur(18px); -webkit-backdrop-filter:blur(18px); border-bottom:1px solid rgba(255,255,255,.08); box-shadow:0 10px 30px rgba(0,0,0,.18); }
.navbar { max-width:1280px; margin:0 auto; padding:16px 30px; display:flex; align-items:center; justify-content:space-between; gap:18px; }
.logo { display:flex; align-items:center; gap:10px; font-size:24px; font-weight:700; color:#4ade80; }
.nav-menu { display:flex; align-items:center; justify-content:center; gap:22px; list-style:none; margin:0; padding:0; }
.nav-menu li { list-style:none; }
.nav-link { position:relative; display:inline-block; padding:8px 0; color:#d1d5db; font-weight:500; font-size:15px; text-decoration:none; }
.nav-link:hover,.nav-link.active { color:#4ade80; }
.nav-link.active::after,.nav-link:hover::after { content:""; position:absolute; left:0; bottom:-5px; width:100%; height:2px; background:#4ade80; }
.nav-buttons { display:flex; gap:10px; flex-shrink:0; }
.btn { display:inline-flex; align-items:center; justify-content:center; padding:10px 18px; border-radius:12px; font-weight:600; cursor:pointer; text-decoration:none; }
.btn-outline { border:1px solid #16a34a; color:#4ade80; background:transparent; }
.btn-outline:hover { background:linear-gradient(135deg,#16a34a,#15803d); color:#fff; }
.hamburger { display:none; flex-direction:column; gap:6px; cursor:pointer; flex-shrink:0; width:32px; height:32px; justify-content:center; }
.hamburger span { width:28px; height:3px; background:#22c55e; border-radius:5px; transition:.3s; }
.hamburger.active span:nth-child(1){transform:rotate(45deg) translate(6px,6px)} .hamburger.active span:nth-child(2){opacity:0} .hamburger.active span:nth-child(3){transform:rotate(-45deg) translate(7px,-7px)}
.footer { background:#050d0a; padding:60px 20px 20px; }
.footer-container { max-width:1200px; margin:auto; display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:30px; }
.footer-logo { color:#4ade80; margin-bottom:10px; }
.footer-col p { color:#cbd5e1; font-size:14px; }
.footer-col h3 { margin-bottom:12px; }
.footer-col ul { list-style:none; margin:0; padding:0; }
.footer-col ul li { margin-bottom:8px; }
.footer-col ul li a { color:#cbd5e1; font-size:14px; text-decoration:none; }
.footer-col ul li a:hover { color:#4ade80; }
.footer-col i { color:#94a3b8; margin:5px 10px 5px 5px; }
.footer-bottom { text-align:center; margin-top:30px; border-top:1px solid rgba(255,255,255,.1); padding-top:15px; color:#94a3b8; font-size:14px; }
.floating { position:fixed; right:20px; z-index:999; width:50px; height:50px; display:flex; align-items:center; justify-content:center; border-radius:50%; font-size:20px; color:#fff; cursor:pointer; box-shadow:0 10px 25px rgba(0,0,0,.3); }
.whatsapp { bottom:80px; background:#15803d; } .top-btn { bottom:20px; background:#15803d; display:none; border:0; }
[data-theme="light"] .header,[data-theme="light"] .navbar { background:#fff !important; border-color:#d1fae5 !important; }
[data-theme="light"] .nav-menu { background:#fff !important; }
[data-theme="light"] .nav-link { color:#1a1f1c !important; }
[data-theme="light"] .nav-link:hover,[data-theme="light"] .nav-link.active { color:#15803d !important; }
[data-theme="light"] .footer { background:#fff !important; }
[data-theme="light"] .footer-col p,[data-theme="light"] .footer-col ul li a { color:#4b5563 !important; }
[data-theme="light"] .footer-col h3,[data-theme="light"] .footer-bottom { color:#1a1f1c !important; }
@media (max-width:992px){ .navbar{padding:14px 20px}.nav-menu{gap:16px}.nav-buttons{gap:8px} }
@media (max-width:768px){
 .navbar{padding:12px 16px}.hamburger{display:flex}
 .nav-menu{position:absolute;top:100%;left:0;width:100%;display:flex;flex-direction:column;align-items:stretch;gap:0;padding:10px 16px 18px;background:#0f2318;border-top:1px solid rgba(74,222,128,.15);transform:translateY(-10px);opacity:0;visibility:hidden;transition:.2s ease;box-shadow:0 12px 24px rgba(0,0,0,.25)}
 .nav-menu.active{transform:translateY(0);opacity:1;visibility:visible}.nav-menu li{width:100%}.nav-link{display:block;width:100%;padding:12px 8px;text-align:center}.nav-link.active::after,.nav-link:hover::after{display:none}.nav-buttons{display:none}
 .nav-menu-buttons{width:100%;padding:10px 8px 0}.nav-menu-buttons .nav-buttons{display:flex !important;flex-direction:column;width:100%;gap:10px}.nav-menu-buttons .btn{width:100%}
 [data-theme="light"] .nav-menu{background:#fff !important}
 .footer{padding:42px 18px 18px}.footer-container{grid-template-columns:1fr;gap:26px}
 .blog-hero{padding:42px 16px 24px !important}.blog-hero h1{font-size:clamp(26px,7vw,34px) !important}.blog-subtitle{font-size:14px !important}
 .blog-toolbar-section,.blog-list-section,.blog-post-section{padding-left:14px !important;padding-right:14px !important}.blog-grid{grid-template-columns:1fr !important;gap:18px !important}
 .blog-categories{justify-content:flex-start !important;overflow-x:auto;flex-wrap:nowrap !important;padding:2px 2px 8px;scrollbar-width:none}.blog-categories::-webkit-scrollbar{display:none}.category-chip{flex:0 0 auto;white-space:nowrap;padding:8px 14px !important}
 .blog-post-container{max-width:100% !important}.blog-post-header h1{font-size:clamp(25px,7vw,30px) !important}.blog-post-content{font-size:15px !important;line-height:1.75 !important}.blog-post-content table{display:block;max-width:100%;overflow-x:auto;white-space:nowrap}.blog-share{flex-wrap:wrap}.affiliate-card{flex-direction:column;align-items:flex-start}
}
@media (max-width:420px){.logo{font-size:21px}.blog-card-body{padding:16px}.blog-card h3{font-size:17px}.blog-post-content h2{font-size:20px}}