:root {
  color-scheme: dark;
  --background: #000;
  --foreground: #fff;
  --sidebar-width: 195px;
  --page-padding: 80px;
  --column-gap: 100px;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 13px;
  font-weight: 400;
  line-height: 1.4;
  letter-spacing: .1em;
  font-synthesis: none;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
* { box-sizing: border-box; }
html { background: var(--background); scrollbar-color: #888 var(--background); }
body { background: var(--background); color: var(--foreground); margin: 0; min-height: 100vh; }
a, a:visited { color: inherit; text-decoration: none; }
a:hover { color: #ddd; }
button { border: 0; background: none; color: inherit; font: inherit; letter-spacing: inherit; cursor: pointer; padding: 0; }
button, a { -webkit-tap-highlight-color: transparent; }
button:focus-visible, a:focus-visible { outline: 1px solid var(--foreground); outline-offset: 4px; }
main:focus { outline: none; }
::selection { color: var(--background); background: var(--foreground); }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
.skip { position: fixed; top: -100px; left: 20px; z-index: 30; padding: 12px; background: var(--foreground); color: var(--background); }
.skip:focus { top: 10px; color: var(--background); }
.sidebar { position: fixed; top: var(--page-padding); left: var(--page-padding); width: var(--sidebar-width); z-index: 5; text-align: right; background: var(--background); }
.identity { margin-bottom: 30px; }
.identity h1 { display: inline-block; margin: 0; font: inherit; line-height: .9; letter-spacing: 1px; text-transform: uppercase; }
.identity-role { margin: 7px 0 0; font-size: 9px; font-weight: 400; line-height: 1.3; letter-spacing: .16em; text-transform: uppercase; opacity: .8; }
.name { white-space: nowrap; }
.nav-project, .bio-link, .contact-link { display: block; font-size: 13px; line-height: .9; letter-spacing: .1em; text-transform: uppercase; padding: .2em; }
.nav-project[aria-current="page"], .bio-link[aria-current="page"], .contact-link[aria-current="page"] { color: #aaa; }
.nav-project:hover, .bio-link:hover, .contact-link:hover { color: #ddd; }
.bio-link { margin-top: 20px; }
.menu-toggle { display: none; }
main { margin-left: calc(var(--page-padding) + var(--sidebar-width) + var(--column-gap)); padding: var(--page-padding) var(--page-padding) var(--page-padding) 0; max-width: calc(1800px - var(--page-padding) - var(--sidebar-width) - var(--column-gap)); min-height: 100vh; }
.film-information { text-transform: uppercase; margin-bottom: 34px; }
.film-information h2 { font: inherit; margin: 0 0 14px; }
.film-information p { margin: 0; }
.film-information strong { font-weight: 700; }
.film-credits { text-transform: none; }
.film-synopsis { max-width: 680px; margin-bottom: 24px; text-transform: none; line-height: 1.8; }
.film-recognition { margin-top: 24px !important; }
.award-laurel { display: block; width: 160px; max-width: 100%; height: auto; }
.film-information-with-laurel .film-laurel { margin-top: 24px; }
.project-video { width: calc(66.666667% - 11.333333px); margin: 0 0 34px; background: var(--background); }
.project-video iframe { display: block; width: 100%; height: auto; border: 0; background: var(--background); }
.project-video-caption { margin: 8px 0 0; color: var(--foreground); }
.project-video video { display: block; width: 100%; aspect-ratio: 16 / 9; object-fit: contain; background: var(--background); }
.video-fallback { display: none; width: 100%; height: auto; }
.project-video.has-error video { display: none; }
.project-video.has-error .video-fallback { display: block; }
.stills { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; align-items: start; width: 100%; margin: 0; background: var(--background); }
.stills-stacked { grid-template-columns: minmax(0, 1fr); width: calc(66.666667% - 11.333333px); }
main:has(.stills-joined) { max-width: none; }
.stills.stills-joined { grid-template-columns: minmax(0, 1fr); gap: 0; width: 100%; }
.gallery-image { display: block; width: 100%; min-width: 0; padding: 0; background: var(--background); }
.gallery-image-wide { grid-column: 1 / -1; }
.gallery-image img { display: block; width: 100%; height: auto; object-fit: contain; }
.gallery-image.scroll-reveal img { opacity: 0; transform: translate3d(0, 40px, 0); transition: transform 1s ease-in-out, opacity .8s ease-in-out; }
.gallery-image.scroll-reveal.is-visible img { opacity: 1; transform: none; }
.bio-sheet { display: grid; grid-template-columns: minmax(0, 1fr); align-items: start; gap: 36px; max-width: 900px; }
.bio-portrait { width: 80%; }
.bio-gallery { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; grid-column: 1 / -1; }
.bio-text { max-width: 680px; line-height: 1.8; }
.bio-text h2 { font: inherit; text-transform: uppercase; margin: 0 0 20px; }
.bio-text p { margin: 0 0 20px; }
.bio-text p:last-child { margin-bottom: 0; }
.bio-imdb { display: inline-block; padding: 4px 0; font-size: 11px; letter-spacing: .08em; }
.bio-imdb:hover { text-decoration: underline; text-underline-offset: 3px; }
.contact-sheet { display: flex; flex-direction: column; align-items: flex-start; gap: 28px; padding-top: 68px; padding-left: 80px; text-transform: lowercase; }
.contact-sheet p { margin: 0; }
.contact-sheet > p:first-child { text-transform: uppercase; }
.instagram-link { display: flex; align-items: flex-start; width: 44px; height: 44px; }
.instagram-link svg { display: block; }
.lightbox { position: fixed; inset: 0; border: 0; padding: 0; margin: 0; width: 100vw; height: 100dvh; max-width: none; max-height: none; background: var(--background); color: var(--foreground); }
.lightbox::backdrop { background: var(--background); }
.lightbox[open] { display: flex; align-items: center; justify-content: center; }
.lightbox-image { display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; padding: 40px 70px; }
.lightbox-image img { display: block; max-width: 100%; max-height: 100%; object-fit: contain; }
.close-viewer { position: absolute; z-index: 2; top: 15px; right: 22px; font-size: 28px; font-weight: 400; letter-spacing: 0; width: 32px; height: 32px; }
.previous-image, .next-image { position: absolute; top: 50%; transform: translateY(-50%); width: 45px; height: 65px; font-size: 38px; font-weight: 400; letter-spacing: 0; z-index: 2; }
.previous-image { left: 10px; }
.next-image { right: 10px; }
.error-message { text-transform: uppercase; }
.error-message h2 { font: inherit; margin: 0 0 14px; }
.error-message a { text-decoration: underline; text-underline-offset: 3px; }
.no-js { margin: 20px; font-size: 13px; }
@media (max-width: 1200px) { .bio-sheet { gap: 28px; } }
@media (min-width: 641px) and (max-width: 1000px) {
  :root { --page-padding: 40px; --column-gap: 60px; --sidebar-width: 175px; }
  .project-video, .stills-stacked { width: 100%; }
  .contact-sheet { padding-left: 0; }
}
@media (max-width: 640px) {
  :root { --page-padding: 20px; }
  .sidebar { position: relative; inset: auto; width: auto; padding: 20px; }
  .identity { margin: 0 0 0 80px; min-height: 17px; }
  .identity h1 { line-height: .9; }
  .menu-toggle { display: block; position: absolute; top: 16px; left: 20px; padding: 4px 0; font-size: 13px; line-height: 1.4; text-transform: uppercase; }
  #navigation { display: none; padding-top: 25px; text-align: center; }
  .menu-open #navigation { display: block; }
  .nav-project, .bio-link, .contact-link { padding: 0; line-height: 2.5; }
  .bio-link { margin-top: 15px; }
  main { margin: 0; padding: 20px; max-width: none; min-height: calc(100vh - 57px); }
  .film-information { margin-bottom: 34px; }
  .project-video, .stills-stacked { width: 100%; }
  .stills {
    width: calc(100% + 2 * var(--page-padding)) !important;
    margin-inline: calc(-1 * var(--page-padding));
  }
  .bio-portrait {
    width: calc(100% + 2 * var(--page-padding));
    margin-inline: calc(-1 * var(--page-padding));
  }
  .contact-sheet { padding-top: 34px; padding-left: 0; overflow-wrap: anywhere; }
  .lightbox-image { padding: 45px 12px; }
  .previous-image { left: 0; }
  .next-image { right: 0; }
  .close-viewer { right: 10px; }
}
@media (max-width: 767px) { .stills, .bio-gallery { grid-template-columns: 1fr; gap: 16px; } }
.home-view { --background: #000; --foreground: #fff; color: #fff; background: #000; overflow: hidden; }
.home-view .sidebar { background: transparent; }
.home-view a:hover, .home-view .nav-project:hover, .home-view .bio-link:hover, .home-view .contact-link:hover { color: #ddd; }
.home-view main { margin: 0; padding: 0; max-width: none; min-height: 100svh; }
.home-slideshow { position: fixed; inset: 0; z-index: 0; overflow: hidden; background: #000; pointer-events: none; }
.slideshow-frame { position: absolute; inset: 0; display: block; width: 100%; height: 100%; object-fit: cover; opacity: 0; transition: opacity 1500ms ease-in-out; }
.slideshow-frame[src$="/main-03-v2.jpg"], .slideshow-frame[src$="/main-05.jpg"] { object-position: center bottom; }
.slideshow-frame.is-current { opacity: 1; }
.home-slideshow::after { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg, #0009 0%, #0006 28%, #0001 65%); opacity: .7; }
@media (max-width: 640px) {
  .home-view .sidebar.menu-open { background: #0009; }
  .home-view main { min-height: calc(100svh - 57px); }
  .home-slideshow::after { background: linear-gradient(180deg, #0008, #0001 55%); }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { transition: none !important; animation: none !important; }
  .gallery-image.scroll-reveal img { opacity: 1; transform: none; }
}
