/* Optical continuity across the compact, tablet, and desktop header states. */
@media (max-width: 980px) {
  #main-header {
    background: rgba(255, 255, 255, .98);
  }

  #main-header .logo_container,
  #main-header .logo_container > a {
    height: var(--ry-mobile-header-height) !important;
  }

  #main-header .logo_container {
    display: flex !important;
    align-items: center;
  }

  #main-header #logo {
    width: min(clamp(230px, 34vw, 300px), calc(100vw - 124px)) !important;
    max-width: min(clamp(230px, 34vw, 300px), calc(100vw - 124px)) !important;
    mix-blend-mode: multiply;
  }
}

@media (max-width: 767px) {
  :root {
    --ry-mobile-header-height: 76px;
  }

  #main-header .container.et_menu_container {
    width: calc(100% - 48px) !important;
  }
}

@media (min-width: 768px) and (max-width: 980px) {
  :root {
    --ry-mobile-header-height: 88px;
  }

  #main-header .container.et_menu_container {
    width: calc(100% - 88px) !important;
  }
}

@media (min-width: 981px) {
  #main-header,
  #main-header.et-fixed-header {
    min-height: 96px !important;
    height: 96px !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }

  #main-header .container.et_menu_container {
    width: min(calc(100% - 88px), 1440px) !important;
    height: 96px !important;
  }

  #main-header .logo_container,
  #main-header .logo_container > a {
    height: 96px !important;
  }

  #main-header .logo_container {
    display: flex !important;
    align-items: center;
  }

  #main-header .logo_container > a {
    display: flex !important;
    align-items: center;
  }

  #main-header #logo {
    position: static !important;
    margin: 0 !important;
    transform: none !important;
    mix-blend-mode: multiply;
  }

  #main-header #et-top-navigation {
    padding-top: 24px !important;
  }

}