/*=================================================================
  HEADER & NAVIGATION — शङ्खघोष मिडिया
  Replaces: styles-menubtn.css, jquery.mmenu.css, mobilemenu.css
  Uses site's existing colours (#1e1878 navy, #f89d28 orange,
  #2760d4 blue, #ec1a3a red) and the site's existing font (Mukta).
=================================================================*/
:root{
  --sg-navy:#1e1878;
  --sg-navy-dark:#140f52;
  --sg-orange:#f89d28;
  --sg-orange-deep:#eb8d02;
  --sg-blue:#2760d4;
  --sg-red:#ec1a3a;
  --sg-text:#242424;
  --sg-muted:#707070;
}

/* ============ UTILITY BAR ============ */
.header-utility{
  background:var(--sg-navy-dark);
  color:#cfd0e8;
  font-family:'Open Sans',sans-serif;
  font-size:13px;
  overflow:hidden;
  max-height:38px;
  transition:max-height .35s ease, opacity .35s ease, padding .35s ease;
}
.header-utility.is-collapsed{
  max-height:0;
  opacity:0;
  padding:0;
}
.header-utility-inner{
  display:flex;
  align-items:center;
  justify-content:space-between;
  height:38px;
}

/* secondary nav (header-menu) rendered inside utility bar */
.utility-left{
  display:flex;
  align-items:center;
  gap:22px;
}
.utility-nav{
  display:flex;
  align-items:center;
  gap:4px;
}
.utility-nav > li > a{
  display:block;
  padding:8px 12px;
  color:#cfd0e8;
  font-weight:600;
}
.utility-nav > li > a:hover,
.utility-nav > li.active > a{
  color:#fff;
}

.utility-right{
  display:flex;
  align-items:center;
  gap:18px;
}
.utility-clock{
  white-space:nowrap;
  letter-spacing:.2px;
}
.utility-social{
  display:flex;
  gap:10px;
}
.utility-social a{
  width:24px;height:24px;
  border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  background:rgba(255,255,255,.08);
  color:#cfd0e8;
  font-size:12px;
  transition:background .2s ease, color .2s ease;
}
.utility-social a:hover{
  background:var(--sg-orange);
  color:var(--sg-navy-dark);
}

/* ============ MAIN HEADER ============ */
.site-header{
  position:sticky;
  top:0;
  z-index:500;
  background:#fff;
  box-shadow:0 2px 10px rgba(20,15,82,.07);
  border-bottom:3px solid var(--sg-orange);
  transition:box-shadow .3s ease;
}
.site-header.is-stuck{
  box-shadow:0 4px 18px rgba(20,15,82,.16);
}
.header-inner{
  display:flex;
  align-items:center;
  gap:28px;
  padding:14px 0;
  transition:padding .3s ease;
}
.site-header.is-stuck .header-inner{
  padding:8px 0;
}

.site-logo{
  flex-shrink:0;
  display:flex;
  align-items:center;
  padding:8px 16px;
  border-radius:14px;
  background:linear-gradient(150deg,var(--sg-navy-dark) 0%,var(--sg-navy) 100%);
  box-shadow:0 3px 12px rgba(20,15,82,.22);
  transition:padding .3s ease, height .3s ease;
}
.site-logo img{
  height:60px;
  width:auto;
  display:block;
  transition:height .3s ease;
}
.site-header.is-stuck .site-logo{
  padding:5px 12px;
}
.site-header.is-stuck .site-logo img{
  height:42px;
}

/* ============ PRIMARY NAV (desktop) ============ */
.nav-wrap{
  margin-left:auto;
  display:flex;
  align-items:center;
}
.nav-mobile-head{
  display:none;
}
.primary-nav{
  list-style:none;
  margin:0;
  padding:0;
  display:flex;
  align-items:center;
  gap:2px;
}
.primary-nav > li{
  position:relative;
}
.primary-nav > li > a{
  display:flex;
  align-items:center;
  gap:6px;
  padding:12px 16px;
  font-weight:600;
  font-size:16.5px;
  color:var(--sg-text);
  position:relative;
}
.primary-nav > li > a::after{
  content:'';
  position:absolute;
  left:16px;right:16px;bottom:6px;
  height:3px;border-radius:3px;
  background:var(--sg-orange);
  transform:scaleX(0);
  transform-origin:left;
  transition:transform .25s ease;
}
.primary-nav > li:hover > a,
.primary-nav > li.active > a{
  color:var(--sg-navy);
}
.primary-nav > li:hover > a::after,
.primary-nav > li.active > a::after{
  transform:scaleX(1);
}

/* caret for items that have a submenu ("has-sub", as already used on this project) */
.primary-nav > li.has-sub > a::after{
  /* keep underline AND caret: underline uses ::after, so caret uses a small span instead */
}
.primary-nav > li.has-sub > a{padding-right:30px;}
.primary-nav > li.has-sub > a::before{
  content:'';
  position:absolute;
  right:14px;top:50%;
  width:7px;height:7px;
  border-right:2px solid var(--sg-muted);
  border-bottom:2px solid var(--sg-muted);
  transform:translateY(-70%) rotate(45deg);
  transition:transform .2s ease, border-color .2s ease;
}
.primary-nav > li.has-sub:hover > a::before{
  border-color:var(--sg-navy);
  transform:translateY(-30%) rotate(225deg);
}

/* dropdown (submenu rendered by the Nav widget as a nested <ul>) */
.primary-nav > li > ul{
  list-style:none;
  margin:0;
  position:absolute;
  top:100%;left:0;
  min-width:220px;
  background:#fff;
  border-top:3px solid var(--sg-orange);
  box-shadow:0 12px 30px rgba(20,15,82,.14);
  padding:8px 0;
  opacity:0;
  visibility:hidden;
  transform:translateY(8px);
  transition:opacity .2s ease, transform .2s ease, visibility .2s ease;
}
.primary-nav > li:hover > ul{
  opacity:1;visibility:visible;transform:translateY(0);
}
.primary-nav > li > ul > li > a{
  display:block;
  padding:10px 20px;
  font-size:15.5px;
  font-weight:500;
  color:var(--sg-text);
  border-left:3px solid transparent;
}
.primary-nav > li > ul > li > a:hover{
  background:#f6f6fb;
  border-left-color:var(--sg-orange);
  color:var(--sg-navy);
}

/* ============ HEADER ACTIONS (search) ============ */
.header-actions{
  display:flex;
  align-items:center;
  gap:6px;
}
.icon-btn{
  width:38px;height:38px;
  border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  color:var(--sg-navy);
  background:transparent;
  border:none;cursor:pointer;
  font-size:16px;
  transition:background .2s ease;
}
.icon-btn:hover{background:#f1f1f8;}
.search-wrap{position:relative;}
.search-panel{
  position:absolute;
  right:0;top:calc(100% + 12px);
  width:320px;
  background:#fff;
  box-shadow:0 12px 30px rgba(20,15,82,.16);
  border-radius:10px;
  padding:10px;
  display:flex;gap:8px;
  margin:0;
  opacity:0;visibility:hidden;
  transform:translateY(-6px);
  transition:opacity .2s ease, transform .2s ease, visibility .2s ease;
}
.search-panel.is-open{opacity:1;visibility:visible;transform:translateY(0);}
.search-panel input{
  flex:1;border:1px solid #e3e3ec;border-radius:6px;
  padding:9px 12px;font-family:'Mukta',sans-serif;font-size:15px;outline:none;
}
.search-panel input:focus{border-color:var(--sg-blue);}
.search-panel button{
  background:var(--sg-navy);color:#fff;border:none;border-radius:6px;
  padding:0 16px;font-weight:600;cursor:pointer;
}

/* optional ad strip below header (position 7) */
.header-ad-strip{
  text-align:center;
  padding:14px 0;
  border-top:1px solid #eee;
}

.hamburger{display:none;}

/* Search hidden on large screens for now — kept on mobile */
@media (min-width:992px){
  .header-actions{display:none;}
}

/* ============ MOBILE (<=991px) ============ */
@media (max-width:991px){
  .header-utility{display:none;}
  .header-inner{gap:12px;}
  .site-logo img{height:42px;}
  .site-header.is-stuck .site-logo img{height:38px;}

  .hamburger{
    order:-1;
    display:flex;flex-direction:column;justify-content:center;gap:5px;
    width:38px;height:38px;border:none;background:transparent;cursor:pointer;
    flex-shrink:0;
  }
  .hamburger span{
    display:block;height:2.5px;width:22px;background:var(--sg-navy);border-radius:2px;
  }

  .nav-wrap{
    margin-left:0;
    position:fixed;
    top:0;right:0;
    width:82%;max-width:340px;height:100%;
    background:var(--sg-navy);
    flex-direction:column;
    align-items:stretch;
    padding:0 0 40px;
    transform:translateX(100%);
    transition:transform .35s ease;
    overflow-y:auto;
    z-index:1000;
  }
  .nav-wrap.is-open{transform:translateX(0);}

  .nav-mobile-head{
    display:flex;align-items:center;justify-content:space-between;
    padding:18px 22px;margin-bottom:6px;
    border-bottom:1px solid rgba(255,255,255,.1);
  }
  .nav-mobile-head span{color:#fff;font-weight:700;font-size:15px;font-family:'Open Sans',sans-serif;letter-spacing:.3px;}
  .nav-mobile-head button{
    background:rgba(255,255,255,.08);border:none;color:#fff;
    width:32px;height:32px;border-radius:50%;font-size:16px;cursor:pointer;line-height:1;
  }

  .primary-nav{flex-direction:column;align-items:stretch;gap:0;}
  .primary-nav > li{width:100%;}
  .primary-nav > li > a{
    color:#fff;padding:15px 22px;font-size:17px;
    justify-content:space-between;
    border-bottom:1px solid rgba(255,255,255,.08);
  }
  .primary-nav > li > a::after{display:none;}
  .primary-nav > li:hover > a,
  .primary-nav > li.active > a{color:var(--sg-orange);}
  .primary-nav > li.has-sub > a::before{border-color:#fff;right:22px;}
  .primary-nav > li.has-sub.is-sub-open > a::before{border-color:var(--sg-orange);}

  .primary-nav > li > ul{
    position:static;box-shadow:none;border-top:none;
    background:rgba(255,255,255,.04);
    max-height:0;overflow:hidden;padding:0;
    opacity:1;visibility:visible;transform:none;
    transition:max-height .3s ease;
  }
  .primary-nav > li.is-sub-open > ul{max-height:600px;padding:6px 0;}
  .primary-nav > li > ul > li > a{color:#e4e4f4;padding:11px 34px;}
  .primary-nav > li > ul > li > a:hover{background:rgba(255,255,255,.06);border-left-color:var(--sg-orange);color:#fff;}

  .nav-scrim{
    display:none;
    position:fixed;inset:0;
    background:rgba(20,15,82,.45);
    z-index:900;
  }
  .nav-scrim.is-visible{display:block;}

  .search-panel{
    position:fixed;left:16px;right:16px;top:60px;width:auto;
  }
}
@media (min-width:992px){
  .nav-scrim{display:none !important;}
}