/*
 * Business Voice C10 R1 HF57
 * Header dropdown responsive correction.
 *
 * Problem:
 * legacy public-shell CSS changed submenus to position:static at <=1180px,
 * while the main navigation does not collapse until <=960px. In the
 * 961–1180px range (also common at browser zoom on 1366px screens), opening
 * How It Works therefore enlarged the entire header and pushed the hero down.
 *
 * Authority:
 * - >960px: premium floating dropdown; never changes header height.
 * - <=960px: mobile drawer keeps its in-flow submenu treatment.
 */

@media (min-width:961px) and (max-width:1180px){
  .navbar .menu-item-has-children{
    position:relative!important;
  }

  .navbar .menu-item-has-children > .sub-menu{
    position:absolute!important;
    left:-14px!important;
    top:calc(100% - 2px)!important;
    min-width:292px!important;
    margin:0!important;
    padding:9px!important;
    background:#fff!important;
    border:1px solid #dce4eb!important;
    border-radius:10px!important;
    box-shadow:0 12px 28px rgba(5,30,52,.12)!important;
    list-style:none!important;
    opacity:0!important;
    visibility:hidden!important;
    transform:translateY(7px)!important;
    transition:opacity .18s ease, transform .18s ease, visibility .18s ease!important;
    z-index:180!important;
    white-space:normal!important;
  }

  .navbar .menu-item-has-children:hover > .sub-menu,
  .navbar .menu-item-has-children:focus-within > .sub-menu{
    opacity:1!important;
    visibility:visible!important;
    transform:none!important;
  }

  .navbar .menu-item-has-children > .sub-menu li{
    display:block!important;
  }

  .navbar .menu-item-has-children > .sub-menu a{
    display:flex!important;
    align-items:center!important;
    min-height:42px!important;
    padding:9px 11px!important;
    border-radius:6px!important;
    font-size:12px!important;
    line-height:1.35!important;
  }
}

/* Desktop authority too: dropdown floats over page content, never participates
   in the header's document flow. */
@media (min-width:1181px){
  .navbar .menu-item-has-children > .sub-menu{
    position:absolute!important;
    z-index:180!important;
  }
}

/* Keep mobile behaviour deliberately unchanged/in-flow. */
@media (max-width:960px){
  .navbar .menu-item-has-children > .sub-menu{
    position:static!important;
  }
}