
/* VISHVAK CHEMIX — CLEAN FINAL HEADER + LANGUAGE */
.site-header{width:100%;max-width:none;position:relative;z-index:100}
.site-header .utility{width:100%;max-width:none}
.site-header .main-nav{
  width:100%;
  max-width:none;
  min-width:0;
  box-sizing:border-box;
  display:flex;
  align-items:center;
  gap:22px;
}
.site-header .brand{flex:0 0 176px;min-width:0}
.site-header .nav-links{
  flex:1 1 auto;
  min-width:0;
  margin-left:auto;
  display:flex;
  align-items:stretch;
  justify-content:flex-end;
  gap:0;
  white-space:nowrap;
}
.site-header .nav-links>a{flex:0 0 auto;white-space:nowrap}
.site-header .nav-language{
  display:flex;
  align-items:center;
  gap:4px;
  flex:0 0 auto;
  margin-left:8px;
  height:100%;
}
.site-header .nav-language a{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  height:38px;
  min-width:38px;
  padding:0 8px;
  border:1px solid #d8e1e8;
  background:#fff;
  color:#21364a;
  font-size:10px;
  font-weight:900;
  line-height:1;
  white-space:nowrap;
}
.site-header .nav-language a:hover{
  border-color:#0876b9;
  color:#0876b9;
}
.site-header .nav-language a.active{
  background:#edf7fb;
  border-color:#0876b9;
  color:#075f91;
}
html,body{width:100%;max-width:100%;overflow-x:hidden}
@media(max-width:1350px){
  .site-header .main-nav{gap:10px;padding-left:4%;padding-right:4%}
  .site-header .brand{flex-basis:150px}
  .site-header .brand img{width:145px}
  .site-header .nav-links>a{padding-left:7px!important;padding-right:7px!important;font-size:11px}
  .site-header .nav-language{margin-left:5px}
  .site-header .nav-language a{min-width:34px;padding:0 5px}
}
@media(max-width:900px){
  .site-header .main-nav{height:70px;padding:0 4%;position:relative}
  .site-header .brand{flex-basis:145px}
  .site-header .brand img{width:138px}
  .site-header .menu-toggle{display:block;margin-left:auto}
  .site-header .nav-links{
    display:none;
    position:absolute;
    top:70px;left:0;right:0;
    height:auto;
    background:#fff;
    border-bottom:1px solid #d8e1e8;
    padding:10px 4%;
    flex-direction:column;
    align-items:stretch;
    box-shadow:0 20px 40px rgba(0,0,0,.12);
  }
  .site-header .nav-links.open{display:flex}
  .site-header .nav-links>a{height:48px;padding:0!important}
  .site-header .nav-rfq{margin:5px 0!important;justify-content:center}
  .site-header .nav-language{
    height:auto;
    width:100%;
    margin:5px 0 2px;
    padding-top:5px;
    border-top:1px solid #edf1f4;
  }
  .site-header .nav-language a{flex:1;height:42px}
}

/* =========================================================
   VISHVAK CHEMIX — FINAL HEADER LAYOUT
   Deterministic desktop positioning: logo and navigation occupy
   separate areas, so navigation can never overlap the logo.
   WhatsApp remains part of the navigation.
   ========================================================= */
@media (min-width:901px){
  .site-header .main-nav{
    position:relative!important;
    display:block!important;
    height:84px!important;
    width:100%!important;
    max-width:none!important;
    padding:0!important;
    margin:0!important;
    overflow:visible!important;
  }

  .site-header .main-nav > .brand{
    position:absolute!important;
    left:5.5%!important;
    top:0!important;
    width:205px!important;
    height:84px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:flex-start!important;
    margin:0!important;
    z-index:20!important;
  }

  .site-header .main-nav > .brand img{
    display:block!important;
    width:176px!important;
    max-width:176px!important;
    height:auto!important;
    max-height:58px!important;
    margin:0!important;
    object-fit:contain!important;
  }

  .site-header .menu-toggle{display:none!important}

  .site-header .nav-links{
    position:absolute!important;
    left:calc(5.5% + 205px)!important;
    right:5.5%!important;
    top:0!important;
    width:auto!important;
    height:84px!important;
    min-width:0!important;
    margin:0!important;
    padding:0!important;
    display:flex!important;
    align-items:stretch!important;
    justify-content:flex-start!important;
    gap:0!important;
    overflow:visible!important;
    white-space:nowrap!important;
  }

  .site-header .nav-links>a{
    flex:0 0 auto!important;
    white-space:nowrap!important;
    height:84px!important;
    padding-left:6px!important;
    padding-right:6px!important;
    font-size:11px!important;
  }

  .site-header .nav-links .nav-whatsapp{
    display:flex!important;
    flex:0 0 auto!important;
    align-items:center!important;
    justify-content:center!important;
    height:50px!important;
    margin:17px 0!important;
    padding:0 10px!important;
    font-size:11px!important;
    visibility:visible!important;
    opacity:1!important;
  }

  .site-header .nav-links .nav-rfq{
    display:flex!important;
    flex:0 0 auto!important;
    height:50px!important;
    margin:17px 0!important;
    padding:0 14px!important;
    align-items:center!important;
  }

  .site-header .nav-language{
    display:flex!important;
    flex:0 0 auto!important;
    align-items:center!important;
    height:84px!important;
    margin-left:5px!important;
    gap:4px!important;
  }

  .site-header .nav-language a{
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    height:38px!important;
    min-width:40px!important;
    padding:0 7px!important;
    white-space:nowrap!important;
  }
}

/* Compact desktop widths without allowing the first link to move left. */
@media (min-width:901px) and (max-width:1550px){
  .site-header .main-nav > .brand{
    left:3.5%!important;
    width:175px!important;
  }
  .site-header .main-nav > .brand img{
    width:158px!important;
    max-width:158px!important;
  }
  .site-header .nav-links{
    left:calc(3.5% + 175px)!important;
    right:3.5%!important;
  }
  .site-header .nav-links>a{
    padding-left:4px!important;
    padding-right:4px!important;
    font-size:9.5px!important;
  }
  .site-header .nav-links .nav-whatsapp{
    padding-left:6px!important;
    padding-right:6px!important;
    font-size:9.5px!important;
  }
  .site-header .nav-links .nav-rfq{
    padding-left:8px!important;
    padding-right:8px!important;
  }
  .site-header .nav-language a{
    min-width:36px!important;
    padding-left:4px!important;
    padding-right:4px!important;
  }
}

@media (max-width:900px){
  .site-header .main-nav{position:relative!important;display:flex!important}
}

/* HEADER WHATSAPP REMOVED — floating WhatsApp remains active. */
.site-header .nav-whatsapp{
  display:none!important;
}
