/* LionPromos unified header v2 — FULLY SELF-CONTAINED.
   All colors are LITERALS copied from the reference rendering (contact.html / site.css palette).
   NEVER use var() here: subpages define different palettes (--gold:#D4AF37 on case-studies,
   --red undefined on solutions/blog) which hijack the header look. */
@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:wght@400;600;700;900&family=Montserrat:wght@400;600;700;800;900&display=swap');

/* ===== Layout container (self-contained; solutions/blog don't load site.css,
   which is where .container{1280px} normally lives — without this the header
   spans the full viewport and logo/lang-switcher get pushed to the extreme edges) ===== */
body .topbar .container,
body .header .container{max-width:1280px;margin:0 auto;padding:0 24px;width:100%;box-sizing:border-box}

/* ===== Topbar ===== */
body .topbar{background:#0E3E2E;color:rgba(255,255,255,.9);font-size:.82rem;padding:10px 0;font-family:'Montserrat',sans-serif}
body .topbar .container{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:8px}
body .topbar-left{display:flex;gap:20px;align-items:center;flex-wrap:wrap}
body .topbar-left a{color:rgba(255,255,255,.9)}
body .topbar i{margin-right:5px;color:#17A528}
body .topbar-right{display:flex;gap:16px;align-items:center;flex-wrap:wrap}
body .lang-switcher{display:flex;gap:6px}
body .lang-switcher a{padding:3px 10px;border-radius:4px;font-weight:700;font-size:.78rem;color:rgba(255,255,255,.7);text-decoration:none;font-family:'Montserrat',sans-serif}
body .lang-switcher a.active{background:#17A528;color:#1a1a2e}
body .lang-switcher a:hover{color:#17A528}

/* ===== Header bar ===== */
/* Defensive: some pages carry legacy element rules like header:not(.site-header){padding:60px}
   (old hero styles) or bare header{...} that would hit the unified nav; (0,1,2) beats them all */
body header.header{padding:0;margin:0;background:#ffffff;text-align:left}
body .header{background:#ffffff;position:sticky;top:0;z-index:100;box-shadow:0 2px 16px rgba(14,62,46,.08);font-family:'Montserrat',sans-serif}
body .header-inner{display:flex;align-items:center;justify-content:space-between;padding:14px 0;position:relative}
body .logo{display:flex;align-items:center;gap:10px}
body .logo-img{height:52px;width:auto;display:block}
body .nav{display:flex;align-items:center;gap:4px}
body .nav a{padding:8px 14px;border-radius:6px;font-weight:600;font-size:.9rem;color:#1a1a2e;text-decoration:none;font-family:'Montserrat',sans-serif}
body .nav a:hover{color:#009048;background:rgba(0,144,72,.06)}
body .nav a.design-link{color:#17A528;font-weight:800;background:linear-gradient(135deg,rgba(23,165,40,.1),rgba(23,165,40,.2));border:1.5px solid #17A528}
body .nav a.design-link:hover{background:#17A528;color:#1a1a2e}
body .nav-dropdown{position:relative}
body .nav-dropdown>a{display:flex;align-items:center;gap:4px;padding:7px 12px;border-radius:6px;font-weight:600;font-size:.88rem;color:#1a1a2e;text-decoration:none;font-family:'Montserrat',sans-serif}
body .nav-dropdown>a::after{content:'\25BE';font-size:.65rem;margin-left:2px;transition:transform .2s}
body .nav-dropdown>a:hover,body .nav-dropdown>a.active{color:#3498DB;background:rgba(0,144,72,.06)}
body .nav-dropdown>a:hover::after,body .nav-dropdown>a.active::after{transform:rotate(180deg)}

/* ===== Mega menu ===== */
body .mega-menu{position:absolute;top:calc(100% + 8px);left:50%;transform:translateX(-50%);width:720px;max-width:95vw;background:#fff;border-radius:12px;box-shadow:0 16px 48px rgba(0,0,0,.14);opacity:0;visibility:hidden;transition:opacity .2s ease,visibility .2s ease;z-index:200;padding:24px 20px 16px}
body .nav-dropdown:hover .mega-menu{opacity:1;visibility:visible}
body .mega-menu::before{content:'';position:absolute;top:-12px;left:0;right:0;height:12px;background:transparent}
body .mega-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px;padding-bottom:10px;border-bottom:2px solid #17A528}
body .mega-header h3{font-family:'Playfair Display',serif;font-size:1.05rem;color:#0E3E2E;margin:0;font-weight:700}

/* ===== Header actions: search + Quote ===== */
body .header-actions{display:flex;align-items:center;gap:12px}
body .search-toggle{background:none;border:1px solid #e0d8cc;border-radius:8px;font-size:1.1rem;color:#1a1a2e;cursor:pointer;padding:8px 10px;font-family:'Montserrat',sans-serif}
body .search-toggle:hover{border-color:#3498DB;color:#3498DB}
/* Quote button — force reference look on every page (inline style="background:var(--red)"
   resolves to dark-red/gold/undefined depending on page palette, so !important is required
   to win over the inline attribute) */
body .header-actions .btn{display:inline-flex;align-items:center;gap:8px;border:none;border-radius:50px;cursor:pointer;font-weight:700;font-family:'Montserrat',sans-serif;padding:10px 20px;font-size:.85rem;background:#3498DB !important;color:#ffffff !important;transition:all .3s ease;text-decoration:none}
body .header-actions .btn:hover{background:#2E8BC0 !important;color:#ffffff !important;transform:translateY(-2px)}
body .mobile-menu-btn{display:none;background:none;border:none;cursor:pointer;font-size:1.4rem;color:#1a1a2e}

@media (max-width:768px){
  body .nav{display:none}
  body .mobile-menu-btn{display:block}
  body .header-actions .btn{display:none}
  body .header-inner.nav-open .nav{display:flex;flex-direction:column;align-items:flex-start;position:absolute;top:100%;left:0;right:0;background:#fff;box-shadow:0 16px 48px rgba(0,0,0,.14);padding:12px 20px;z-index:150}
  body .topbar-left a[href^="mailto"]{display:none}
}