/* Party-only layout refinements; the approved footage and 4:3 crop stay intact. */
body[data-hero-story=party] .eyebrow {
  font-size: 10px;
  line-height: 1.6;
  letter-spacing: 1.7px;
}
body[data-hero-story=party] .gift .eyebrow { margin-bottom: 0; }

@media (max-width: 800px) {
  body[data-hero-story=party] .gift { margin-left: 7%; margin-right: 7%; }
  body[data-hero-story=party] .gift-copy { padding: 32px 0 0; }
  body[data-hero-story=party] .mobile-buy { gap: 12px; padding: 16px; }
  body[data-hero-story=party] .mobile-buy small { font-size: 11px; white-space: nowrap; }
  body[data-hero-story=party] .mobile-buy > span { font-size: 12px; }
  html[data-motion=on] body[data-party-rebuild] .scene p.scene-body {
    font-size: 13px; line-height: 1.5;
  }
  html[data-motion=on] body[data-party-rebuild] .scene h1 {
    font-size: clamp(36px, 11.5vw, 49px);
    line-height: 1.03; letter-spacing: -1.5px;
  }
}

@media (max-width: 800px) and (orientation: portrait) {
  /* Center the reveal copy in the actual space above the fixed 4:3 image. */
  html[data-motion=on] body[data-party-rebuild] .party-reveal-copy {
    top: calc((100% - 75vw) / 2); bottom: auto;
    transform: translateY(calc(-50% + (1 - var(--party-reveal, 0)) * 10px));
  }
  body[data-party-rebuild] .party-reveal-copy h2 {
    font-size: clamp(28px, 8.4vw, 36px);
    line-height: 1.08; letter-spacing: -1px; margin: 10px 0 0;
  }
}

@media (max-width: 800px) and (max-height: 700px) and (orientation: portrait) {
  html[data-motion=on] body[data-party-rebuild] .scene h1 {
    font-size: 36px; line-height: 1.02; margin: 8px 0; letter-spacing: -1px;
  }
  body[data-party-rebuild] .party-reveal-copy h2 {
    font-size: clamp(28px, 8vw, 32px); margin: 0;
  }
}

/* Short landscape viewports use a compact two-column hero, with a visible CTA. */
@media (orientation: landscape) and (max-height: 600px) {
  html[data-motion=on] body[data-party-rebuild] .stage {
    top: 88px; height: calc(100svh - 88px); min-height: 0;
  }
  html[data-motion=on] body[data-party-rebuild] .stage-copy {
    width: 42%; max-width: 360px; height: 100%; margin-left: 5%; padding: 0;
  }
  html[data-motion=on] body[data-party-rebuild] .scene:first-child {
    top: 50%; left: 0; right: 0; transform: translateY(-50%);
  }
  html[data-motion=on] body[data-party-rebuild] .scene:first-child > .eyebrow,
  body[data-party-rebuild] .scene .fine { display: none; }
  html[data-motion=on] body[data-party-rebuild] .scene h1 {
    font-size: clamp(30px, 8svh, 44px);
    line-height: 1; letter-spacing: -1px; margin: 0 0 10px;
  }
  html[data-motion=on] body[data-party-rebuild] .scene p.scene-body {
    font-size: 13px; line-height: 1.4;
  }
  html[data-motion=on] body[data-party-rebuild] .scene:first-child .actions {
    display: flex; margin: 12px 0 0;
  }
  body[data-party-rebuild] .scene .button {
    min-height: 44px; padding: 12px 18px; font-size: 12px;
  }
  body[data-party-rebuild] .mobile-buy { display: none; }
  html[data-motion=on] body[data-party-rebuild] .party-reveal-copy {
    top: 8%; left: 5%; max-width: 340px; color: var(--ivory);
    transform: none; text-shadow: 0 1px 16px #20110880;
  }
  body[data-party-rebuild] .party-reveal-copy h2 { font-size: 28px; margin-top: 8px; }
  body[data-party-rebuild] .party-reveal-copy .eyebrow,
  body[data-party-rebuild] .party-reveal-copy em { color: inherit; }
}
@media (max-width: 800px) and (orientation: landscape) and (max-height: 600px) {
  html[data-motion=on] body[data-party-rebuild] .stage {
    top: 73px; height: calc(100svh - 73px);
  }
}