:root {
  --ada-brand-logo-height-mobile: 40px;
  --ada-brand-logo-width-mobile: 8rem;
}

/* ADA lockups keep the source layout ratio while giving the brand mark more presence. */
.header__logo,
.footer__logo {
  width: var(--ada-brand-logo-width-mobile) !important;
  height: auto !important;
}

@media (min-width: 768px) {
  :root {
    --ada-brand-logo-width-mobile: 8.75rem;
  }
}

@media (min-width: 1024px) and (hover: hover) {
  :root {
    --ada-brand-logo-width-mobile: 9.5rem;
  }

  .footer__logo {
    width: 10rem !important;
  }
}

.site-loader__clou {
  width: 38vw !important;
  max-width: 180px !important;
  height: auto !important;
}

/* Keep the original animation hooks in the DOM, but never let their source
   CLOU artwork become visible over the ADA mark during runtime transitions. */
.header__logo__item,
.site-loader__clou path {
  display: none !important;
}

/* The footer lockup is an SVG with its own 4:1 viewBox; never squeeze it into
   the source image's old fixed-height box. */
.footer__logo {
  display: block;
}

/* The touch fallback added by the ADA runtime releases the source site's
   transform based scroller.  Keep this scoped to the fallback class so a
   desktop/WebGL visit still follows the captured animation path. */
@media (hover: none) and (pointer: coarse), (max-width: 767px) {
  .ada-mobile-safe,
  .ada-mobile-safe body {
    min-height: 100%;
    overflow-x: hidden !important;
    overflow-y: auto !important;
  }

  .ada-mobile-safe [asscroll-container],
  .ada-mobile-safe [asscroll] {
    height: auto !important;
    min-height: 100% !important;
    pointer-events: auto !important;
    position: static !important;
    transform: none !important;
  }

  .ada-mobile-safe .js-projects-grid {
    height: auto !important;
    opacity: 1 !important;
    visibility: visible !important;
  }

  .ada-mobile-safe .gl-canvas,
  .ada-mobile-safe .gl-label-renderer,
  .ada-mobile-safe .gl-ui,
  .ada-mobile-safe .js-mobile-intro,
  .ada-mobile-safe .ring-back-button,
  .ada-mobile-safe .js-site-loader,
  .ada-mobile-safe .site-loader {
    display: none !important;
  }
}