/* Adapt mode: one sizing owner, with the 1512 desktop composition as its anchor.
 * Captured rem geometry inherits this unit. Mobile/tablet structural grids remain.
 * Browser-height film framing and hairlines are deliberate independent constraints.
 */
:root {
  font-size: var(--paak-unit);
  --paak-theatre-gutter: 4rem;
  --paak-room-max: 160rem;
  --paak-preview-max: 110rem;
  --paak-header-mark-width: 9rem;
  --paak-indent-wide: calc(231.00336px * var(--scale));
  --paak-caption-bottom-wide: calc(104.99328px * var(--scale));
  --paak-caption-height-wide: calc(24.14664px * var(--scale));
  --paak-stage-desktop: min(72svh, 90rem);
  --paak-runway-desktop: min(28svh, 32rem);
  --paak-stage-tablet: min(64svh, 64rem);
  --paak-stage-mobile: clamp(270px, 100vw, 460px);
  --paak-runway-mobile: 20svh;
}
.layout-header .paak-header-mark {
  width: var(--paak-header-mark-width);
}
/* Keep reference indentation and captions proportional beyond the old 1920 cap. */
@media (width >= 1512px) {
  .tagline__wrapper .space {
    width: var(--paak-indent-wide);
  }
  .featured-works .list .work-wrapper .thumbnail .logo__wrapper {
    bottom: var(--paak-caption-bottom-wide);
    height: var(--paak-caption-height-wide);
  }
}
.reel.paak-theatre {
  --theatre-height: var(--paak-stage-desktop);
  height: calc(var(--theatre-height) + var(--paak-runway-desktop));
}
@media (width < 1024px) {
  :root {
    --paak-theatre-gutter: 2rem;
  }
  .reel.paak-theatre {
    --theatre-height: var(--paak-stage-tablet);
  }
}
@media (width < 768px) {
  :root {
    --paak-theatre-gutter: 1rem;
  }
  .reel.paak-theatre {
    --theatre-height: var(--paak-stage-mobile);
    height: calc(var(--theatre-height) + var(--paak-runway-mobile));
  }
  .hero .taglines {
    min-width: 0;
  }
  .hero .taglines > * {
    min-width: 0;
  }
}
@media (prefers-reduced-motion: reduce) {
  .reel.paak-theatre {
    height: var(--theatre-height);
  }
}
/* Full-screen playback is a viewport surface. Keep the original film fit,
 * with larger invisible hit areas around its existing icons. */
:root {
  --paak-player-unit: 10px;
  --paak-player-controls-width: 914px;
  --paak-hit-target: 44px;
}
.full-showreel .video-overlay {
  bottom: calc(5 * var(--paak-player-unit));
  gap: var(--paak-player-unit);
  height: var(--paak-hit-target);
}
.full-showreel .video-state {
  width: var(--paak-hit-target);
  height: var(--paak-hit-target);
}
.full-showreel .video-bar {
  padding-block: calc(var(--paak-hit-target) / 2);
}
.full-showreel .close-mobile {
  right: calc(2 * var(--paak-player-unit));
  top: calc(2 * var(--paak-player-unit));
  min-width: var(--paak-hit-target);
  min-height: var(--paak-hit-target);
  display: flex;
  align-items: center;
  justify-content: center;
}
@media (width >= 1024px) {
  .full-showreel .video {
    padding-inline: calc(4 * var(--paak-player-unit));
  }
  .full-showreel .video-overlay {
    bottom: calc(10 * var(--paak-player-unit));
    width: var(--paak-player-controls-width);
  }
}
@media (width < 768px) {
  :root {
    --paak-player-unit: 2.667vw;
  }
  .mobile-menu-toggle {
    min-width: var(--paak-hit-target);
    min-height: var(--paak-hit-target);
  }
}
/* Long words and short CTAs may wrap when text is enlarged by the reader. */
.page-home .tagline__wrapper .content p a {
  display: inline-block;
  max-width: 100%;
  white-space: normal;
}
.hero .taglines,
.page-home .key-value .content,
.page-home .key-value .title,
.layout-footer a {
  overflow-wrap: anywhere;
}
.page-home .key-value .extra-split-word,
.page-home .key-value .--word {
  max-width: 100%;
}