:root{
  --paper:#f7f6f2;
  --transition-white:#fdfdfd;
  --ink:#171715;
  --muted:#6e6c66;
  --line:rgba(23,23,21,.16);
  --gutter:clamp(18px,3.5vw,64px);
  --content:min(93vw,1760px);
  --ease:cubic-bezier(.22,.61,.36,1);
}
*{box-sizing:border-box}
html{background:var(--paper);scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font-family:"Helvetica Neue","Arial Nova",Arial,system-ui,sans-serif;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;letter-spacing:-.018em}
body.film-locked{overflow:hidden;touch-action:none}
img,video{display:block;max-width:100%}
figure{margin:0}
a{color:inherit;text-decoration:none}
button{font:inherit}

/* FIRST VIEWPORT */
.intro{min-height:100svh;display:flex;align-items:flex-start;justify-content:center;padding:clamp(22px,3.2vh,38px) 0 clamp(24px,3vh,34px)}
.intro-shell{width:min(92vw,calc((100svh - 175px) * 16 / 9),1680px);max-width:calc(100vw - 2*var(--gutter));margin:0 auto}
.identity{margin-bottom:clamp(20px,2.8vh,32px)}
.identity-name{margin:0;font-size:clamp(25px,2vw,32px);line-height:1;font-weight:500;letter-spacing:-.045em}
.identity-role{margin:8px 0 0;font-size:clamp(13px,1vw,15px);line-height:1.3;font-weight:400;letter-spacing:-.006em;color:#34332f}
.manifest{position:relative;width:100%;aspect-ratio:16/9;background:#111;overflow:hidden;isolation:isolate}
.manifest video{width:100%;height:100%;object-fit:contain;background:#0d0d0d;transition:opacity .65s var(--ease)}
.play-button{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:88px;height:88px;border:1px solid rgba(255,255,255,.68);border-radius:50%;background:rgba(12,12,12,.2);backdrop-filter:blur(4px);cursor:pointer;display:grid;place-items:center;transition:opacity .35s ease,transform .35s ease;z-index:4}
.play-button:hover{transform:translate(-50%,-50%) scale(1.035)}
.play-button:before{content:"";width:0;height:0;border-top:9px solid transparent;border-bottom:9px solid transparent;border-left:15px solid #fff;margin-left:4px}
.play-label{position:absolute;left:50%;top:calc(50% + 61px);transform:translateX(-50%);z-index:4;color:rgba(255,255,255,.9);font-size:11px;letter-spacing:.09em;text-transform:uppercase;white-space:nowrap;transition:opacity .35s ease}
.film-controls{position:absolute;right:18px;bottom:15px;z-index:7;display:flex;align-items:center;gap:18px}
.film-timer{position:absolute;left:18px;bottom:17px;z-index:7;color:rgba(255,255,255,.92);font-size:12px;line-height:1;font-variant-numeric:tabular-nums;letter-spacing:.025em;opacity:0;transition:opacity .3s ease;pointer-events:none;text-shadow:0 1px 10px rgba(0,0,0,.35)}
.film-action,.fullscreen-toggle{padding:6px 0;border:0;border-bottom:1px solid rgba(255,255,255,.55);background:transparent;color:rgba(255,255,255,.88);font-size:12px;line-height:1;letter-spacing:.02em;cursor:pointer;transition:opacity .35s ease,border-color .35s ease}
.film-action{opacity:0;pointer-events:none}
.fullscreen-toggle{opacity:.92}
.film-action:hover,.fullscreen-toggle:hover{border-color:#fff;color:#fff}
.manifest.show-skip .film-action{opacity:1;pointer-events:auto}
.manifest.playing .play-button,.manifest.playing .play-label{opacity:0;pointer-events:none}
.manifest.playing .film-timer{opacity:1}
.manifest.video-ended .film-timer,.manifest.ended .film-timer{opacity:0}
.paper-wash{position:absolute;inset:0;z-index:5;background:var(--transition-white);opacity:0;pointer-events:none;transition:opacity .16s linear,background-color 1.1s var(--ease)}
.manifest.video-ended .paper-wash,.manifest.ended .paper-wash{opacity:1}
.manifest.ended .paper-wash{background:var(--paper)}
.manifest-copy{position:absolute;inset:0;z-index:6;display:grid;place-items:center;padding:7vw;text-align:center;opacity:0;transform:translateY(6px);pointer-events:none;transition:opacity .95s var(--ease),transform .95s var(--ease)}
.manifest-copy p{max-width:1050px;margin:0;font-size:clamp(34px,4.15vw,72px);line-height:1.08;font-weight:400;letter-spacing:-.052em}
.manifest-copy strong{font-weight:500}
.manifest.video-ended{background:var(--transition-white)}
.manifest.ended{background:var(--paper)}
.manifest.video-ended video,.manifest.ended video{opacity:0}
.manifest.copy-visible .manifest-copy{opacity:1;transform:none}
.manifest.ended .film-controls,.manifest.ended .play-button,.manifest.ended .play-label{display:none}
.page-veil{position:fixed;inset:0;z-index:2147483000;background:var(--transition-white);opacity:0;pointer-events:none;transition:opacity .72s var(--ease)}
body.page-transition .page-veil{opacity:1}
.after-manifest{height:clamp(180px,35vh,460px)}

/* PROJECTS */
.projects{overflow:hidden}
.project{padding:0 0 11vh}
.project + .project{padding-top:clamp(180px,27vh,360px)}
.project-header{width:var(--content);margin:0 auto clamp(58px,8vh,104px);padding-top:18px;border-top:1px solid var(--line);display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:clamp(12px,1.35vw,24px);align-items:start}
.project-index{grid-column:1/3;font-size:11px;line-height:1.2;letter-spacing:.13em;text-transform:uppercase;color:var(--muted)}
.project-title{grid-column:1/9;margin:28px 0 0;max-width:1020px;font-size:clamp(42px,4.65vw,76px);line-height:1.01;font-weight:400;letter-spacing:-.052em}
.project-roles{grid-column:10/13;grid-row:2;align-self:end;justify-self:end;min-width:170px;font-size:clamp(15px,1.05vw,18px);line-height:1.45;font-weight:500;letter-spacing:-.015em;text-align:left}
.project-roles span{display:block}
.project-hero{width:var(--content);margin:0 auto;overflow:hidden;background:#e9e7e1}
.project-hero img{width:100%;height:auto}
.diptych{width:var(--content);margin:clamp(58px,8vh,112px) auto 0;display:grid;grid-template-columns:minmax(0,62fr) minmax(0,34fr);gap:4%;align-items:end}
.diptych.small-large{grid-template-columns:minmax(0,34fr) minmax(0,62fr)}
.diptych img{width:100%;height:auto}

/* FULLSCREEN MANIFEST */
.manifest:fullscreen{width:100vw;height:100vh;aspect-ratio:auto;background:#000}
.manifest:fullscreen video{width:100%;height:100%;object-fit:contain}
.manifest:fullscreen .play-button,.manifest:fullscreen .play-label{display:none}
.manifest:-webkit-full-screen{width:100vw;height:100vh;aspect-ratio:auto;background:#000}
.manifest:-webkit-full-screen video{width:100%;height:100%;object-fit:contain}
.manifest.video-ended:fullscreen,.manifest.video-ended:-webkit-full-screen{background:var(--transition-white)}
.manifest.ended:fullscreen,.manifest.ended:-webkit-full-screen{background:var(--paper)}
.manifest::backdrop{background:#000}
.manifest.video-ended::backdrop{background:var(--transition-white)}
.manifest.ended::backdrop{background:var(--paper)}

/* Final sequence */
.award{width:var(--content);margin:clamp(220px,34vh,470px) auto 0;padding-top:20px;border-top:1px solid var(--line);display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:clamp(12px,1.35vw,24px)}
.award-label{grid-column:1/3;font-size:11px;letter-spacing:.13em;text-transform:uppercase;color:var(--muted)}
.award p{grid-column:4/11;margin:0;font-size:clamp(28px,3.25vw,56px);line-height:1.12;letter-spacing:-.042em}
.contact{width:var(--content);margin:clamp(220px,36vh,520px) auto 0;padding-bottom:clamp(160px,25vh,330px);display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:clamp(12px,1.35vw,24px);align-items:end}
.contact h2{grid-column:1/9;grid-row:1;margin:0;font-size:clamp(66px,9.1vw,158px);line-height:.89;font-weight:400;letter-spacing:-.075em}
.contact a{grid-column:9/13;grid-row:1;justify-self:end;align-self:end;margin:0 0 clamp(5px,.48vw,9px);padding-bottom:5px;border-bottom:1px solid #777;font-size:clamp(18px,1.55vw,27px);line-height:1;letter-spacing:-.025em}
.footer{width:var(--content);margin:0 auto 34px;padding:34px 0 0;border-top:1px solid var(--line);display:grid;grid-template-columns:repeat(3,1fr);gap:20px;color:#292824;font-size:clamp(14px,1vw,16px);line-height:1.25;letter-spacing:-.008em}
.footer span:first-child{font-weight:500}
.footer span:nth-child(2){text-align:center}
.footer span:last-child{text-align:right}

.reveal{opacity:1;transform:none}
.js .reveal{opacity:0;transform:translateY(11px);transition:opacity .85s var(--ease),transform .85s var(--ease)}
.js .reveal.visible{opacity:1;transform:none}

@media(max-width:760px){
  :root{--content:calc(100vw - 36px);--gutter:18px}
  .intro{min-height:100svh;padding:18px 0 20px}
  .intro-shell{width:var(--content);max-width:none}
  .identity{margin-bottom:18px}
  .identity-name{font-size:23px}
  .identity-role{font-size:13px;max-width:340px}
  .play-button{width:64px;height:64px}.play-label{top:calc(50% + 46px);font-size:9px}.film-controls{right:12px;bottom:10px;gap:14px}.film-timer{left:12px;bottom:13px;font-size:11px}.film-action,.fullscreen-toggle{font-size:11px}
  .manifest-copy{padding:8vw}.manifest-copy p{font-size:clamp(28px,8.1vw,40px);line-height:1.08}
  .after-manifest{height:22vh}
  .project + .project{padding-top:18vh}
  .project-header{grid-template-columns:repeat(6,minmax(0,1fr));gap:10px;margin-bottom:38px;padding-top:13px}
  .project-index{grid-column:1/3;font-size:10px}
  .project-title{grid-column:1/7;margin-top:22px;font-size:clamp(38px,11.1vw,55px);line-height:.99;letter-spacing:-.055em}
  .project-roles{grid-column:1/7;grid-row:auto;justify-self:start;margin-top:16px;min-width:0;font-size:15px;line-height:1.38}
  .project-roles span{display:inline}.project-roles span:not(:last-child):after{content:" · "}
  .diptych,.diptych.small-large{display:block;margin-top:18px}.diptych figure{margin-bottom:18px}
  .award{grid-template-columns:repeat(6,minmax(0,1fr));margin-top:24vh}.award-label{grid-column:1/7;margin-bottom:24px}.award p{grid-column:1/7;font-size:31px}
  .contact{grid-template-columns:repeat(6,minmax(0,1fr));margin-top:26vh;padding-bottom:20vh;align-items:start}.contact h2{grid-column:1/7;grid-row:auto;font-size:clamp(59px,18vw,84px)}.contact a{grid-column:1/7;grid-row:auto;justify-self:start;align-self:auto;margin:5vh 0 0}
  .footer{width:var(--content);margin-bottom:22px;padding-top:24px;display:flex;flex-direction:column;gap:7px;font-size:14px}.footer span:nth-child(2),.footer span:last-child{text-align:left}
}
@media(max-height:650px) and (min-width:761px){
  .intro{padding-top:18px;padding-bottom:18px}.identity{margin-bottom:14px}.identity-name{font-size:25px}.identity-role{margin-top:5px;font-size:13px}
  .intro-shell{width:min(88vw,calc((100svh - 112px) * 16 / 9),1500px)}
}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}.js .reveal{opacity:1;transform:none}.manifest-copy,.paper-wash,.manifest video,.page-veil{transition:none!important}
}

/* Production accessibility and rendering */
:focus-visible{outline:2px solid var(--ink);outline-offset:5px}
.manifest :focus-visible{outline-color:#fff}
.project img{background:#e9e7e1}
@media(hover:none){.play-button:hover{transform:translate(-50%,-50%)}}