/* Home opening scene. The poster remains the default; JS opts into motion. */
.home-cinema {
  --cinema-ink: #f6f1e6;
  --cinema-gold: #e4c994;
  position: relative;
  isolation: isolate;
  overflow: hidden;
  color: var(--cinema-ink);
  background: #121310;
}
.home-cinema::after {
  z-index: 1;
  pointer-events: none;
  background: linear-gradient(90deg, rgba(17, 18, 15, .92), rgba(17, 18, 15, .73) 34%, rgba(17, 18, 15, .15) 76%), linear-gradient(0deg, #121310, transparent 28%, rgba(18, 19, 16, .16));
}
.home-cinema__media {
  position: absolute;
  inset: 0;
  z-index: 0;
  overflow: hidden;
  pointer-events: none;
}
.home-cinema .premiere-backdrop,
.home-cinema__video {
  position: absolute;
  inset: 0;
  z-index: 0;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 70% center;
}
.home-cinema__video { opacity: 0; transition: opacity 1.1s ease; }
.home-cinema[data-video-ready="true"] .home-cinema__video { opacity: .78; }
.home-cinema__light {
  position: absolute;
  inset: -20%;
  background: radial-gradient(ellipse at 77% 20%, rgba(215, 177, 104, .15), transparent 47%);
  opacity: .55;
}
.home-cinema__topline,
.home-cinema__grid,
.home-cinema__bottom { position: relative; z-index: 2; }
.home-cinema__topline {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 24px;
  padding-block: 24px 0;
  color: #bdb4a2;
  font-size: .61rem;
  font-weight: 500;
  letter-spacing: .15em;
  text-transform: uppercase;
}
.home-cinema__tagline { color: #bdb4a2; }
.home-cinema__grid {
  display: grid;
  grid-template-columns: minmax(0, 1.16fr) minmax(0, 1fr);
  align-items: center;
  min-height: min(690px, calc(100dvh - 189px));
  gap: 40px;
  padding-block: clamp(48px, 6vw, 90px) 64px;
}
.home-cinema__copy { min-width: 0; }
.home-cinema__eyebrow { margin-bottom: 24px; letter-spacing: .2em; }
.home-cinema__title {
  margin: 0;
  font-family: var(--display);
  font-size: clamp(4.5rem, 7.4vw, 7.4rem);
  font-weight: 600;
  line-height: .95;
  letter-spacing: -.025em;
  text-transform: uppercase;
}
.home-cinema__title em {
  display: inline-block;
  margin-top: 2px;
  color: var(--cinema-gold);
  font-family: var(--serif);
  font-size: 1.13em;
  font-weight: 500;
  letter-spacing: -.05em;
  line-height: .95;
  text-transform: none;
}
.home-cinema__description {
  max-width: 420px;
  margin: 31px 0 0;
  color: #e0dbcf;
  font-size: 1.04rem;
  line-height: 1.75;
  text-wrap: pretty;
}
.home-cinema__context {
  max-width: 420px;
  margin: 13px 0 0;
  color: #b5b0a2;
  font-size: .82rem;
  line-height: 1.65;
  text-wrap: pretty;
}
.home-cinema__actions { display: flex; align-items: center; flex-wrap: wrap; gap: 12px; margin-top: 30px; }
.home-cinema__actions .button { min-height: 54px; padding-inline: 25px; }
.home-cinema__actions .button--outline { border-color: #81765f; background: rgba(18, 19, 16, .34); }
.home-cinema__community { display: flex; gap: 14px; align-items: center; margin-top: 31px; }
.home-cinema__faces { display: flex; flex-shrink: 0; padding-left: 6px; }
.home-cinema__faces img { width: 37px; height: 37px; object-fit: cover; border: 2px solid #25251f; border-radius: 50%; margin-left: -6px; }
.home-cinema__community strong { display: block; color: #e2dbce; font-size: .74rem; font-weight: 600; line-height: 1.6; }
.home-cinema__community div > span { display: block; margin-top: 2px; color: #b5afa1; font-size: .66rem; line-height: 1.65; }
.home-cinema__visual { position: relative; display: grid; align-content: center; justify-items: center; min-width: 0; padding-block: 16px; }
.home-cinema .premiere-seal { position: relative; width: min(100%, 430px); height: auto; animation: none; }
.home-cinema__scene-label { position: relative; margin-bottom: 20px; color: #c9b793; font-size: .57rem; letter-spacing: .25em; text-transform: uppercase; }
.home-cinema__signature { position: relative; display: flex; align-items: center; justify-content: center; gap: 15px; margin-top: 24px; color: #c9b793; font-size: .55rem; letter-spacing: .17em; text-transform: uppercase; }
.home-cinema__signature > span { display: block; width: 30px; height: 1px; background: #8f7950; }
.home-cinema__orbits { position: absolute; inset: 2% -6% 6%; pointer-events: none; }
.home-cinema__orbits > span { position: absolute; inset: 9%; border: 1px solid rgba(200, 171, 118, .2); border-radius: 50%; transform: rotate(-24deg) scaleY(.78); }
.home-cinema__orbits > span:nth-child(2) { inset: 2%; border-color: rgba(200, 171, 118, .12); transform: rotate(24deg) scaleY(.83); }
.home-cinema__orbits > span:nth-child(3) { inset: -7%; border-color: rgba(200, 171, 118, .08); transform: rotate(-14deg) scaleY(.8); }
.home-cinema__bottom {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  min-height: 88px;
  padding-block: 17px;
  border-top: 1px solid rgba(222, 205, 168, .22);
}
.home-cinema__explore,
.home-cinema__pathways a { display: inline-flex; align-items: center; gap: 14px; min-height: 44px; color: #e0d8c8; font-size: .69rem; font-weight: 500; }
.home-cinema__explore > span { display: grid; place-items: center; width: 37px; height: 37px; border: 1px solid rgba(224, 203, 164, .32); border-radius: 50%; font-size: 18px; }
.home-cinema__pathways { display: flex; align-items: center; gap: 28px; }
.home-cinema__pathways .material-symbols-rounded { color: var(--cinema-gold); font-size: 17px; }
.home-cinema__pathways a { gap: 12px; }
.home-cinema__motion {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  flex-shrink: 0;
  min-height: 44px;
  padding: 8px 13px;
  border: 1px solid #776b55;
  border-radius: 2px;
  background: rgba(22, 23, 20, .8);
  color: #e9e0cd;
  font: inherit;
  font-size: .63rem;
  letter-spacing: .015em;
  text-transform: none;
  cursor: pointer;
  transition: background .2s, border-color .2s, transform .2s;
}
.home-cinema__motion[hidden] { display: none; }
.home-cinema__motion .material-symbols-rounded { font-size: 19px; }
.home-cinema__motion:hover { background: #333026; border-color: var(--cinema-gold); }
.home-cinema__motion:active { transform: scale(.97); }
.home-cinema__explore:hover,
.home-cinema__pathways a:hover { color: var(--cinema-gold); }
.home-cinema a:focus-visible,
.home-cinema button:focus-visible { outline: 2px solid var(--cinema-gold); outline-offset: 5px; }

/* Pause controls all continuous decoration as well as the background film. */
@media (prefers-reduced-motion: no-preference) {
  .home-cinema[data-motion="playing"] .premiere-seal { animation: cinema-seal 10s ease-in-out infinite; }
  .home-cinema[data-motion="playing"] .home-cinema__orbits { animation: cinema-orbits 24s ease-in-out infinite alternate; }
  .home-cinema[data-motion="playing"] .home-cinema__light { animation: cinema-light 12s ease-in-out infinite alternate; }
  @keyframes cinema-seal { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-7px); } }
  @keyframes cinema-orbits { from { transform: rotate(-5deg); opacity: .55; } to { transform: rotate(7deg); opacity: 1; } }
  @keyframes cinema-light { from { transform: translateX(-3%); opacity: .3; } to { transform: translateX(3%); opacity: .8; } }
}
@media (max-width: 1100px) {
  .home-cinema__grid { gap: 20px; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); }
  .home-cinema__title { font-size: clamp(4.2rem, 7.8vw, 6.7rem); }
  .home-cinema .premiere-seal { width: min(100%, 360px); }
  .home-cinema__pathways { gap: 17px; }
  .home-cinema__bottom { gap: 16px; }
  .home-cinema__explore { font-size: .62rem; gap: 10px; }
}
@media (max-width: 800px) {
  .home-cinema__grid { gap: 20px; }
  .home-cinema__description { font-size: .94rem; }
  .home-cinema__actions .button { padding-inline: 19px; }
  .home-cinema__bottom { flex-wrap: wrap; }
  .home-cinema__explore { flex: 1 1 35%; }
  .home-cinema__pathways { order: 3; width: 100%; justify-content: flex-start; gap: 24px; border-top: 1px solid rgba(222, 205, 168, .12); padding-top: 8px; }
}
@media (max-width: 767px) {
  .home-cinema::after { background: linear-gradient(180deg, rgba(17, 18, 15, .88), rgba(17, 18, 15, .64) 47%, rgba(17, 18, 15, .28) 72%, #121310); }
  .home-cinema .premiere-backdrop,
  .home-cinema__video { object-position: 72% center; }
  .home-cinema__topline { padding-top: 19px; font-size: .5rem; letter-spacing: .08em; gap: 18px; }
  .home-cinema__tagline { max-width: 170px; line-height: 1.7; }
  .home-cinema__grid { grid-template-columns: minmax(0, 1fr); min-height: 0; padding-block: 36px 23px; gap: 25px; }
  .home-cinema__eyebrow { margin-bottom: 20px; font-size: .6rem; letter-spacing: .13em; }
  .home-cinema__title { font-size: clamp(3.6rem, 14vw, 5.9rem); line-height: .98; }
  .home-cinema__title em { font-size: 1.1em; }
  .home-cinema__description { max-width: 390px; margin-top: 23px; font-size: .93rem; line-height: 1.65; }
  .home-cinema__context { max-width: 360px; font-size: .75rem; margin-top: 10px; }
  .home-cinema__actions { margin-top: 24px; gap: 9px; }
  .home-cinema__actions .button { min-height: 51px; font-size: .61rem; padding-inline: 17px; gap: 12px; }
  .home-cinema__community { margin-top: 23px; gap: 11px; }
  .home-cinema__community strong { font-size: .68rem; }
  .home-cinema__community div > span { font-size: .6rem; }
  .home-cinema__faces img { width: 32px; height: 32px; }
  .home-cinema__visual { padding: 7px 0 0; min-height: 225px; }
  .home-cinema .premiere-seal { width: 203px; }
  .home-cinema__scene-label { display: none; }
  .home-cinema__signature { margin-top: 10px; font-size: .48rem; gap: 11px; }
  .home-cinema__signature > span { width: 22px; }
  .home-cinema__orbits { inset: -4% max(5%, calc(50% - 180px)) -6%; }
  .home-cinema__bottom { padding-block: 12px; min-height: 78px; gap: 9px 14px; }
  .home-cinema__explore { font-size: .6rem; gap: 8px; }
  .home-cinema__explore > span { width: 30px; height: 30px; font-size: 16px; }
  .home-cinema__motion { font-size: .62rem; padding-inline: 9px; gap: 4px; }
  .home-cinema__pathways a { font-size: .65rem; }
}
@media (max-width: 359px) {
  .home-cinema__topline { justify-content: flex-end; }
  .home-cinema__tagline { display: none; }
  .home-cinema__title { font-size: 3.45rem; }
  .home-cinema__actions { display: grid; grid-template-columns: minmax(0, 1fr); }
  .home-cinema__actions .button { width: 100%; }
  .home-cinema__bottom { align-items: flex-start; }
  .home-cinema__motion { flex: 0 0 auto; }
}
@media (prefers-reduced-motion: reduce) {
  .home-cinema *, .home-cinema *::before, .home-cinema *::after { animation: none !important; transition: none !important; }
}
