/* About and project details continue the cinematic language of the studies. */
.work { padding-bottom: 0; }

/* One pinned film carries both chapters; the copy scrolls over it. */
.studio-chapter { position: relative; isolation: isolate; background: #241e1a; }
.studio-film-backdrop { position: absolute; inset: 0; z-index: 0; pointer-events: none; }
.studio-film-viewport { position: sticky; top: 0; height: 100svh; overflow: hidden; }
.studio-film-viewport > video, .studio-film-viewport > .media-poster { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 68% center; }
.studio-chapter[data-ready=true] .media-poster { opacity: 0; }
.studio-film-controls { position: absolute; inset: 24px 6vw auto auto; z-index: 4; }
.studio-film-controls .media-toggle, .questions-intro .media-toggle { position: static; width: max-content; max-width: 100%; margin: 0; font-size: 14px; }
.studio-film-controls .media-toggle { background: #211b18cc; border-color: #e9ceb04d; }
.questions-intro .media-toggle { margin-top: 32px; background: #e8edf1; border-color: #687d946b; color: #243548; }
.questions-intro .media-toggle:hover { background: #cbd5df; }
.questions-intro .media-toggle:focus-visible { outline-color: #3e5674; }

.about.about-film {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  justify-content: center;
  gap: 0;
  min-height: max(740px, 90svh);
  padding: 110px 6vw 42px;
  background: transparent;
  color: #fff8e9;
  scroll-margin-top: 0;
}
.about-film-shade {
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background: linear-gradient(90deg, #211b18ed 0%, #211b18c2 32%, #211b182b 65%, #211b1812), linear-gradient(0deg, #241e1aaa 0%, transparent 45%);
}
.about-film .about-copy { position: relative; z-index: 2; width: 55%; max-width: 740px; margin-block: auto; }
.about-film .eyebrow { color: #eee5d5; font-size: 12px; }
.about-film .about-copy h2 { margin: 28px 0 32px; font-size: clamp(50px, 5.6vw, 84px); line-height: 1.03; }
.about-film .about-copy h2 em { color: #e9ceb0; }
.about-film .about-copy > p:not(.eyebrow) { max-width: 420px; color: #e8ded2; font-size: 16px; line-height: 1.8; margin-bottom: 24px; }
.about-film .about-copy > p.about-lead { max-width: 465px; color: #fff8e9; font-size: 21px; line-height: 1.55; }
.about-film .text-link { color: #fff8e9; font-size: 14px; border-color: #fff8e966; margin-top: 12px; min-height: 44px; }
.about-film .text-link:hover { border-color: #fff8e9; }
.about-film .text-link:focus-visible { outline-color: #fff8e9; }
.about-film-footer { position: relative; z-index: 2; display: flex; align-items: center; justify-content: space-between; gap: 24px; margin-top: 75px; }
.about-film-credit { max-width: 420px; color: #d2c2b3; font-size: 12px; line-height: 1.6; letter-spacing: .1em; }

.studio-questions { position: relative; z-index: 1; background: linear-gradient(90deg, #dbe1e7eb, #dbe1e7f5 52%, #dbe1e7f5); color: #243548; padding-block: 96px 115px; grid-template-columns: minmax(0, .85fr) minmax(0, 1.4fr); gap: 8vw; align-items: start; }
.studio-questions .eyebrow { color: #4b5b6a; font-size: 12px; }
.studio-questions h2 { font-size: clamp(48px, 5.1vw, 74px); margin-top: 30px; }
.studio-questions h2 em { color: #3e5674; }
.studio-questions .faq-list { min-width: 0; border-color: #28374a40; }
.studio-questions details { border-color: #28374a40; }
.studio-questions summary { display: grid; grid-template-columns: 28px minmax(0, 1fr) 24px; gap: 18px; padding-block: 27px; min-height: 84px; }
.studio-questions summary span, .studio-questions details[open] summary span { transform: none; }
.studio-questions .question-number { color: #405268; font-size: 12px; letter-spacing: .05em; }
.studio-questions .question-label { color: #243548; font-size: 18px; font-weight: 400; line-height: 1.5; }
.studio-questions .question-toggle { font-size: 24px; color: #3e5674; text-align: center; transition: transform .2s; }
.studio-questions details[open] .question-toggle { transform: rotate(45deg); }
.studio-questions details p { margin: 0 42px 30px 46px; font-size: 16px; line-height: 1.8; color: #405268; max-width: 570px; }
.studio-questions summary:hover .question-label, .studio-questions details[open] .question-label { color: #3e5674; }
.studio-questions summary:focus-visible { outline: 2px solid #3e5674; outline-offset: 5px; }

@media (max-width: 1050px) {
  .about-film .about-copy { width: 72%; }
  .studio-questions { gap: 6vw; }
}
@media (max-width: 760px) {
  .about.about-film { min-height: 840px; padding-top: 285px; padding-bottom: 32px; }
  .studio-film-viewport > video, .studio-film-viewport > .media-poster { object-position: 72% center; }
  .about-film-shade { background: linear-gradient(180deg, #211b180a 0%, #211b1844 20%, #241e1ad9 43%, #241e1af5 74%, #241e1aeb 100%); }
  .about-film .about-copy { width: 100%; max-width: 570px; }
  .about-film .about-copy h2 { font-size: clamp(43px, 7.8vw, 60px); margin: 22px 0 26px; }
  .about-film .about-copy > p.about-lead { font-size: 20px; }
  .about-film-footer { margin-top: 48px; align-items: flex-end; }
  .about-film-credit { max-width: 280px; font-size: 12px; }
  .studio-questions { grid-template-columns: 1fr; padding-block: 70px 75px; gap: 40px; background: #dbe1e7f2; }
  .studio-questions h2 { font-size: 48px; margin-top: 22px; }
  .studio-questions h2 br { display: none; }
  .studio-questions h2 em::before { content: ' '; }
}
@media (max-width: 480px) {
  .about-film-footer { align-items: flex-start; flex-direction: column-reverse; gap: 25px; margin-top: 32px; }
  .about-film-credit { max-width: 280px; }
  .studio-questions h2 { font-size: 43px; }
  .studio-questions summary { grid-template-columns: 22px minmax(0, 1fr) 20px; gap: 12px; padding-block: 23px; }
  .studio-questions .question-label { font-size: 17px; }
  .studio-questions details p { margin: 0 0 26px 34px; }
}
@media (prefers-reduced-motion: reduce) {
  .studio-questions .question-toggle { transition: none; }
}