:root{--carbon:#101211;--rail:#252925;--paper:#f4f5f0;--signal:#dfff3f;--quiet:#a9ada6;--rule:#424740;--max:1440px;--gutter:clamp(20px,4vw,64px)}
*{box-sizing:border-box}html{scroll-behavior:smooth;background:var(--carbon)}body{margin:0;background:var(--carbon);color:var(--paper);font-family:"Avenir Next",Avenir,"PingFang HK",sans-serif;font-size:16px;line-height:1.5}img{display:block;width:100%;height:100%;object-fit:cover}a{color:inherit;text-decoration:none}button{font:inherit}a:focus-visible,button:focus-visible{outline:3px solid var(--signal);outline-offset:4px}.shell{width:min(var(--max),100%);margin:auto;padding-inline:var(--gutter)}
.site-head{height:92px;display:grid;grid-template-columns:180px 1fr auto auto;align-items:center;gap:32px;padding:0 var(--gutter);border-bottom:1px solid var(--rule);position:relative;z-index:3}.wordmark{font-size:31px;font-weight:900;letter-spacing:-.08em}.wordmark span{color:var(--signal)}.head-role{font-size:12px;color:var(--quiet);line-height:1.3}.site-head nav{display:flex;gap:26px;font-size:13px}.site-head nav a:hover{color:var(--signal)}.availability{padding:12px 17px;background:var(--paper);color:var(--carbon);border-radius:100px;font-size:12px;font-weight:700}.availability:before{content:"";display:inline-block;width:7px;height:7px;background:var(--signal);border-radius:50%;margin-right:8px;box-shadow:0 0 0 2px var(--carbon)}
.hero{min-height:700px;display:grid;grid-template-columns:minmax(290px,.72fr) minmax(560px,1.28fr);gap:clamp(50px,7vw,110px);align-items:center;padding-block:76px 96px}.hero-copy{align-self:stretch;display:flex;flex-direction:column;justify-content:flex-end;padding-bottom:45px}.role-line{max-width:390px;color:var(--quiet);font-size:15px}.hero h1{margin:28px 0 24px;font-size:clamp(58px,7vw,106px);line-height:.86;letter-spacing:-.07em}.hero-note{max-width:420px;color:var(--quiet)}.text-link{width:max-content;margin-top:34px;border-bottom:1px solid var(--paper);padding-bottom:4px;font-weight:600}.text-link:hover{border-color:var(--signal);color:var(--signal)}
.hero-sequence{position:relative;display:grid;grid-template-columns:1.5fr .8fr;grid-template-rows:auto 1fr 1fr auto;gap:10px;height:560px;padding:20px;background:var(--rail);overflow:hidden}.sequence-meta{grid-column:1/-1;display:flex;justify-content:space-between;color:var(--quiet);font:12px/1.2 "Avenir Next Condensed",sans-serif;letter-spacing:.08em}.shot{position:relative;margin:0;overflow:hidden;background:#050505}.shot figcaption{position:absolute;left:10px;bottom:8px;padding:5px 8px;background:rgba(16,18,17,.82);font-size:10px}.shot-main{grid-row:2/4;min-height:0}.shot-food,.shot-beauty{min-height:0}.track-scale{grid-column:1/-1;display:flex;justify-content:space-between;color:#777d75;font:10px "Avenir Next Condensed",sans-serif}.playhead{position:absolute;left:62%;top:44px;bottom:28px;width:1px;background:var(--signal);z-index:2}.playhead span{display:block;width:13px;height:13px;margin-left:-6px;background:var(--signal);border-radius:50%}
.featured,.browse,.collections,.approach{padding-block:100px;border-top:1px solid var(--rule)}.section-intro{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:end;margin-bottom:50px}.section-intro h2,.approach h2{margin:0;font-size:clamp(42px,5vw,72px);line-height:.95;letter-spacing:-.055em}.section-intro p,.approach-head>p{margin:0;max-width:520px;color:var(--quiet)}
.featured-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:18px}.work-card{position:relative;background:var(--rail);border:0;color:inherit;text-align:left;padding:0;cursor:pointer;overflow:hidden}.work-card .media{display:block;aspect-ratio:16/10;overflow:hidden;background:#000}.work-card.portrait .media{aspect-ratio:4/5}.work-card img{transition:transform .45s cubic-bezier(.2,.8,.2,1)}.work-card:hover img{transform:scale(1.025)}.work-card .card-copy{display:grid;grid-template-columns:1fr auto;gap:12px;padding:15px 16px 18px;border-top:1px solid var(--rule)}.work-card h3{margin:0;font-size:18px;letter-spacing:-.02em}.work-card p{margin:4px 0 0;color:var(--quiet);font-size:12px}.work-card time{font:11px "Avenir Next Condensed",sans-serif;color:var(--quiet)}.work-card .lock{position:absolute;top:12px;right:12px;padding:7px 9px;background:var(--paper);color:var(--carbon);font-size:10px;font-weight:700}.featured-grid .work-card:nth-child(1){grid-column:span 7}.featured-grid .work-card:nth-child(2){grid-column:span 5}.featured-grid .work-card:nth-child(3){grid-column:span 4}.featured-grid .work-card:nth-child(4){grid-column:span 5}.featured-grid .work-card:nth-child(5){grid-column:span 3}.featured-grid .work-card:nth-child(n+6){grid-column:span 4}
.browse-intro{margin-bottom:30px}.browse-intro p{text-align:right}.filter-rail{display:flex;gap:8px;overflow:auto;padding-bottom:20px}.filter-rail button{white-space:nowrap;border:1px solid var(--rule);background:transparent;color:var(--quiet);padding:10px 15px;border-radius:100px;cursor:pointer}.filter-rail button[aria-pressed="true"]{background:var(--signal);border-color:var(--signal);color:var(--carbon);font-weight:700}.work-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--rule);border:1px solid var(--rule)}.work-grid .work-card{background:var(--carbon)}.work-grid .work-card .media{aspect-ratio:16/11}.work-grid .work-card.portrait .media{aspect-ratio:4/5}.work-grid .work-card[hidden]{display:none}
.collection-list{border-top:1px solid var(--rule)}.collection-row{display:grid;grid-template-columns:64px 1.1fr 1fr 150px;gap:30px;align-items:center;padding:24px 0;border-bottom:1px solid var(--rule);transition:background .2s}.collection-row:hover{background:var(--rail)}.collection-row .index{font:13px "Avenir Next Condensed",sans-serif;color:var(--quiet)}.collection-row h3{margin:0;font-size:clamp(23px,3vw,40px);letter-spacing:-.04em}.collection-row p{margin:0;color:var(--quiet)}.collection-row .collection-count{text-align:right;color:var(--quiet);font-size:13px}
.approach{display:grid;grid-template-columns:.72fr 1.28fr;gap:80px}.approach-head{position:sticky;top:36px;align-self:start}.approach-head>p{margin-top:24px}.approach-track{border-top:1px solid var(--rule)}.approach-track article{display:grid;grid-template-columns:46px 1fr;column-gap:22px;padding:30px 0;border-bottom:1px solid var(--rule)}.approach-track article>span{grid-row:1/5;color:var(--signal);font:14px "Avenir Next Condensed",sans-serif}.approach-track h3{margin:0;font-size:25px}.approach-track strong{margin-top:4px}.approach-track p{margin:14px 0 0;color:var(--quiet);max-width:570px}.approach-track small{margin-top:16px;color:#737871}
.case-study{background:var(--paper);color:var(--carbon);padding-block:54px 74px;margin-top:40px}.case-status{display:flex;justify-content:space-between;border-bottom:1px solid #b9bcb5;padding-bottom:16px;font:11px "Avenir Next Condensed",sans-serif;letter-spacing:.08em}.case-status span:last-child{color:#777}.case-title-row{display:grid;grid-template-columns:1.15fr .85fr;gap:80px;padding:55px 0}.case-title-row p{margin:0 0 14px}.case-title-row h2{font-size:clamp(48px,7vw,100px);line-height:.88;letter-spacing:-.07em;margin:0}.case-summary{align-self:end!important;color:#565b55;max-width:490px}.case-frames{display:grid;grid-template-columns:1.55fr .45fr;gap:12px;height:490px}.case-frames figure{margin:0;position:relative;overflow:hidden;background:#000}.case-frames figcaption{position:absolute;bottom:8px;left:9px;background:rgba(244,245,240,.92);padding:5px 8px;font:10px "Avenir Next Condensed",sans-serif}.case-tall img{object-fit:contain}.case-facts{display:grid;grid-template-columns:1fr 1fr;border-block:1px solid #b9bcb5;margin-top:42px}.case-facts div{padding:22px 0}.case-facts div+div{border-left:1px solid #b9bcb5;padding-left:30px}.case-facts span,.efficiency>span{display:block;color:#777;font-size:12px;margin-bottom:5px}.case-facts strong{text-transform:uppercase}.workflow{display:grid;grid-template-columns:1fr 70px 1fr 70px 1fr;align-items:start;padding:48px 0}.workflow div span{font-size:28px;font-weight:800;letter-spacing:-.04em}.workflow div p{color:#666;max-width:300px}.workflow i{height:1px;background:#9da198;margin-top:20px;position:relative}.workflow i:after{content:"";position:absolute;right:0;top:-3px;width:7px;height:7px;border-radius:50%;background:var(--signal);border:1px solid var(--carbon)}.efficiency{display:grid;grid-template-columns:.6fr .55fr 1fr;gap:30px;align-items:end;background:var(--carbon);color:var(--paper);padding:34px}.efficiency strong{font-size:64px;line-height:1;color:var(--signal);letter-spacing:-.05em}.efficiency p{margin:0;color:var(--quiet);font-size:13px}
.contact{display:grid;grid-template-columns:1.2fr .8fr;gap:80px;padding-block:120px}.contact p{color:var(--quiet)}.contact h2{max-width:830px;margin:20px 0 0;font-size:clamp(44px,6vw,84px);line-height:.95;letter-spacing:-.06em}.contact-actions{display:flex;flex-direction:column;justify-content:flex-end;align-items:flex-start;gap:24px}.cta{padding:16px 22px;border-radius:100px;background:var(--signal);color:var(--carbon);font-weight:800}.contact-actions span{color:var(--quiet);font-size:13px}.site-foot{display:flex;justify-content:space-between;padding:24px var(--gutter);border-top:1px solid var(--rule);color:var(--quiet);font-size:12px}
dialog{width:min(1120px,calc(100% - 28px));max-height:92vh;background:var(--carbon);color:var(--paper);border:1px solid var(--rule);padding:0}dialog::backdrop{background:rgba(0,0,0,.8)}.dialog-close{position:absolute;right:15px;top:15px;z-index:2;background:var(--signal);color:var(--carbon);border:0;border-radius:100px;padding:10px 15px;font-weight:700;cursor:pointer}#film-stage{background:#000;display:grid;place-items:center;min-height:500px}#film-stage video,#film-stage iframe{width:100%;height:min(62vw,630px);border:0;object-fit:contain}.dialog-copy{padding:26px 30px 32px}.dialog-copy p{color:var(--quiet)}.dialog-copy h2{font-size:38px;margin:6px 0}.dialog-copy #dialog-project{font-size:12px;margin:0}.dialog-copy #dialog-desc{max-width:720px}.dialog-copy #dialog-meta{font:12px "Avenir Next Condensed",sans-serif;color:var(--quiet)}
@media(max-width:900px){.site-head{grid-template-columns:1fr auto;height:76px}.head-role,.site-head nav{display:none}.availability{font-size:0}.availability:after{content:"WhatsApp";font-size:12px}.hero{grid-template-columns:1fr;padding-block:55px;gap:45px}.hero-copy{padding-bottom:0}.hero-sequence{height:520px}.section-intro,.approach,.case-title-row,.contact{grid-template-columns:1fr}.featured-grid .work-card,.featured-grid .work-card:nth-child(n){grid-column:span 6}.work-grid{grid-template-columns:repeat(2,1fr)}.collection-row{grid-template-columns:42px 1fr auto}.collection-row p{display:none}.approach{gap:40px}.approach-head{position:static}.case-frames{grid-template-columns:1fr .45fr;height:400px}.workflow{grid-template-columns:1fr;gap:26px}.workflow i{width:1px;height:28px;margin:0 0 0 8px}.efficiency{grid-template-columns:1fr 1fr}.efficiency p{grid-column:1/-1}.contact{gap:50px}.browse-intro p{text-align:left}}
@media(max-width:560px){:root{--gutter:18px}.site-head{padding-inline:18px}.hero{min-height:auto;padding-top:42px}.hero h1{font-size:60px}.role-line{font-size:13px}.hero-sequence{height:440px;padding:12px;grid-template-columns:1.25fr .75fr}.featured,.browse,.collections,.approach{padding-block:72px}.section-intro{grid-template-columns:1fr;gap:18px;margin-bottom:34px}.section-intro h2,.approach h2{font-size:47px}.featured-grid{gap:10px}.featured-grid .work-card,.featured-grid .work-card:nth-child(n){grid-column:1/-1}.featured-grid .work-card:nth-child(3),.featured-grid .work-card:nth-child(5){grid-column:span 6}.featured-grid .work-card:nth-child(3) .media,.featured-grid .work-card:nth-child(5) .media{aspect-ratio:4/5}.work-grid{grid-template-columns:1fr 1fr}.work-card .card-copy{grid-template-columns:1fr;padding:12px}.work-card h3{font-size:15px}.work-card time{display:none}.collection-row{gap:12px;padding:20px 0}.collection-row h3{font-size:25px}.collection-row .collection-count{font-size:11px}.approach-track article{grid-template-columns:36px 1fr}.case-study{padding-inline:18px}.case-status{gap:20px}.case-title-row{gap:30px;padding:38px 0}.case-title-row h2{font-size:54px}.case-frames{height:350px;grid-template-columns:1fr .5fr}.case-facts{grid-template-columns:1fr}.case-facts div+div{border-left:0;border-top:1px solid #b9bcb5;padding-left:0}.efficiency{padding:25px}.efficiency strong{font-size:50px}.contact{padding-block:85px}.contact h2{font-size:48px}.site-foot{gap:20px;flex-wrap:wrap}#film-stage{min-height:260px}.dialog-copy{padding:22px 18px}.dialog-copy h2{font-size:28px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.work-card img{transition:none}}

/* C V2.1 — structured editorial film system */
.hero h1{font-size:clamp(58px,6vw,92px);line-height:.9;letter-spacing:-.065em}
.hero-sequence{display:flex;flex-direction:column;height:auto;min-height:560px}
.hero-track{display:flex;align-items:center;gap:12px;flex:1;min-height:0;padding:14px 0}
.hero-frame{position:relative;display:flex;flex-direction:column;min-width:0;padding:0;border:0;background:#050505;color:var(--paper);text-align:left;cursor:pointer;overflow:hidden}
.hero-frame.landscape{flex:1 1 66%}.hero-frame.vertical{flex:0 1 17%}
.hero-media{display:block;width:100%;overflow:hidden;background:#000}.hero-frame.landscape .hero-media{aspect-ratio:16/9}.hero-frame.vertical .hero-media{aspect-ratio:9/16}
.hero-frame img{object-fit:contain;transition:opacity .25s}.hero-frame:hover img{opacity:.72}
.hero-label{display:block;width:100%;padding:10px 11px 12px;border-top:1px solid var(--rule);font-size:11px;font-weight:700;line-height:1.25}
.hero-label small{display:block;margin-bottom:4px;color:var(--quiet);font:9px "Avenir Next Condensed",sans-serif;letter-spacing:.08em;text-transform:uppercase}
.hero-frame i{position:absolute;right:9px;top:9px;display:grid;place-items:center;width:36px;height:36px;border-radius:50%;background:var(--signal);color:var(--carbon);font-size:9px;font-style:normal;font-weight:800;text-transform:uppercase}
.hero-sequence .playhead{left:44%;top:42px;bottom:28px;pointer-events:none}.hero-sequence .track-scale{display:flex}

.featured-groups,.browse-groups,.collection-format-groups{display:grid;gap:54px}
.film-group{display:grid;gap:18px}.film-group-head{display:flex;justify-content:space-between;align-items:end;gap:30px;padding-bottom:12px;border-bottom:1px solid var(--rule)}
.film-group-head h3{margin:0;font-size:24px;letter-spacing:-.035em}.film-group-head p{max-width:470px;margin:0;color:var(--quiet);font-size:12px;text-align:right}
.structured-grid{display:grid;gap:18px}.landscape-group .structured-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.vertical-group .structured-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
.work-card{display:flex;flex-direction:column;min-width:0;border:1px solid var(--rule)}
.work-card:disabled{cursor:not-allowed;color:inherit}.work-card:disabled img{filter:saturate(.6);opacity:.72}.work-card:disabled:hover img{transform:none}
.work-card .media,.work-grid .work-card .media{display:grid;place-items:center;background:#050505;overflow:hidden}
.work-card.landscape .media,.work-grid .work-card.landscape .media{aspect-ratio:16/9}.work-card.portrait .media,.work-grid .work-card.portrait .media{aspect-ratio:9/16}
.work-card .media img,.work-grid .work-card .media img{width:100%;height:100%;object-fit:contain}
.work-card .card-copy{margin-top:auto}.work-card .card-copy small{display:block;margin-bottom:5px;color:var(--signal);font:9px "Avenir Next Condensed",sans-serif;letter-spacing:.07em;text-transform:uppercase}
.card-tags{display:flex;flex-wrap:wrap;gap:6px;padding:0 16px 16px}.card-tags em{border:1px solid var(--rule);border-radius:100px;padding:4px 7px;color:var(--quiet);font-size:9px;font-style:normal}
.browse-groups{padding-top:12px}.browse-groups:empty{display:none}
.collection-row .collection-count b{margin-left:8px;color:var(--signal)}

main[data-page="collection"]{min-height:70vh}
.collection-hero{padding-block:54px 94px}.back-link{display:inline-block;margin-bottom:76px;border-bottom:1px solid var(--quiet);padding-bottom:4px;color:var(--quiet);font-size:13px}.back-link:hover{color:var(--signal);border-color:var(--signal)}
.collection-title-row{display:grid;grid-template-columns:1.22fr .78fr;gap:80px;align-items:end}.collection-title-row>div>p:first-child{margin:0 0 16px;color:var(--signal);font-size:12px;text-transform:uppercase;letter-spacing:.07em}
.collection-title-row h1{max-width:920px;margin:0;font-size:clamp(64px,9vw,136px);line-height:.82;letter-spacing:-.075em}.collection-title-row>div:last-child>p{margin:22px 0 0;color:var(--quiet);font-size:17px}
.collection-status{display:inline-block;border:1px solid var(--rule);padding:8px 10px;color:var(--quiet);font:10px "Avenir Next Condensed",sans-serif;letter-spacing:.08em}
.collection-sections{display:grid;gap:0}.collection-film-section{padding-block:80px;border-top:1px solid var(--rule)}.collection-section-head{display:grid;grid-template-columns:52px 1fr;gap:20px;margin-bottom:44px}.collection-section-head>span{color:var(--signal);font:13px "Avenir Next Condensed",sans-serif}.collection-section-head h2{margin:0;font-size:clamp(42px,5vw,72px);line-height:.95;letter-spacing:-.055em}.collection-section-head p{max-width:620px;margin:15px 0 0;color:var(--quiet)}
.collection-film-section .film-group-head h3{font-size:17px}.collection-film-section .film-group-head p{font-size:11px}
.project-stills,.next-projects{padding-block:90px;border-top:1px solid var(--rule)}.stills-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.stills-grid figure{margin:0;background:#050505;border:1px solid var(--rule)}.stills-grid img{aspect-ratio:16/9;object-fit:contain}.stills-grid figcaption{padding:12px 14px;color:var(--quiet);font-size:11px;border-top:1px solid var(--rule)}
.next-project-list{border-top:1px solid var(--rule)}.next-project-list a{display:grid;grid-template-columns:1fr 1fr auto;gap:30px;align-items:center;padding:22px 0;border-bottom:1px solid var(--rule)}.next-project-list a:hover{color:var(--signal)}.next-project-list span{font-size:26px;font-weight:700;letter-spacing:-.035em}.next-project-list small{color:var(--quiet)}
dialog.portrait-dialog #film-stage{min-height:650px}dialog.portrait-dialog #film-stage video,dialog.portrait-dialog #film-stage iframe{width:min(420px,100%);height:min(72vh,760px)}

@media(max-width:900px){
 .hero-sequence{min-height:500px}.hero-track{gap:8px}.hero-frame.landscape{flex-basis:62%}.hero-frame.vertical{flex-basis:19%}.hero-label{font-size:9px}
 .vertical-group .structured-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
 .collection-title-row{grid-template-columns:1fr;gap:40px}.collection-title-row h1{font-size:86px}.collection-title-row>div:last-child{max-width:650px}
}
@media(max-width:560px){
 .hero-sequence{min-height:0;height:auto}.hero-track{display:grid;grid-template-columns:1fr 1fr;align-items:start}.hero-frame.landscape{grid-column:1/-1}.hero-frame.vertical{width:100%}.hero-sequence .playhead{display:none}.hero-label{font-size:10px}
 .featured-groups,.browse-groups,.collection-format-groups{gap:42px}.film-group-head{display:block}.film-group-head p{margin-top:8px;text-align:left}
 .landscape-group .structured-grid{grid-template-columns:1fr}.vertical-group .structured-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
 .work-card .card-copy{display:block}.work-card time{display:block;margin-top:7px}.card-tags{padding:0 11px 12px}.card-tags em{font-size:8px}
 .collection-hero{padding-block:36px 68px}.back-link{margin-bottom:54px}.collection-title-row h1{font-size:58px}.collection-title-row>div:last-child>p{font-size:15px}
 .collection-film-section{padding-block:62px}.collection-section-head{grid-template-columns:34px 1fr;margin-bottom:34px}.collection-section-head h2{font-size:44px}
 .project-stills,.next-projects{padding-block:68px}.stills-grid{grid-template-columns:1fr}.next-project-list a{grid-template-columns:1fr auto}.next-project-list small{grid-column:1/-1;grid-row:2}.next-project-list span{font-size:23px}
 dialog.portrait-dialog #film-stage{min-height:430px}dialog.portrait-dialog #film-stage video,dialog.portrait-dialog #film-stage iframe{height:68vh}
}
