/* Skylake — Services mega-menu skin (macket 2B, variant C: navy one-area).
   Scope strictly: Services full-width mega panel of Astra header/mobile menus.
   No markup/JS changes. Deactivate plugin to fully revert. */

/* ============ DESKTOP (panel) — navy #191654, one continuous area ============
   Astra renders this as a FULL-WIDTH mega (adds .astra-mega-menu-width-full +
   inline width:1440px on the <ul>, and a full-width wrapper). We keep the wrapper
   as an invisible full-width positioning layer and make the <ul> itself the visible
   navy card: capped max-width + centered, so it never stretches edge-to-edge. */
#ast-hf-menu-1 .astra-megamenu-li.full-width-mega > .astra-full-megamenu-wrapper{
  background:transparent;border:0;box-shadow:none;padding:0;color:#eef0fb;
}
#ast-hf-menu-1 .astra-megamenu-li.full-width-mega .astra-megamenu.sub-menu{
  display:grid !important;
  grid-template-columns:2fr 1fr;
  grid-template-rows:min-content min-content;
  align-items:start;
  gap:0 34px;
  width:auto !important;max-width:980px !important;margin:0 auto !important;box-sizing:border-box;
  background:#191654 !important;
  border:1px solid rgba(255,255,255,.06) !important;
  border-radius:14px !important;
  box-shadow:0 24px 60px rgba(13,11,46,.30),0 8px 20px rgba(13,11,46,.18) !important;
  padding:26px 30px !important;
}
/* groups are plain regions — no per-group card substrate */
#ast-hf-menu-1 .astra-megamenu-li.full-width-mega .astra-megamenu.sub-menu > li.sl-grp{
  background:transparent;border:0;border-radius:0;padding:0;margin:0;
}
/* Foot column ~2/3, full-height hairline divider on its right edge */
#ast-hf-menu-1 .astra-megamenu-li.full-width-mega .sl-grp-foot{
  grid-column:1;grid-row:1 / span 2;align-self:stretch;
  padding-right:34px;border-right:1px solid rgba(255,255,255,.12);
}
#ast-hf-menu-1 .astra-megamenu-li.full-width-mega .sl-grp-regen{grid-column:2;grid-row:1}
/* right column: Regenerative on top, Other below with a thin horizontal divider */
#ast-hf-menu-1 .astra-megamenu-li.full-width-mega .sl-grp-other{
  grid-column:2;grid-row:2;margin-top:34px !important;padding-top:22px !important;
  border-top:1px solid rgba(255,255,255,.16);
}

#ast-hf-menu-1 .astra-megamenu-li.full-width-mega .sl-grp > a{
  font-family:"Fraunces",Georgia,serif;font-weight:500;font-size:20px;line-height:1.1;
  letter-spacing:-.01em;color:#fff;display:inline-flex;align-items:center;gap:9px;
  padding:0 0 4px !important;background:transparent !important;text-decoration:none !important;
}
#ast-hf-menu-1 .astra-megamenu-li.full-width-mega .sl-grp-foot > a,
#ast-hf-menu-1 .astra-megamenu-li.full-width-mega .sl-grp-other > a{
  pointer-events:none;cursor:default;
}
#ast-hf-menu-1 .astra-megamenu-li.full-width-mega .sl-grp-other > a{
  font-family:"JetBrains Mono",ui-monospace,monospace;font-size:10.5px;letter-spacing:.16em;
  text-transform:uppercase;color:#8f90bd;font-weight:500;
}
/* SVG chevron via background-image — robust against theme styles that add
   background / border-radius to ::after (which turned the old border-trick chevron
   into a filled blot on the homepage). Hard-reset borders/shadow/transform. */
#ast-hf-menu-1 .astra-megamenu-li.full-width-mega .sl-grp-regen > a::after{
  content:"";width:11px;height:11px;margin-left:2px;display:inline-block;flex:0 0 auto;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%235ab2cf' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='9 6 15 12 9 18'/%3E%3C/svg%3E") center/contain no-repeat !important;
  border:0 !important;border-radius:0 !important;box-shadow:none !important;transform:none !important;
}
#ast-hf-menu-1 .astra-megamenu-li.full-width-mega .sl-grp-regen > a:hover{color:#5ab2cf}

#ast-hf-menu-1 .astra-megamenu-li.full-width-mega .sl-grp > ul.sub-menu{
  display:flex !important;flex-wrap:wrap;gap:6px 8px;margin:12px 0 0 !important;padding:0 !important;
  list-style:none;background:transparent !important;border:0 !important;box-shadow:none !important;
  position:static !important;opacity:1 !important;visibility:visible !important;transform:none !important;
  width:auto !important;
}
#ast-hf-menu-1 .astra-megamenu-li.full-width-mega .sl-grp > ul.sub-menu > li{
  margin:0 !important;padding:0 !important;width:auto !important;max-width:none !important;
  flex:0 0 auto !important;border:0 !important;
}
#ast-hf-menu-1 .astra-megamenu-li.full-width-mega .sl-grp > ul.sub-menu > li > a{
  font-family:"Figtree",ui-sans-serif,system-ui,sans-serif;font-size:12.5px;line-height:1;color:#d4d6ef;
  background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.08);text-decoration:none !important;
  display:inline-flex !important;align-items:center;width:auto !important;
  padding:6px 11px !important;border-radius:999px;transition:background .14s,color .14s,border-color .14s;
}
#ast-hf-menu-1 .astra-megamenu-li.full-width-mega .sl-grp > ul.sub-menu > li > a:hover{
  background:#2f9bc0;color:#fff;border-color:transparent;
}
#ast-hf-menu-1 .astra-megamenu-li.full-width-mega .sl-grp > ul.sub-menu ul{display:none !important}
#ast-hf-menu-1 .astra-megamenu-li.full-width-mega .astra-megamenu.sub-menu .ast-menu-toggle,
#ast-hf-menu-1 .astra-megamenu-li.full-width-mega .astra-megamenu.sub-menu .dropdown-menu-toggle{display:none !important}

/* ============ MOBILE (Astra off-canvas, menu 11 — plain accordion, NOT mega) ============
   Scope: the Services item carries class `sl-services`; its sub-menu holds three `.sl-grp`
   groups. We darken the expanded Services region to the 2B navy panel, hide Astra's arrow
   icons and toggles inside it, force the per-group chip sub-menus open, and pill the leaf links. */
@media (max-width:921px){
  /* expanded Services region → navy 2B panel */
  #ast-hf-mobile-menu .sl-services > .sub-menu{
    background:#191654 !important;border-radius:12px;margin:6px 12px !important;padding:4px 16px 14px !important;
  }
  /* hide Astra arrows + accordion toggles INSIDE the Services submenu only
     (group headings + chips) — the Services item keeps its OWN toggle to expand */
  #ast-hf-mobile-menu .sl-services .sub-menu .ast-icon,
  #ast-hf-mobile-menu .sl-services .sub-menu .ast-menu-toggle,
  #ast-hf-mobile-menu .sl-services .sub-menu .dropdown-menu-toggle{display:none !important}

  /* Services expand toggle (Astra <button class="ast-menu-toggle">): the theme paints it
     as a dark navy pill ("blot") with a hard-to-see arrow. Strip the pill and show a clean
     navy chevron on the white drawer row. Group-level toggles are hidden above. */
  #ast-hf-mobile-menu .sl-services > .ast-menu-toggle{
    background:transparent !important;border:0 !important;box-shadow:none !important;
    border-radius:0 !important;outline:0 !important;padding:6px 10px !important;min-width:0 !important;
  }
  #ast-hf-mobile-menu .sl-services > .ast-menu-toggle .ast-arrow-svg,
  #ast-hf-mobile-menu .sl-services > .ast-menu-toggle svg{
    fill:#191654 !important;stroke:none !important;width:18px !important;height:auto !important;
  }

  /* group container */
  #ast-hf-mobile-menu .sl-grp{border-top:1px solid rgba(255,255,255,.09) !important;padding:14px 0 4px !important}
  #ast-hf-mobile-menu .sl-grp:first-child{border-top:0 !important}

  /* group heading = group's own menu-link */
  #ast-hf-mobile-menu .sl-grp > .menu-link{
    font-family:"Fraunces",Georgia,serif !important;font-size:19px !important;font-weight:500 !important;
    color:#fff !important;padding:2px 0 !important;background:transparent !important;text-decoration:none !important;
    display:inline-flex;align-items:center;gap:8px;pointer-events:none;
  }
  #ast-hf-mobile-menu .sl-grp > .menu-link .menu-text{color:#fff !important}
  #ast-hf-mobile-menu .sl-grp-regen > .menu-link{pointer-events:auto}
  #ast-hf-mobile-menu .sl-grp-other > .menu-link .menu-text{
    font-family:"JetBrains Mono",ui-monospace,monospace !important;font-size:10.5px !important;
    letter-spacing:.16em;text-transform:uppercase;color:#9092c0 !important;
  }
  #ast-hf-mobile-menu .sl-grp-regen > .menu-link::after{
    content:"";width:12px;height:12px;margin-left:2px;display:inline-block;flex:0 0 auto;
    background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%235ab2cf' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='9 6 15 12 9 18'/%3E%3C/svg%3E") center/contain no-repeat !important;
    border:0 !important;border-radius:0 !important;box-shadow:none !important;transform:none !important;
  }

  /* force per-group chip sub-menu OPEN regardless of Astra toggle state */
  #ast-hf-mobile-menu .sl-grp > .sub-menu{
    display:flex !important;flex-wrap:wrap;gap:7px !important;margin:0 !important;padding:8px 0 2px !important;
    height:auto !important;max-height:none !important;overflow:visible !important;
    visibility:visible !important;opacity:1 !important;background:transparent !important;
  }
  #ast-hf-mobile-menu .sl-grp > .sub-menu > li{border:0 !important;margin:0 !important;padding:0 !important;width:auto !important;max-width:none !important;flex:0 0 auto !important}
  #ast-hf-mobile-menu .sl-grp > .sub-menu > li > .menu-link{
    font-family:"Figtree",ui-sans-serif,system-ui,sans-serif !important;font-size:12.5px !important;line-height:1 !important;color:#d8daf0 !important;
    background:rgba(255,255,255,.06) !important;border:1px solid rgba(255,255,255,.09) !important;text-decoration:none !important;
    padding:6px 12px !important;border-radius:999px !important;min-height:32px;display:inline-flex !important;align-items:center;width:auto !important;
  }
}
