@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+SC:wght@400;500;600;700;800&display=swap');
:root{--bg:#111413;--text:#f2f2eb;--muted:#969b94;--lime:#d9ed96}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:90px}body{margin:0;background:var(--bg);color:var(--text);font-family:'Noto Sans SC',sans-serif}a{color:inherit;text-decoration:none}button{font:inherit;cursor:pointer}header{height:90px;padding:0 5%;display:flex;align-items:center;justify-content:space-between;background:#111413}.logo{font-size:25px;font-weight:700;letter-spacing:2px;display:flex;align-items:center;gap:18px}.logo span{font-size:9px;font-weight:400;letter-spacing:2px;color:#acb1aa}nav{display:flex;gap:42px;font-size:13px}nav a:hover{color:var(--lime)}.hero{height:min(760px,85vh);min-height:540px;position:relative;margin:0 22px;overflow:hidden}.hero>img{width:100%;height:100%;object-fit:cover;filter:brightness(.7) saturate(.65)}.shade{position:absolute;inset:0;background:linear-gradient(90deg,#08120dd9,transparent 85%),linear-gradient(0deg,#08110a80,transparent 40%)}.hero-copy{position:absolute;top:14%;left:6%}.eyebrow{font-size:10px;letter-spacing:2.7px;font-weight:500}.hero h1{font-size:clamp(55px,6.6vw,96px);line-height:1.23;letter-spacing:-3px;margin:30px 0 22px;font-weight:600}.intro{font-size:14px;line-height:2;color:#ccd1c5}.watch{display:inline-flex;align-items:center;gap:15px;margin-top:30px;font-size:13px}.watch span{display:grid;place-items:center;border:1px solid #ffffff65;border-radius:50%;width:44px;height:44px;font-size:24px}.watch:hover span{background:var(--lime);color:#111}.hero-bottom{position:absolute;bottom:30px;left:6%;right:4%;display:flex;justify-content:space-between;font-size:10px;letter-spacing:2px;color:#c7cec2}.vertical{position:absolute;right:30px;top:42%;writing-mode:vertical-rl;letter-spacing:3px;font-size:9px;color:#c1c9ba}.works{padding:100px 7% 90px}.section-top{display:flex;align-items:end;justify-content:space-between}.accent{color:var(--lime)}h2{font-size:37px;font-weight:500;letter-spacing:-1.5px;line-height:1.5;margin:20px 0}h2 span{color:var(--lime)}.muted{color:var(--muted);font-size:13px;line-height:2}.filterbar{display:flex;justify-content:space-between;align-items:center;margin:35px 0 30px;border-bottom:1px solid #ffffff17;padding-bottom:20px}.filters{display:flex;gap:28px}.filters button{border:0;background:none;color:var(--muted);padding:8px 0;font-size:12px}.filters button.active{color:var(--lime)}small{font-size:9px;margin-left:6px}.demo,.note{font-size:10px;color:#81877f}.work-group-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px 22px;align-items:start}.card{display:block;text-align:left;background:none;border:0;color:inherit;padding:0;width:100%}.cover{aspect-ratio:16/10;position:relative;overflow:hidden;background:#232a23}.cover img{width:100%;height:100%;object-fit:cover;transition:transform .6s;filter:none}.card:hover img{transform:scale(1.045);filter:none}.play{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:50px;height:50px;display:grid;place-items:center;border:1px solid #ffffff8a;border-radius:50%;background:#0003;font-size:14px;padding-left:3px;transition:.2s}.card:hover .play{background:var(--lime);color:#131713;border-color:var(--lime)}.time{position:absolute;bottom:16px;right:16px;font-size:10px;background:#0007;padding:4px 8px;letter-spacing:1px}.card-title{display:flex;align-items:center;justify-content:space-between;margin:16px 0 6px}.card h3{font-size:18px;font-weight:500;margin:0}.card-title span{color:#aab1a2}.meta{font-size:10px;color:#969d93;letter-spacing:1px}.about{padding:80px 7% 95px;border-top:1px solid #ffffff17;display:grid;grid-template-columns:1fr 1fr;gap:70px;background:#151916}.about h2{font-size:40px}.about-main{font-size:21px;line-height:1.7;margin-top:42px}.tags{display:flex;gap:10px;margin-top:30px}.tags span{border:1px solid #ffffff26;padding:8px 15px;font-size:11px;color:#b5bcae}.contact{padding:90px 7%;background:var(--lime);color:#192016;position:relative}.contact h2{font-size:56px;line-height:1.35;margin:25px 0}.contact h2 span{display:inline-block;color:#192016;margin-left:45px}.contact>p:not(.eyebrow){font-size:13px}.contact button{margin-top:25px;color:#eef2e5;background:#1b2418;padding:15px 23px;border:0;font-size:12px}.contact button span{margin-left:40px}.contact .note{color:#48563b}footer{padding:35px 7%;display:flex;justify-content:space-between;align-items:center}footer>span,footer>a:last-child{font-size:10px;color:var(--muted)}dialog{background:#151916;color:var(--text);border:1px solid #ffffff20;padding:0;max-width:940px;width:90%;max-height:90vh}dialog::backdrop{background:#000d;backdrop-filter:blur(8px)}dialog video{width:100%;display:block;background:#000;max-height:58vh}#close{position:absolute;right:10px;top:10px;border:0;border-radius:50%;width:35px;height:35px;background:#111c;color:white;z-index:2}.dialog-copy{padding:20px 28px}.dialog-copy h3{font-weight:500}.dialog-copy>p{font-size:12px;line-height:1.8}button:focus-visible,a:focus-visible{outline:2px solid var(--lime);outline-offset:5px}@media(max-width:700px){header{height:75px;padding:0 6%}.logo span{display:none}nav{gap:22px;font-size:12px}.hero{margin:0 10px;min-height:590px;height:80vh}.hero-copy{left:7%;top:15%}.hero h1{font-size:58px}.vertical{display:none}.hero-bottom span:first-child{display:none}.hero-bottom{bottom:25px}.works{padding:65px 6%}.section-top{display:block}.section-top>.muted{display:none}h2{font-size:28px}.filters{gap:20px}.demo{display:none}.filterbar{margin:25px 0}.work-group-grid{grid-template-columns:1fr;gap:30px}.about{padding:55px 6%;grid-template-columns:1fr;gap:0}.about h2{font-size:32px}.about-main{margin-top:15px;font-size:19px}.contact{padding:60px 6%}.contact h2{font-size:40px}.contact h2 span{margin-left:15px}footer{padding:25px 6%;gap:20px}footer>.logo{font-size:20px}footer>span{font-size:8px}.cover{aspect-ratio:16/10}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}

.email-link{display:inline-flex;gap:40px;align-items:center;margin-top:25px;background:#1b2418;color:#eef2e5;padding:15px 23px;font-size:16px}.email-link:hover{background:#33452c}.empty-state{grid-column:1/-1;padding:70px 20px;text-align:center;border:1px solid #ffffff17;color:var(--muted);font-size:14px}@media(max-width:700px){.filters{flex-wrap:wrap;gap:12px 20px}.about h2{font-size:30px}.email-link{font-size:15px}}

.cover.portrait{aspect-ratio:9/16}.cover.portrait img{object-fit:cover;background:#090c0a}.cover{aspect-ratio:16/9}dialog video{height:auto;max-height:66vh;object-fit:contain}.dialog-copy{padding:14px 28px}

.card{align-self:start}.card h3{font-size:15px;line-height:1.65}.card-title{align-items:flex-start;gap:10px}.work-group-grid{grid-auto-flow:row}dialog.portrait-player{width:min(92vw,440px)}dialog.portrait-player video{width:100%;height:66vh;object-fit:contain} @media(min-width:701px) and (max-width:1000px){.work-group-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}

#grid{display:flex;flex-direction:column;gap:48px}.work-group{min-width:0;width:100%}.work-group-title{margin:0 0 22px;font-size:13px;font-weight:500;color:#aeb6a6;letter-spacing:2px}.work-group-grid .card h3{font-size:16px}
