*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#fff;color:#090909;font-family:'Bodoni Moda','Times New Roman',serif}a{color:inherit;text-decoration:none}button{font:inherit;cursor:pointer}button,a{-webkit-tap-highlight-color:transparent}.header{height:106px;padding:0 4.4%;display:flex;align-items:center;justify-content:space-between;background:#fff;position:relative;z-index:10}.name{font-family:'Bodoni Moda','Times New Roman',serif;font-size:36px;letter-spacing:-.035em;white-space:nowrap}.desktop-nav{display:flex;gap:28px;font:400 14px 'Bodoni Moda','Times New Roman',serif}.desktop-nav a:hover{text-decoration:underline;text-underline-offset:7px}.menu-toggle{display:none;width:44px;height:38px;background:transparent;border:0;align-items:center;justify-content:center;flex-direction:column;gap:8px}.menu-toggle span{height:1.5px;width:30px;background:#000}.page[hidden]{display:none!important}.film-page{min-height:calc(100svh - 270px);display:flex;align-items:flex-start}.film-feature{display:block;width:100%;line-height:0;cursor:pointer}.film-feature img{display:block;width:100%;height:auto;max-height:none;object-fit:contain;object-position:center}.project-page{background:#fff;padding:10px max(4.4%,18px) 60px;min-height:60svh}.project-images{max-width:1200px;margin:0 auto;display:flex;flex-direction:column;gap:36px}.project-images img{display:block;width:100%;height:auto;cursor:zoom-in}.back-link{display:block;max-width:1200px;margin:48px auto 0;font:400 14px 'Bodoni Moda','Times New Roman',serif;text-decoration:underline;text-underline-offset:4px}.about-page{max-width:1100px;margin:40px auto 0;padding:0 4.4%;min-height:calc(100svh - 330px)}.about-bio{font-family:'Bodoni Moda','Times New Roman',serif;font-size:clamp(27px,3vw,42px);line-height:1.33;letter-spacing:-.015em;margin:0 0 65px}.contact{display:flex;align-items:flex-start;flex-direction:column;gap:18px;font:400 21px 'Bodoni Moda','Times New Roman',serif;letter-spacing:.04em}.contact a{text-decoration:underline;text-underline-offset:5px}.footer{min-height:180px;display:flex;align-items:center;justify-content:center;gap:36px;margin-top:60px;background:#fff}.footer a{height:32px;width:32px}.footer svg{width:100%;height:100%;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linejoin:round}.menu-overlay{position:fixed;inset:0;z-index:50;background:#fff;display:none}.menu-overlay.open{display:block}.menu-overlay nav{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:10px}.menu-overlay nav a{font:400 clamp(46px,7vw,65px)/1.65 'Bodoni Moda','Times New Roman',serif;letter-spacing:.035em}.menu-close{position:absolute;right:4%;top:35px;z-index:2;font:400 60px/1 'Bodoni Moda','Times New Roman',serif;border:0;background:none}.lightbox{display:none;position:fixed;inset:0;background:#fff;z-index:100;align-items:center;justify-content:center}.lightbox.open{display:flex}.lightbox img{object-fit:contain;max-width:87vw;max-height:85svh}.lightbox button{position:absolute;color:#111;border:0;background:#fff;font:46px 'Bodoni Moda','Times New Roman',serif;z-index:2}#close-photo{right:3%;top:1%;font-size:38px}#prev-photo{left:2%;top:48%}#next-photo{right:2%;top:48%}#photo-number{position:absolute;bottom:18px;color:#555;font:12px 'Bodoni Moda','Times New Roman',serif}@media(max-width:700px){.header{height:108px;padding:0 5%}.name{font-size:34px}.desktop-nav{display:none}.menu-toggle{display:flex}.menu-close{right:5%;top:30px}.menu-overlay nav a{font-size:58px}.film-page{min-height:calc(100svh - 340px)}.film-feature img{max-height:none;height:auto;object-fit:contain}.project-page{padding:0 0 50px}.project-images{gap:24px}.back-link{margin:50px 5% 0}.about-page{margin:35px auto 0;padding:0 5%;min-height:calc(100svh - 290px)}.about-bio{font-size:clamp(27px,6.6vw,34px);line-height:1.37}.contact{font-size:17px;gap:22px}.footer{min-height:130px;margin-top:clamp(80px,20vh,230px)}.footer a{height:29px;width:29px}.lightbox img{max-width:100vw;max-height:80svh}}
/* Consistent editorial serif typography across the complete portfolio. */
body, button, input, textarea, select {font-family:'Bodoni Moda','Times New Roman',serif;}
.name {font-weight:400; letter-spacing:-.035em;}
.desktop-nav, .back-link, .contact, .menu-overlay nav a, .lightbox button, #photo-number {font-family:'Bodoni Moda','Times New Roman',serif;}
.contact {letter-spacing:0;}

/* Homepage: editorial image framed by white space on all devices. */
.film-page {
  min-height: calc(100svh - 106px);
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 20px 6% 110px;
}
.film-feature {
  width: 100%;
  max-width: 1180px;
  flex: 0 1 1180px;
}
.film-feature img {
  display: block;
  width: 100%;
  height: auto;
  max-height: min(67svh, 780px);
  object-fit: contain;
}
@media (max-width:700px) {
  .film-page {
    min-height: calc(100svh - 108px);
    padding: 0 6% 110px;
  }
  .film-feature { max-width: none; flex: 0 1 auto; }
  .film-feature img { width: 100%; height: auto; max-height: none; }
}

/* Typography correction: match the provided light, classic serif reference. */
body, button, input, textarea, select,
.name, .desktop-nav, .menu-overlay nav a,
.about-bio, .back-link, .lightbox button, #photo-number {
  font-family: 'Times New Roman', Times, serif;
  font-weight: 400;
  font-synthesis: none;
}
.name { letter-spacing: -0.045em; font-size: 36px; }
.desktop-nav { font-size: 16px; }
.about-bio {
  font-size: clamp(27px, 2.65vw, 37px);
  line-height: 1.36;
  letter-spacing: -0.012em;
  font-weight: 400;
}
.contact {
  font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
  font-size: 19px;
  font-weight: 300;
  letter-spacing: 0.075em;
  line-height: 1.45;
}
.contact a { text-underline-offset: 5px; text-decoration-thickness: 1px; }
@media (max-width: 700px) {
 .name { font-size: 32px; }
 .about-bio { font-size: clamp(22px, 4.5vw, 28px); line-height: 1.4; letter-spacing: -0.006em; }
 .contact { font-size: 15px; letter-spacing: 0.065em; }
}

/* All film stills use the exact same image frame as the homepage. */
.project-page { padding: 20px 6% 60px; }
.project-images { width: 100%; max-width: 1180px; margin-inline: auto; align-items: center; }
.project-images img { width: 100%; height: auto; max-height: min(67svh, 780px); object-fit: contain; object-position: center; }
.back-link { max-width: 1180px; }
@media(max-width:700px) {
  .project-page { padding: 0 6% 50px; }
  .project-images img { width: 100%; height: auto; max-height: none; object-fit: contain; }
}

/* Respect visitors who prefer less animation. */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
}

/* Seb Tabe-inspired, white sweeping menu reveal (desktop and mobile). */
.menu-overlay {
  display:block;
  pointer-events:none;
  visibility:hidden;
  clip-path:inset(0 0 0 100%);
  transition:clip-path 760ms cubic-bezier(.76,0,.24,1),visibility 0s linear 760ms;
  will-change:clip-path;
}
.menu-overlay.open {
  display:block;
  visibility:visible;
  pointer-events:auto;
  clip-path:inset(0 0 0 0);
  transition:clip-path 760ms cubic-bezier(.76,0,.24,1), visibility 0s;
}
.menu-overlay::before {
  content:'';position:absolute;top:0;bottom:0;left:0;width:1px;
  background:#161616;opacity:.7;pointer-events:none;
}
.menu-overlay nav a {
  opacity:0; transform:translateY(14px);
  transition:opacity 350ms ease,transform 550ms cubic-bezier(.22,1,.36,1);
}
.menu-overlay.open nav a {opacity:1;transform:translateY(0);transition-delay:300ms}
.menu-overlay.open nav a:nth-child(2) {transition-delay:390ms}
.menu-close {font-size:0!important;width:45px;height:45px;top:29px;right:4%;}
.menu-close::before,.menu-close::after {
 content:'';position:absolute;width:30px;height:1.5px;left:7px;top:22px;background:#000;
}
.menu-close::before {transform:rotate(45deg)}
.menu-close::after {transform:rotate(-45deg)}
@media(min-width:701px) {
  .desktop-nav{display:flex}
  .menu-toggle{display:flex;margin-left:28px}
  .header{justify-content:flex-start}
  .desktop-nav{margin-left:auto}
}
@media(max-width:700px){.menu-close{right:5%;top:30px}}
@media(prefers-reduced-motion:reduce){
  .menu-overlay,.menu-overlay.open,.menu-overlay nav a,.menu-overlay.open nav a{transition:none!important;transform:none!important}
}
