/* SVG lift hero — height is content-driven, no fixed viewport lock */
[data-hero] { position: relative; min-height: auto; padding: 0; }

.hero-stage {
  min-height: auto;
  display: flex; flex-direction: column; align-items: center;
  justify-content: flex-start;
  padding-top: 96px;
  padding-bottom: 96px;
}

/* overflow:hidden = reveal clip. Bottom edge hides the teriyaki piece at rest. */
.hero-box {
  position: relative;
  overflow: hidden;
  width: min(92vw, 880px);
  height: clamp(290px, 38vw, 400px);
  margin: 0 auto;
  pointer-events: none;
}

/* SVG fills box width; natural height extends below the clip line. */
/* GSAP scrubs this: y 0 → -720 over 600px of scroll. */
.hero-svg {
  display: block;
  width: 100%;
}

.hero-copy { margin-top: 28px; text-align: center; }

@media (prefers-reduced-motion: reduce) {
  .hero-stage { padding-top: clamp(80px, 10vh, 120px); padding-bottom: clamp(60px, 8vh, 96px); }
}