/* Odyssey Behavioral Health: global header and footer. */

/* ==========================================================
 10. HEADER TRANSITION
 ========================================================== */

/* Initial / top-of-page header */
#initial-header {
 position: absolute;

 top: 8px;
 left: 1.5vw;
 right: auto;

 width: 97vw;
 max-width: 97vw;

 z-index: 100;

 opacity: 1;
 visibility: visible;
 transform: translateY(0);
 pointer-events: auto;

 transition:
 opacity 450ms ease,
 transform 450ms ease,
 visibility 0s linear 0s;
}

/* Sticky header remains full-width and otherwise unchanged in behavior */
#sticky-header {
 position: fixed;
 inset: 0 0 auto;

 width: 100%;

 z-index: 101;

 opacity: 0;
 visibility: hidden;
 transform: translateY(-24px);
 pointer-events: none;

 transition:
 opacity 650ms ease,
 transform 650ms ease,
 visibility 0s linear 650ms;
}

body.has-scrolled #initial-header {
 opacity: 0;
 visibility: hidden;
 transform: translateY(-20px);
 pointer-events: none;

 transition:
 opacity 350ms ease,
 transform 350ms ease,
 visibility 0s linear 350ms;
}

body.has-scrolled #sticky-header {
 opacity: 1;
 visibility: visible;
 transform: translateY(0);
 pointer-events: auto;

 transition:
 opacity 650ms ease,
 transform 650ms ease,
 visibility 0s linear 0s;
}


/* ==========================================================
 15. INITIAL HEADER ââ¬â¬ FLOATING GRADIENT BAR
 Desktop only.
 ========================================================== */

@media (min-width: 1025px) {

 #initial-header {
 background:
 linear-gradient(
 100deg,
 rgba(16, 42, 77, 0.78) 0%,
 rgba(91, 50, 97, 0.72) 100%
 );

 border: 0;

 border-radius: 3px;

 box-shadow:
 0 8px 30px
 rgba(16, 42, 77, 0.14);

 backdrop-filter: blur(20px);
 -webkit-backdrop-filter: blur(20px);
 }

 #initial-header .obh-header-inner {
 width: calc(100% - 48px);
 max-width: none;

 margin-inline: auto;
 padding: 0;
 }

}


/* ==========================================================
 20. SITE HEADER LAYOUT
 ========================================================== */

.obh-header-inner {
 width: 93vw;
 max-width: 93vw;

 margin-inline: auto;

 display: flex;
 align-items: center;
 justify-content: space-between;

 gap: 32px;

 min-width: 0;
}


/* ----------------------------------------------------------
 LOGO
 ---------------------------------------------------------- */

.obh-site-logo {
 display: inline-flex;
 align-items: center;

 flex: 0 0 auto;

 line-height: 0;
 text-decoration: none;
}

#initial-header .obh-site-logo {
 margin-top: 10px;
}

.obh-site-logo__image {
 display: block;

 width: auto;
 height: auto;

 max-width: 100%;
}

#initial-header .obh-site-logo__image {
 width: 180px;
}

#sticky-header .obh-site-logo__image {
 width: 160px;
}

.obh-site-logo:focus-visible {
 outline: 2px solid var(--obh-accent);
 outline-offset: 5px;
}


/* ==========================================================
 30. PRIMARY NAVIGATION
 ========================================================== */

.obh-site-nav {
 flex: 1 1 auto;
 min-width: 0;
}

.obh-site-nav__list {
 display: flex;
 align-items: center;
 justify-content: center;

 gap: clamp(20px, 2vw, 34px);

 margin: 0 !important;
 padding: 0 !important;

 list-style: none !important;
}

.obh-site-nav__item {
 position: static;

 margin: 0 !important;
 padding: 0 !important;

 list-style: none !important;
}

.obh-site-nav__parent {
 display: flex;
 align-items: center;

 gap: 7px;
}


/* ----------------------------------------------------------
 NAV LINK
 Base desktop weight = 500
 Hover / focus / open weight = 600
 ---------------------------------------------------------- */

.obh-site-nav__link {
 display: inline-flex;
 align-items: center;

 padding: 16px 0 12px;

 font-family: var(--obh-font-body);
 font-size: 1rem;
 font-weight: 500;
 line-height: 1.2;

 text-decoration: none !important;

 transition:
 color 220ms ease,
 font-weight 220ms ease;
}

/* Initial header nav  white against dark translucent gradient */

#initial-header .obh-site-nav__link {
 color: var(--obh-white);

 transition:
 color 260ms ease,
 text-shadow 260ms ease;
}

#initial-header .obh-site-nav__link:hover,
#initial-header .obh-site-nav__link:focus-visible,
#initial-header
.obh-site-nav__item.is-open
> .obh-site-nav__parent
.obh-site-nav__link {
 color: var(--obh-accent);

 text-shadow:
 0 0 0.35px currentColor,
 0 0 0.35px currentColor;
}


/* Sticky header nav ⬠preserve current light-header treatment */

#sticky-header .obh-site-nav__link {
 color: var(--obh-navy);
}

#sticky-header .obh-site-nav__link:hover,
#sticky-header .obh-site-nav__link:focus-visible,
#sticky-header
.obh-site-nav__item.is-open
> .obh-site-nav__parent
.obh-site-nav__link {
 color: var(--obh-purple);
 font-weight: 600;
}


/* ----------------------------------------------------------
 PARENT TOGGLE / CHEVRON
 Compact, static, no circular button chrome
 ---------------------------------------------------------- */

#initial-header
.obh-site-nav--desktop
button.obh-site-nav__toggle,

#sticky-header
.obh-site-nav--desktop
button.obh-site-nav__toggle {
 appearance: none !important;
 -webkit-appearance: none !important;

 display: inline-flex !important;
 align-items: center !important;
 justify-content: center !important;

 flex: 0 0 auto !important;

 width: 12px !important;
 min-width: 12px !important;
 max-width: 12px !important;

 height: 12px !important;
 min-height: 0 !important;
 max-height: 12px !important;

 margin: 0 !important;
 padding: 0 !important;

 border: 0 !important;
 border-radius: 0 !important;

 outline: 0;

 background: none !important;
 background-color: transparent !important;
 background-image: none !important;

 box-shadow: none !important;

 line-height: 1 !important;

 cursor: pointer;
}


/* Prevent Elementor/global button states from recreating button chrome */

#initial-header
.obh-site-nav--desktop
button.obh-site-nav__toggle:hover,

#initial-header
.obh-site-nav--desktop
button.obh-site-nav__toggle:focus,

#initial-header
.obh-site-nav--desktop
button.obh-site-nav__toggle:focus-visible,

#sticky-header
.obh-site-nav--desktop
button.obh-site-nav__toggle:hover,

#sticky-header
.obh-site-nav--desktop
button.obh-site-nav__toggle:focus,

#sticky-header
.obh-site-nav--desktop
button.obh-site-nav__toggle:focus-visible {
 border: 0 !important;
 border-radius: 0 !important;

 background: none !important;
 background-color: transparent !important;
 background-image: none !important;

 box-shadow: none !important;
}


/* Remove any inherited pseudo-element button decoration */

#initial-header
.obh-site-nav--desktop
button.obh-site-nav__toggle::before,

#initial-header
.obh-site-nav--desktop
button.obh-site-nav__toggle::after,

#sticky-header
.obh-site-nav--desktop
button.obh-site-nav__toggle::before,

#sticky-header
.obh-site-nav--desktop
button.obh-site-nav__toggle::after {
 display: none !important;
 content: none !important;
}


/* Static compact chevron */

.obh-site-nav--desktop
.obh-site-nav__toggle-icon {
 display: block;

 width: 5px;
 height: 5px;

 border-right: 2px solid currentColor;
 border-bottom: 2px solid currentColor;

 transform:
 translateY(-1px)
 rotate(45deg);

 transform-origin: center;

 transition:
 color 220ms ease;
}


/* Transparent header arrow */

#initial-header
.obh-site-nav--desktop
.obh-site-nav__toggle {
 color: var(--obh-white) !important;
}


/* Sticky header arrow */

#sticky-header
.obh-site-nav--desktop
.obh-site-nav__toggle {
 color: var(--obh-navy) !important;
}


/* Keep chevron pointing downward while menu is open */

.obh-site-nav--desktop
.obh-site-nav__item.is-open
.obh-site-nav__toggle-icon {
 transform:
 translateY(-1px)
 rotate(45deg);
}

/* ==========================================================
 40. DESKTOP MEGA MENU
 Desktop / laptop only.
 Mobile slide-menu styling lives in the mobile section.
 ========================================================== */

@media (min-width: 1025px) {
 
 /* ----------------------------------------------------------
 MEGA MENU POSITIONING CONTEXT
 ---------------------------------------------------------- */

#initial-header .obh-header-inner,
#sticky-header .obh-header-inner {
 position: relative;
}

#initial-header .obh-header-inner .elementor-widget-shortcode,
#sticky-header .obh-header-inner .elementor-widget-shortcode,
#initial-header .obh-site-nav--desktop,
#sticky-header .obh-site-nav--desktop,
#initial-header .obh-site-nav--desktop .obh-site-nav__list,
#sticky-header .obh-site-nav--desktop .obh-site-nav__list,
#initial-header .obh-site-nav--desktop .obh-site-nav__item,
#sticky-header .obh-site-nav--desktop .obh-site-nav__item {
 position: static !important;
}

 /* ----------------------------------------------------------
 PANEL OPEN / CLOSE
 ---------------------------------------------------------- */

 .obh-mega-menu {
 position: absolute;

 top: 100%;
 left: 0;

 width: 100%;

 opacity: 0;
 visibility: hidden;
 pointer-events: none;

 transform: translateY(10px);

 transition:
 opacity 220ms ease,
 transform 220ms ease,
 visibility 0s linear 220ms;

 z-index: 200;
 }

 .obh-site-nav__item.is-open > .obh-mega-menu {
 opacity: 1;
 visibility: visible;
 pointer-events: auto;

 transform: translateY(0);

 transition:
 opacity 220ms ease,
 transform 220ms ease,
 visibility 0s linear 0s;
 }


 /* ----------------------------------------------------------
 SHARED MEGA MENU PANEL
 ---------------------------------------------------------- */

 .obh-mega-menu__inner {
 box-sizing: border-box;
 
 width: 75vw;
 max-width: 75vw;

 margin-inline: auto;

 padding: 36px;

 background:
 linear-gradient(
 180deg,
 #F6F7F8 0%,
 #E8EEF5 100%
 );

 border: 0;
 border-radius: 0;

 box-shadow:
 0 18px 42px
 rgba(16, 42, 77, 0.10);
 }


 /* ----------------------------------------------------------
 STANDARD MEGA MENUS
 About Us / Treatment / Levels of Care

 Left = 1 part
 Right = 2 parts
 ---------------------------------------------------------- */

 .obh-mega-menu__inner--standard {
 display: grid;

 grid-template-columns:
 minmax(0, 1fr)
 minmax(0, 2fr);

 column-gap: 80px;

 align-items: start;
 }


 /* ----------------------------------------------------------
 LEFT INTRO COLUMN
 ---------------------------------------------------------- */

 .obh-mega-menu__intro {
 min-width: 0;

 display: flex;
 flex-direction: column;
 align-items: flex-start;

 gap: 24px;
}

.obh-mega-menu__title,
.obh-mega-menu__summary {
 margin: 0 !important;
}

.obh-mega-menu__title {
 color: var(--obh-navy);

 font-family: var(--obh-font-heading);
 font-size: clamp(1.9rem, 2.15vw, 2.4rem);
 font-weight: 700;
 line-height: 1.15;
 letter-spacing: -1.2px;
}

 .obh-mega-menu__summary {
 width: 100%;
 max-width: 34rem;

 margin: 0;

 color: var(--obh-navy);

 font-family: var(--obh-font-body);
 font-size: 1rem;
 font-weight: 400;
 line-height: 1.4;
 letter-spacing: -0.1px;
 }


/* ----------------------------------------------------------
 MEGA MENU CTA

 Existing global Odyssey button system handles the
 actual button appearance.
 ---------------------------------------------------------- */

body .obh-mega-menu__intro > .obh-mega-menu__cta.obh-section-button {
 margin-top: 0 !important;
 margin-bottom: 0 !important;
}

.obh-mega-menu__cta .elementor-button {
 margin: 0 !important;
}
 
 /* ----------------------------------------------------------
 RIGHT SUBMENU GRID
 2 columns x 2 rows on all non-mobile header sizes
 ---------------------------------------------------------- */

 .obh-mega-menu__links-wrap {
 width: 100%;
 min-width: 0;
 }

 .obh-mega-menu__links {
 width: 100%;

 display: grid;

 grid-template-columns:
 repeat(2, minmax(0, 1fr));

 column-gap: 40px;
 row-gap: 24px;

 margin: 0 !important;
 padding: 0 !important;

 list-style: none !important;
 }

 .obh-mega-menu__item {
 min-width: 0;

 margin: 0 !important;
 padding: 0 !important;

 list-style: none !important;
 }


 /* ----------------------------------------------------------
 SUBMENU LINKS
 Shippori treatment from mockup
 ---------------------------------------------------------- */

 .obh-mega-menu__link {
 width: 100%;

 display: flex;
 align-items: flex-start;

 min-height: 0;

 padding: 0 0 14px;

 color: var(--obh-navy) !important;

 border-bottom:
 1px solid
 rgba(16, 42, 77, 0.14);

 font-family: var(--obh-font-heading) !important;
 font-size: clamp(1.08rem, 1.2vw, 1.28rem) !important;
 font-weight: 600 !important;
 line-height: 1.3 !important;
 letter-spacing: -0.7px !important;

 text-decoration: none !important;

 transition:
 color 240ms ease,
 border-color 240ms ease;
 }

 .obh-mega-menu__link:hover,
 .obh-mega-menu__link:focus-visible {
 color: var(--obh-purple) !important;

 border-color:
 rgba(135, 73, 147, 0.32);
 }

 .obh-mega-menu__link-text {
 color: inherit !important;
 }

 .obh-mega-menu__link-arrow {
 display: none;
 }


 /* ==========================================================
 ODYSSEY VIRTUAL MEGA MENU
 ========================================================== */

 .obh-mega-menu__inner--virtual {
 display: grid;

 grid-template-columns:
 minmax(0, 1fr)
 minmax(0, 2fr);

 column-gap: 80px;

 align-items: stretch;
 }


 /* Left Virtual column */

 .obh-mega-menu__intro--virtual {
 justify-content: flex-start;
 }

 .obh-mega-menu__virtual-logo {
 width: 100%;
 max-width: 245px;

 margin: 0;
 }

 .obh-mega-menu__virtual-logo-image {
 display: block;

 width: 100%;
 height: auto;

 max-width: 245px;
 }


 /* ----------------------------------------------------------
 VIRTUAL WHITE CTA CARD
 ---------------------------------------------------------- */

 .obh-mega-menu__virtual-card {
 width: 100%;
 min-width: 0;

 display: flex;
 flex-direction: column;
 justify-content: center;
 align-items: flex-start;

 gap: 24px;

 padding: 36px;

 background: var(--obh-white);

 border:
 1px solid
 rgba(16, 42, 77, 0.07);

 box-shadow:
 0 10px 28px
 rgba(16, 42, 77, 0.06);
 }

 .obh-mega-menu__virtual-heading {
 margin: 0;

 color: var(--obh-navy);

 font-family: var(--obh-type-shippori-subhead-family) !important;
 font-size: var(--obh-type-shippori-subhead-size) !important;
 font-weight: var(--obh-type-shippori-subhead-weight) !important;
 line-height: var(--obh-type-shippori-subhead-line-height) !important;
 letter-spacing: var(--obh-type-shippori-subhead-letter-spacing) !important;
 }

 .obh-mega-menu__virtual-copy {
 max-width: 42rem;

 margin: 0 !important;

 color: var(--obh-navy);

 font-family: var(--obh-font-body);
 font-size: 1rem;
 font-weight: 400;
 line-height: 1.4;
 letter-spacing: -0.1px;
 }

 .obh-mega-menu__virtual-actions {
 display: flex;
 flex-wrap: wrap;
 align-items: center;

 gap: 16px;

 margin-top: 0;
 }

 .obh-mega-menu__virtual-actions
 .obh-section-button.obh-mega-menu__virtual-start,
 .obh-mega-menu__virtual-actions
 .obh-section-button.obh-mega-menu__virtual-phone {
 margin-top: 0 !important;
 }


 }

/* ==========================================================
 50. RESPONSIVE DESKTOP / TABLET PREP
 ========================================================== */

@media (max-width: 1180px) {

 .obh-header-inner {
 width: 93vw;
 max-width: 93vw;

 gap: 24px;
 }

 #initial-header .obh-header-inner {
 width: calc(100% - 40px);
 max-width: none;
 }

 .obh-site-nav__list {
 gap: 18px;
 }

 .obh-site-nav__link {
 font-size: 0.94rem;
 }

 #initial-header .obh-site-logo__image {
 width: 220px;
 }

 #sticky-header .obh-site-logo__image {
 width: 185px;
 }

}


/* ----------------------------------------------------------
 HEADER TEXT-ARROW BUTTON SIZING
 ---------------------------------------------------------- */

.obh-textarrow-btn.obh-textarrow-btn--header-desktop
.elementor-button {
 font-size: 0.92rem !important;
}

.obh-textarrow-btn.obh-textarrow-btn--header-mobile
.elementor-button {
 font-size: 0.85rem !important;
}

/* ----------------------------------------------------------
   PAGE-AWARE HEADER ACTION

   Default = Locations
   Odyssey Virtual = Virtual phone
   ---------------------------------------------------------- */

.obh-header-action {
  flex: 0 0 auto;
  margin: 0 !important;
}

.obh-header-action .elementor-button {
  margin: 0 !important;
  white-space: nowrap;
}

/* Transparent header: white normally */

#initial-header
.obh-header-action
.elementor-button {
  color: var(--obh-white) !important;
}

/* Match main-nav light-blue hover */

#initial-header
.obh-header-action
.elementor-button:hover,
#initial-header
.obh-header-action
.elementor-button:focus-visible {
  color: var(--obh-accent) !important;
}


/* ----------------------------------------------------------
   INITIAL HEADER LOCATIONS BUTTON HOVER
   Match primary nav hover color
   ---------------------------------------------------------- */

#initial-header
.obh-textarrow-btn.obh-textarrow-btn--header-desktop
.elementor-button:hover,
#initial-header
.obh-textarrow-btn.obh-textarrow-btn--header-desktop
.elementor-button:focus-visible {
  color: var(--obh-accent) !important;
}


/* ==========================================================
   70. MOBILE / TABLET HEADER + SLIDE MENU
   ========================================================== */

#mobile-header {
  display: none;
}


/* ----------------------------------------------------------
   MOBILE FLOATING HEADER BAR
   Matches transparent desktop header.
   ---------------------------------------------------------- */

#mobile-header .obh-mobile-header-inner {
  width: 93% !important;
  max-width: 93% !important;

  min-height: 56px;

  margin:
    8px
    auto
    0 !important;

  padding:
    0
    18px !important;

  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;

  align-items: center !important;
  justify-content: space-between !important;

  gap: 16px;

  position: relative;
  z-index: 502;

  background:
    linear-gradient(
      100deg,
      rgba(16, 42, 77, 0.78) 0%,
      rgba(91, 50, 97, 0.72) 100%
    );

  border: 0;
  border-radius: 3px;

  box-shadow:
    0 8px 30px
    rgba(16, 42, 77, 0.14);

  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
}


/* ----------------------------------------------------------
   PAGE-AWARE WHITE LOGO
   Same shortcode / markup as desktop.
   ---------------------------------------------------------- */

#mobile-header .obh-site-logo {
  display: flex;
  align-items: center;

  flex: 0 1 auto;

  margin: 0;

  line-height: 0;
  text-decoration: none;
}

#mobile-header .obh-site-logo__image {
  display: block;

  width: 145px;
  height: auto;

  max-width: 100%;
}


/* ----------------------------------------------------------
   ELEMENTOR SHORTCODE WRAPPERS
   ---------------------------------------------------------- */

#mobile-header
.obh-mobile-header-inner
.elementor-widget-shortcode {
  width: auto;
  max-width: none;

  flex: 0 0 auto;
}


/* ----------------------------------------------------------
   RIGHT-SIDE HEADER ACTION GROUP
   ---------------------------------------------------------- */

#mobile-header .obh-mobile-header-actions {
  width: auto !important;
  max-width: none !important;

  margin-left: auto;

  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;

  align-items: center !important;
  justify-content: flex-end !important;

  gap: 12px;

  flex: 0 0 auto;
}


/* ----------------------------------------------------------
   PAGE-AWARE HEADER ACTION
   Locations / Virtual phone
   ---------------------------------------------------------- */

#mobile-header
.obh-textarrow-btn--header-mobile {
  width: auto !important;
  max-width: none !important;

  margin: 0 !important;

  flex: 0 0 auto;
}

#mobile-header
.obh-textarrow-btn--header-mobile
.elementor-button {
  margin: 0 !important;

  color: var(--obh-white) !important;

  font-size: 0.82rem !important;
  line-height: 1.1 !important;

  white-space: nowrap;
}

#mobile-header
.obh-textarrow-btn--header-mobile
.elementor-button:hover,
#mobile-header
.obh-textarrow-btn--header-mobile
.elementor-button:focus-visible {
  color: var(--obh-accent) !important;
}


/* ----------------------------------------------------------
   | MENU CONTROL
   ---------------------------------------------------------- */

#mobile-header .obh-mobile-menu-toggle {
  appearance: none !important;
  -webkit-appearance: none !important;

  display: inline-flex !important;
  align-items: center;
  justify-content: center;

  width: auto !important;
  min-width: 0 !important;
  height: auto !important;

  margin: 0 !important;

  padding:
    1px
    0
    1px
    12px !important;

  border: 0 !important;

  border-left:
    1px solid
    rgba(255, 255, 255, 0.58) !important;

  border-radius: 0 !important;

  background: transparent !important;
  box-shadow: none !important;

  color: var(--obh-white) !important;

  font-family: var(--obh-font-body) !important;
  font-size: 0.88rem !important;
  font-weight: 600 !important;
  line-height: 1.1 !important;
  letter-spacing: 0.02em !important;

  text-transform: lowercase;

  white-space: nowrap;

  cursor: pointer;

  transition:
    color 220ms ease,
    opacity 220ms ease;
}

#mobile-header .obh-mobile-menu-toggle:hover,
#mobile-header .obh-mobile-menu-toggle:focus-visible {
  color: var(--obh-accent) !important;

  background: transparent !important;
  box-shadow: none !important;
}


/* ----------------------------------------------------------
   MOBILE MENU POPOUT
   93% centered light mega-menu gradient.
   ---------------------------------------------------------- */

#mobile-header .obh-mobile-nav-panel {
  position: fixed !important;

  top: 72px;
  left: 50%;

  width: 93% !important;
  max-width: 93% !important;

  height:
    calc(100dvh - 88px);

  margin: 0 !important;
  padding: 0 !important;

  background:
    linear-gradient(
      180deg,
      #F6F7F8 0%,
      #E8EEF5 100%
    );

  border: 0;
  border-radius: 3px;

  box-shadow:
    0 18px 42px
    rgba(16, 42, 77, 0.14);

  opacity: 0;
  visibility: hidden;
  pointer-events: none;

  transform:
    translateX(-50%)
    translateY(-12px);

  overflow-x: hidden !important;
  overflow-y: auto !important;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;

  z-index: 500;

  transition:
    opacity 260ms ease,
    transform 260ms ease,
    visibility 0s linear 260ms;
}

body.obh-mobile-menu-open
#mobile-header
.obh-mobile-nav-panel {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;

  transform:
    translateX(-50%)
    translateY(0);

  transition:
    opacity 260ms ease,
    transform 260ms ease,
    visibility 0s linear 0s;
}

body.obh-mobile-menu-open {
  overflow: hidden;
}


/* ----------------------------------------------------------
   MOBILE MENU STAGE
   ---------------------------------------------------------- */

#mobile-header
.obh-mobile-nav-panel,
#mobile-header
.obh-mobile-nav-panel > .e-con-inner,
#mobile-header
.obh-mobile-nav-panel .elementor-widget-shortcode,
#mobile-header
.obh-mobile-nav-panel .elementor-widget-container,
#mobile-header
.obh-site-nav--mobile {
  box-sizing: border-box;

  width: 100% !important;
  max-width: none !important;
}

#mobile-header
.obh-mobile-nav-panel > .e-con-inner,
#mobile-header
.obh-mobile-nav-panel .elementor-widget-shortcode,
#mobile-header
.obh-mobile-nav-panel .elementor-widget-container,
#mobile-header
.obh-site-nav--mobile {
  min-height: 100%;
  height: auto;
}

#mobile-header
.obh-mobile-nav-panel > .e-con-inner {
  padding: 0 !important;
}

#mobile-header
.obh-site-nav--mobile {
  position: relative;

  overflow: visible;
}

#mobile-header
.obh-mobile-menu__root {
  box-sizing: border-box;

  width: 100% !important;
  max-width: none !important;
  min-height: 100%;
  height: auto;

  padding: 36px !important;

  overflow: visible;

  opacity: 1;

  transform: translateX(0);

  transition:
    transform 300ms ease,
    opacity 240ms ease;
}

#mobile-header
.obh-site-nav--mobile.is-submenu-open
.obh-mobile-menu__root {
  opacity: 0;

  transform: translateX(-100%);

  pointer-events: none;
}


/* ----------------------------------------------------------
   ROOT NAVIGATION SCREEN
   ---------------------------------------------------------- */

#mobile-header
.obh-site-nav--mobile
.obh-site-nav__list {
  width: 100% !important;
  max-width: none !important;

  display: flex !important;
  flex-direction: column !important;

  align-items: stretch !important;
  justify-content: flex-start !important;

  gap: 0;

  margin: 0 !important;
  padding: 0 !important;

  list-style: none !important;
}

#mobile-header
.obh-site-nav--mobile
.obh-site-nav__item {
  width: 100% !important;
  max-width: none !important;

  margin: 0 !important;
  padding: 0 !important;

  list-style: none !important;

  border-bottom:
    1px solid
    rgba(16, 42, 77, 0.14);
}

#mobile-header
.obh-site-nav--mobile
.obh-site-nav__parent {
  width: 100%;

  min-height: 68px;

  display: flex;
  align-items: center;
  justify-content: space-between;

  gap: 18px;
}


/* ----------------------------------------------------------
   ROOT MENU LINKS
   Shippori styling locked against global link typography.
   ---------------------------------------------------------- */

#mobile-header
.obh-site-nav--mobile
.obh-site-nav__parent
.obh-site-nav__link {
  flex: 1 1 auto;

  display: flex !important;
  align-items: center;

  padding:
    20px
    0 !important;

  color: var(--obh-navy) !important;

  font-family: var(--obh-font-heading) !important;
  font-size: 1.35rem !important;
  font-weight: 600 !important;
  line-height: 1.25 !important;
  letter-spacing: -0.7px !important;

  text-decoration: none !important;

  transition:
    color 220ms ease;
}

#mobile-header
.obh-site-nav--mobile
.obh-site-nav__parent
.obh-site-nav__link:hover,
#mobile-header
.obh-site-nav--mobile
.obh-site-nav__parent
.obh-site-nav__link:focus-visible {
  color: var(--obh-purple) !important;
}


/* ----------------------------------------------------------
   ROOT RIGHT-ARROW CONTROL
   ---------------------------------------------------------- */

#mobile-header
.obh-site-nav--mobile
.obh-site-nav__toggle {
  appearance: none !important;
  -webkit-appearance: none !important;

  flex: 0 0 34px;

  width: 34px !important;
  min-width: 34px !important;
  height: 34px !important;

  margin: 0 !important;
  padding: 0 !important;

  display: inline-flex !important;
  align-items: center;
  justify-content: center;

  color: var(--obh-navy) !important;

  border: 0 !important;
  border-radius: 0 !important;

  background: transparent !important;
  box-shadow: none !important;
}

#mobile-header
.obh-site-nav--mobile
.obh-site-nav__toggle-icon {
  width: 8px;
  height: 8px;

  border-right:
    1.5px solid currentColor;

  border-bottom:
    1.5px solid currentColor;

  transform:
    rotate(-45deg);
}


/* ----------------------------------------------------------
   MOBILE SLIDE CONTAINER
   ---------------------------------------------------------- */

#mobile-header
.obh-mobile-menu__slides {
  position: absolute;

  inset: 0;

  width: 100%;
  min-height: 100%;

  pointer-events: none;
}

#mobile-header
.obh-mobile-menu__slide {
  position: absolute !important;

  inset: 0;

  width: 100% !important;
  max-width: none !important;
  min-height: 100%;

  margin: 0 !important;

  opacity: 0;
  visibility: hidden;
  pointer-events: none;

  transform:
    translateX(100%) !important;

  overflow: visible !important;
  overscroll-behavior: auto;

  transition:
    transform 300ms ease,
    opacity 240ms ease,
    visibility 0s linear 300ms;
}

#mobile-header
.obh-mobile-menu__slide.is-active {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;

  transform:
    translateX(0) !important;

  transition:
    transform 300ms ease,
    opacity 240ms ease,
    visibility 0s linear 0s;
}


/* ----------------------------------------------------------
   BACK CONTROL
   ---------------------------------------------------------- */

#mobile-header
.obh-mobile-menu__back {
  appearance: none !important;
  -webkit-appearance: none !important;

  display: inline-flex !important;
  align-items: center;

  gap: 8px;

  width: fit-content !important;
  align-self: flex-start;

  margin: 0 !important;

  padding: 0 !important;

  color: var(--obh-primary) !important;

  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;

  font-family: var(--obh-font-body) !important;
  font-size: 0.9rem !important;
  font-weight: 700 !important;
  line-height: 1.2 !important;
  letter-spacing: 0.02em !important;

  cursor: pointer;
}

#mobile-header
.obh-mobile-menu__back {
  position: relative;
}

#mobile-header
.obh-mobile-menu__back:hover,
#mobile-header
.obh-mobile-menu__back:focus-visible {
  color: var(--obh-purple) !important;
}

#mobile-header
.obh-mobile-menu__back:focus,
#mobile-header
.obh-mobile-menu__back:focus-visible {
  outline: none !important;
  box-shadow: none !important;
}

#mobile-header
.obh-mobile-menu__back::after {
  content: "";
  position: absolute;

  left: 0;
  right: auto;
  bottom: -6px;

  width: 100%;
  height: 2px;

  background: linear-gradient(
    90deg,
    #258FE8 0%,
    #B05ACB 100%
  );

  opacity: 0;
  transform: scaleX(0.35);
  transform-origin: center;

  transition:
    opacity 180ms ease,
    transform 180ms ease;
}

#mobile-header
.obh-mobile-menu__back:focus-visible::after {
  opacity: 1;
  transform: scaleX(1);
}

#mobile-header
.obh-mobile-menu__back:focus,
#mobile-header
.obh-mobile-menu__back:focus-visible {
  outline: none !important;
  box-shadow: none !important;
}


/* ----------------------------------------------------------
   MOBILE MEGA-MENU CONTENT
   Same semantic classes/content as desktop.
   Only layout changes.
   ---------------------------------------------------------- */

#mobile-header
.obh-mobile-menu__slide
.obh-mega-menu__inner {
  box-sizing: border-box;

  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  min-height: 100%;

  margin: 0 !important;

  padding: 36px !important;

  background: transparent !important;

  border: 0 !important;
  border-radius: 0 !important;

  box-shadow: none !important;
}


/* Standard + Virtual slides stack vertically */

#mobile-header
.obh-mega-menu__inner--standard,
#mobile-header
.obh-mega-menu__inner--virtual {
  display: flex !important;
  flex-direction: column !important;

  gap: 36px !important;
}


/* ----------------------------------------------------------
   SHARED INTRO CONTENT
   ---------------------------------------------------------- */

#mobile-header
.obh-mega-menu__intro {
  min-width: 0;

  display: flex;
  flex-direction: column;
  align-items: flex-start;

  gap: 24px;
}

#mobile-header
.obh-mega-menu__title,
#mobile-header
.obh-mega-menu__summary {
  margin: 0 !important;
}

#mobile-header
.obh-mega-menu__title {
  color: var(--obh-navy) !important;

  font-family: var(--obh-font-heading) !important;
  font-size: 1.7rem !important;
  font-weight: 700 !important;
  line-height: 1.15 !important;
  letter-spacing: -1.2px !important;
}

#mobile-header
.obh-mega-menu__summary {
  width: 100%;
  max-width: 34rem;

  color: var(--obh-navy) !important;

  font-family: var(--obh-font-body) !important;
  font-size: 1rem !important;
  font-weight: 400 !important;
  line-height: 1.4 !important;
  letter-spacing: -0.1px !important;
}


/* ----------------------------------------------------------
   SHARED MEGA MENU CTA
   Existing global section-button system stays in control.
   ---------------------------------------------------------- */

body
#mobile-header
.obh-mega-menu__intro
> .obh-mega-menu__cta.obh-section-button {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

#mobile-header
.obh-mega-menu__cta
.elementor-button {
  margin: 0 !important;
}


/* ----------------------------------------------------------
   CHILD-PAGE LINKS
   Shared mega-menu classes; mobile layout only.
   ---------------------------------------------------------- */

#mobile-header
.obh-mega-menu__links-wrap {
  width: 100%;
  min-width: 0;
}

#mobile-header
.obh-mega-menu__links {
  width: 100%;

  display: grid !important;
  grid-template-columns: 1fr !important;

  gap: 18px !important;

  margin: 0 !important;
  padding: 0 !important;

  list-style: none !important;
}

#mobile-header
.obh-mega-menu__item {
  min-width: 0;

  margin: 0 !important;
  padding: 0 !important;

  list-style: none !important;
}

#mobile-header
.obh-mega-menu__link {
  width: 100%;

  display: flex;
  align-items: flex-start;

  min-height: 0;

  padding:
    0
    0
    14px !important;

  color: var(--obh-navy) !important;

  border-bottom:
    1px solid
    rgba(16, 42, 77, 0.14);

  font-family: var(--obh-font-heading) !important;
  font-size: 1.18rem !important;
  font-weight: 600 !important;
  line-height: 1.3 !important;
  letter-spacing: -0.7px !important;

  text-decoration: none !important;

  transition:
    color 240ms ease,
    border-color 240ms ease;
}

#mobile-header
.obh-mega-menu__link:hover,
#mobile-header
.obh-mega-menu__link:focus-visible {
  color: var(--obh-purple) !important;

  border-color:
    rgba(135, 73, 147, 0.32);
}

#mobile-header
.obh-mega-menu__link-text {
  color: inherit !important;
}

#mobile-header
.obh-mega-menu__link-arrow {
  display: none !important;
}


/* ----------------------------------------------------------
   ODYSSEY VIRTUAL MOBILE SLIDE
   ---------------------------------------------------------- */

#mobile-header
.obh-mega-menu__virtual-logo {
  width: 100%;
  max-width: 220px;

  margin: 0;
}

#mobile-header
.obh-mega-menu__virtual-logo-image {
  display: block;

  width: 100%;
  height: auto;

  max-width: 220px;
}

#mobile-header
.obh-mega-menu__virtual-card {
  width: 100%;
  min-width: 0;

  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;

  gap: 24px;

  padding: 28px;

  background: var(--obh-white);

  border:
    1px solid
    rgba(16, 42, 77, 0.07);

  box-shadow:
    0 10px 28px
    rgba(16, 42, 77, 0.06);
}

#mobile-header
.obh-mega-menu__virtual-heading {
  margin: 0 !important;

  color: var(--obh-navy) !important;

  font-family: var(--obh-type-shippori-subhead-family) !important;
  font-size: 1.35rem !important;
  font-weight: var(--obh-type-shippori-subhead-weight) !important;
  line-height: var(--obh-type-shippori-subhead-line-height) !important;
  letter-spacing: var(--obh-type-shippori-subhead-letter-spacing) !important;
}

#mobile-header
.obh-mega-menu__virtual-copy {
  margin: 0 !important;

  color: var(--obh-navy) !important;

  font-family: var(--obh-font-body) !important;
  font-size: 1rem !important;
  font-weight: 400 !important;
  line-height: 1.4 !important;
  letter-spacing: -0.1px !important;
}

#mobile-header
.obh-mega-menu__virtual-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;

  gap: 16px;

  margin-top: 0;
}

#mobile-header
.obh-mega-menu__virtual-start,
#mobile-header
.obh-mega-menu__virtual-phone {
  margin-top: 0 !important;
}


/* ----------------------------------------------------------
   TABLET + MOBILE HEADER SWITCH
   Non-sticky mobile header with gentle fade near top.
   ---------------------------------------------------------- */

@media (max-width: 1024px) {

  #initial-header,
  #sticky-header {
    display: none !important;
  }

  #mobile-header {
    display: block !important;

    position: absolute !important;

    top: 0;
    right: 0;
    bottom: auto;
    left: 0;

    width: 100% !important;

    z-index: 501;

    background: transparent !important;

    border: 0 !important;
    box-shadow: none !important;

    opacity: 1;

    transform: translateY(0);

    transition:
      opacity 520ms ease,
      transform 560ms ease;

    pointer-events: auto;
  }

  body.obh-mobile-header-faded
  #mobile-header {
    opacity: 0;

    transform:
      translateY(-12px);

    pointer-events: none;
  }

}