/* Project-page extension: the film completes before the project name enters. */
.project-detail-page { background: #000; }
/* Keep the shared bar physically centered in both reading directions. */
.project-detail-page .site-header.floating-nav { inset-inline: auto; left: 50%; }
.project-film {
  position: relative;
  isolation: isolate;
  width: 100%;
  height: 100vh;
  height: 100svh;
  min-height: 320px;
  overflow: hidden;
  background: #f4f4ea;
  color: #fff;
}
.project-film-video,
.project-film-still {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}
.project-film-video { z-index: -3; }
.project-film-still { z-index: -2; }
.project-film.is-enhanced .project-film-still { visibility: hidden; }
.project-film:is([data-film-state='static'],[data-film-state='blocked'],[data-film-state='error']) .project-film-still { visibility: visible; }
.project-film-shade {
  position: absolute;
  z-index: -1;
  inset: 40% 0 0;
  background: linear-gradient(transparent, #0002 40%, #0009);
  pointer-events: none;
}
.project-film-title-wrap {
  position: absolute;
  inset-inline: var(--gutter);
  inset-block-end: clamp(20px, 2.5vw, 48px);
  max-width: 1840px;
  margin-inline: auto;
}
.project-film-title {
  margin: 0;
  font-size: clamp(42px, 13.8vw, 280px);
  font-weight: 500;
  line-height: 1.05;
  letter-spacing: -.025em;
  text-transform: uppercase;
  text-align: center;
}
.project-film-title-mask { display: block; overflow: hidden; padding-block: .16em .06em; }
.project-film-title-line { display: block; width: max-content; max-width: 100%; margin-inline: auto; white-space: nowrap; }
.project-film.is-revealing .project-film-title-line { will-change: transform, opacity; }
.project-film.is-enhanced[data-title-visible='false'] .project-film-title-line,
.project-film.is-enhanced[data-title-visible='false'] .project-film-shade { opacity: 0; }
html.project-film-pending .project-film-title-line,
html.project-film-pending .project-film-shade { opacity: 0; }
html.project-film-pending .project-film-still { visibility: hidden; }
.project-film-controls {
  position: absolute;
  inset-block-start: max(104px, calc(env(safe-area-inset-top) + 88px));
  inset-inline-end: var(--gutter);
}
.project-film-controls[hidden] { display: none; }
.project-film-control {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  min-height: 44px;
  padding: 13px 16px 9px;
  border: 0;
  border-radius: 0;
  background: #000;
  color: #fff;
  font: 400 14px/1 Vazirmatn, Arial, sans-serif;
  text-transform: uppercase;
  transition: background-color .2s ease;
}
.project-film-control:hover { background: #753323; }
.project-film-control:active { background: #000; }
.project-film-control:focus-visible { outline: 2px solid #f4f3dc; outline-offset: 5px; }
.project-film-control svg { width: 16px; height: 16px; flex: 0 0 16px; margin-block-start: -3px; }
.project-film-control [data-film-icon] { display: none; }
.project-film-control[data-action='pause'] [data-film-icon='pause'],
.project-film-control[data-action='play'] [data-film-icon='play'],
.project-film-control[data-action='replay'] [data-film-icon='replay'] { display: block; }
.project-film-status { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
html[dir='rtl'] .project-film-title { line-height: 1.3; letter-spacing: 0; text-transform: none; }
html[dir='rtl'] .project-film-control { padding-block: 10px; line-height: 1.5; }
html[dir='rtl'] .project-film-control svg { margin-block-start: 0; }
@media (max-width: 899px) {
  .project-film-title-wrap { inset-block-end: 24px; }
  .project-film-controls { inset-block-start: 92px; }
}
@media (max-width: 599px) {
  .project-film-title-wrap { inset-inline: 20px; inset-block-end: max(24px, env(safe-area-inset-bottom)); }
  .project-film-controls { inset-inline-end: 20px; }
}
@media (prefers-reduced-motion: reduce) {
  .project-film-control { transition: none; }
}
