/* ==========================================================================
   Raiganj University - Utility bar, site header, main nav & mega menu
   File: assets/css/02-header.css
   ======================================================================= */

/* ===== Utility bar ===== */
.utility-bar{
  background:var(--teal);
  color:#DCE7E3;
  font-size:12.5px;
  border-bottom:1px solid rgba(255,255,255,0.08);
}
.utility-inner{
  max-width:1280px; margin:0 auto;
  display:flex; align-items:center; justify-content:space-between;
  gap:60px; padding:0 24px;
}
.contact-info{
  display:flex; align-items:center; gap:20px;
  padding:8px 0; flex-shrink:0; white-space:nowrap;
  max-width:100%; overflow-x:auto; scrollbar-width:none;
}
.contact-info::-webkit-scrollbar{ display:none; }
.contact-info a{
  display:inline-flex; align-items:center; gap:7px;
  opacity:.92;
}
.contact-info a:hover{ opacity:1; color:var(--gold-soft); }
.contact-info svg{ flex-shrink:0; opacity:.85; }
.utility-bar .track{
  display:flex; gap:15px; white-space:nowrap;
  padding:8px 20px;
  margin:6px 0;
  overflow-x:auto;
  scrollbar-width:none;
  min-width:0;
  background:rgba(0,0,0,0.18);
  border-radius:999px;

}
.utility-bar .track::-webkit-scrollbar{display:none;}
.utility-bar a{
  opacity:.88; padding:2px 0; border-bottom:1px solid transparent;
}
.utility-bar a:hover{ opacity:1; border-bottom-color:var(--gold); }
.utility-bar .sep{opacity:.35;}

/* ===== Header ===== */
.site-header{
  background:var(--cream);
  border-bottom:1px solid var(--line);
  position:sticky; top:0; z-index:500;
}
.header-row{
  max-width:1280px; margin:0 auto;
  display:flex; align-items:center; justify-content:space-between;
  padding:32px 24px;
  gap:20px;
}
.brand{
  display:flex; align-items:center; gap:14px;
}
.seal{
  width:80px; height:80px; border-radius:8px;
  flex-shrink:0;
  display:flex; align-items:center; justify-content:center;
  overflow:hidden;
  background:#fff;
  border:3px solid var(--maroon);
  box-shadow:0 6px 16px rgba(110,20,35,0.18);
}
.seal img{
  width:110%; height:110%; object-fit:contain;
}
.brand-text .name{
  font-size:28px; font-weight:700; line-height:1.15; color:var(--maroon-dark);
}
.brand-text .name-bn{
  font-family:'Noto Sans Bengali', sans-serif; font-weight:600;
  font-size:20px; line-height:1.3; color:var(--maroon); margin-top:2px;
}
.brand-text .sub{
  font-family:'IBM Plex Mono', monospace; font-size:11.5px; letter-spacing:.08em;
  color:var(--ink-soft); text-transform:uppercase; margin-top:5px;
}
.header-actions-wrap{ display:flex; flex-direction:column; align-items:flex-end; gap:8px; }
.header-mini-links{ display:flex; align-items:center; gap:10px; }
.header-mini-link{
  display:inline-flex; align-items:center; gap:7px;
  font-family:'IBM Plex Mono', monospace; font-size:11.5px; font-weight:600; letter-spacing:.05em; text-transform:uppercase;
  color:var(--maroon-dark);
  background:var(--paper);
  border:1px solid var(--line);
  border-radius:999px;
  padding:6px 14px 6px 10px;
  transition:background .2s ease, border-color .2s ease, color .2s ease, transform .2s ease;
}
.header-mini-link svg{ width:15px; height:15px; flex-shrink:0; color:var(--gold); }
.header-mini-link:hover{
  color:#fff; background:var(--maroon); border-color:var(--maroon); transform:translateY(-1px);
}
.header-mini-link:hover svg{ color:var(--gold-soft); }
.header-actions{ display:flex; align-items:center; gap:12px; }
.btn{
  display:inline-flex; align-items:center; gap:8px;
  padding:11px 20px; font-size:14px; font-weight:600;
  border:1px solid var(--maroon); border-radius:var(--radius);
  cursor:pointer; background:transparent; color:var(--maroon-dark);
  white-space:nowrap;
}
.btn-solid{
  background:var(--maroon); color:#fff; border-color:var(--maroon);
}
.btn-solid:hover{ background:var(--maroon-dark); }
.btn:hover{ background:rgba(110,20,35,0.06); }
.icon-btn{
  width:40px; height:40px; display:flex; align-items:center; justify-content:center;
  border:1px solid var(--line); border-radius:50%; background:#fff; cursor:pointer;
}
.google-search-box{
  display:inline-flex; align-items:center; gap:6px;
  padding:11px 16px;
  background:#fff;
  border-radius:24px;
  position:relative;
  isolation:isolate;
}
.google-search-box::before{
  content:""; position:absolute; inset:0; border-radius:24px; padding:1.5px;
  background:linear-gradient(90deg,var(--maroon),var(--maroon-dark));
  -webkit-mask:linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite:xor; mask-composite:exclude;
  pointer-events:none;
}
.gsb-icon{ color:#5f6368; flex:0 0 auto; }
.gsb-input{
  border:none; outline:none; font-size:13.5px;
  color:#3c4043; width:100px; background:transparent;
}
.gsb-input::placeholder{ color:#9aa0a6; }


/* ===== Main nav ===== */
.main-nav{
  background:var(--maroon);
}
.nav-inner{
  max-width:1280px; margin:0 auto; padding:0 24px;
  display:flex; align-items:stretch;
}
.nav-list{
  list-style:none; margin:0; padding:0; display:flex;
  flex:1;
}
.nav-list > li{ position:relative; }
.nav-link{
  display:flex; align-items:center; height:52px; padding:0 10px;
  color:#F3E9DC; font-size:14.5px; font-weight:500; letter-spacing:.01em;
  border-bottom:3px solid transparent;
  cursor:pointer;
}
.nav-list > li:hover > .nav-link,
.nav-list > li.open > .nav-link{
  background:rgba(255,255,255,0.06);
  border-bottom-color:var(--gold);
  color:#fff;
}
.nav-link .caret{
  margin-left:6px; font-size:10px; opacity:.7; transition:transform .15s ease;
}
.nav-list > li.open > .nav-link .caret{ transform:rotate(180deg); }

/* Mega menu */
.mega{
  position:absolute; top:100%; left:0;
  background:var(--cream);
  border:1px solid var(--line);
  border-top:3px solid var(--gold);
  box-shadow:0 18px 40px rgba(20,10,8,0.18);
  padding:26px 30px;
  display:none;
  z-index:400;
  min-width:640px;
  max-width:920px;
  max-height:calc(100vh - 110px);
  overflow-y:auto;
}
.nav-list > li.open > .mega{ display:block; }
.nav-list > li.open > .mega.flip{ left:auto; right:0; }
.mega.flat{ min-width:420px; columns:2; column-gap:36px; }
.mega.flat .mega-col{ break-inside:avoid; margin-bottom:4px; }
.mega-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(200px, 1fr));
  gap:8px 34px;
}
.mega-col{ min-width:0; }
.mega-col + .mega-col{ }
.mega-heading{
  font-family:'IBM Plex Mono', monospace;
  font-size:10.5px; letter-spacing:.1em; text-transform:uppercase;
  color:var(--maroon); font-weight:600;
  border-bottom:1px solid var(--line);
  padding-bottom:6px; margin-bottom:8px;
}
.mega-sub{
  font-size:13px; font-weight:600; color:var(--ink);
  margin:10px 0 4px;
}
.mega-heading-ic{
  display:flex; align-items:center; gap:9px;
  font-size:13px; font-weight:700; letter-spacing:.01em; text-transform:uppercase;
  color:var(--maroon-dark);
  border-bottom:2px solid var(--gold);
  padding-bottom:9px; margin:0 0 10px;
}
.mega-heading-ic + ul{ margin-top:0; }
.mega-heading-ic .ic{
  width:20px; height:20px; flex:0 0 20px;
  display:inline-flex; align-items:center; justify-content:center;
  color:var(--gold);
}
.mega-heading-ic .ic svg{ width:17px; height:17px; }
.mega-group + .mega-group{ margin-top:20px; }
.mega ul{ list-style:none; margin:0 0 6px; padding:0; }
.mega li a, .mega-col > a{
  display:block; font-size:13.5px; color:var(--ink-soft);
  padding:4px 0; line-height:1.4;
}
.mega li a:hover, .mega-col > a:hover{ color:var(--maroon-dark); text-decoration:underline; text-underline-offset:3px; }
.mega .nested{ padding-left:12px; border-left:2px solid var(--paper); margin:4px 0 8px 2px; }
.mega-index{
  font-family:'Fraunces', serif; font-size:34px; color:var(--gold-soft);
  -webkit-text-stroke:1px var(--maroon);
  position:absolute; right:24px; top:14px; opacity:.5; pointer-events:none;
}

/* mobile toggle */
.nav-toggle{ display:none; }
