:root {
  color-scheme:light;
  --paper:#f2f0ea;
  --ink:#10100f;
  --muted:#6f6e68;
  --line:rgba(16,16,15,.18);
  --dark:#11110f;
  --warm:#e4e0d7;
  --paper-on-dark:#f5f2eb;
  --pad:clamp(1.2rem,3.8vw,4.5rem);
  --section-space:clamp(5rem,10vw,10rem);
  --label-size:.68rem;
  --label-tracking:.13em;
  --pill-radius:999px;
  --ease:cubic-bezier(.22,1,.36,1);
}
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; overflow-x:hidden; background:var(--paper); color:var(--ink); font:16px/1.5 Arial,Helvetica,sans-serif; -webkit-font-smoothing:antialiased; }
img,video { display:block; width:100%; }
button,a { color:inherit; }
a { text-decoration:none; }
button { font:inherit; }
.skip-link { position:fixed; z-index:200; left:1rem; top:0; padding:.7rem 1rem; background:var(--paper); transform:translateY(-110%); }
.skip-link:focus { transform:none; }
button:focus-visible,a:focus-visible { outline:2px solid currentColor; outline-offset:4px; }
.site-header a:focus-visible,.menu-button:focus-visible { outline-offset:6px; }
.site-header { position:fixed; z-index:90; inset:0 0 auto; display:flex; align-items:center; justify-content:space-between; gap:2rem; padding:1rem var(--pad); background:transparent; color:white; border-bottom:1px solid transparent; opacity:1; transform:none; pointer-events:auto; transition:background .3s ease,color .3s ease,border-color .3s ease; }
.site-header.is-scrolled,.inner-page .site-header { background:rgba(242,240,234,.95); color:var(--ink); border-color:var(--line); backdrop-filter:blur(14px); }
.wordmark,.site-nav a,.menu-button,.kicker { font-size:var(--label-size); font-weight:700; letter-spacing:var(--label-tracking); text-transform:uppercase; }
.site-nav { display:flex; align-items:center; gap:clamp(1rem,2.4vw,2.8rem); }
.site-nav a { position:relative; }
.site-nav a::after { content:""; position:absolute; right:0; bottom:-.32rem; left:0; height:1px; background:currentColor; transform:scaleX(0); transform-origin:right; transition:transform .2s ease; }
.site-nav a:hover::after,.site-nav a:focus-visible::after,.site-nav a[aria-current="page"]::after { transform:scaleX(1); transform-origin:left; }
.menu-button { display:none; border:0; padding:.4rem 0; background:none; }
.hero { position:relative; min-height:100svh; overflow:hidden; background:#050505; color:white; }
.hero-video { position:absolute; inset:0; height:100%; object-fit:cover; }
.hero::after { content:""; position:absolute; inset:0; background:linear-gradient(180deg,rgba(0,0,0,.32),rgba(0,0,0,.06) 24%,rgba(0,0,0,.06) 55%,rgba(0,0,0,.68)); }
.hero-reel { position:absolute; z-index:2; inset:0; display:grid; place-items:center; }
.watch-reel { display:grid; place-items:center; width:clamp(8rem,12vw,11rem); aspect-ratio:1; border:1px solid rgba(255,255,255,.8); border-radius:50%; background:rgba(0,0,0,.14); color:white; cursor:pointer; font-size:.7rem; font-weight:700; letter-spacing:var(--label-tracking); text-transform:uppercase; backdrop-filter:blur(4px); transition:transform .35s var(--ease),background .35s var(--ease); }
.watch-reel:hover { transform:scale(1.06); background:rgba(255,255,255,.14); }
.hero-caption { position:absolute; z-index:2; right:var(--pad); bottom:1.5rem; left:var(--pad); display:flex; align-items:flex-end; justify-content:space-between; gap:2rem; }
.hero-caption p { margin:0; font-size:.68rem; letter-spacing:.12em; text-transform:uppercase; }
.hero-caption h1 { margin:.35rem 0 0; font-size:clamp(1.4rem,2.6vw,2.6rem); font-weight:400; letter-spacing:-.04em; }
.scroll-cue { font-size:.65rem; letter-spacing:.12em; text-transform:uppercase; }
.section { padding:var(--section-space) var(--pad); }
.section--flush-top { padding-top:0; }
.section-head { display:grid; grid-template-columns:minmax(0,1fr) minmax(14rem,28rem); gap:2rem; align-items:end; margin-bottom:clamp(2.5rem,4vw,4rem); border-top:1px solid var(--line); padding-top:1.2rem; }
.section-head h2 { margin:0; font-size:clamp(2.5rem,4.5vw,4.8rem); font-weight:400; letter-spacing:-.06em; line-height:.92; }
.section-head > .more-link { justify-self:end; margin:0; }
.selected-work { background:var(--warm); }
.page-title h1,.project-hero h1 { margin:0; font-size:clamp(2.8rem,5vw,5.5rem); font-weight:400; letter-spacing:-.065em; line-height:.92; }
.film-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:clamp(2rem,5vw,5rem) clamp(1rem,2vw,2rem); }
.film-catalog { padding-bottom:var(--section-space); }
.film-card { display:block; width:100%; border:0; padding:0; background:none; text-align:left; cursor:pointer; }
.film-card figure { position:relative; margin:0; aspect-ratio:16/9; overflow:hidden; background:#171716; }
.film-card img { height:100%; object-fit:cover; transition:transform .55s ease,opacity .25s ease; }
.film-card:hover img { transform:scale(1.02); opacity:.85; }
.film-card .play-chip { position:absolute; right:1rem; bottom:1rem; padding:.55rem .8rem; border-radius:var(--pill-radius); background:var(--paper); font-size:.62rem; font-weight:700; letter-spacing:.1em; text-transform:uppercase; }
.film-card > div { display:flex; justify-content:space-between; gap:1rem; padding-top:.8rem; border-top:1px solid var(--line); margin-top:.6rem; }
.film-card h3 { margin:0; font-size:1rem; font-weight:500; }
.film-card p { margin:0; color:var(--muted); font-size:.68rem; letter-spacing:.08em; text-transform:uppercase; }
.preview-band { background:var(--dark); color:var(--paper-on-dark); }
.preview-band .section-head { border-color:rgba(255,255,255,.2); }
.collection-grid,.project-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:clamp(2rem,4vw,4rem) clamp(1rem,2vw,2rem); }
.collection-card figure,.project-card figure { margin:0; overflow:hidden; background:#222; }
.collection-card figure { aspect-ratio:4/3; }
.project-card figure { aspect-ratio:16/10; }
.collection-card img,.project-card img { height:100%; object-fit:cover; transition:transform .6s ease; }
.collection-card:hover img,.project-card:hover img { transform:scale(1.025); }
.collection-card > div,.project-card > div { display:flex; align-items:baseline; justify-content:space-between; gap:1rem; padding-top:.85rem; }
.collection-card h2,.project-card h2 { margin:0; font-size:clamp(1.5rem,2.8vw,3rem); font-weight:400; letter-spacing:-.045em; }
.collection-card p,.project-card p,.project-card span { margin:0; font-size:.64rem; letter-spacing:.1em; text-transform:uppercase; }
.project-card > div { display:grid; grid-template-columns:1fr auto; }
.project-card p { grid-column:1/-1; color:var(--muted); }
.project-card span { color:var(--muted); }
.more-link { display:inline-block; margin-top:3rem; border-bottom:1px solid currentColor; padding-bottom:.3rem; font-size:var(--label-size); font-weight:700; letter-spacing:.1em; text-transform:uppercase; transition:opacity .2s ease; }
.more-link:hover { opacity:.58; }
.about-strip { display:grid; grid-template-columns:1fr 1.2fr; gap:clamp(3rem,9vw,10rem); align-items:center; }
.about-strip figure { margin:0; aspect-ratio:4/5; overflow:hidden; }
.about-strip img { height:100%; object-fit:cover; }
.about-strip h2 { max-width:10ch; margin:0 0 2rem; font-size:clamp(2.8rem,5.5vw,6rem); font-weight:400; letter-spacing:-.06em; line-height:.94; }
.about-strip .kicker { margin:0 0 1.25rem; }
.about-strip p:not(.kicker) { max-width:38rem; font-size:clamp(1rem,1.35vw,1.25rem); line-height:1.7; }
.inner-page { padding-top:3.2rem; }
.page-title { display:grid; grid-template-columns:minmax(0,1fr) minmax(14rem,28rem); gap:2rem; align-items:end; padding:clamp(5rem,10vw,9rem) var(--pad) clamp(3rem,6vw,6rem); }
.page-title p { margin:0; }
.page-title [data-page-count] { color:var(--muted); text-align:right; }
.collection-page-title { display:flex; grid-template-columns:none; align-items:center; gap:clamp(1.25rem,3vw,3rem); padding:clamp(2.5rem,4vw,4rem) var(--pad) clamp(2rem,3vw,3rem); }
.collection-page-title::after { content:""; flex:1; min-width:2rem; height:1px; background:var(--line); }
.collection-page-title h1 { flex:none; max-width:none; font-size:clamp(2.75rem,5vw,5.5rem); white-space:nowrap; }
.gallery-grid { columns:3 20rem; column-gap:.8rem; padding:0 var(--pad) clamp(5rem,10vw,10rem); }
.gallery-image { width:100%; margin:0 0 .8rem; border:0; padding:0; background:none; cursor:zoom-in; break-inside:avoid; }
.gallery-image img { width:100%; height:auto; }
.project-hero { padding:clamp(5rem,9vw,8rem) var(--pad) clamp(3rem,6vw,5rem); background:var(--warm); border-bottom:1px solid var(--line); }
.project-eyebrow { margin:0 0 clamp(1.5rem,3vw,3rem); font-size:var(--label-size); font-weight:700; letter-spacing:var(--label-tracking); text-transform:uppercase; }
.project-hero h1 { max-width:14ch; font-size:clamp(4rem,8.5vw,9rem); text-wrap:balance; }
.project-hero-details { display:grid; grid-template-columns:minmax(0,1.5fr) minmax(16rem,.65fr); gap:clamp(3rem,9vw,10rem); align-items:start; margin-top:clamp(3rem,6vw,5rem); border-top:1px solid var(--line); padding-top:1.15rem; }
.project-hero .summary { max-width:48rem; margin:0; font-size:clamp(1.15rem,1.8vw,1.65rem); line-height:1.5; }
.role-block { width:100%; max-width:28rem; justify-self:end; }
.role-block p { margin:0; }
.role-block p:not(.kicker) { line-height:1.65; }
.role-block .kicker { margin:0 0 .75rem; color:var(--muted); }
.project-media { display:grid; gap:1rem; padding:0 var(--pad); }
.project-cover { margin:0; max-height:80vh; overflow:hidden; background:#111; }
.project-cover img { width:100%; height:100%; max-height:80vh; object-fit:cover; }
.project-video,.video-embed { width:100%; background:#000; }
.video-embed { position:relative; aspect-ratio:16/9; }
.video-embed iframe { position:absolute; inset:0; width:100%; height:100%; border:0; }
.project-story { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:clamp(2rem,8vw,9rem); padding:clamp(5rem,10vw,10rem) var(--pad); }
.project-story article { border-top:1px solid var(--line); padding-top:1rem; }
.project-story article > p:last-child { max-width:42rem; margin:1.5rem 0 0; font-size:clamp(1.1rem,1.55vw,1.4rem); line-height:1.65; }
.project-gallery-section { padding:0 var(--pad) clamp(6rem,10vw,10rem); }
.project-gallery-section > .kicker { border-top:1px solid var(--line); padding-top:1rem; }
.project-gallery { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:.8rem; margin-top:2rem; }
.project-gallery-image { border:0; padding:0; background:none; cursor:zoom-in; }
.project-gallery-image img { height:100%; object-fit:cover; }
.project-deck-section { padding-bottom:clamp(6rem,10vw,10rem); }
.project-deck { margin-top:2rem; }
.project-deck-frame { display:grid; width:100%; min-height:clamp(16rem,55vw,48rem); place-items:center; border:0; padding:0; background:var(--warm); cursor:zoom-in; }
.project-deck-frame img { width:100%; max-height:80vh; object-fit:contain; }
.project-deck-controls { display:flex; align-items:center; justify-content:space-between; gap:1rem; border-top:1px solid var(--line); padding-top:1rem; margin-top:1rem; }
.project-deck-controls p { margin:0; color:var(--muted); font-size:var(--label-size); font-weight:700; letter-spacing:var(--label-tracking); }
.project-deck-controls button { border:0; border-bottom:1px solid currentColor; padding:.2rem 0; background:none; cursor:pointer; font-size:var(--label-size); font-weight:700; letter-spacing:var(--label-tracking); text-transform:uppercase; }
dialog { border:0; padding:0; background:transparent; }
dialog::backdrop { background:rgba(0,0,0,.92); backdrop-filter:blur(6px); }
.reel-dialog { width:min(94vw,1500px); }
.reel-dialog video { max-height:88vh; background:#000; }
.film-dialog,.showcase-dialog { width:min(92vw,1120px); max-height:92vh; overflow:auto; background:var(--dark); color:white; }
.film-dialog video { width:100%; max-height:72vh; aspect-ratio:4/3; object-fit:contain; background:#000; }
.film-dialog-meta { display:flex; align-items:end; justify-content:space-between; gap:2rem; padding:1.15rem 1.25rem 1.35rem; }
.film-dialog-meta p { margin:0 0 .25rem; color:rgba(255,255,255,.6); font-size:.65rem; letter-spacing:.12em; text-transform:uppercase; }
.film-dialog-meta h2 { margin:0; font-size:clamp(1.4rem,2.5vw,2.4rem); font-weight:400; letter-spacing:-.04em; }
.clip-list { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:.4rem; }
.clip-list button { width:2.6rem; aspect-ratio:1; border:1px solid rgba(255,255,255,.35); border-radius:50%; background:transparent; color:white; cursor:pointer; font-size:.64rem; }
.clip-list button:hover,.clip-list button.is-active { background:white; color:var(--dark); }
.showcase-dialog { width:min(96vw,1280px); padding:clamp(1rem,2vw,2rem); }
.showcase-dialog-header { display:flex; align-items:end; justify-content:space-between; gap:2rem; margin-bottom:1.5rem; border-bottom:1px solid rgba(255,255,255,.2); padding:0 3.5rem 1.25rem 0; }
.showcase-dialog-header p { margin:0 0 .35rem; color:rgba(255,255,255,.58); font-size:.65rem; letter-spacing:.12em; text-transform:uppercase; }
.showcase-dialog-header h2 { margin:0; font-size:clamp(1.6rem,3vw,3rem); font-weight:400; letter-spacing:-.045em; line-height:1; }
.showcase-clip-list { flex:none; }
.showcase-media { display:grid; gap:1rem; }
.showcase-media--youtube { grid-template-columns:repeat(auto-fit,minmax(min(100%,28rem),1fr)); }
.showcase-media--video { place-items:center; }
.showcase-media video { width:100%; max-height:76vh; object-fit:contain; background:#000; }
.showcase-video { position:relative; aspect-ratio:16/9; background:#000; }
.showcase-video iframe { position:absolute; inset:0; width:100%; height:100%; border:0; }
.dialog-close { position:fixed; z-index:2; top:1rem; right:1rem; border:1px solid rgba(255,255,255,.5); border-radius:50%; width:3rem; aspect-ratio:1; background:var(--dark); color:white; cursor:pointer; }
.lightbox { width:100vw; height:100vh; max-width:none; max-height:none; }
.lightbox img { width:100%; height:100%; object-fit:contain; }
.site-footer { display:flex; justify-content:space-between; gap:2rem; padding:1.4rem var(--pad); border-top:1px solid var(--line); font-size:.65rem; letter-spacing:.1em; text-transform:uppercase; }
.site-footer p { margin:0; }
.reveal-ready .reveal { opacity:0; transform:translateY(1.2rem); transition:opacity .65s var(--ease),transform .65s var(--ease); }
.reveal-ready .reveal.is-in { opacity:1; transform:none; }
@media (max-width:760px) {
  .site-header { padding-block:.8rem; }
  .menu-button { display:block; position:relative; z-index:2; }
  .site-nav { position:absolute; top:100%; right:0; left:0; display:grid; gap:0; padding:0 var(--pad) 1rem; background:var(--paper); border-bottom:1px solid var(--line); opacity:0; transform:translateY(-.5rem); pointer-events:none; transition:.2s ease; }
  .site-nav.is-open { color:var(--ink); opacity:1; transform:none; pointer-events:auto; }
  .site-nav a { border-top:1px solid var(--line); padding:.8rem 0; }
  .hero-caption { align-items:flex-start; }
  .hero-caption h1 { font-size:1.45rem; }
  .scroll-cue { display:none; }
  .section-head,.page-title { grid-template-columns:1fr; gap:.8rem; }
  .collection-page-title { gap:1rem; padding-block:2.5rem 2rem; }
  .collection-page-title h1 { font-size:clamp(2.5rem,11vw,3.5rem); }
  .film-grid,.collection-grid,.project-grid,.project-story,.project-gallery { grid-template-columns:1fr; }
  .collection-card h2,.project-card h2 { font-size:2rem; }
  .about-strip { grid-template-columns:1fr; }
  .about-strip figure { width:84%; }
  .page-title [data-page-count] { text-align:left; }
  .gallery-grid { columns:2 9rem; gap:.45rem; }
  .gallery-image { margin-bottom:.45rem; }
  .project-hero h1 { max-width:none; font-size:clamp(3.5rem,15vw,5.5rem); }
  .project-hero-details { grid-template-columns:1fr; gap:2.5rem; margin-top:3rem; }
  .role-block { max-width:none; justify-self:start; }
  .project-deck-frame { min-height:14rem; }
  .film-dialog-meta { display:grid; gap:1rem; }
  .clip-list { justify-content:flex-start; }
  .showcase-dialog { width:100vw; max-height:100vh; margin:0; padding:1rem; }
  .showcase-dialog-header { display:grid; gap:1rem; padding-right:3.5rem; }
  .showcase-clip-list { justify-self:start; }
  .showcase-media--youtube { grid-template-columns:1fr; }
}
@media (prefers-reduced-motion:reduce) { html{scroll-behavior:auto} *,*::before,*::after{transition-duration:.01ms!important;animation-duration:.01ms!important} .reveal-ready .reveal{opacity:1;transform:none} }