/* Hero options: turntable (A), assembly (B), cinematic build (C) */
.hx .hx__view{position:relative;align-self:center}
.hx-cv{display:block;width:100%;height:auto;aspect-ratio:var(--ar,1.7778)}
/* the frames are photographed on white: multiply lets the white melt into the page so the house floats over the stars */
.hx--turn .hx-cv,.hx--asm .hx-cv{mix-blend-mode:multiply;transform:translate3d(var(--mx,0px),var(--my,0px),0) scale(1.06)}
.hx__hint{position:absolute;right:6%;bottom:-1.6rem;font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-50);display:flex;align-items:center;gap:.6em}
.hx__hint::before{content:"";width:26px;height:1px;background:var(--red)}
.hx--turn .hx__view,.hx--asm .hx__view{margin-right:-3vw}

/* C — full-screen cinematic build behind the copy */
.hx--cine{background:var(--navy-2);overflow:hidden}
.hx--cine .hx__bg{position:absolute;inset:0}
.hx--cine .hx-cv{position:absolute;inset:0;width:100%;height:100%;aspect-ratio:auto}
.hx--cine .hx__scrim{position:absolute;inset:0;background:linear-gradient(90deg,rgba(10,9,52,.86) 0%,rgba(10,9,52,.6) 32%,rgba(10,9,52,0) 60%),linear-gradient(0deg,rgba(10,9,52,.55),rgba(10,9,52,0) 30%)}
.hx--cine .hero__copy{position:relative;z-index:2}
.hx--cine .hero__k{color:#ff7a7f}
.hx--cine .h-xxl{color:#fff}
.hx--cine .hero__proof{color:var(--on-dark-70)}
.hx--cine .btn--ghost{color:#fff}
.hx--cine{grid-template-columns:minmax(0,1fr)}

@media (max-width:899px){
  .hx--turn .hx__view,.hx--asm .hx__view{margin:0 -1rem}
  .hx__hint{right:1rem;bottom:2%}
  .hx--cine{min-height:100svh;align-content:end;padding-bottom:calc(64px + 4vh)}
  .hx--cine .hx__scrim{background:linear-gradient(0deg,rgba(10,9,52,.92) 0%,rgba(10,9,52,.7) 45%,rgba(10,9,52,.15) 75%)}
}
@media (prefers-reduced-motion:reduce){ .hx-cv{transform:none!important} }

/* B real — full screen, the canvas a touch larger than the frame so it can drift in depth */
.hx--real .hx-cv{inset:-3%;width:106%;height:106%;will-change:transform;transform:scale(1.07)}
.hx__hint--dark{color:var(--on-dark-70);bottom:5vh;right:var(--gut);z-index:2}
.hx--real .hx__scrim{background:linear-gradient(90deg,#0a0934 0%,rgba(10,9,52,.92) 18%,rgba(10,9,52,.55) 36%,rgba(10,9,52,0) 56%),linear-gradient(0deg,rgba(10,9,52,.45),rgba(10,9,52,0) 26%)}
@media (max-width:899px){
  .hx__hint--dark{display:none}
  .hx--real{align-content:start;padding-top:calc(var(--hdr) + 12svh + 66vw)}
  .hx--real .hx__scrim{background:linear-gradient(180deg,rgba(10,9,52,0) 0,rgba(10,9,52,0) calc(12svh + 50vw),#0a0934 calc(12svh + 72vw))}
}

/* B real, now a real video (smooth playback instead of image frames) */
.hx--real .hx-vid{position:absolute;top:-3%;left:13%;width:90%;height:106%;object-fit:cover;object-position:50% 55%;transform:scale(1.06);will-change:transform;background:#0a0934}
@media (max-width:899px){
  .hx--real .hx-vid{top:calc(var(--hdr) + 2svh);left:-9vw;width:118vw;height:calc(118vw * .5625);transform:none!important}
}