/* KS-MEGAMENU V7 — 2026-05-04 — comprehensive structure + refined visual design */

/* ---- Defeat theme-6291330 cascade ---- */
#header .ks-mm-v7,
#header .ks-mm-v7 * {
  all: revert;
  box-sizing: border-box;
  font-family: 'Inter', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}

/* ---- Hide empty leftover navy strip where old menu used to be ---- */
#header .ks-row3 { display: none !important; }

/* ---- Wrapper + bar (navy, matches dark header above) ---- */
#header > .ks-mm-v7,
#header .ks-mm-v7 {
  display: block !important;
  position: relative !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  background: #0F172A !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
  box-shadow: 0 1px 0 rgba(0, 0, 0, 0.20) !important;
  z-index: 1100;
  flex: 1 0 100% !important;
  grid-column: 1 / -1 !important;
}

/* Force the wrapper to break out of any flex/grid parent */
#header .ks-search > .ks-mm-v7,
#header .ks-row2-inner > .ks-mm-v7,
#header .container > .ks-mm-v7 {
  flex-basis: 100% !important;
  width: 100% !important;
}
#header .ks-mm-v7 .ks-mm-bar {
  position: relative !important;
  display: flex !important;
  align-items: stretch !important;
  list-style: none !important;
  margin: 0 auto !important;
  padding: 0 24px !important;
  max-width: 1440px !important;
  height: 56px !important;
  gap: 0 !important;
}
#header .ks-mm-v7 .ks-mm-item {
  position: static !important;
  display: inline-flex !important;
  align-items: stretch !important;
  height: 56px !important;
  padding: 0 !important;
  margin: 0 !important;
  list-style: none !important;
}
#header .ks-mm-v7 .ks-mm-trigger {
  position: relative !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  background: transparent !important;
  border: 0 !important;
  color: #ffffff !important;
  font-weight: 600 !important;
  font-size: 13px !important;
  letter-spacing: 0.01em !important;
  padding: 0 16px !important;
  height: 56px !important;
  cursor: pointer !important;
  text-decoration: none !important;
  white-space: nowrap !important;
  transition: color .15s ease, background .15s ease !important;
}
#header .ks-mm-v7 .ks-mm-trigger-icon {
  font-size: 16px !important;
  line-height: 1 !important;
  color: #93c5fd !important;
  transition: transform .2s ease !important;
}
#header .ks-mm-v7 .ks-mm-trigger:hover,
#header .ks-mm-v7 .ks-mm-trigger:focus,
#header .ks-mm-v7 .ks-mm-trigger[aria-expanded="true"] {
  color: #ffffff !important;
  background: rgba(99, 102, 241, 0.18) !important;
  outline: 0 !important;
}
#header .ks-mm-v7 .ks-mm-trigger:hover .ks-mm-trigger-icon,
#header .ks-mm-v7 .ks-mm-trigger[aria-expanded="true"] .ks-mm-trigger-icon {
  color: #ffffff !important;
}
#header .ks-mm-v7 .ks-mm-trigger:hover .ks-mm-trigger-icon {
  transform: scale(1.15) !important;
}

/* Caret */
#header .ks-mm-v7 .ks-mm-trigger[aria-haspopup="menu"]::after {
  content: '' !important;
  width: 6px !important;
  height: 6px !important;
  border-right: 2px solid currentColor !important;
  border-bottom: 2px solid currentColor !important;
  transform: rotate(45deg) translateY(-2px) !important;
  margin-left: 2px !important;
  transition: transform .2s ease !important;
  opacity: 0.7 !important;
}
#header .ks-mm-v7 .ks-mm-trigger[aria-expanded="true"]::after {
  transform: rotate(-135deg) translateY(2px) !important;
  opacity: 1 !important;
}

/* Active underline */
#header .ks-mm-v7 .ks-mm-trigger::before {
  content: '' !important;
  position: absolute !important;
  left: 16px !important;
  right: 16px !important;
  bottom: 0 !important;
  height: 3px !important;
  background: linear-gradient(90deg, #93c5fd, #c4b5fd) !important;
  transform: scaleX(0) !important;
  transform-origin: left !important;
  transition: transform .2s ease !important;
  border-radius: 2px 2px 0 0 !important;
}
#header .ks-mm-v7 .ks-mm-trigger:hover::before,
#header .ks-mm-v7 .ks-mm-trigger[aria-expanded="true"]::before {
  transform: scaleX(1) !important;
}

/* ---- Panel: anchored to the FULL-WIDTH .ks-mm-bar (not individual <li>) ---- */
#header .ks-mm-v7 .ks-mm-panel {
  position: absolute !important;
  top: 56px !important;
  left: 50% !important;
  transform: translateX(-50%) translateY(-6px) !important;
  width: calc(100vw - 32px) !important;
  max-width: 1240px !important;
  min-width: 0 !important;
  background: #ffffff !important;
  border: 1px solid #e5e7eb !important;
  border-top: 3px solid #4f46e5 !important;
  border-radius: 0 0 14px 14px !important;
  box-shadow: 0 24px 64px -12px rgba(20, 35, 70, 0.20), 0 4px 12px rgba(20, 35, 70, 0.06) !important;
  padding: 32px 36px 28px !important;
  z-index: 1200 !important;
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
  transition: opacity .2s ease, transform .2s ease, visibility 0s linear .2s !important;
}
#header .ks-mm-v7 .ks-mm-panel[hidden] { display: none !important; }
#header .ks-mm-v7 .ks-mm-panel.ks-mm-open {
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
  transform: translateX(-50%) translateY(0) !important;
  transition: opacity .2s ease, transform .2s ease, visibility 0s !important;
}

/* ---- Grid layouts ---- */
#header .ks-mm-v7 .ks-mm-grid {
  display: grid !important;
  gap: 32px !important;
  align-items: start !important;
  grid-template-columns: 1fr 1fr 1fr 1fr !important;
}
#header .ks-mm-v7 .ks-mm-grid-3 { grid-template-columns: 1fr 1fr 1fr !important; }
#header .ks-mm-v7 .ks-mm-grid-3-feat { grid-template-columns: 1fr 1fr 1fr 300px !important; }
#header .ks-mm-v7 .ks-mm-grid-2 { grid-template-columns: 1fr 1fr !important; }

#header .ks-mm-v7 .ks-mm-col {
  display: flex !important;
  flex-direction: column !important;
  gap: 4px !important;
  min-width: 0 !important;
}
#header .ks-mm-v7 .ks-mm-col-title {
  display: block !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.08em !important;
  color: #4f46e5 !important;
  margin: 0 0 10px !important;
  padding-bottom: 8px !important;
  border-bottom: 1px solid #e5e7eb !important;
}

/* ---- Links ---- */
#header .ks-mm-v7 .ks-mm-link {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 8px !important;
  color: #1e293b !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  text-decoration: none !important;
  padding: 5px 0 !important;
  line-height: 1.4 !important;
  transition: color .15s ease, transform .15s ease !important;
  visibility: visible !important;
  opacity: 1 !important;
}
#header .ks-mm-v7 .ks-mm-link:hover {
  color: #4f46e5 !important;
  transform: translateX(3px) !important;
}
#header .ks-mm-v7 .ks-mm-view-all {
  font-weight: 600 !important;
  color: #4f46e5 !important;
  font-size: 13px !important;
  margin-top: 6px !important;
  padding-top: 8px !important;
  border-top: 1px dashed #e5e7eb !important;
}

/* Counts in muted tone */
#header .ks-mm-v7 .ks-mm-link-meta {
  font-size: 11px !important;
  font-weight: 600 !important;
  color: #94a3b8 !important;
  background: #f1f5f9 !important;
  padding: 2px 7px !important;
  border-radius: 10px !important;
  margin-left: auto !important;
}

/* Badges */
#header .ks-mm-v7 .ks-mm-link-badge {
  display: inline-block !important;
  font-size: 10px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  background: #fef3c7 !important;
  color: #92400e !important;
  padding: 2px 6px !important;
  border-radius: 4px !important;
  margin-left: 6px !important;
  letter-spacing: 0.04em !important;
}
#header .ks-mm-v7 .ks-mm-link-badge.ks-new { background: #dcfce7 !important; color: #166534 !important; }
#header .ks-mm-v7 .ks-mm-link-badge.ks-hot { background: #fee2e2 !important; color: #991b1b !important; }

/* ---- Featured tile ---- */
#header .ks-mm-v7 .ks-mm-feat {
  background: linear-gradient(135deg, #eef2ff 0%, #e0e7ff 100%) !important;
  border: 1px solid #c7d2fe !important;
  border-radius: 12px !important;
  padding: 20px !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 6px !important;
  text-decoration: none !important;
  transition: transform .25s ease, box-shadow .25s ease !important;
  position: relative !important;
  overflow: hidden !important;
}
#header .ks-mm-v7 .ks-mm-feat::before {
  content: '' !important;
  position: absolute !important;
  top: -40px !important;
  right: -40px !important;
  width: 120px !important;
  height: 120px !important;
  background: radial-gradient(circle, rgba(79,70,229,0.12), transparent 70%) !important;
  pointer-events: none !important;
}
#header .ks-mm-v7 .ks-mm-feat:hover {
  transform: translateY(-3px) !important;
  box-shadow: 0 12px 32px -6px rgba(79, 70, 229, 0.30) !important;
}
#header .ks-mm-v7 .ks-mm-feat-eyebrow {
  font-size: 10px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.1em !important;
  color: #4f46e5 !important;
}
#header .ks-mm-v7 .ks-mm-feat-title {
  font-size: 17px !important;
  font-weight: 700 !important;
  color: #1e293b !important;
  line-height: 1.25 !important;
  margin-top: 2px !important;
}
#header .ks-mm-v7 .ks-mm-feat-price {
  font-size: 18px !important;
  font-weight: 800 !important;
  color: #4f46e5 !important;
  margin: 4px 0 !important;
}
#header .ks-mm-v7 .ks-mm-feat-desc {
  font-size: 12px !important;
  color: #475569 !important;
  line-height: 1.5 !important;
  margin-top: 4px !important;
}
#header .ks-mm-v7 .ks-mm-feat-cta {
  font-size: 13px !important;
  font-weight: 700 !important;
  color: #4f46e5 !important;
  margin-top: 8px !important;
  padding-top: 8px !important;
  border-top: 1px solid rgba(79, 70, 229, 0.20) !important;
}

/* B2B variant — green palette */
#header .ks-mm-v7 .ks-mm-feat-b2b {
  background: linear-gradient(135deg, #ecfdf5 0%, #d1fae5 100%) !important;
  border-color: #6ee7b7 !important;
}
#header .ks-mm-v7 .ks-mm-feat-b2b .ks-mm-feat-eyebrow,
#header .ks-mm-v7 .ks-mm-feat-b2b .ks-mm-feat-price,
#header .ks-mm-v7 .ks-mm-feat-b2b .ks-mm-feat-cta {
  color: #047857 !important;
}
#header .ks-mm-v7 .ks-mm-feat-b2b .ks-mm-feat-cta { border-top-color: rgba(4, 120, 87, 0.20) !important; }
#header .ks-mm-v7 .ks-mm-feat-b2b::before {
  background: radial-gradient(circle, rgba(16,185,129,0.14), transparent 70%) !important;
}

/* ---- Panel footer ---- */
#header .ks-mm-v7 .ks-mm-panel-footer {
  margin-top: 24px !important;
  padding-top: 18px !important;
  border-top: 1px solid #e5e7eb !important;
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  gap: 16px !important;
  font-size: 13px !important;
  flex-wrap: wrap !important;
}
#header .ks-mm-v7 .ks-mm-panel-footer a {
  color: #4f46e5 !important;
  font-weight: 600 !important;
  text-decoration: none !important;
}
#header .ks-mm-v7 .ks-mm-panel-footer a:hover { text-decoration: underline !important; }
#header .ks-mm-v7 .ks-mm-panel-footer .ks-mm-footer-meta { color: #6b7280 !important; font-size: 12px !important; }

/* ---- Mobile: hide entire desktop menu ---- */
@media (max-width: 992px) {
  #header .ks-mm-v7 { display: none !important; }
}

/* ---- Hide all duplicate ps_mainmenu wrappers + legacy nav ---- */
#header .ks-mm-v7 ~ .ks-mm-v7,
#header .ks-mm-v6,
#header .ks-mm-wrapper:not(.ks-mm-v7),
#header ul.top-menu.hidden-md-up { display: none !important; }