/* ============================================================
   GrowwithBA — Mega Menu styling (Cloudflare-style wide panel)
   Applies only when a dropdown has .gwba-mega (added by gwba-mega.js)
   ============================================================ */

/* Override the narrow dropdown sizing for mega panels */
.gwba-dropdown.gwba-mega{
  min-width: min(1100px, 94vw);
  width: min(1100px, 94vw);
  padding: 22px 26px 0;
  border-radius: 18px;
  /* anchor to a viewport-safe centered position instead of the nav item,
     so left-side triggers (Solutions) don't push the panel off-screen */
  position: fixed;
  left: 50%;
  top: 77px;
  transform: translateX(-50%) translateY(8px);
  text-align: left;
}
/* keep the reveal transforms consistent with hover/open states */
.gwba-has-dropdown:hover .gwba-dropdown.gwba-mega,
.gwba-nav-item.gwba-has-dropdown.gwba-open .gwba-dropdown.gwba-mega{
  transform: translateX(-50%) translateY(0) !important;
}

/* Columns grid */
.gwba-mega-cols{
  display:grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px 28px;
  padding-bottom: 18px;
}
.gwba-mega-col h4{
  font-family:'JetBrains Mono',ui-monospace,monospace;
  font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;
  color:#0D1421;opacity:.5;margin:6px 0 8px;padding-left:2px;
}

/* Item: chip + (title / subtitle) */
.gwba-mega-item{
  display:flex !important;align-items:flex-start;gap:11px;
  padding:9px 10px !important;border-radius:11px;text-decoration:none;
  transition:background .14s ease;
}
.gwba-mega-item:hover{background:#FFF5E6 !important;}
.gwba-mega-txt{display:flex;flex-direction:column;line-height:1.25;min-width:0}
.gwba-mega-txt strong{
  font-family:'Plus Jakarta Sans',system-ui,sans-serif;
  font-size:14.5px;font-weight:700;color:#0D1421;white-space:nowrap;
}
.gwba-mega-txt em{
  font-style:normal;font-size:12.5px;color:#0D1421;opacity:.6;font-weight:500;margin-top:2px;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}

/* Chip (icon square) — mirrors site .gwba-chip */
.gwba-mega-chip{
  display:inline-flex;align-items:center;justify-content:center;
  width:30px;height:30px;border:2px solid #0D1421;border-radius:8px;
  box-shadow:1.5px 1.5px 0 #0D1421;flex-shrink:0;background:#6C5CE7;margin-top:1px;
}
.gwba-mega-chip svg{width:16px;height:16px}
.gwba-mega-chip.c-purple{background:#6C5CE7}
.gwba-mega-chip.c-pink{background:#FF6B9D}
.gwba-mega-chip.c-yellow{background:#FFD93D}
.gwba-mega-chip.c-mint{background:#00D9A3}
.gwba-mega-chip.c-sky{background:#4FC3F7}

/* Footer row */
.gwba-mega-foot{
  display:flex;flex-wrap:wrap;align-items:center;gap:8px 22px;
  border-top:1px solid rgba(13,20,33,.1);
  margin:0 -26px;padding:14px 26px;
  background:#FBFAF7;border-radius:0 0 18px 18px;
}
.gwba-mega-foot a{
  font-size:13px;font-weight:600;color:#0D1421;opacity:.7;text-decoration:none;
  padding:0 !important;
}
.gwba-mega-foot a:hover{opacity:1;background:transparent !important}
.gwba-mega-foot a.gwba-mega-foot-primary{
  color:#6C5CE7;opacity:1;font-weight:800;margin-right:auto;
}

/* ---------- RESPONSIVE ---------- */
@media (max-width:1024px){
  /* On tablet/mobile the site already shows its own mobile menu;
     keep the mega panel from overflowing if it ever shows. */
  .gwba-dropdown.gwba-mega{
    width:min(620px,94vw);min-width:0;
  }
  .gwba-mega-cols{grid-template-columns:repeat(2,1fr);gap:4px 18px}
}
@media (max-width:560px){
  .gwba-dropdown.gwba-mega{width:94vw}
  .gwba-mega-cols{grid-template-columns:1fr}
  .gwba-mega-txt strong,.gwba-mega-txt em{white-space:normal}
}