/* UTS desktop header (1025px+): transparent-over-hero on the homepage, solid white
   everywhere else, turning solid white on scroll on the homepage too. Mirrors the
   Musafir.com header behavior. Mobile/tablet (<1025px) is completely untouched. */
@media (min-width: 1025px) {

  .elementor-element-0c57b18 {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    box-sizing: border-box !important;
    z-index: 999;
    transition: background-color .25s ease, box-shadow .25s ease, border-color .25s ease;
  }

  /* Force real edge spacing regardless of Elementor's own full-width/padding
     handling — the pill/icons were rendering flush against the browser edge. */
  .elementor-element-0c57b18 > .e-con-inner,
  .elementor-element-0c57b18 {
    padding-left: 40px !important;
    padding-right: 40px !important;
  }

  /* Every other page keeps the header solid and reserves space for it
     since it's no longer in normal document flow. */
  body:not(.home) {
    padding-top: var(--uts-header-h, 80px);
  }

  /* Solid white state: non-home pages always, home page once scrolled. */
  body:not(.home) .elementor-element-0c57b18,
  body.home.uts-scrolled .elementor-element-0c57b18 {
    background: #FFFFFF !important;
    border-bottom-color: #EAEAEA !important;
    box-shadow: 0 1px 6px rgba(26, 22, 31, 0.06) !important;
  }
  body:not(.home) .elementor-element-62a41c4 .wte-nav-menu,
  body.home.uts-scrolled .elementor-element-62a41c4 .wte-nav-menu {
    --nav-item-color: #1A161F !important;
    --nav-item-hover-color: #4285F4 !important;
  }
  body:not(.home) .elementor-element-0c57b18 img,
  body.home.uts-scrolled .elementor-element-0c57b18 img {
    filter: none !important;
  }

  /* Transparent state: home page, before scrolling. */
  body.home:not(.uts-scrolled) .elementor-element-0c57b18 {
    background: transparent !important;
    border-bottom-color: transparent !important;
    box-shadow: none !important;
  }
  body.home:not(.uts-scrolled) .elementor-element-62a41c4 .wte-nav-menu {
    --nav-item-color: #FFFFFF !important;
    --nav-item-hover-color: #FFFFFF !important;
  }
  body.home:not(.uts-scrolled) .elementor-element-0c57b18 img {
    filter: brightness(0) invert(1) !important;
  }

  /* Alignment fix: <img> is inline by default and leaves a few px of
     phantom baseline gap under it, which throws off vertical centering
     next to the nav text and the promo pill/icons. Force it to block
     and give it a fixed height so the logo, nav, pill and icons all
     share the same visual center line. */
  .elementor-element-0c57b18 .elementor-element-7b6f418 img {
    display: block;
    max-height: 42px;
    width: auto;
  }
  .elementor-element-0c57b18 .elementor-element-7b6f418 a {
    display: flex;
    align-items: center;
    line-height: 0;
  }
  .elementor-element-0c57b18 .uts-header-actions-html svg {
    display: block;
  }

  /* A little extra breathing room around the nav items themselves. */
  .elementor-element-62a41c4 .wte-nav-menu {
    --nav-spacing: 36px !important;
  }
}