/* Our Services mega menu — submenu link styling (site-wide) */

.services-mega {
  background-color: #051422;
  isolation: isolate;
  /* 12 hubs: allow full panel + scroll when taller than viewport */
  max-height: min(calc(100dvh - 88px), 900px);
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-width: thin;
  scrollbar-color: rgba(66, 209, 179, 0.45) rgba(255, 255, 255, 0.06);
}

.services-mega::-webkit-scrollbar {
  width: 6px;
}

.services-mega::-webkit-scrollbar-thumb {
  background: rgba(66, 209, 179, 0.4);
  border-radius: 999px;
}

.services-mega::-webkit-scrollbar-track {
  background: rgba(255, 255, 255, 0.05);
}

.services-mega .smega-hdr {
  position: sticky;
  top: 0;
  z-index: 2;
  background: rgba(5, 20, 34, 0.98);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}

.services-mega .services-grid {
  position: relative;
  z-index: 1;
  padding-bottom: 16px;
}

.services-mega .service-card {
  overflow: visible;
  padding: 12px 13px 14px;
}

.services-mega .scard-hdr {
  margin-bottom: 9px;
}

.services-mega .scard-hdr h4 {
  font-size: 12px;
  letter-spacing: 0.85px;
  line-height: 1.25;
}

.services-mega .scard-hdr h4 a {
  color: rgba(226, 252, 247, 0.93);
  text-decoration: none;
  transition: color 0.18s ease;
}

.services-mega .scard-hdr h4 a:hover,
.services-mega .scard-hdr h4 a:focus-visible {
  color: #bffaf0;
  text-decoration: none;
  outline: none;
}

.services-mega .service-card li {
  position: relative;
  cursor: pointer;
  font-size: 13px;
  font-weight: 600;
  line-height: 1.35;
  padding: 3px 0 3px 14px;
  transition: padding-left 0.18s ease;
}

.services-mega .service-card li::before {
  content: '';
  position: absolute;
  left: 4px;
  top: 50%;
  transform: translateY(-50%);
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: rgba(140, 225, 210, 0.32);
  transition: background 0.18s ease, transform 0.18s ease;
  pointer-events: none;
}

.services-mega .service-card li:hover {
  padding-left: 18px;
}

.services-mega .service-card li:hover::before {
  background: rgba(66, 209, 179, 0.82);
  transform: translateY(-50%) scale(1.35);
}

/* Reset legacy card-design flex/badge rules inside mega menu */
.services-mega .card-design li {
  display: block;
  gap: unset;
  padding: 3px 0 3px 14px;
}

.services-mega .card-design li::before {
  display: block;
}

.services-mega .card-design li:hover {
  padding-left: 18px;
}

.services-mega .service-card::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 2px;
}

.services-mega .service-card li a {
  display: block;
  width: 100%;
  margin: -3px 0;
  padding: 3px 0;
  color: rgba(255, 255, 255, 0.74);
  text-decoration: none;
  cursor: pointer;
  transition: color 0.18s ease;
}

.services-mega .service-card li a:link,
.services-mega .service-card li a:visited {
  color: rgba(255, 255, 255, 0.74);
  text-decoration: none;
}

.services-mega .service-card li:hover a,
.services-mega .service-card li a:hover,
.services-mega .service-card li a:focus-visible {
  color: #bffaf0;
  text-decoration: none;
  outline: none;
}

.services-mega .card-design li:hover a,
.services-mega .card-design li a:focus-visible {
  color: #ffc4dc;
}

.services-mega .card-dev li:hover a,
.services-mega .card-dev li a:focus-visible {
  color: #8ee8ff;
}

.services-mega .card-enterprise li:hover a,
.services-mega .card-enterprise li a:focus-visible {
  color: #c4d4ff;
}

.services-mega .card-startup li:hover a,
.services-mega .card-startup li a:focus-visible {
  color: #ffc9b0;
}

.services-mega .card-quality li:hover a,
.services-mega .card-quality li a:focus-visible {
  color: #9ed4ff;
}

.services-mega .card-specialized li:hover a,
.services-mega .card-specialized li a:focus-visible {
  color: #ff9ed4;
}

.services-mega .card-silicon li:hover a,
.services-mega .card-silicon li a:focus-visible {
  color: #a0f0e8;
}

.services-mega .card-mecha li:hover a,
.services-mega .card-mecha li a:focus-visible {
  color: #ffd4a0;
}

.services-mega .card-neural li:hover a,
.services-mega .card-neural li a:focus-visible {
  color: #d4b4ff;
}

.services-mega .card-growth::before {
  background: linear-gradient(90deg, #3ecf8e, #56d4ff);
}

.services-mega .card-growth:hover {
  box-shadow: 0 0 0 1px rgba(62, 207, 142, 0.18), 0 8px 22px rgba(62, 207, 142, 0.07);
}

.services-mega .icon-growth {
  background: rgba(62, 207, 142, 0.15);
  color: #6ee7b0;
}

.services-mega .card-growth li:hover a,
.services-mega .card-growth li a:focus-visible {
  color: #9ef0c8;
}

.services-mega .card-branding::before {
  background: linear-gradient(90deg, #ff6eb4, #ffb37a);
}

.services-mega .card-branding:hover {
  box-shadow: 0 0 0 1px rgba(255, 110, 180, 0.18), 0 8px 22px rgba(255, 110, 180, 0.07);
}

.services-mega .icon-branding {
  background: rgba(255, 110, 180, 0.15);
  color: #ff8ec8;
}

.services-mega .card-branding li:hover a,
.services-mega .card-branding li a:focus-visible {
  color: #ffc4e8;
}

.services-mega .card-launch::before {
  background: linear-gradient(90deg, #ffaa5a, #ff6eb4);
}

.services-mega .card-launch:hover {
  box-shadow: 0 0 0 1px rgba(255, 170, 90, 0.18), 0 8px 22px rgba(255, 170, 90, 0.07);
}

.services-mega .icon-launch {
  background: rgba(255, 170, 90, 0.15);
  color: #ffbc6e;
}

.services-mega .card-launch li:hover a,
.services-mega .card-launch li a:focus-visible {
  color: #ffd4a8;
}