/* Editorial portfolio: original design inspired by an image-led studio layout. */
:root{--paper:#f2f1eb;--ink:#191919;--muted:#5b5b55;--line:#19191935}
body{background:var(--paper);color:var(--ink);font-family:Arial,Helvetica,sans-serif;font-size:17px;line-height:1.5}
body[data-theme=dark]{--paper:#191919;--ink:#f2f1eb;--muted:#b9b9b0;--line:#f2f1eb40}
header{padding:26px 4vw;border-color:var(--line);flex-wrap:wrap}.brand{font-size:19px;letter-spacing:-.06em}nav a{color:var(--ink)}nav a:hover,nav a[aria-current=page]{color:var(--ink)}
.wrap{max-width:1800px;padding-left:4vw;padding-right:4vw}.eyebrow{color:var(--muted);font-size:11px;letter-spacing:.08em}.muted,.card p,.row p,.row .date,.page-head p,.hero p,.poster-card p,.collaborator-logos figcaption,.image-caption,.media-link span,.notice,footer,.archive-controls label{color:var(--muted)}
h1,h2,h3{font-weight:400}h2{font-size:clamp(38px,6.5vw,102px);letter-spacing:-.065em;line-height:.98}h3{letter-spacing:-.035em}a:focus-visible,button:focus-visible,select:focus-visible{outline:2px solid var(--ink);outline-offset:5px}.accent{color:var(--ink)}
.section,.row,.card,.media-link,footer{border-color:var(--line)}.button{background:var(--ink);color:var(--paper);border-color:var(--ink);border-radius:60px}.button.secondary{color:var(--ink);border-color:var(--line)}.text-link{color:var(--ink);border-color:var(--ink);font-size:14px}.light{background:#e3e2da;color:#191919}.tag{color:var(--ink);border-color:var(--line)}.notice{border-color:var(--ink)}select{background:var(--paper);color:var(--ink);border-color:var(--line)}.archive-result{border-color:var(--line)}.film-index-card{background:var(--ink);color:var(--paper)}.film-index-card .muted,.film-index-card .eyebrow,.film-index-card .text-link{color:var(--paper)}.page-head h1{font-size:clamp(60px,10vw,150px);letter-spacing:-.065em}.hero .caption{color:var(--muted)}.theme-toggle{border:1px solid var(--line);border-radius:50%;width:35px;height:35px;background:transparent;color:var(--ink);cursor:pointer;font-size:20px;flex-shrink:0}.page-head{padding-top:90px}.poster-link{background:#171717}.bottom-cta{padding-top:95px;padding-bottom:95px}
.intro{padding-top:52px;padding-bottom:55px}.intro-meta{display:flex;justify-content:space-between;gap:20px;font-size:12px}.intro h1{font-size:clamp(86px,15.5vw,240px);line-height:.86;letter-spacing:-.078em;margin:74px 0 40px;position:relative}.intro h1>span{display:inline-block;margin-left:19vw}.round-link{position:absolute;right:2%;bottom:2%;display:grid;place-items:center;border:1px solid var(--ink);border-radius:50%;width:8vw;height:8vw;font-size:5vw;line-height:1;letter-spacing:0}.intro-bottom{display:flex;justify-content:space-between;align-items:end;gap:30px}.intro-bottom p{font-size:16px;margin:0;max-width:500px}.cinema{margin:0 2vw}.cinema>a{display:block;position:relative;overflow:hidden;background:#111}.cinema img{aspect-ratio:2.25;object-fit:cover;transition:transform .7s}.cinema a:hover img{transform:scale(1.025)}.reel-badge{position:absolute;bottom:30px;left:30px;display:flex;align-items:center;gap:45px;padding:17px 23px;border-radius:50px;background:#f2f1eb;color:#191919;font-size:14px}.cinema-caption{display:flex;justify-content:space-between;font-size:11px;padding:14px 0;color:var(--muted)}
.selected,.practice{padding-top:120px;padding-bottom:60px}.editorial-heading{display:grid;grid-template-columns:1fr 2fr auto;gap:35px;align-items:start;margin-bottom:65px}.editorial-heading h2{margin:0}.editorial-heading>.text-link{align-self:end}.feature-grid{display:grid;grid-template-columns:1fr 1fr;gap:90px 5vw}.feature-project:nth-child(even){padding-top:140px}.project-photo{position:relative;overflow:hidden}.project-photo img{aspect-ratio:1.35;transition:transform .6s}.feature-project:hover img{transform:scale(1.035)}.project-arrow{position:absolute;right:18px;bottom:18px;border-radius:50%;background:var(--paper);color:var(--ink);width:44px;height:44px;display:grid;place-items:center;font-size:24px}.project-caption h3{font-size:25px;margin:20px 0 6px}.project-caption p{font-size:12px;color:var(--muted)}.film-band{display:flex;align-items:center;justify-content:space-between;gap:25px;border-top:1px solid var(--line);padding:30px 0;margin-top:80px}.film-band>span{font-size:12px}.film-band>span:last-child{font-size:35px}.film-band h3{font-size:clamp(24px,3.5vw,48px);margin:0}.film-strip{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}.film-strip img{aspect-ratio:2/3;object-fit:contain;background:#111}
.service-line{display:grid;grid-template-columns:1fr 5fr auto;align-items:center;gap:20px;border-top:1px solid var(--line);padding:30px 0}.service-line h3{font-size:clamp(28px,4.4vw,70px);margin:0}.service-line>span{font-size:13px}.service-line>span:last-child{font-size:36px}.service-line:hover h3{transform:translateX(8px)}.service-line h3{transition:transform .2s}
.bio-panel{display:grid;grid-template-columns:1fr 1.25fr;gap:12vw;align-items:center;padding-top:110px;padding-bottom:130px}.bio-portrait img{aspect-ratio:4/5;filter:grayscale(1);object-position:50% 28%}.bio-portrait>span{display:block;margin-top:13px;font-size:11px;color:var(--muted)}.bio-panel h2{font-size:clamp(42px,5.4vw,84px);margin:26px 0}.bio-panel p{max-width:520px;color:var(--muted);margin-bottom:35px}.education-panel{background:#e3e2da;color:#191919;padding:100px 0 60px}.education-panel .eyebrow{color:#55554f}.education-panel .text-link{color:#191919;border-color:#191919}.teaching-wide{aspect-ratio:2.1;object-position:center}.education-copy{display:flex;justify-content:space-between;gap:30px;margin-top:30px}.education-copy>div{display:flex;align-items:start;gap:30px}.education-copy p{font-size:16px}.contact-end{padding-top:120px;padding-bottom:110px}.contact-end h2{font-size:clamp(60px,11vw,180px);margin:35px 0 40px}.contact-end h2 span{font-size:.7em}.contact-end>a:hover h2{text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:12px}footer{padding-left:4vw;padding-right:4vw}.work-image{object-fit:contain;background:#e3e2da}.about-jumps a{border-color:var(--line)}
@media(min-width:1000px){body:not(.editorial-home) .grid:has(.work-image){grid-template-columns:repeat(2,minmax(0,1fr));gap:65px 4vw}}
@media(max-width:800px){header{flex-direction:row;align-items:center;gap:15px}.brand{margin-right:auto}nav{order:3;width:100%;gap:24px}.wrap{padding-left:6vw;padding-right:6vw}.intro{padding-top:28px}.intro-meta{font-size:10px}.intro-meta span:last-child{max-width:85px;text-align:right}.intro h1{font-size:15.6vw;margin:50px 0 30px}.intro h1>span{margin-left:15vw}.round-link{width:10vw;height:10vw;font-size:7vw;right:0}.intro-bottom{align-items:start;flex-direction:column;gap:20px}.intro-bottom p{font-size:14px}.cinema{margin:0 3vw}.cinema img{aspect-ratio:1.45}.reel-badge{left:15px;bottom:15px;padding:12px 18px}.cinema-caption{font-size:10px}.selected,.practice{padding-top:70px;padding-bottom:30px}.editorial-heading{grid-template-columns:1fr;gap:20px;margin-bottom:35px}.editorial-heading>.text-link{justify-self:start}.feature-grid{gap:35px;grid-template-columns:1fr}.feature-project:nth-child(even){padding-top:0}.project-caption h3{font-size:24px}.film-band{flex-wrap:wrap;margin-top:40px}.film-band h3{order:3;width:100%}.film-strip{grid-template-columns:repeat(2,1fr);gap:14px}.service-line{grid-template-columns:25px 1fr 25px;padding:24px 0;gap:12px}.service-line h3{font-size:29px}.bio-panel{grid-template-columns:1fr;gap:40px;padding-top:60px;padding-bottom:70px}.bio-portrait{max-width:440px}.bio-panel h2{font-size:52px}.education-panel{padding-top:65px;padding-bottom:40px}.teaching-wide{aspect-ratio:1.4}.education-copy{flex-direction:column;gap:10px}.contact-end{padding-top:70px;padding-bottom:65px}.contact-end h2{font-size:14vw}.page-head{padding-top:55px}.page-head h1{font-size:15vw}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{transition:none!important;scroll-behavior:auto!important}}

/* Subtle scroll depth and a desktop pointer trail. */
.scroll-depth{transform:perspective(1400px) translateY(var(--depth-y,0px)) rotateX(var(--depth-rotate,0deg));transform-origin:center;backface-visibility:hidden}
.cursor-trail{position:fixed;inset:0;pointer-events:none;z-index:1000;opacity:0;overflow:hidden;contain:strict}
.cursor-trail i{position:absolute;left:0;top:0;display:block;border-radius:50%;background:var(--ink);will-change:transform}
body[data-theme=dark] .education-panel,body[data-theme=dark] .light{background:#242521;color:#f2f1eb}
body[data-theme=dark] .education-panel .eyebrow,body[data-theme=dark] .light .eyebrow{color:#b9b9b0}
body[data-theme=dark] .education-panel .text-link{color:#f2f1eb;border-color:#f2f1eb}
body[data-theme=dark] .light .button.secondary{color:#f2f1eb!important;border-color:#f2f1eb60!important}
@media(hover:none),(pointer:coarse){.cursor-trail{display:none}}
@media(prefers-reduced-motion:reduce){.scroll-depth{transform:none!important}.cursor-trail{display:none}}

/* Preserve the wide framing of the supplied project photographs. */
.project-photo img{aspect-ratio:auto;height:auto}.project-photo img[src*="huawei-gala"]{aspect-ratio:4/3;object-fit:cover;object-position:center}

/* Consistent OnePlus framing and captions over the photographs. */
.project-photo,.work-photo,.teaching-feature{position:relative;overflow:hidden}
.project-photo img,.project-photo img[src*="huawei-gala"],.work-photo .work-image,.teaching-feature .teaching-wide{width:100%;height:auto!important;aspect-ratio:6000/3368;object-fit:cover;object-position:center;margin:0}
.project-photo .project-caption,.photo-label{position:absolute;top:16px;right:16px;max-width:calc(100% - 32px);padding:14px 18px;background:rgb(0 0 0 / 50%);color:#fff;text-align:right;pointer-events:none}
.project-photo .project-caption h3,.photo-label h3{font-size:clamp(16px,1.6vw,25px);line-height:1.2;margin:0 0 6px;color:#fff}
.project-photo .project-caption p,.photo-label p{font-size:12px;line-height:1.4;margin:0;color:#fff}
.teaching-feature{margin:0}.work-photo{margin-bottom:20px}
@media(max-width:600px){.project-photo .project-caption,.photo-label{top:10px;right:10px;max-width:calc(100% - 20px);padding:10px 12px}.project-photo .project-caption p,.photo-label p{font-size:10px}}
/* Discreet text-only image captions. */
.project-photo .project-caption,.photo-label{background:none;padding:0;top:13px;right:15px;text-shadow:0 1px 4px rgb(0 0 0 / 80%)}
.project-photo .project-caption h3,.photo-label h3{font-size:12px;font-weight:400;line-height:1.35;letter-spacing:0;margin:0 0 3px;color:rgb(255 255 255 / 90%)}
.project-photo .project-caption p,.photo-label p{font-size:10px;line-height:1.35;color:rgb(255 255 255 / 75%)}
@media(max-width:600px){.project-photo .project-caption,.photo-label{top:10px;right:11px;padding:0}.project-photo .project-caption h3,.photo-label h3{font-size:11px}.project-photo .project-caption p,.photo-label p{font-size:9px}}
/* Bottom-left placement for photo captions. */
.project-photo .project-caption,.photo-label{top:auto;right:auto;bottom:13px;left:15px;text-align:left}
@media(max-width:600px){.project-photo .project-caption,.photo-label{top:auto;right:auto;bottom:10px;left:11px}}
/* Half-transparent caption text. */
.project-photo .project-caption h3,.project-photo .project-caption p,.photo-label h3,.photo-label p{color:rgb(255 255 255 / 50%);text-shadow:none}
/* Reveal captions gently on hover or keyboard focus. */
@media(hover:hover) and (pointer:fine){
 .project-photo .project-caption,.work-photo .photo-label,.teaching-feature .photo-label{opacity:0;transform:translateY(-10px);transition:opacity .25s ease,transform .3s ease}
 .feature-project:hover .project-caption,.feature-project:focus-visible .project-caption,.work-photo:hover .photo-label,.work-photo:focus .photo-label,.teaching-feature:hover .photo-label,.teaching-feature:focus .photo-label{opacity:1;transform:translateY(0)}
}

/* Edge-to-edge photography collage, in supplied reading order. */
.photography-collage{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;margin:0;border:0}
.collage-photo{position:relative;overflow:hidden;min-width:0;margin:0;padding:0;border:0}
.collage-photo img{display:block;width:100%;height:100%;aspect-ratio:2/3;object-fit:cover;object-position:center}
.collage-photo:nth-child(7){grid-column:1/-1}
.collage-photo:nth-child(7) img{aspect-ratio:3/2;height:auto}
.collage-photo:focus-visible{outline:2px solid #fff;outline-offset:-3px}
@media(hover:hover) and (pointer:fine){
 .collage-photo .photo-label{opacity:0;transform:translateY(-10px);transition:opacity .25s ease,transform .3s ease}
 .collage-photo:hover .photo-label,.collage-photo:focus-visible .photo-label{opacity:1;transform:translateY(0)}
}
@media(max-width:600px){.photography-collage{grid-template-columns:repeat(2,minmax(0,1fr))}}
/* Continuous project collage without gaps or staggered spacing. */
.feature-grid{gap:0}
.feature-project,.feature-project:nth-child(even){padding:0;margin:0}
.feature-grid .project-photo{border:0;border-radius:0;transform:none}
.feature-grid .project-arrow{display:none}
body:not(.editorial-home) .grid:has(.work-photo){gap:0}
.grid:has(.work-photo)>article:has(.work-photo){margin:0;padding:0;position:relative}
.grid:has(.work-photo) .work-photo{margin:0;border:0;border-radius:0}
.grid:has(.work-photo)>article:has(.work-photo)>p{padding:14px 18px;margin:0}