/* "PLACE" reveal — see template-parts/place-reveal.php */
.place-reveal {
  position: relative;
  background: var(--color-ink);
  color: #fff;
}
.place-reveal__pin {
  position: relative;
  height: 100vh;
  height: 100svh;
  overflow: hidden;
}
.place-reveal__media {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
/* Same cool grade the old reel band used, plus a floor scrim for the caption */
.place-reveal__grade {
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    linear-gradient(180deg, rgba(12, 17, 31, .25) 0%, rgba(12, 17, 31, 0) 30%, rgba(12, 17, 31, 0) 50%, rgba(12, 17, 31, .78) 100%),
    rgba(29, 63, 168, .08);
}
.place-reveal__mask {
  display: none;
}
.place-reveal__tag {
  position: absolute;
  top: clamp(5.5rem, 12vh, 7.5rem);
  right: clamp(1.25rem, 5vw, 4rem);
  z-index: 2;
  font-family: var(--font-mono);
  font-size: 11px;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, .7);
}
.place-reveal__cap {
  position: absolute;
  left: clamp(1.25rem, 5vw, 4rem);
  right: clamp(1.25rem, 5vw, 4rem);
  bottom: clamp(2rem, 9vh, 6rem);
  z-index: 2;
}
.place-reveal__kicker {
  font-family: var(--font-mono);
  font-size: 12px;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, .78);
  margin: 0 0 .9rem;
}
.place-reveal__title {
  font-family: var(--font-display);
  font-weight: 700;
  font-size: clamp(2.6rem, 7.4vw, 7.5rem);
  line-height: .95;
  letter-spacing: -.035em;
  margin: 0;
  max-width: 14ch;
  text-shadow: 0 10px 50px rgba(0, 0, 0, .45);
}

/* Motion version: only when the script has taken over */
.place-reveal.is-live {
  height: 330vh;
}
.place-reveal.is-live .place-reveal__pin {
  position: sticky;
  top: 0;
}
.place-reveal.is-live .place-reveal__mask {
  display: block;
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
}
.place-reveal.is-live .place-reveal__cap,
.place-reveal.is-live .place-reveal__tag {
  opacity: 0;
}
@media (max-aspect-ratio: 3/4) {
  .place-reveal.is-live { height: 270vh; }
}