/*
 * REAL.PRO Studios · Final Header + Video V1
 * Narrow finalization layer.
 */

@media (max-width: 760px) {

  html body .site-header[data-header] {
    box-sizing: border-box !important;

    min-height: 74px !important;
    height: 74px !important;

    padding-left:
      max(16px, env(safe-area-inset-left)) !important;

    padding-right:
      max(16px, env(safe-area-inset-right)) !important;

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

    overflow: visible !important;
    z-index: 10050 !important;
  }

  html body .site-header[data-header] .header-logo {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: flex-start !important;

    min-height: 48px !important;
    height: 48px !important;

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

    flex: 0 0 auto !important;
  }

  html body
  .site-header[data-header]
  .header-logo
  img[src*="realpro-logo-symbol"] {
    display: block !important;

    width: clamp(58px, 16vw, 64px) !important;
    min-width: clamp(58px, 16vw, 64px) !important;
    max-width: clamp(58px, 16vw, 64px) !important;

    height: auto !important;
    max-height: 44px !important;

    object-fit: contain !important;
    object-position: left center !important;
  }

  html body
  .site-header[data-header]
  .header-logo
  img[src*="realpro-logo-horizontal"] {
    display: block !important;

    width: clamp(142px, 39vw, 176px) !important;
    min-width: 0 !important;
    max-width: min(176px, calc(100vw - 104px)) !important;

    height: auto !important;
    max-height: 40px !important;

    object-fit: contain !important;
    object-position: left center !important;
  }

  html body .site-header[data-header] .menu-toggle {
    box-sizing: border-box !important;

    width: 48px !important;
    min-width: 48px !important;

    height: 48px !important;
    min-height: 48px !important;

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

    flex: 0 0 48px !important;

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

    position: relative !important;
    z-index: 10060 !important;

    touch-action: manipulation !important;
  }

  html body .site-header[data-header] .menu-toggle span {
    pointer-events: none !important;
  }

  html body.menu-open .site-header[data-header],
  html body.nav-open .site-header[data-header],
  html body.mobile-menu-open .site-header[data-header] {
    z-index: 10070 !important;
  }

  html body .fullscreen-menu[data-menu] {
    z-index: 10080 !important;
  }
}


@media
  (max-width: 760px)
  and (max-height: 560px)
  and (orientation: landscape) {

  html body .site-header[data-header] {
    min-height: 68px !important;
    height: 68px !important;
  }

  html body
  .site-header[data-header]
  .header-logo
  img[src*="realpro-logo-symbol"] {
    width: 56px !important;
    min-width: 56px !important;
    max-width: 56px !important;
  }
}


/* Videos must never be hidden by a stale layout rule. */
html body video {
  max-width: 100%;
}

html body .rp-page-hero__video,
html body .hero-video,
html body .rp-cinematic-fullscreen-film-v2__video {
  display: block !important;
}