/* ===== DW Ogg — Mobile menu: collapsed by default, stacks when opened ===== */
@media (max-width: 959px) {
  /* Off-canvas panel is already moved in with body.mobile-open (JS handles this).
     We just fix the UL layout and override the inline-flex rule. */

  /* When the panel is open (body has .mobile-open), make the list a vertical stack */
  body.mobile-open .custom-menu-primary.js-enabled .hs-menu-wrapper > ul {
    display: flex !important;         /* override inline-flex / inline */
    flex-direction: column;
    align-items: stretch;
    width: 100%;
    margin: 0;
    padding: 0;
  }

  /* Hard override the rule that caused the “one-letter-per-line” issue */
  .header-box-main .hs-menu-wrapper.hs-menu-flow-vertical.flyouts ul {
    display: flex !important;
  }

  /* Links and items take full width and wrap text normally */
  .custom-menu-primary.js-enabled .hs-menu-wrapper > ul li {
    display: block;
    width: 100%;
  }
  .custom-menu-primary.js-enabled .hs-menu-wrapper > ul a {
    display: block;
    width: 100%;
    white-space: normal;
    line-height: 1.3;
    letter-spacing: normal;
    transform: none !important;
    writing-mode: horizontal-tb !important;
  }

  /* If any overlay variant is used, prevent max-content squeezing */
  .header-box-main .overlay-content ul {
    width: 100% !important;
  }
}
/* ===== Mobile top bar for HEADER-NEW (top-level only; children folded) ===== */
@media (max-width: 767px) {
  /* Make sure the off-canvas panel shows normally */
  .header-box-main .custom-menu-primary.js-enabled .hs-menu-wrapper {
    position: relative !important;
    right: auto !important;
    height: auto !important;
    padding: 8px 0 !important;
    display: block !important;
    background: #fff !important;
  }

  /* Show ONLY top-level items as a horizontal, scrollable strip */
  .header-box-main .hs-menu-wrapper > ul {
    display: flex !important;
    flex-wrap: nowrap;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    gap: 16px;
    padding: 8px 12px;
    border-bottom: 1px solid #eee;
  }
  .header-box-main .hs-menu-wrapper > ul > li {
    flex: 0 0 auto;
    margin: 0 !important;
    border: 0 !important;
  }
  .header-box-main .hs-menu-wrapper > ul > li > a {
    display: inline-block !important;
    padding: 8px 6px !important;
    white-space: nowrap !important;
    text-align: center !important;
  }

  /* HIDE all submenus by default */
  .header-box-main .hs-menu-wrapper ul ul {
    display: none !important;
    position: static !important;
    width: 100% !important;
    box-shadow: none !important;
    border: 0 !important;
    padding: 8px 12px !important;
  }

  /* OPEN a submenu only when the parent is toggled (theme uses .child-open / .is-open) */
  .header-box-main .hs-menu-wrapper li.child-open > ul,
  .header-box-main .hs-menu-wrapper li.is-open > ul {
    display: block !important;
  }

  /* Neutralize any odd letter/vertical writing rules on mobile */
  .header-box-main .hs-menu-wrapper a {
    white-space: normal !important;
    writing-mode: horizontal-tb !important;
    transform: none !important;
    letter-spacing: normal !important;
    line-height: 1.3 !important;
  }

  /* Optional: hide the big CTA inside the menu on mobile */
  .header-box-main .header-cta 
}
/* ===== Header-new: CTA + mobile/tablet polish ===== */

/* --- MOBILE (≤767px): keep one CTA, fix clipping, keep top items in a thin bar --- */
@media (max-width: 767px) {
  /* We previously hid header-cta in some fixes — ensure it shows now */
  .header-box-main .header-cta { display: block !important; }

  /* Keep only ONE CTA: use the dedicated header CTA and hide menu-CTA duplicates */

  /* Make sure the CTA text doesn't get cut off */
  .header-box-main .header-cta a.talk-anchor {
    display: inline-block !important;
    padding: 10px 14px !important;
    line-height: 1.2 !important;
    white-space: nowrap !important;
    max-width: 100% !important;
    overflow: visible !important;
  }

  /* Keep the top-level menu as a slim horizontal scroller (from earlier fix) */
  .header-box-main .custom-menu-primary.js-enabled .hs-menu-wrapper {
    position: relative !important;
    right: auto !important;
    height: auto !important;
    padding: 8px 0 !important;
    display: block !important;
    background: #fff !important;
  }
  .header-box-main .hs-menu-wrapper > ul {
    display: flex !important;
    flex-wrap: nowrap;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    gap: 16px;
    padding: 8px 12px;
    border-bottom: 1px solid #eee;
  }
  .header-box-main .hs-menu-wrapper > ul > li {
    flex: 0 0 auto;
    margin: 0 !important;
    border: 0 !important;
  }
  .header-box-main .hs-menu-wrapper > ul > li > a {
    display: inline-block !important;
    padding: 8px 6px !important;
    white-space: nowrap !important;
    text-align: center !important;
  }

  /* Hide all submenus by default; open only when parent is toggled by theme */
  .header-box-main .hs-menu-wrapper ul ul { display: none !important; position: static !important; }
  .header-box-main .hs-menu-wrapper li.child-open > ul,
  .header-box-main .hs-menu-wrapper li.is-open > ul { display: block !important; }
}

/* --- TABLET (768–1024px): keep one CTA, show top-level inline, fold children --- */
@media (min-width: 768px) and (max-width: 1024px) {
  /* Single CTA only */
  .header-box-main .hs-menu-wrapper > ul > li.hs-menu-depth-1:last-child { display: none !important; }
  .header-box-main .open-popup-link.header-btn { display: none !important; }
  .header-box-main .header-cta { display: block !important; }
  .header-box-main .header-cta a.talk-anchor { white-space: nowrap !important; }

  /* Top-level items inline; children folded unless toggled */
  .header-box-main .hs-menu-wrapper > ul {
    display: flex !important;
    flex-wrap: wrap;
    gap: 16px;
    padding: 8px 0;
  }
  .header-box-main .hs-menu-wrapper ul ul { display: none !important; }
  .header-box-main .hs-menu-wrapper li.child-open > ul,
  .header-box-main .hs-menu-wrapper li.is-open > ul { display: block !important; }

  /* Guard against weird letter stacking */
  .header-box-main .hs-menu-wrapper a {
    white-space: normal !important;
    writing-mode: horizontal-tb !important;
    transform: none !important;
    letter-spacing: normal !important;
    line-height: 1.3 !important;
  }
}
/* === Header-new: single CTA + correct mobile & tablet layout (override) === */

/* MOBILE (≤767px) ------------------------------------------------------- */
@media (max-width: 767px) {
  /* Use the CTA that’s inside the menu (last item) and hide the standalone one
     so you never get duplicates. This guarantees you always have one CTA. */

  /* Keep the top level as a slim horizontal strip */
  .header-box-main .custom-menu-primary.js-enabled .hs-menu-wrapper {
    position: relative !important;
    right: auto !important;
    height: auto !important;
    padding: 8px 0 !important;
    display: block !important;
    background: #fff !important;
  }
  .header-box-main .hs-menu-wrapper > ul {
    display: flex !important;
    flex-wrap: nowrap;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    gap: 12px;
    padding: 8px 12px;
    border-bottom: 1px solid #eee;
  }
  .header-box-main .hs-menu-wrapper > ul > li {
    flex: 0 0 auto;
    margin: 0 !important;
    border: 0 !important;
  }
  .header-box-main .hs-menu-wrapper > ul > li > a {
    display: inline-block !important;
    padding: 8px 6px !important;
    white-space: nowrap !important;
    text-align: center !important;
  }

  /* Make the last item look like a proper button and prevent clipping */
  .header-box-main .hs-menu-wrapper > ul > li.hs-menu-depth-1:last-child > a {
    display: inline-block !important;
    padding: 10px 14px !important;
    line-height: 1.2 !important;
    white-space: nowrap !important;
    border-radius: 4px;
  }

  /* Hide all submenus by default; theme opens on .child-open / .is-open */
  .header-box-main .hs-menu-wrapper ul ul { display: none !important; position: static !important; }
  .header-box-main .hs-menu-wrapper li.child-open > ul,
  .header-box-main .hs-menu-wrapper li.is-open   > ul { display: block !important; }

  /* Safety: stop any odd vertical text effects */
  .header-box-main .hs-menu-wrapper a {
    white-space: normal !important;
    writing-mode: horizontal-tb !important;
    transform: none !important;
    letter-spacing: normal !important;
    line-height: 1.3 !important;
  }
}

/* TABLET (768–1024px) --------------------------------------------------- */
@media (min-width: 768px) and (max-width: 1024px) {
  /* Same approach: keep a single CTA (use menu last item), hide standalone */

  /* Force the top level to be a horizontal row (not stacked) */
  .header-box-main .hs-menu-wrapper > ul {
    display: flex !important;
    flex-wrap: wrap;
    gap: 16px;
    padding: 10px 0;
  }
  .header-box-main .hs-menu-wrapper > ul > li {
    margin: 0 !important;
  }
  .header-box-main .hs-menu-wrapper > ul > li > a {
    white-space: nowrap !important;
  }

  /* Make the last item (CTA) look right and never truncate */
  .header-box-main .hs-menu-wrapper > ul > li.hs-menu-depth-1:last-child > a {
    display: inline-block !important;
    padding: 10px 16px !important;
    line-height: 1.2 !important;
    white-space: nowrap !important;
    border-radius: 4px;
  }

  /* Fold child menus unless the theme toggles them open */
  .header-box-main .hs-menu-wrapper ul ul { display: none !important; }
  .header-box-main .hs-menu-wrapper li.child-open > ul,
  .header-box-main .hs-menu-wrapper li.is-open   > ul { display: block !important; }

  /* Safety overrides */
  .header-box-main .hs-menu-wrapper a {
    white-space: normal !important;
    writing-mode: horizontal-tb !important;
    transform: none !important;
    letter-spacing: normal !important;
    line-height: 1.3 !important;
  }
}
/* === Header-new: restore CTA on mobile, remove duplicates, tablet horizontal === */

/* ---------- MOBILE (≤767px) ---------- */
@media (max-width: 767px) {
  /* 1) SHOW the original header CTA again */
  .header-box-main .header-cta { 
    display: block !important; 
    padding-right: 12px;                 /* breathing room on right edge */
  }

  /* Make sure the CTA text never gets clipped or duplicated visually */
  .header-box-main .header-cta a.talk-anchor {
    display: inline-block !important;
    padding: 10px 16px !important;
    line-height: 1.2 !important;
    white-space: nowrap !important;      /* single-line button text */
    max-width: 100% !important;
    overflow: visible !important;
  }

  /* 2) HIDE duplicates inside the menu */
  /* Last menu item that duplicates CTA */
  .header-box-main .hs-menu-wrapper > ul > li.hs-menu-depth-1:last-child { 
    display: none !important; 
  }
  /* JS-appended popup CTA duplicate */
  .header-box-main .open-popup-link.header-btn { 
    display: none !important; 
  }

  /* Keep your horizontal top-level strip (from earlier) */
  .header-box-main .custom-menu-primary.js-enabled .hs-menu-wrapper {
    position: relative !important;
    right: auto !important;
    height: auto !important;
    padding: 8px 0 !important;
    display: block !important;
    background: #fff !important;
  }
  .header-box-main .hs-menu-wrapper > ul {
    display: flex !important;
    flex-wrap: nowrap;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    gap: 12px;
    padding: 8px 12px;
    border-bottom: 1px solid #eee;
  }
  .header-box-main .hs-menu-wrapper > ul > li {
    flex: 0 0 auto;
    margin: 0 !important;
    border: 0 !important;
  }
  .header-box-main .hs-menu-wrapper > ul > li > a {
    display: inline-block !important;
    padding: 8px 6px !important;
    white-space: nowrap !important;
    text-align: center !important;
  }

  /* Hide all submenus by default; open only when parent is toggled */
  .header-box-main .hs-menu-wrapper ul ul { 
    display: none !important; 
    position: static !important; 
  }
  .header-box-main .hs-menu-wrapper li.child-open > ul,
  .header-box-main .hs-menu-wrapper li.is-open   > ul { 
    display: block !important; 
  }
}

/* ---------- TABLET (768–1024px) ---------- */
@media (min-width: 768px) and (max-width: 1024px) {
  /* Keep the original header CTA visible; hide menu duplicate(s) */
  .header-box-main .header-cta { 
    display: block !important; 
    padding-right: 12px;                 /* give it some right padding on tablet too */
  }
  .header-box-main .hs-menu-wrapper > ul > li.hs-menu-depth-1:last-child { 
    display: none !important; 
  }
  .header-box-main .open-popup-link.header-btn { 
    display: none !important; 
  }
  .header-box-main .header-cta a.talk-anchor {
    white-space: nowrap !important;
    padding: 10px 16px !important;
    line-height: 1.2 !important;
  }

  /* Force the main nav to lay out horizontally on tablet */
  .header-box-main .hs-menu-wrapper > ul {
    display: flex !important;
    flex-wrap: wrap;                      /* wrap to next line if needed, still horizontal */
    gap: 16px;
    padding: 10px 0;
  }
  .header-box-main .hs-menu-wrapper > ul > li { 
    margin: 0 !important; 
  }
  .header-box-main .hs-menu-wrapper > ul > li > a { 
    white-space: nowrap !important; 
  }

  /* Keep child menus folded unless toggled by your theme’s class */
  .header-box-main .hs-menu-wrapper ul ul { display: none !important; }
  .header-box-main .hs-menu-wrapper li.child-open > ul,
  .header-box-main .hs-menu-wrapper li.is-open   > ul { display: block !important; }

  /* Safety: prevent any vertical-writing/letter spacing issues */
  .header-box-main .hs-menu-wrapper a {
    white-space: normal !important
/* === FINAL OVERRIDE: restore standalone CTA, fix clipping, horizontal tablet nav === */

/* Phones & Tablets: ALWAYS show the standalone CTA (.header-cta) */
@media (max-width: 1024px) {
  /* Unhide and raise it above overlays; give right padding so it isn't cut off */
  .header-box-main .header-cta {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    position: relative;
    z-index: 1004;
    padding-right: 12px;
  }
  .header-box-main .header-cta a.talk-anchor {
    display: inline-block !important;
    padding: 10px 16px !important;
    line-height: 1.2 !important;
    white-space: nowrap !important; /* prevent text wrapping / duplication look */
    overflow: visible !important;
  }

  /* Make sure its row/containers are visible on mobile */
  .header-box-main .nav-col,
  .header-box-main .nav-col .nav-wrapper,
  .header-box-main .custom-menu-primary.js-enabled .hs-menu-wrapper {
    display: block !important;
  }

  /* If the site adds a dark overlay when menu opens, keep CTA above it */
  body.mobile-open .header-box-main .header-cta {
    display: block !important;
    z-index: 1004 !important;
  }

  /* Keep main menu top level tidy on phones */
  @media (max-width: 767px) {
    .header-box-main .hs-menu-wrapper > ul {
      display: flex !important;
      flex-wrap: nowrap;
      overflow-x: auto;
      -webkit-overflow-scrolling: touch;
      gap: 12px;
      padding: 8px 12px;
      border-bottom: 1px solid #eee;
    }
    .header-box-main .hs-menu-wrapper > ul > li {
      flex: 0 0 auto;
      margin: 0 !important;
      border: 0 !important;
    }
    .header-box-main .hs-menu-wrapper > ul > li > a {
      display: inline-block !important;
      padding: 8px 6px !important;
      white-space: nowrap !important;
      text-align: center !important;
    }

    /* Hide all submenus by default; theme opens them with its toggle classes */
    .header-box-main .hs-menu-wrapper ul ul { display: none !important; position: static !important; }
    .header-box-main .hs-menu-wrapper li.child-open > ul,
    .header-box-main .hs-menu-wrapper li.is-open   > ul { display: block !important; }
  }
}

/* Tablets only: force horizontal main nav (keep CTA visible) */
@media (min-width: 768px) and (max-width: 1024px) {
  .header-box-main .hs-menu-wrapper > ul {
    display: flex !important;
    flex-wrap: wrap;         /* wrap to next line if needed, but stay horizontal */
    gap: 16px;
    padding: 10px 0;
  }
  .header-box-main .hs-menu-wrapper > ul > li { margin: 0 !important; }
  .header-box-main .hs-menu-wrapper > ul > li > a { white-space: nowrap !important; }

  /* Keep child menus folded unless toggled by the theme */
  .header-box-main .hs-menu-wrapper ul ul { display: none !important; }
  .header-box-main .hs-menu-wrapper li.child-open > ul,
  .header-box-main .hs-menu-wrapper li.is-open   > ul { display: block !important; }
}

    /* === FIX: make menu last item the CTA, fix mobile padding, keep tablet horizontal === */

/* 1) Undo the mobile re-order that breaks the CTA */
@media (max-width: 959px){
  .header-box-main .hs-menu-wrapper>ul li.hs-menu-depth-1:last-child{
    order: 0 !important;
    margin: 0 !important;
    text-align: center !important;
  }
}

/* 2) Style the last menu item as the CTA on phones & tablets (and give right padding) */
@media (max-width: 1024px){
  .header-box-main .hs-menu-wrapper>ul>li.hs-menu-depth-1:last-child{
    display: inline-block !important;
    margin-right: 12px !important;    /* avoids visual cutoff on the right */
  }
  .header-box-main .hs-menu-wrapper>ul>li.hs-menu-depth-1:last-child > a{
    display: inline-block !important;
    background: #b11f24 !important;
    color: #fff !important;
    border: 1px solid #b11f24 !important;
    border-radius: 4px !important;
    padding: 10px 16px !important;
    line-height: 1.2 !important;
    white-space: nowrap !important;
    text-transform: uppercase !important;
    font-weight: 500 !important;
  }

  /* If a popup CTA link exists, keep it hidden so you only have one button */
  .header-box-main .open-popup-link.header-btn{ display: none !important; }
}

/* 3) Tablet (768–1024px): force main nav to be horizontal */
@media (min-width: 768px) and (max-width: 1024px){
  .header-box-main .hs-menu-wrapper>ul{
    display: flex !important;
    flex-wrap: wrap;                 /* allows two rows if needed, still horizontal */
    gap: 16px;
    padding: 10px 0;
  }
  .header-box-main .hs-menu-wrapper>ul>li{ margin: 0 !important; }
  .header-box-main .hs-menu-wrapper>ul>li>a{ white-space: nowrap !important; }
}

/* 4) Phone (≤767px): keep top-level as a slim horizontal strip */
@media (max-width: 767px){
  .header-box-main .hs-menu-wrapper>ul{
    display: flex !important;
    flex-wrap: nowrap;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    gap: 12px;
    padding: 8px 12px;
    border-bottom: 1px solid #eee;
  }
  .header-box-main .hs-menu-wrapper>ul>li{ flex: 0 0 auto; }
}

    
/* IMPORTANT: Hide CTA duplicates that sometimes get injected elsewhere */
@media (max-width: 1024px) {
  /* If your menu’s last item is a duplicate CTA, hide that one */
  .header-box-main .hs-menu-wrapper > ul > li.hs-menu-depth-1:last-child { display: none !important; }
  /* If JS injected a popup CTA link, hide that too */
  .header-box-main .open-popup-link.header-btn { display: none !important; }
}
/* === FINAL FIX: single CTA (correct link), no clipping, tablet horizontal === */

/* 0) Never style or show a duplicate popup CTA */
@media (max-width: 1024px){
  .header-box-main .open-popup-link.header-btn { display: none !important; }
}

/* 1) Keep only the CORRECT CTA in the last menu item:
      - Style ONLY the anchor with class .nav-button
      - Hide any other anchors inside that same last <li> (prevents wrong link) */
@media (max-width: 1024px){
  /* Hide any non-CTA anchors inside the last menu item */
  .header-box-main .hs-menu-wrapper > ul > li.hs-menu-depth-1:last-child > a:not(.nav-button){
    display: none !important;
  }

  /* Style the real CTA */
  .header-box-main .hs-menu-wrapper > ul > li.hs-menu-depth-1:last-child > a.nav-button{
    display: inline-block !important;
    background: #b11f24 !important;
    color: #fff !important;
    border: 1px solid #b11f24 !important;
    border-radius: 4px !important;
    padding: 10px 16px !important;
    line-height: 1.2 !important;
    white-space: nowrap !important;
    text-transform: uppercase !important;
    font-weight: 600 !important;
    margin-right: 12px !important;      /* prevents right-edge clipping on mobile */
  }

  /* Make sure no rule moves the last item to the top on mobile */
  .header-box-main .hs-menu-wrapper > ul > li.hs-menu-depth-1:last-child{
    order: 0 !important;
    margin: 0 !important;
    text-align: center !important;
  }
}

/* 2) Mobile top level: slim horizontal strip (keeps your earlier intent) */
@media (max-width: 767px){
  .header-box-main .hs-menu-wrapper > ul{
    display: flex !important;
    flex-wrap: nowrap;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    gap: 12px;
    padding: 8px 12px;
    border-bottom: 1px solid #eee;
  }
  .header-box-main .hs-menu-wrapper > ul > li{
    flex: 0 0 auto;
    margin: 0 !important;
    border: 0 !important;
  }
  .header-box-main .hs-menu-wrapper > ul > li > a{
    display: inline-block !important;
    padding: 8px 6px !important;
    white-space: nowrap !important;
    text-align: center !important;
  }
  /* Fold child menus by default; open only when the theme toggles them */
  .header-box-main .hs-menu-wrapper ul ul{ display:none !important; position:static !important; }
  .header-box-main .hs-menu-wrapper li.child-open > ul,
  .header-box-main .hs-menu-wrapper li.is-open   > ul{ display:block !important; }
}

/* 3) Tablet: force main nav horizontal */
@media (min-width: 768px) and (max-width: 1024px){
  .header-box-main .hs-menu-wrapper > ul{
    display: flex !important;
    flex-wrap: wrap;                    /* second line if needed, still horizontal */
    gap: 16px;
    padding: 10px 0;
  }
  .header-box-main .hs-menu-wrapper > ul > li{ margin: 0 !important; }
  .header-box-main .hs-menu-wrapper > ul > li > a{ white-space: nowrap !important; }
}
