/* Kohper "B2B suite" mega menu — presentation only. */
:root{
  --bbm-ink:#17181B; --bbm-copper:#C87F3F; --bbm-muted:#7A7568;
  --bbm-line:#EAE4D8; --bbm-divider:#EFEAE0; --bbm-surface:#FBFAF7;
}

.bb-mega,
.bb-mega-dimmer{
  visibility:hidden; opacity:0; pointer-events:none;
  transition:opacity .16s ease, visibility .16s ease;
}
body.bb-mega-active .bb-mega,
body.bb-mega-active .bb-mega-dimmer{ visibility:visible; opacity:1; pointer-events:auto; }

/* Dimmer covers everything below the header. */
.bb-mega-dimmer{
  position:fixed; left:0; right:0; bottom:0; top:var(--bbm-top,84px);
  background:rgba(15,42,82,.12); z-index:9998;
}

/* Full-width white panel, docked under the header. */
.bb-mega{
  position:fixed; left:0; right:0; top:var(--bbm-top,84px); z-index:9999;
  background:#fff; border-bottom:1px solid var(--bbm-line);
  box-shadow:0 18px 40px rgba(15,42,82,.10);
  transform:translateY(-6px); transition:opacity .16s ease, visibility .16s ease, transform .16s ease;
}
body.bb-mega-active .bb-mega{ transform:translateY(0); }
.bb-mega-inner{ max-width:1200px; margin:0 auto; padding:26px 20px 22px; }

.bb-mega-head{ margin-bottom:18px; }
.bb-mega-eyebrow{
  display:block; font-size:11.5px; font-weight:600; letter-spacing:.12em;
  text-transform:uppercase; color:var(--bbm-copper);
}
.bb-mega-lead{ margin:6px 0 0; font-size:14px; color:var(--bbm-muted); }

.bb-mega-grid{
  display:grid; grid-template-columns:repeat(4, minmax(0,1fr)); gap:12px;
}
@media (max-width:921px){ .bb-mega-grid{ grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:544px){ .bb-mega-grid{ grid-template-columns:1fr; } }

.bb-mega-tile{
  display:grid; grid-template-columns:38px 1fr; grid-template-rows:auto auto;
  column-gap:12px; row-gap:2px; align-items:start;
  padding:14px; border:1px solid var(--bbm-line); border-radius:4px;
  text-decoration:none; background:#fff; transition:border-color .12s, background .12s;
}
.bb-mega-tile:hover{ border-color:var(--bbm-copper); background:#FBFAF7; }
.bb-mega-ico{
  grid-row:1 / span 2; width:38px; height:38px; border-radius:6px;
  background:var(--bbm-ink); color:#fff; display:flex; align-items:center; justify-content:center;
}
.bb-mega-name{ font-size:14px; font-weight:600; color:var(--bbm-ink); line-height:1.3; }
.bb-mega-desc{ font-size:12.5px; color:var(--bbm-muted); line-height:1.45; }

.bb-mega-foot{
  display:flex; flex-wrap:wrap; gap:14px; align-items:center; justify-content:space-between;
  margin-top:20px; padding-top:16px; border-top:1px solid var(--bbm-divider);
}
.bb-mega-foot-note{ font-size:13px; color:var(--bbm-muted); }
.bb-mega-foot-actions{ display:flex; gap:10px; }
.bb-mega-btn{
  display:inline-block; font-size:13px; font-weight:600; padding:10px 18px;
  border-radius:3px; text-decoration:none; letter-spacing:.01em;
}
.bb-mega-btn--ghost{ background:#fff; color:var(--bbm-ink); border:1px solid var(--bb-strong,#D8D2C4); }
.bb-mega-btn--ghost:hover{ background:var(--bbm-copper); border-color:var(--bbm-copper); color:#fff; }
.bb-mega-btn--solid{ background:var(--bbm-copper); color:#fff; border:1px solid var(--bbm-copper); }
.bb-mega-btn--solid:hover{ background:var(--bbm-ink); border-color:var(--bbm-ink); }

/* Trigger affordance */
.bb-mega-trigger > a::after,
.bb-mega-trigger > .menu-link::after{ content:"\25BE"; font-size:.7em; margin-left:6px; opacity:.6; }
body.bb-mega-active .bb-mega-trigger > a,
body.bb-mega-active .bb-mega-trigger > .menu-link{ color:var(--bbm-copper); }