/* Homepage brand intro: first visit only, aligned to the established content grid. */


.home-intro {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 10000;
  pointer-events: none;
  background: #efe9de;
  opacity: 1;
  visibility: visible;
  transition: opacity 420ms cubic-bezier(.22, 1, .36, 1), visibility 0s linear 420ms;
}

html.home-intro-pending .home-intro { display: block; }

.home-intro__logo {
  position: absolute;
  top: 44%;
  left: clamp(24px, 6.5vw, 100px);
  width: clamp(190px, 19vw, 300px);
  height: auto;
  display: block;
  opacity: 0;
  transform: translate3d(0, 14px, 0);
  animation: home-intro-mark 480ms cubic-bezier(.16, 1, .3, 1) 60ms forwards;
}

.home-intro.is-leaving {
  opacity: 0;
  visibility: hidden;
}

@keyframes home-intro-mark {
  to { opacity: 1; transform: translate3d(0, 0, 0); }
}

@media (max-width: 760px) {
  .home-intro__logo {
    top: auto;
    bottom: clamp(44px, 10vh, 88px);
    left: 20px;
    width: min(58vw, 220px);
  }
}

@media (prefers-reduced-motion: reduce) {
  .home-intro { display: none !important; }
  html.home-intro-pending,
  html.home-intro-pending body { overflow: auto; }
}