/* Products / Solutions mega-dropdowns in the main nav (partials/nav-links.njk,
   data in src/_data/nav.json, behaviour in assets/nav-menus.js), from the
   "Products Dropdown" design (option A rev 2). Webflow's own w-dropdown only
   does a flat link list, so these are custom: a dark card (warm-900) under the
   nav; rows turn orange with an arrow on hover. Desktop opens on hover/click;
   inside Webflow's hamburger menu (<=991px) they expand inline. */
.alt-dd { position: relative; display: flex; align-items: center; }
.alt-dd__toggle {
  display: inline-flex; align-items: center; gap: 6px;
  background: none; border: 0; cursor: pointer;
  font: inherit; color: inherit; -webkit-appearance: none; appearance: none;
}
.alt-dd__chev { stroke: currentColor; fill: none; stroke-width: 2; transition: transform 200ms cubic-bezier(0.2, 0, 0, 1); }
.alt-dd__panel { display: none; }
.alt-dd__card {
  box-sizing: border-box; background: #241310; border: 1px solid rgba(247, 246, 255, 0.16);
  border-radius: 12px; padding: 10px; font-family: Matter, "Helvetica Neue", Arial, sans-serif; text-align: left;
}
.alt-dd__card--products { display: grid; grid-template-columns: 2fr 3fr; gap: 10px; }
.alt-dd__card--solutions { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; align-items: start; padding-top: 18px; }
.alt-dd__overview, .alt-dd__item { display: flex; flex-direction: column; gap: 6px; text-decoration: none; border-radius: 8px; }
.alt-dd__overview { padding: 15px 18px; border: 1px solid rgba(247, 246, 255, 0.16); }
.alt-dd__item { padding: 12px 14px; }
.alt-dd__list { display: flex; flex-direction: column; gap: 2px; padding: 4px 0; }
.alt-dd__group { display: flex; flex-direction: column; gap: 2px; }
.alt-dd__q { padding: 0 14px 8px; font-size: 14px; line-height: 1.4; color: rgba(247, 246, 255, 0.62); }
.alt-dd__title {
  display: flex; align-items: center; gap: 8px; color: #F7F6FF;
  font-weight: 500; font-size: 17px; line-height: 1.25; letter-spacing: -0.01em;
  transition: color 160ms cubic-bezier(0.2, 0, 0, 1);
}
.alt-dd__overview .alt-dd__title { font-size: 20px; line-height: 1.2; }
.alt-dd__arrow { opacity: 0; transition: opacity 160ms cubic-bezier(0.2, 0, 0, 1); }
.alt-dd__desc { font-size: 14px; line-height: 1.45; color: rgba(247, 246, 255, 0.62); white-space: nowrap; }
.alt-dd__desc--wrap { white-space: normal; line-height: 1.5; }
.alt-dd__more { margin-top: auto; padding-top: 14px; font-weight: 500; font-size: 14px; line-height: 1.45; color: #FA5838; }
.alt-dd__overview:hover .alt-dd__title, .alt-dd__item:hover .alt-dd__title,
.alt-dd__overview:focus-visible .alt-dd__title, .alt-dd__item:focus-visible .alt-dd__title,
.alt-dd__item[aria-current="page"] .alt-dd__title { color: #FA5838; }
.alt-dd__overview:hover .alt-dd__arrow, .alt-dd__item:hover .alt-dd__arrow,
.alt-dd__overview:focus-visible .alt-dd__arrow, .alt-dd__item:focus-visible .alt-dd__arrow { opacity: 1; }
.alt-dd__overview:focus-visible, .alt-dd__item:focus-visible { outline: 2px solid rgba(250, 88, 56, 0.45); outline-offset: 0; }
.alt-dd.is-open .alt-dd__toggle { color: #FA5838; }
.alt-dd.is-open .alt-dd__chev { transform: rotate(180deg); }
.alt-dd.is-open .alt-dd__panel { display: block; }

@media (min-width: 992px) {
  .alt-dd:hover .alt-dd__toggle { color: #FA5838; }
  .alt-dd:hover .alt-dd__chev { transform: rotate(180deg); }
  .alt-dd:hover .alt-dd__panel { display: block; }
  /* padding-top bridges the gap between the toggle and the card so the
     pointer can travel down without the panel closing. */
  .alt-dd__panel { position: absolute; top: 100%; z-index: 1000; width: 660px; padding-top: 18px; }
  .alt-dd__panel--products { left: -60px; }
  .alt-dd__panel--solutions { left: -160px; }
}
@media (max-width: 991px) {
  /* The hamburger menu is absolutely positioned inside the fixed nav, so page
     scrolling can't reach anything below the screen edge. With a mega-menu
     expanded it is taller than a phone screen; cap it to the space under the
     nav (64px on tablet/phone) and let it scroll on its own. */
  .navbar_menu[data-nav-menu-open] { max-height: calc(100vh - 64px); max-height: calc(100dvh - 64px); overflow-y: auto; overscroll-behavior: contain; -webkit-overflow-scrolling: touch; }
  .alt-dd { flex-direction: column; align-items: center; width: 100%; }
  .alt-dd__panel { width: 100%; padding: 12px 0; }
  .alt-dd__card--products, .alt-dd__card--solutions { grid-template-columns: 1fr; }
  /* Stacked Solutions groups get a hairline between them (design round 5a):
     10px under the first group, 1px rule inset 14px, 18px above the second. */
  .alt-dd__card--solutions { gap: 0; }
  .alt-dd__card--solutions .alt-dd__group:not(:last-child) { padding-bottom: 10px; }
  .alt-dd__card--solutions .alt-dd__group + .alt-dd__group { position: relative; padding-top: 18px; }
  .alt-dd__card--solutions .alt-dd__group + .alt-dd__group::before { content: ""; position: absolute; top: 0; left: 14px; right: 14px; height: 1px; background: rgba(247, 246, 255, 0.16); }
  .alt-dd__desc { white-space: normal; }
}