/* The media stage, thumbnail rail and reading area share one composition. */
.profile-cinema {
  position: relative;
  isolation: isolate;
  overflow: visible;
  gap: 0;
  padding: clamp(28px, 4vw, 60px) 0 0;
  background: radial-gradient(ellipse at 30% 18%, #16283375, transparent 44%),
    radial-gradient(ellipse at 83% 25%, #44213330, transparent 35%),
    linear-gradient(#080e13f2 0%, #080d12f2 65%, #080d1200);
}
.profile-cinema .profile-inspiration-carousel__header {
  padding: 0 clamp(18px, 3vw, 42px) 24px;
  align-items: end;
  gap: 20px;
  box-sizing: border-box;
}
.profile-cinema .profile-inspiration-carousel__copy {
  border: 0;
  padding: 0;
  max-width: none;
  gap: 16px;
}
.profile-cinema .profile-inspiration-kicker {
  color: #b5c5ce;
  letter-spacing: .25em;
  font-size: .68rem;
}
.profile-cinema .profile-inspiration-carousel__copy h2 {
  max-width: 30ch;
  font-size: clamp(1.8rem, 3.2vw, 3.1rem);
  font-weight: 600;
  letter-spacing: -.035em;
  line-height: 1.15;
}
.profile-cinema .profile-inspiration-carousel__copy p {
  font-size: .95rem;
  max-width: 70ch;
  color: #b6c0c6;
}
.profile-cinema .profile-inspiration-carousel__controls { gap: 6px; }
.profile-cinema .profile-inspiration-carousel__controls button {
  background: transparent;
  border-color: #b6ddeb40;
  border-radius: 50%;
  width: 42px;
  height: 42px;
  min-height: 42px;
}
.profile-cinema__stage {
  position: relative;
  width: 100%;
  aspect-ratio: 2.55;
  perspective: 1400px;
  isolation: isolate;
  touch-action: pan-y;
  margin: 10px 0 0;
}
.profile-cinema__stage::after {
  content: '';
  position: absolute;
  pointer-events: none;
  left: 6%;
  right: 6%;
  bottom: -28px;
  height: 25%;
  background: radial-gradient(ellipse, #81cef01c, #ac648713 40%, transparent 70%);
  filter: blur(12px);
  z-index: -1;
}
.profile-cinema__stage > .profile-inspiration-film__frame {
  position: absolute;
  left: 20%;
  top: 4%;
  width: 60%;
  aspect-ratio: 16 / 9;
  border: 1px solid #a8cad4a8;
  border-radius: 8px;
  overflow: visible;
  background: #0a1116;
  box-sizing: border-box;
  transform: translateX(0) scale(1);
  transition: transform 620ms cubic-bezier(.22,.7,.25,1), filter 620ms ease, box-shadow 620ms ease;
  box-shadow: -2px 0 4px #a6e4ff95, 2px 0 4px #eaaedb80, 0 22px 40px #0009;
  z-index: 3;
}
.profile-cinema__stage > .profile-inspiration-film__frame::before {
  inset: 0;
  background: none;
  border-radius: inherit;
  box-shadow: inset 1px 0 1px #b6eaff90, inset -1px 0 1px #ebb0d6a0;
  z-index: 5;
}
.profile-cinema__stage > .profile-inspiration-film__frame::after {
  content: '';
  position: absolute;
  top: calc(100% + 7px);
  left: 0;
  width: 100%;
  height: 16%;
  border-radius: inherit;
  background: var(--film-image) center bottom / cover;
  transform: scaleY(-1);
  mask-image: linear-gradient(transparent, #0004);
  opacity: .28;
  filter: blur(2px);
  pointer-events: none;
}
.profile-cinema__stage > [data-position='left'] {
  transform: translateX(-47%) translateY(4%) scale(.86);
  filter: brightness(.68) saturate(.8);
  box-shadow: -1px 0 3px #a6e4ff65, 1px 0 2px #eaaedb55, 0 18px 30px #0008;
  z-index: 1;
}
.profile-cinema__stage > [data-position='right'] {
  transform: translateX(47%) translateY(4%) scale(.86);
  filter: brightness(.68) saturate(.8);
  box-shadow: -1px 0 3px #a6e4ff65, 1px 0 2px #eaaedb55, 0 18px 30px #0008;
  z-index: 1;
}
.profile-cinema__stage > [data-position]:focus-within { outline: 2px solid #b5e7ff; outline-offset: 5px; }
.profile-cinema__stage .profile-inspiration-film__poster {
  border-radius: inherit;
  height: 100%;
  font: inherit;
}
.profile-cinema__stage .profile-inspiration-film__poster img {
  filter: none;
  transform: none;
  border-radius: inherit;
}
.profile-cinema__stage .profile-inspiration-film__poster::after {
  background: linear-gradient(180deg, #050c1445, transparent 35%, #050c141a 60%, #050a11e6);
}
.profile-cinema__stage .profile-inspiration-film__poster-copy {
  padding: clamp(16px, 2.2vw, 30px);
  right: 0;
  gap: 8px;
}
.profile-cinema__stage .profile-inspiration-film__poster-copy strong {
  font-size: clamp(1.05rem, 2.1vw, 1.8rem);
  font-weight: 600;
  letter-spacing: -.015em;
}
.profile-cinema__stage .profile-inspiration-film__poster-copy small { display: none; }
.profile-cinema__number {
  position: absolute;
  top: 6%;
  left: 4%;
  color: #f0ece6;
  font-size: clamp(1.4rem, 3.8vw, 3.2rem);
  font-weight: 300;
  letter-spacing: -.04em;
  line-height: 1;
  z-index: 2;
}
.profile-cinema__stage [data-position='right'] .profile-cinema__number { left: auto; right: 4%; }
.profile-cinema__stage [data-position='right'] .profile-inspiration-film__poster-copy { text-align: right; }
.profile-cinema__stage [data-position]:not([data-position='center']) .profile-inspiration-film__poster-copy strong {
  max-width: 15ch;
  font-size: clamp(.85rem, 1.4vw, 1.2rem);
}
.profile-cinema__stage [data-position='right'] .profile-inspiration-film__poster-copy strong { margin-left: auto; }
.profile-cinema__play {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  display: grid;
  place-items: center;
  width: clamp(48px, 6vw, 80px);
  aspect-ratio: 1;
  border: 1.5px solid #fff;
  border-radius: 50%;
  background: #05101b38;
  box-shadow: 0 3px 20px #0003;
  z-index: 3;
}
.profile-cinema__play::after { content: ''; border-left: 18px solid #fff; border-top: 11px solid transparent; border-bottom: 11px solid transparent; margin-left: 5px; }
.profile-cinema__stage [data-position]:not([data-position='center']) .profile-cinema__play { display: none; }
.profile-inspiration-film__frame .profile-inspiration-film__poster[hidden] { display: none; }
.profile-cinema__stage iframe { position: absolute; inset: 0; border-radius: inherit; z-index: 4; }
.profile-cinema .profile-inspiration-carousel__dots {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  grid-auto-flow: row;
  grid-auto-columns: auto;
  gap: 14px;
  max-width: 490px;
  width: 52%;
  margin: 18px auto 34px;
  overflow: visible;
  padding: 0;
}
.profile-cinema .profile-inspiration-carousel__dots button {
  display: block;
  position: relative;
  aspect-ratio: 16 / 9;
  min-height: 0;
  border: 1px solid #d0e3ef40;
  border-radius: 5px;
  background: #090d13;
  overflow: visible;
}
.profile-cinema .profile-inspiration-carousel__thumb-media { min-height: 0; height: 100%; border-radius: 4px; }
.profile-cinema .profile-inspiration-carousel__thumb-media img { object-fit: cover; filter: brightness(.74); border-radius: inherit; }
.profile-cinema .profile-inspiration-carousel__thumb-copy { position: absolute; inset: 0; padding: 8px; align-content: start; text-shadow: 0 1px 5px #000; }
.profile-cinema .profile-inspiration-carousel__thumb-copy small { color: #fff; font-size: 1rem; letter-spacing: 0; font-weight: 500; }
.profile-cinema .profile-inspiration-carousel__thumb-copy strong { display: none; }
.profile-cinema .profile-inspiration-carousel__dots button[aria-pressed='true'] { border-color: #c1ecff; box-shadow: 0 0 4px #afe4ff, 0 0 15px #93c8ff50; }
.profile-cinema .profile-inspiration-carousel__dots button[aria-pressed='true']::after { content: ''; position: absolute; bottom: -12px; left: 32%; width: 36%; height: 2px; background: #d7eeff; box-shadow: 0 0 8px #87cfff; }
.profile-cinema .profile-inspiration-carousel__dots button:focus-visible { outline: 2px solid #fff; outline-offset: 5px; }
.profile-cinema .profile-inspiration-carousel__track {
  position: relative;
  height: auto;
  width: 100%;
  max-width: 1080px;
  margin: 0 auto;
  transition: none;
}
.profile-cinema .profile-inspiration-carousel__track > [data-profile-carousel-slide] {
  position: relative;
  inset: auto;
  width: 100%;
  padding: 28px clamp(18px, 3vw, 42px) 36px;
  margin: 0;
  transform: none;
  filter: none;
  opacity: 1;
  border: 0;
  border-top: 1px solid #b5dae325;
  box-shadow: none;
  background: none;
  animation: none;
  transition: none;
  box-sizing: border-box;
}
.profile-cinema .profile-inspiration-carousel__track > [data-profile-carousel-slide][hidden] { display: none; }
.profile-cinema .profile-inspiration-carousel__track > article::before,
.profile-cinema .profile-inspiration-carousel__track > article::after { display: none; }
.profile-cinema .profile-inspiration-film__content { padding: 0; gap: 18px; }
.profile-cinema .profile-inspiration-film__content h3 { font-size: clamp(1.4rem, 2.3vw, 2rem); }
.profile-cinema .profile-inspiration-film__intro { max-width: none; }
.profile-cinema .profile-inspiration-film__body { column-gap: 36px; }
@media (max-width: 980px) {
  .profile-cinema .profile-inspiration-carousel__header { grid-template-columns: 1fr; }
  .profile-cinema .profile-inspiration-carousel__controls { justify-content: flex-end; }
  .profile-cinema__stage { aspect-ratio: 2.25; }
  .profile-cinema__stage > .profile-inspiration-film__frame { left: 17%; width: 66%; }
  .profile-cinema__stage > [data-position='left'] { transform: translateX(-37%) translateY(4%) scale(.86); }
  .profile-cinema__stage > [data-position='right'] { transform: translateX(37%) translateY(4%) scale(.86); }
}
@media (max-width: 680px) {
  .profile-cinema { overflow: clip; }
  .profile-cinema .profile-inspiration-carousel__header { padding-bottom: 14px; }
  .profile-cinema .profile-inspiration-carousel__copy { gap: 12px; }
  .profile-cinema .profile-inspiration-carousel__copy h2 { font-size: 1.75rem; }
  .profile-cinema .profile-inspiration-carousel__copy p { font-size: .9rem; }
  .profile-cinema__stage { aspect-ratio: 1.95; }
  .profile-cinema__stage > .profile-inspiration-film__frame { left: 10%; width: 80%; border-radius: 5px; }
  .profile-cinema__stage > [data-position='left'] { transform: translateX(-27%) translateY(4%) scale(.88); }
  .profile-cinema__stage > [data-position='right'] { transform: translateX(27%) translateY(4%) scale(.88); }
  .profile-cinema__stage .profile-inspiration-film__poster-copy { padding: 12px; }
  .profile-cinema__stage .profile-inspiration-film__poster-copy strong { font-size: .95rem; }
  .profile-cinema__stage [data-position]:not([data-position='center']) .profile-inspiration-film__poster-copy { display: none; }
  .profile-cinema__number { font-size: 1.5rem; }
  .profile-cinema__play { width: 44px; }
  .profile-cinema__play::after { border-left-width: 12px; border-top-width: 8px; border-bottom-width: 8px; }
  .profile-cinema .profile-inspiration-carousel__dots { width: 70%; gap: 10px; margin-top: 14px; margin-bottom: 28px; }
  .profile-cinema .profile-inspiration-carousel__thumb-copy { padding: 4px; }
  .profile-cinema .profile-inspiration-carousel__thumb-copy small { font-size: .8rem; }
}
@media (prefers-reduced-motion: reduce) {
  .profile-cinema *, .profile-cinema *::before, .profile-cinema *::after { animation: none !important; transition: none !important; }
}