/* Home hero: "Are You Happy?" release takeover. Loaded by index.html only.
   A silent looping intro video fills the hero. The copy and the one button sit low and left over a dark fade,
   so the face stays clear. The poster shows first, in low-power mode, and when the device asks for less motion. */
.home .hero--release {
  position: relative; display: flex; align-items: flex-end; overflow: hidden;
  height: auto; min-height: calc(100svh - var(--nav-height)); margin-top: var(--nav-height);
  padding: clamp(28px, 6vh, 72px) clamp(20px, 5vw, 72px); background: #070708;
}
.home .hero--release .hero__bg {
  position: absolute; inset: 0; z-index: 0;
  background: url('/assets/video/home-intro-poster.jpg') 50% 40% / cover no-repeat;
}
.home .hero--release .hero__video {
  position: absolute; inset: 0; z-index: 1; width: 100%; height: 100%;
  object-fit: cover; object-position: 50% 40%; pointer-events: none;
}
.home .hero--release .hero__overlay {
  position: absolute; inset: 0; z-index: 2;
  background: linear-gradient(0deg, rgba(7,7,8,.88) 0%, rgba(7,7,8,.55) 28%, rgba(7,7,8,0) 62%),
              linear-gradient(90deg, rgba(7,7,8,.55) 0%, rgba(7,7,8,0) 55%);
}
.release-hero { position: relative; z-index: 3; width: 100%; max-width: 1280px; margin: 0 auto; }
.release-hero__copy { text-align: left; color: var(--cream, #f0ebe0); max-width: 600px; animation: release-rise 1s .12s cubic-bezier(.22,1,.36,1) both; }
.release-hero__copy .hero__wordmark { display: none; } /* the nav already carries the logo */
.release-hero__status {
  display: inline-flex; align-items: center; gap: 10px; margin: 0 0 14px;
  font: 500 12px/1 Jost, sans-serif; letter-spacing: .2em; text-transform: uppercase; color: #e0b38e;
}
.release-hero__status::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: #e0b38e; box-shadow: 0 0 0 5px rgba(224,179,142,.16); }
.release-hero__title {
  margin: 0 0 16px; font: 400 clamp(52px, 6.4vw, 92px)/.9 "Cormorant Garamond", serif;
  letter-spacing: -.03em; text-wrap: balance; color: #f6f1e7;
}
.release-hero__line { margin: 0 0 30px; font: 300 16px/1.55 Jost, sans-serif; color: rgba(240,235,224,.78); max-width: 34ch; }
.home .hero--release .hero__cta {
  display: inline-flex; align-items: center; gap: 14px; margin: 0; padding: 18px 40px;
  border: 0; border-radius: 999px; color: #0a0a0a; text-decoration: none;
  background: linear-gradient(180deg, #d4a47d 0%, #c8956c 100%);
  font: 600 .78rem/1 Jost, sans-serif; letter-spacing: .22em; text-transform: uppercase;
  box-shadow: 0 0 0 1px rgba(255,236,214,.35) inset, 0 10px 40px rgba(200,149,108,.32);
  transition: transform .35s cubic-bezier(.22,1,.36,1), box-shadow .35s ease, background .35s ease;
}
.home .hero--release .hero__cta::after { content: "→"; font-size: 1.05em; transition: transform .35s cubic-bezier(.22,1,.36,1); }
.home .hero--release .hero__cta:hover { transform: translateY(-2px); background: linear-gradient(180deg, #e0b38e 0%, #d4a47d 100%); box-shadow: 0 0 0 1px rgba(255,236,214,.5) inset, 0 16px 52px rgba(200,149,108,.42); }
.home .hero--release .hero__cta:hover::after { transform: translateX(4px); }
.home .hero--release .hero__cta:focus-visible { outline: 2px solid #f6f1e7; outline-offset: 4px; }
.release-hero__actions { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; }
.home .hero--release .hero__cta.hero__cta--ghost {
  background: rgba(7,7,8,.35); color: #f6f1e7; box-shadow: none; border: 1px solid rgba(240,235,224,.4);
  -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
}
.home .hero--release .hero__cta.hero__cta--ghost::after { content: none; }
.home .hero--release .hero__cta.hero__cta--ghost:hover { background: rgba(240,235,224,.12); border-color: #f6f1e7; box-shadow: none; transform: translateY(-2px); }
.release-hero__note { margin: 16px 0 0; font: 400 12.5px/1.5 Jost, sans-serif; color: rgba(240,235,224,.55); }

@keyframes release-rise { from { opacity: 0; transform: translateY(18px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) {
  .release-hero__copy { animation: none; }
  .home .hero--release .hero__video { display: none; }
}

@media (max-width: 820px) {
  /* Phone: the video is a 3:4 panel at the top so her face and wings are never clipped; the copy sits on the fade below it. */
  .home .hero--release { min-height: calc(100svh - var(--nav-height)); padding: 20px 20px 36px; align-items: flex-end; }
  .home .hero--release .hero__bg,
  .home .hero--release .hero__video { inset: 0 0 auto 0; height: 133.34vw; max-height: 78svh; }
  .home .hero--release .hero__bg { background-image: url('/assets/video/home-intro-poster-mobile.jpg'); background-position: 50% 0; }
  .home .hero--release .hero__video { object-position: 50% 0; }
  .home .hero--release .hero__overlay {
    background: linear-gradient(180deg, rgba(7,7,8,0) 0, rgba(7,7,8,0) calc(min(133.34vw, 78svh) - 150px), #070708 min(133.34vw, 78svh));
  }
  .release-hero__copy { max-width: 520px; margin: 0 auto; text-align: center; }
  .release-hero__status { margin-bottom: 10px; font-size: 11px; }
  .release-hero__title { font-size: clamp(46px, 13vw, 64px); margin-bottom: 12px; }
  .release-hero__line { margin: 0 auto 22px; font-size: 15px; }
  .home .hero--release .hero__cta { padding: 17px 34px; }
  .release-hero__actions { flex-direction: column; align-items: stretch; gap: 10px; max-width: 340px; margin: 0 auto; }
  .home .hero--release .hero__cta { justify-content: center; }
}