/* Optik — native Helix mega menus, 2026-09-09. */
:root { --om-ink: #202b26; --om-muted: #69746e; --om-green: #268b55; --om-line: #e5eae6; }
.optik-mega .sp-dropdown-inner { color: var(--om-ink); }
@media (min-width: 992px) {
  #sp-menu .sp-megamenu-parent { position: static; }
  .sp-megamenu-parent > .optik-mega { position: static; }
  .sp-megamenu-parent > .optik-mega > a { padding-right: 6px; }
  .sp-megamenu-parent > .optik-mega > a:after { display: none; }
  .optik-mega > .sp-dropdown.sp-dropdown-mega {
    left: 50% !important; right: auto !important; width: calc(100% - 40px) !important;
    max-width: 1140px; transform: translateX(-50%); padding: 0;
    animation: none !important; transition: none !important;
  }
  .optik-mega > .sp-dropdown > .sp-dropdown-inner {
    padding: 30px 32px 28px; background: #fff; border: 1px solid var(--om-line);
    border-top: 3px solid var(--om-green); border-radius: 0 0 10px 10px;
    box-shadow: 0 18px 35px -15px rgba(19, 39, 27, .28);
    max-height: calc(100dvh - var(--om-menu-top, 185px) - 16px); overflow-y: auto; overscroll-behavior: contain;
  }
  .optik-mega .sp-dropdown-inner > .row { --bs-gutter-x: 32px; }
  .optik-mega .sp-dropdown-inner > .row > .col-sm-6 { border-left: 1px solid var(--om-line); padding-left: 26px; }
  .optik-mega .sp-mega-group > li + li { margin-top: 24px; }
  .optik-mega .sp-mega-group > li > .sp-group-title {
    display: block; margin: 0 0 12px; padding: 0; font-size: 11px; font-weight: 700;
    letter-spacing: 1.2px; line-height: 1.5; text-transform: uppercase; color: var(--om-muted);
  }
  .optik-mega .sp-dropdown li.sp-menu-item > a {
    display: block; padding: 7px 0; color: var(--om-ink); font-size: 13px;
    font-weight: 400; line-height: 1.5; text-transform: none; background: transparent;
  }
  .optik-mega .sp-dropdown li.sp-menu-item > a:hover { color: var(--om-green); background: transparent; }
  .optik-mega .sp-dropdown li.sp-menu-item > a.optik-menu-all,
  .optik-mega .sp-mega-group > li > a.optik-menu-footer { color: var(--om-green); font-weight: 600; }
  .optik-mega .sp-mega-group > li > a.optik-menu-footer { font-size: 12px; text-transform: none; padding: 0; margin: 0; letter-spacing: .1px; }
  .optik-mega .sp-mega-group > .optik-brand-group > ul,
  .optik-mega .sp-mega-group > li:has(> .optik-brand-group) > ul {
    display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px;
  }
  .optik-mega-contact .sp-mega-group > li:has(> .optik-brand-group) > ul { grid-template-columns: 1fr; gap: 14px; }
  .optik-mega-contact .sp-dropdown li.sp-menu-item > a.optik-brand { height: 80px; }
  .optik-mega-contact a.optik-brand img { transform: scale(1.4); }
  .optik-mega[data-enhanced] > .sp-dropdown { display: none !important; }
  .optik-mega[data-enhanced].is-open > .sp-dropdown { display: block !important; animation: none; }
  .optik-mega-toggle {
    display: inline-flex; justify-content: center; align-items: center; width: 28px; height: 36px;
    margin-right: 8px; padding: 0; background: transparent; color: var(--om-ink); border: 0;
    border-radius: 4px; vertical-align: middle; cursor: pointer;
  }
  .optik-mega-toggle:before { content: ''; width: 6px; height: 6px; border-right: 1.5px solid; border-bottom: 1.5px solid; transform: rotate(45deg) translateY(-2px); }
  .optik-mega-toggle[aria-expanded="true"]:before { transform: rotate(225deg) translate(-1px,-1px); }
  .optik-mega-toggle:hover { background: #edf6ef; color: var(--om-green); }
}
.sp-megamenu-parent .optik-mega .sp-dropdown li.sp-menu-item > a.optik-brand,
.offcanvas-menu .optik-mega a.optik-brand {
  position: relative; display: block; height: 72px; padding: 0; overflow: hidden;
  border: 1px solid var(--om-line); border-radius: 5px; background: #fff;
  transition: border-color .15s, box-shadow .15s;
}
.optik-mega a.optik-brand img { position: absolute; max-width: none !important; object-fit: contain; filter: none !important; opacity: 1; }
.optik-mega a.optik-brand:hover { border-color: #87ad94 !important; box-shadow: 0 3px 10px rgba(31, 75, 47, .08); }
.optik-mega a:focus-visible, .optik-mega button:focus-visible { outline: 2px solid var(--om-green); outline-offset: 3px; }
.offcanvas-menu .optik-mega .menu-child .menu-parent > .mod-menu__heading {
  display: block; color: var(--om-muted); font-size: 11px; font-weight: 700;
  letter-spacing: .8px; text-transform: uppercase; line-height: 1.5; padding: 18px 0 8px;
}
.offcanvas-menu .optik-mega > .menu-child > .menu-parent > .menu-child { display: block !important; padding: 0; }
.offcanvas-menu .optik-mega > .menu-child > .menu-parent > .mod-menu__heading > .menu-toggler { display: none !important; }
.offcanvas-menu .optik-mega > .menu-child > li.optik-brand-group > .menu-child { display: grid !important; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; }
.offcanvas-menu .optik-mega .menu-child li { border: 0; }
.offcanvas-menu .optik-mega .menu-child a { line-height: 1.5; padding: 10px 0; font-size: 13px; }
.offcanvas-menu .optik-mega a.optik-menu-all { color: var(--om-green); font-weight: 600; }
.offcanvas-menu .optik-mega > .menu-child { padding-bottom: 18px; }
.offcanvas-menu .optik-mobile-toggle {
  position: absolute; top: 0; right: 0; width: 44px; height: 44px; background: transparent;
  border: 0; color: var(--om-ink); border-radius: 4px;
}
.offcanvas-menu .optik-mobile-toggle:after { content: '+'; font-size: 21px; }
.offcanvas-menu .optik-mobile-toggle[aria-expanded="true"]:after { content: '−'; }
.offcanvas-menu .optik-mega > a .menu-toggler { display: none !important; }
.offcanvas-menu .optik-mega > a { padding-right: 48px; }
@media (max-width: 991px) {
  html:has(body.offcanvas-active), body.offcanvas-active { overflow: hidden; }
  .offcanvas-menu { width: min(390px, 100%); }
  body.ltr.offcanvas-init.offcanvs-position-right .offcanvas-menu { right: -100%; }
  body.ltr.offcanvas-init.offcanvs-position-right.offcanvas-active .offcanvas-menu { right: 0; }
  .offcanvas-menu .offcanvas-inner { padding: 22px; }
}
@media (prefers-reduced-motion: reduce) { .optik-mega *, .optik-mega *:before { animation: none !important; transition: none !important; } }