/* Generated player foundation and scoped editorial layout. */
.portfolio-page{--bg:#111210;--panel:#191b18;--ink:#f1f0e9;--muted:#b0b3a9;--line:#383b34;--accent:#fa8050;--gutter:clamp(22px,5vw,88px);color-scheme:dark;font-family:Arial,"Microsoft YaHei","PingFang SC",sans-serif;font-synthesis:none}
.portfolio-page *{box-sizing:border-box}.portfolio-page{scroll-behavior:smooth;scroll-padding-top:88px}.portfolio-page{margin:0;background:var(--bg);color:var(--ink)}.portfolio-page a{color:inherit;text-decoration:none}.portfolio-page button{font:inherit;color:inherit;cursor:pointer}.portfolio-page button:disabled{cursor:default}.portfolio-page button,.portfolio-page a{-webkit-tap-highlight-color:transparent}.portfolio-page button:focus-visible,.portfolio-page a:focus-visible{outline:2px solid var(--accent);outline-offset:6px}.portfolio-page p,.portfolio-page h1,.portfolio-page h2,.portfolio-page h3{margin:0}.portfolio-page button{border:0}.portfolio-page img{display:block;width:100%;height:100%;object-fit:cover}.portfolio-page .site-header{padding:25px var(--gutter);display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--line);gap:24px}.portfolio-page .wordmark{font-size:34px;font-weight:900;letter-spacing:-2px;display:flex;align-items:center;gap:20px}.portfolio-page .wordmark span{font-size:14px;letter-spacing:2px;font-weight:400;padding-left:20px;border-left:1px solid var(--line)}.portfolio-page nav{display:flex;gap:34px;font-size:14px}.portfolio-page nav a:hover{color:var(--accent)}.portfolio-page .opening{padding:44px var(--gutter) 46px;max-width:1800px;margin:auto}.portfolio-page .opening-top,.portfolio-page .opening-bottom{display:flex;justify-content:space-between;align-items:center;gap:24px}.portfolio-page .eyebrow,.portfolio-page .edition{font-size:12px;letter-spacing:.16em;font-weight:600;line-height:1.6}.portfolio-page .eyebrow{color:var(--accent)}.portfolio-page .edition{color:var(--muted)}.portfolio-page h1{font-weight:500;font-size:clamp(50px,6.3vw,100px);line-height:1.3;letter-spacing:-.035em;margin:28px 0 28px}.portfolio-page h1 br{display:none}.portfolio-page h1 span{color:var(--muted);margin-left:.2em}.portfolio-page .opening-bottom{font-size:14px;line-height:1.7}.portfolio-page .opening-bottom p span{color:var(--muted)}.portfolio-page .text-link{border-bottom:1px solid var(--ink);padding:10px 0;display:flex;gap:50px;align-items:center}.portfolio-page .text-link span{color:var(--accent);font-size:22px}.portfolio-page .featured{padding:0 var(--gutter);max-width:1800px;margin:auto}.portfolio-page .featured-button{position:relative;display:block;padding:0;width:100%;background:#1c211c;aspect-ratio:2.15;overflow:hidden;text-align:left}.portfolio-page .featured-button:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,#090b094d 0%,transparent 26%,transparent 42%,#090b09cc 100%)}.portfolio-page .featured-button img{transition:transform .7s;object-position:50% 45%}.portfolio-page .featured-button:hover img{transform:scale(1.025)}.portfolio-page .feature-topline{position:absolute;left:32px;right:32px;top:27px;z-index:1;display:flex;justify-content:space-between;gap:20px;font-size:12px;letter-spacing:.12em;text-shadow:0 1px 6px #000}.portfolio-page .feature-caption{position:absolute;left:32px;right:32px;bottom:30px;z-index:1;display:flex;align-items:flex-end;justify-content:space-between;gap:20px}.portfolio-page .feature-caption h2{font-size:clamp(27px,4vw,58px);font-weight:500;letter-spacing:.01em}.portfolio-page .feature-caption p{font-size:14px;margin-top:12px}.portfolio-page .play-action{display:flex;gap:14px;align-items:center;white-space:nowrap;font-size:14px}.portfolio-page .play-icon{width:55px;height:55px;display:grid;place-items:center;border-radius:50%;background:var(--accent);color:#121410;padding-left:3px;font-size:19px}.portfolio-page .works-section{padding:85px var(--gutter) 88px;max-width:1800px;margin:auto}.portfolio-page .section-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin-bottom:36px}.portfolio-page .section-heading h2{font-size:36px;font-weight:500;margin-top:10px}.portfolio-page .work-count{font-size:14px;color:var(--muted);padding-bottom:4px}.portfolio-page .works-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:46px 28px}.portfolio-page .work-card{min-width:0}.portfolio-page .work-button{display:block;width:100%;text-align:left;background:transparent;padding:0}.portfolio-page .work-image{aspect-ratio:16/9;overflow:hidden;background:var(--panel);position:relative}.portfolio-page .work-image img{transition:transform .5s;object-position:50% 42%}.portfolio-page .work-button:hover img{transform:scale(1.035)}.portfolio-page .work-image .small-play{position:absolute;left:19px;bottom:19px;background:#111c;backdrop-filter:blur(10px);border:1px solid #ffffff55;border-radius:50%;width:42px;height:42px;display:grid;place-items:center;padding-left:3px;font-size:13px}.portfolio-page .film-duration{position:absolute;right:16px;bottom:19px;font-size:12px;padding:7px 10px;background:#111c;letter-spacing:.03em}.portfolio-page .card-meta{padding:20px 0 0;display:flex;gap:18px;align-items:flex-start}.portfolio-page .card-number{color:var(--accent);font-size:12px;padding-top:6px;font-variant-numeric:tabular-nums}.portfolio-page .card-copy{flex:1;min-width:0}.portfolio-page .card-copy h3{font-size:23px;font-weight:500;line-height:1.4}.portfolio-page .card-copy p{font-size:14px;color:var(--muted);line-height:1.6;margin-top:7px}.portfolio-page .card-watch{font-size:14px;line-height:1.6;white-space:nowrap;padding-top:4px;color:var(--muted)}.portfolio-page .work-button:hover .card-watch{color:var(--accent)}.portfolio-page .about{border-top:1px solid var(--line);padding:60px var(--gutter) 68px;background:#171915}.portfolio-page .about-content{display:grid;grid-template-columns:1.15fr 1fr;gap:60px;margin-top:26px}.portfolio-page .about h2{font-size:clamp(29px,3.3vw,50px);font-weight:500;line-height:1.45}.portfolio-page .about-content p{font-size:17px;line-height:1.9;max-width:560px}.portfolio-page .about-content .about-secondary{color:var(--muted);margin-top:20px}.portfolio-page .services{margin-top:47px;display:flex;flex-wrap:wrap;gap:18px 38px;padding-top:25px;border-top:1px solid var(--line);font-size:14px;color:var(--muted)}.portfolio-page footer{padding:32px var(--gutter);display:flex;gap:25px;align-items:center;justify-content:space-between;font-size:14px;color:var(--muted)}.portfolio-page .footer-brand{font-weight:900;letter-spacing:-2px;font-size:32px;color:var(--ink)}.portfolio-page footer p{margin-right:auto}.portfolio-page .skip-link{position:fixed;top:-60px;left:20px;z-index:30;background:var(--ink);color:var(--bg);padding:12px}.portfolio-page .skip-link:focus{top:10px}.portfolio-page dialog{width:min(1240px,94vw);max-height:94dvh;padding:24px;background:#161815;border:1px solid #494d43;color:var(--ink);overflow:auto}.portfolio-page dialog::backdrop{background:#050605ed;backdrop-filter:blur(8px)}.portfolio-page:has(dialog[open]){overflow:hidden}.portfolio-page .player-heading{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:20px}.portfolio-page .player-heading h2{font-size:24px;font-weight:500;margin-top:6px;line-height:1.35}.portfolio-page .close-player{padding:10px 2px 10px 14px;background:transparent;white-space:nowrap;font-size:14px}.portfolio-page .close-player span{font-size:28px;vertical-align:-2px;margin-left:12px}.portfolio-page .video-stage{position:relative;background:#000;display:flex;align-items:center;justify-content:center;min-height:180px}.portfolio-page video{display:block;width:100%;max-height:65dvh;background:#000;aspect-ratio:16/9;object-fit:contain}.portfolio-page .playback-message{position:absolute;left:16px;right:16px;top:18px;padding:12px 16px;background:#111e;font-size:14px;line-height:1.6;pointer-events:none}.portfolio-page .player-bottom{display:flex;justify-content:space-between;align-items:center;gap:18px;padding:16px 0 0;font-size:14px;color:var(--muted)}.portfolio-page #retry-playback{background:var(--accent);color:#111;padding:8px 16px;white-space:nowrap}.portfolio-page .film-list{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px}.portfolio-page .film-list:empty{display:none}.portfolio-page .film-list button{padding:11px 14px;border:1px solid var(--line);background:transparent;text-align:left;line-height:1.5;font-size:14px}.portfolio-page .film-list button[aria-pressed=true]{border-color:var(--accent);color:var(--accent)}.portfolio-page .noscript{padding:30px;font-size:18px}.portfolio-page button[hidden],.portfolio-page p[hidden]{display:none}
@media(min-width:1600px){.portfolio-page .site-header,.portfolio-page footer,.portfolio-page .about{padding-left:max(var(--gutter),calc((100vw - 1624px)/2));padding-right:max(var(--gutter),calc((100vw - 1624px)/2))}}
@media(max-width:760px){.portfolio-page{scroll-padding-top:22px}.portfolio-page .site-header{padding-top:20px;padding-bottom:20px;gap:12px}.portfolio-page .wordmark{font-size:29px;gap:11px}.portfolio-page .wordmark span{font-size:12px;letter-spacing:1px;padding-left:11px}.portfolio-page nav{gap:18px;font-size:13px}.portfolio-page .opening{padding-top:32px;padding-bottom:30px}.portfolio-page .edition{font-size:10px;letter-spacing:.1em}.portfolio-page .eyebrow{font-size:11px}.portfolio-page h1{font-size:clamp(44px,9.8vw,72px);margin:24px 0;line-height:1.28}.portfolio-page h1 br{display:block}.portfolio-page h1 span{margin-left:0}.portfolio-page .opening-bottom{font-size:13px}.portfolio-page .text-link{gap:24px}.portfolio-page .featured{padding:0}.portfolio-page .featured-button{aspect-ratio:1.25}.portfolio-page .feature-topline{left:23px;right:23px;top:20px;font-size:10px}.portfolio-page .feature-caption{left:23px;right:23px;bottom:25px}.portfolio-page .feature-caption h2{font-size:32px}.portfolio-page .feature-caption p{font-size:12px;margin-top:8px}.portfolio-page .play-action>span:first-child{display:none}.portfolio-page .play-icon{width:48px;height:48px;font-size:17px}.portfolio-page .works-section{padding-top:51px;padding-bottom:54px}.portfolio-page .section-heading{margin-bottom:26px}.portfolio-page .section-heading h2{font-size:29px}.portfolio-page .work-count{font-size:12px;line-height:1.8;text-align:right;max-width:105px}.portfolio-page .works-grid{grid-template-columns:1fr;gap:32px}.portfolio-page .card-meta{padding-top:15px;gap:12px}.portfolio-page .card-copy h3{font-size:21px}.portfolio-page .card-copy p{font-size:13px}.portfolio-page .card-watch{font-size:13px}.portfolio-page .about{padding-top:42px;padding-bottom:42px}.portfolio-page .about-content{grid-template-columns:1fr;gap:25px;margin-top:18px}.portfolio-page .about h2{font-size:31px}.portfolio-page .about-content p{font-size:16px}.portfolio-page .services{gap:18px 24px;margin-top:28px;font-size:13px}.portfolio-page footer{flex-wrap:wrap;gap:15px;font-size:12px}.portfolio-page footer p{width:calc(100% - 110px);margin-right:0}.portfolio-page footer a{margin-left:auto}.portfolio-page dialog{padding:16px;width:calc(100vw - 20px);max-height:96dvh}.portfolio-page .player-heading h2{font-size:20px}.portfolio-page .player-heading{align-items:flex-start;gap:8px}.portfolio-page .close-player{font-size:13px;padding-top:0}.portfolio-page .close-player span{margin-left:6px}.portfolio-page .video-stage{min-height:120px}.portfolio-page video{max-height:58dvh}.portfolio-page .film-list{gap:8px}.portfolio-page .film-list button{font-size:13px;padding:10px}.portfolio-page .player-bottom{font-size:13px}}
@media(prefers-reduced-motion:reduce){.portfolio-page{scroll-behavior:auto}.portfolio-page *,.portfolio-page *:before,.portfolio-page *:after{transition:none!important}}
.portfolio-page .work-count{display:flex;gap:10px;flex-wrap:wrap}.portfolio-page .work-count span{white-space:nowrap}.portfolio-page .work-count span+span::before{content:"/";margin-right:10px}
@media(max-width:760px){.portfolio-page .work-count{flex-direction:column;gap:0;max-width:none}.portfolio-page .work-count span+span::before{content:none}}

/* Project details share the existing film viewer and visual language. */
.portfolio-page dialog{width:min(1240px,94vw);padding:0 24px 28px}
.portfolio-page .player-heading{position:sticky;top:0;z-index:2;margin:0;padding:22px 0;background:#161815;border-bottom:1px solid var(--line)}
.portfolio-page .project-layout{padding-top:24px}
.portfolio-page .project-media,.portfolio-page .project-details{min-width:0}
.portfolio-page #film-player{-webkit-touch-callout:none}
.portfolio-page .project-details{margin-top:30px;padding:26px 0 5px;border-top:1px solid var(--line)}
.portfolio-page .project-details h3{font-size:23px;font-weight:500;line-height:1.4;margin:10px 0 18px}
.portfolio-page .project-description,.portfolio-page .film-description{max-width:85ch;font-size:15px;line-height:1.9;color:var(--muted);overflow-wrap:anywhere}
.portfolio-page .film-description{margin-top:16px;padding-top:16px;border-top:1px solid var(--line)}
.portfolio-page .project-credits{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));column-gap:28px;margin:24px 0 0;border-top:1px solid var(--line)}
.portfolio-page .project-credits>div{padding:15px 0;border-bottom:1px solid var(--line)}
.portfolio-page .project-credits dt{font-size:12px;line-height:1.6;color:var(--muted);margin-bottom:6px}
.portfolio-page .project-credits dd{font-size:15px;line-height:1.6;margin:0;overflow-wrap:anywhere}
.portfolio-page [hidden]{display:none!important}
@media(max-width:960px){.portfolio-page .project-credits{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:24px}}
@media(max-width:760px){.portfolio-page dialog{padding:0 16px 25px;width:calc(100vw - 20px)}.portfolio-page .player-heading{padding:17px 0}.portfolio-page .project-layout{padding-top:18px}.portfolio-page .project-details{margin-top:24px;padding-top:24px}.portfolio-page .project-details h3{font-size:22px;margin-top:8px}.portfolio-page .project-description,.portfolio-page .film-description{font-size:14px;line-height:1.9}.portfolio-page .project-credits{margin-top:20px;column-gap:18px}.portfolio-page .project-credits dd{font-size:14px}.portfolio-page .featured[data-featured-project="mg07"] .featured-button img{object-position:65% 45%}.portfolio-page .feature-caption h2{font-size:clamp(24px,6.5vw,32px)}}
@media(max-width:360px){.portfolio-page .project-credits{grid-template-columns:1fr}}

/* Readable film details and comfortable touch controls at narrow widths. */
.portfolio-page .project-description,.portfolio-page .film-description{font-size:1rem}
.portfolio-page .close-player,.portfolio-page #retry-playback,.portfolio-page .film-list button{min-height:44px}
.portfolio-page .player-bottom{flex-wrap:wrap}
.portfolio-page #film-label{min-width:0;overflow-wrap:anywhere;line-height:1.6}
.portfolio-page dialog{overscroll-behavior:contain}
@media(max-width:760px){
  .portfolio-page .site-header{flex-wrap:wrap}
  .portfolio-page nav{font-size:14px;flex-wrap:wrap}
  .portfolio-page nav a{display:inline-flex;align-items:center;min-height:44px}
  .portfolio-page .card-copy p,.portfolio-page .card-watch,.portfolio-page .film-list button,.portfolio-page .player-bottom,.portfolio-page .close-player{font-size:14px}
  .portfolio-page .player-heading>div{min-width:0}
  .portfolio-page .player-heading h2{overflow-wrap:anywhere}
}

/* Scheme 02. The build scopes these rules to the scrollable portfolio view. */
.portfolio-page{--bg:#101116;--panel:#191a1e;--ink:#f7f7f8;--muted:#999aa3;--line:#ffffff20;--accent:#fff;--gutter:clamp(24px,4.1vw,84px);--header-height:86px;background-color:var(--bg);color:var(--ink);scroll-padding-top:calc(var(--header-height) + 16px);font-family:Arial,"Microsoft YaHei","PingFang SC",sans-serif;background-image:linear-gradient(121deg,transparent 5%,#b9adc10b 24%,#a49cb021 38%,#8d839510 48%,transparent 66%),radial-gradient(ellipse 65% 90% at 28% 4%,#7068793d,transparent 78%),radial-gradient(ellipse 55% 75% at 56% 98%,#625a7326,transparent 83%),linear-gradient(111deg,#15161d,#101116 62%,#101116);background-repeat:no-repeat;background-size:100% 100%}
.portfolio-page{overflow-x:clip}
.portfolio-page a,.portfolio-page button{-webkit-tap-highlight-color:transparent}
.portfolio-page button:focus-visible,.portfolio-page a:focus-visible{outline:2px solid #ded8eb;outline-offset:6px}
.portfolio-page .editorial-header{position:sticky;top:0;z-index:20;min-height:var(--header-height);padding:18px var(--gutter);display:flex;align-items:center;justify-content:space-between;gap:28px;background:linear-gradient(110deg,#25232ef7,#17171ffb 65%,#13141bfc);border-bottom:1px solid #ffffff1b;isolation:isolate}
.portfolio-page .editorial-header .wordmark{font-size:38px;font-weight:900;line-height:1;letter-spacing:-1.9px;gap:18px;white-space:nowrap}
.portfolio-page .editorial-header .wordmark span{font-size:15px;letter-spacing:2px;font-weight:400;border-left:1px solid #ffffff36;padding-left:18px}
.portfolio-page .editorial-header nav{gap:clamp(25px,4vw,66px);font-size:14px;align-items:center}
.portfolio-page .editorial-header nav a{position:relative;min-height:44px;display:flex;align-items:center;color:#a6a6af;white-space:nowrap}
.portfolio-page .editorial-header nav a[aria-current="page"]{color:#fff}
.portfolio-page .editorial-header nav a[aria-current="page"]::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:#fff}
.portfolio-page .editorial-header nav a:hover{color:#fff}
.portfolio-page .editorial-main{max-width:1920px;margin-inline:auto}
.portfolio-page .editorial-works{padding:0 var(--gutter);scroll-margin-top:var(--header-height)}
.portfolio-page .editorial-intro{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;padding:34px 0 30px}
.portfolio-page .editorial-intro>div{display:flex;align-items:center;gap:28px}
.portfolio-page .editorial-intro h1{margin:0;font-size:clamp(35px,3.5vw,58px);font-weight:500;letter-spacing:.08em;line-height:1.25}
.portfolio-page .editorial-intro h1:focus{outline:none}
.portfolio-page .editorial-intro p{font-size:11px;letter-spacing:.3em;color:#a8a8b3;margin:0}
.portfolio-page .browse-hint{font-size:12px;letter-spacing:.1em;color:#a8a8b3;padding-bottom:8px}
.portfolio-page .browse-hint span{margin-left:18px}
.portfolio-page .spotlight{position:relative;padding-top:10px}
.portfolio-page .spotlight-stage{position:relative;isolation:isolate;padding-bottom:82px;overflow:clip;touch-action:pan-y pinch-zoom}
.portfolio-page .spotlight-stage::before{content:"";display:block;width:72%;aspect-ratio:21/9;margin-inline:auto}
.portfolio-page .spotlight-card{position:absolute;inset:0;pointer-events:none}
.portfolio-page .spotlight-cover{position:absolute;left:14%;top:0;width:72%;aspect-ratio:21/9;padding:0;border:0;overflow:hidden;background:#18191d;pointer-events:auto;transform-origin:center;transform:translate3d(0,0,0) scale(1);opacity:1;isolation:isolate}
.portfolio-page .spotlight-cover img{width:100%;height:100%;display:block;object-fit:cover;object-position:var(--cover-position,50% 50%);transform:scale(var(--frame-scale,1))}
.portfolio-page .spotlight-cover[data-frame-fallback="mg07"]{--frame-scale:1.12}
.portfolio-page .spotlight-card[data-slot="0"]{z-index:3}
.portfolio-page .spotlight-card[data-slot="-1"] .spotlight-cover{transform:translate3d(-89%,0,0) scale(.72);opacity:.55}
.portfolio-page .spotlight-card[data-slot="1"] .spotlight-cover{transform:translate3d(89%,0,0) scale(.72);opacity:.55}
.portfolio-page .spotlight-shade{position:absolute;inset:0;background:#080911;opacity:.23;pointer-events:none}
.portfolio-page .spotlight-card[data-slot="0"] .spotlight-shade{opacity:0}
.portfolio-page .spotlight-play{position:absolute;right:18px;bottom:16px;width:38px;height:38px;border:1px solid #ffffff90;border-radius:50%;display:grid;place-items:center;color:white;background:#12121855;opacity:0}
.portfolio-page .spotlight-card[data-slot="0"] .spotlight-play{opacity:1}
.portfolio-page .spotlight-cover:focus-visible{outline-offset:-3px;outline:3px solid #f1edf7}
.portfolio-page .spotlight-copy{display:none;position:absolute;padding-top:0}
.portfolio-page .spotlight-card[data-slot="0"] .spotlight-copy{display:block;top:calc(100% - 66px);left:14%;width:72%}
.portfolio-page .spotlight-copy h2{font-size:clamp(16px,1.45vw,24px);font-weight:500;line-height:1.4;letter-spacing:.025em}
.portfolio-page .spotlight-card[data-slot="0"] .spotlight-copy h2{font-size:clamp(22px,1.9vw,30px)}
.portfolio-page .spotlight-copy p{font-size:12px;color:#a6a4af;letter-spacing:.1em;margin-top:6px}
.portfolio-page .spotlight-controls{display:flex;align-items:center;justify-content:center;gap:14px;margin:0 auto 12px;color:#bcb9c7}
.portfolio-page .spotlight-controls[hidden]{display:none}
.portfolio-page .spotlight-controls button{display:grid;place-items:center;width:44px;height:44px;padding:0;background:transparent;color:#d4d0dd;border:1px solid transparent;font-size:22px}
.portfolio-page .spotlight-controls button:hover{border-color:#ffffff26;color:#fff}
.portfolio-page .spotlight-controls button:disabled{opacity:.45;cursor:default}
.portfolio-page .spotlight-counter{display:flex;align-items:center;gap:13px;font-size:12px;font-variant-numeric:tabular-nums;letter-spacing:.1em;color:#92909c}
.portfolio-page [data-spotlight-current]{color:#f0edf5}
.portfolio-page .spotlight-counter-line{height:1px;width:42px;background:#ffffff32}
.portfolio-page .spotlight-controls .spotlight-toggle{margin-left:2px}
.portfolio-page .spotlight-toggle-icon{width:9px;height:11px;border-left:2px solid currentColor;border-right:2px solid currentColor}
.portfolio-page .spotlight-toggle[aria-pressed="true"] .spotlight-toggle-icon{width:0;height:0;border-left:8px solid currentColor;border-right:0;border-top:5px solid transparent;border-bottom:5px solid transparent}
.portfolio-page .editorial-list-heading{display:flex;align-items:center;justify-content:space-between;padding:22px 0 4px;border-top:1px solid #ffffff1b;margin-top:12px}
.portfolio-page .editorial-list-heading h2{font-size:14px;font-weight:400;letter-spacing:.18em;color:#c1bdcb}
.portfolio-page .editorial-list-heading>span{font-size:12px;color:#8e8b98;letter-spacing:.06em}
.portfolio-page .sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.portfolio-page .editorial-list{display:block;overflow-x:clip;overflow-y:visible;overflow-clip-margin:8px}
.portfolio-page .editorial-row{display:grid;grid-template-columns:minmax(240px,.88fr) minmax(0,2.45fr);gap:clamp(26px,4vw,76px);align-items:center;padding:24px 0 30px;border-bottom:1px solid #ffffff1b;min-width:0}
.portfolio-page .editorial-row:nth-child(even){grid-template-columns:minmax(0,2.45fr) minmax(240px,.88fr)}
.portfolio-page .editorial-row:nth-child(even) .editorial-cover{grid-column:1;grid-row:1}
.portfolio-page .editorial-row:nth-child(even) .editorial-copy{grid-column:2;grid-row:1}
.portfolio-page .editorial-row:first-child{margin-top:0}
.portfolio-page .editorial-copy{min-width:0;padding:12px 0}
.portfolio-page .editorial-number{font-size:11px;color:#acacb5;letter-spacing:.1em;display:flex;align-items:center;gap:16px;margin-bottom:24px;font-variant-numeric:tabular-nums}
.portfolio-page .editorial-number::after{content:"";height:1px;width:35px;background:#85858d}
.portfolio-page .editorial-copy h2{font-size:clamp(24px,2.1vw,37px);line-height:1.35;letter-spacing:.015em;font-weight:500;text-wrap:balance}
.portfolio-page .editorial-category{font-size:13px;color:#a4a4ad;line-height:1.6;margin-top:9px;letter-spacing:.035em}
.portfolio-page .editorial-play{display:inline-flex;align-items:center;gap:13px;margin-top:25px;min-height:44px;padding:0;background:none;font-size:12px;letter-spacing:.05em;color:#b7b7c1}
.portfolio-page .editorial-play .play-ring{display:grid;place-items:center;width:36px;height:36px;border:1px solid #d9d9df;border-radius:50%;color:#f4f4f7;transition:background-color .2s,color .2s}
.portfolio-page .play-triangle{width:0;height:0;border-top:5px solid transparent;border-bottom:5px solid transparent;border-left:7px solid currentColor;margin-left:3px}
.portfolio-page .editorial-play:hover .play-ring{background:#eee;color:#151519}
.portfolio-page .editorial-cover{display:block;position:relative;width:100%;aspect-ratio:3/1;min-width:0;padding:0;border:0;overflow:hidden;background:#23242a;isolation:isolate;text-align:left}
.portfolio-page .editorial-cover picture{display:block;width:100%;height:100%;overflow:hidden}
.portfolio-page .editorial-cover img{width:100%;height:100%;object-fit:cover;object-position:var(--cover-position,50% 50%);transform:scale(var(--frame-scale,1));transition:transform .65s cubic-bezier(.2,.65,.3,1)}
.portfolio-page .editorial-cover[data-frame-fallback="mg07"]{--frame-scale:1.12}
.portfolio-page .cover-note{position:absolute;right:12px;bottom:10px;border:1px solid #ffffff32;padding:5px 8px;color:#eee;background:#111318b8;font-size:10px;letter-spacing:.06em}
.portfolio-page .cover-play{position:absolute;inset:0;display:grid;place-items:center;background:#0000000a;opacity:0;transition:opacity .25s}
.portfolio-page .cover-play span{width:48px;height:48px;display:grid;place-items:center;border:1px solid #ffffff9c;border-radius:50%;background:#10101575}
@media(hover:hover) and (pointer:fine){.portfolio-page .editorial-cover:hover img{transform:scale(calc(var(--frame-scale,1) + .025))}.portfolio-page .editorial-cover:hover .cover-play{opacity:1}}
.portfolio-page .editorial-cover:focus-visible .cover-play{opacity:1}
.portfolio-page .editorial-row{--cover-entry:clamp(160px,15vw,240px)}
.portfolio-page .editorial-row:nth-child(even){--cover-entry:clamp(-240px,-15vw,-160px)}
.portfolio-page .editorial-row.is-pending .editorial-copy{opacity:0}
.portfolio-page .editorial-row.is-pending .editorial-cover{opacity:0;transform:translate3d(var(--cover-entry),0,0)}
.portfolio-page .editorial-row.is-revealing .editorial-cover{will-change:opacity,transform}
.portfolio-page .editorial-row.is-revealing .editorial-copy{will-change:opacity}
.portfolio-page .editorial-row:focus-within .editorial-copy,.portfolio-page .editorial-row:focus-within .editorial-cover{opacity:1;transform:none}
.portfolio-page .editorial-about{padding:90px var(--gutter) 74px;display:grid;grid-template-columns:1fr 2.6fr;gap:30px;scroll-margin-top:calc(var(--header-height) + 20px)}
.portfolio-page .about-kicker{font-size:11px;letter-spacing:.2em;color:#aaa8b3;padding-top:10px}
.portfolio-page .editorial-about h2{font-weight:500;font-size:clamp(24px,2.5vw,38px);line-height:1.4}
.portfolio-page .editorial-about div>p{font-size:14px;color:#aaa9b3;line-height:2;margin-top:24px}
.portfolio-page .editorial-about>a{grid-column:2;display:inline-flex;gap:24px;align-items:center;font-size:13px;width:max-content;min-height:44px}
.portfolio-page .editorial-footer{margin:0 var(--gutter);padding:24px 0 32px;border-top:1px solid #ffffff20;display:flex;align-items:center;justify-content:space-between;gap:24px;color:#9999a4;font-size:11px;max-width:none}
.portfolio-page .editorial-footer a{min-height:44px;display:inline-flex;align-items:center}
.portfolio-page .editorial-footer p{font-size:11px}
/* A transparent modal shell keeps the glass close control outside the scroller. */
.portfolio-page dialog{--player-edge:24px;--player-close-size:64px;--player-close-gap:18px;--player-padding:26px;width:min(1180px,calc(100vw - 96px));max-width:none;max-height:calc(100dvh - var(--player-edge) - var(--player-edge) - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px));margin:auto;padding:0;overflow:visible;border:0;background:transparent;color:#f6f4fa;box-shadow:none}
.portfolio-page dialog[open]{display:flex;flex-direction:column;align-items:center;gap:var(--player-close-gap)}
.portfolio-page dialog::backdrop{background:#08091159;-webkit-backdrop-filter:blur(7px);backdrop-filter:blur(7px)}
.portfolio-page dialog[data-player-state="opening"]::backdrop{animation:player-backdrop-in 250ms ease-out both}
.portfolio-page dialog[data-player-state="closing"]::backdrop{animation:player-backdrop-out 260ms ease-in both}
@keyframes player-backdrop-in{from{opacity:0}to{opacity:1}}
@keyframes player-backdrop-out{from{opacity:var(--player-backdrop-from,1)}to{opacity:0}}
.portfolio-page dialog[data-player-state="opening"] :is(.player-surface,.close-player),.portfolio-page dialog[data-player-state="closing"] :is(.player-surface,.close-player){will-change:opacity,transform}
.portfolio-page .player-surface{width:100%;min-height:0;max-height:calc(100dvh - var(--player-edge) - var(--player-edge) - var(--player-close-size) - var(--player-close-gap) - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px));overflow:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#d5d0e35c transparent;padding:0 var(--player-padding) 26px;border:1px solid #e8e4ff3d;border-radius:18px;background:linear-gradient(135deg,#53526080,#20212b80 55%,#292a368c);-webkit-backdrop-filter:blur(18px) saturate(115%);backdrop-filter:blur(18px) saturate(115%);box-shadow:0 24px 90px #03040966,inset 0 1px 0 #ffffff24}
.portfolio-page .player-heading{margin:0 calc(-1 * var(--player-padding));padding:20px var(--player-padding);background:#2526318c;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);border-bottom:1px solid #eee8ff26}
.portfolio-page .player-heading h2{font-size:24px;font-weight:500;color:#fff}
.portfolio-page .project-layout{padding-top:22px}
.portfolio-page .video-stage{border-radius:7px;overflow:hidden;background:#000}
.portfolio-page .close-player{flex:0 0 auto;display:grid;place-items:center;width:var(--player-close-size);height:var(--player-close-size);min-height:var(--player-close-size);padding:0;margin:0;border:1px solid #f1edff85;border-radius:50%;background:linear-gradient(145deg,#c7c1df55,#7e788e30 50%,#2d2c3d66);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);color:#fff;box-shadow:0 8px 28px #03030966,inset 0 1px 0 #ffffff55;transition:background-color .18s,border-color .18s,transform .18s}
.portfolio-page .close-player .close-mark{display:block;position:relative;width:24px;height:24px;margin:0;font-size:0}
.portfolio-page .close-mark::before,.portfolio-page .close-mark::after{content:"";position:absolute;left:0;top:11px;width:24px;height:2px;border-radius:2px;background:currentColor;transform:rotate(45deg)}
.portfolio-page .close-mark::after{transform:rotate(-45deg)}
.portfolio-page .close-player:hover{background-color:#c5bed144;border-color:#fff;transform:translateY(-2px)}
.portfolio-page .close-player:active{transform:scale(.95)}
.portfolio-page .close-player:focus-visible{outline:2px solid #fff;outline-offset:5px;box-shadow:0 0 0 7px #cfc5f22b,0 10px 32px #05020d80}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){.portfolio-page .player-surface{background:#20212de8}.portfolio-page .player-heading{background:#252631ed}.portfolio-page .close-player{background:#595466e8}}
.portfolio-page .player-heading .eyebrow,.portfolio-page .project-details .eyebrow{color:#a8a8b5}
.portfolio-page .film-list button[aria-pressed="true"]{background:#eceaf1;color:#17161b;border-color:#eceaf1}
.portfolio-page .project-details{border-color:#ffffff26}
.portfolio-page .project-description,.portfolio-page .film-description{color:#c1bec8}
@media(max-width:1000px) and (min-width:761px){.portfolio-page .editorial-row,.portfolio-page .editorial-row:nth-child(even){grid-template-columns:minmax(0,1fr) minmax(0,2fr);gap:24px}.portfolio-page .editorial-row:nth-child(even){grid-template-columns:minmax(0,2fr) minmax(0,1fr)}.portfolio-page .editorial-number{margin-bottom:12px}.portfolio-page .editorial-play{margin-top:12px}.portfolio-page .editorial-copy h2{font-size:23px}}
@media(max-width:760px){
 .portfolio-page{--gutter:18px;--header-height:74px}
 .portfolio-page .editorial-header{padding:12px var(--gutter);gap:14px;min-height:var(--header-height);flex-wrap:nowrap}
 .portfolio-page .editorial-header .wordmark{font-size:28px;gap:6px;letter-spacing:-1.6px;display:flex;flex-direction:column;align-items:flex-start}
 .portfolio-page .editorial-header .wordmark span{font-size:9px;padding-left:0;border:0;letter-spacing:2px;line-height:1.4}
 .portfolio-page .editorial-header nav{gap:20px;font-size:12px}
 .portfolio-page .editorial-intro{padding:28px 0 20px;display:block}
 .portfolio-page .editorial-intro>div{display:block}
 .portfolio-page .editorial-intro h1{font-size:35px;letter-spacing:.055em}
 .portfolio-page .editorial-intro p{font-size:9px;margin-top:9px;letter-spacing:.23em}
 .portfolio-page .browse-hint{display:none}
 .portfolio-page .spotlight{padding-top:4px}
 .portfolio-page .spotlight-stage{padding-bottom:76px;margin-inline:calc(-1 * var(--gutter))}
 .portfolio-page .spotlight-stage::before{width:86%}
 .portfolio-page .spotlight-cover{left:7%;width:86%}
 .portfolio-page .spotlight-card[data-slot="-1"] .spotlight-cover{transform:translate3d(-92.5%,0,0) scale(.76);opacity:.45}
 .portfolio-page .spotlight-card[data-slot="1"] .spotlight-cover{transform:translate3d(92.5%,0,0) scale(.76);opacity:.45}
 .portfolio-page .spotlight-copy{display:none}
 .portfolio-page .spotlight-card[data-slot="0"] .spotlight-copy{display:block;left:7%;width:86%;top:calc(100% - 62px)}
 .portfolio-page .spotlight-card[data-slot="0"] .spotlight-copy h2{font-size:22px}
 .portfolio-page .spotlight-play{width:32px;height:32px;right:12px;bottom:10px}
 .portfolio-page .spotlight-copy p{font-size:12px;margin-top:4px}
 .portfolio-page .spotlight-controls{margin-bottom:8px;gap:9px}
 .portfolio-page .spotlight:not(.is-ready) .spotlight-stage{padding-bottom:0;margin-inline:0;display:grid;gap:24px}
 .portfolio-page .spotlight:not(.is-ready) .spotlight-stage::before{display:none}
 .portfolio-page .spotlight:not(.is-ready) .spotlight-card{position:relative}
 .portfolio-page .spotlight:not(.is-ready) .spotlight-cover{position:relative;left:0;width:100%;transform:none;opacity:1}
 .portfolio-page .spotlight:not(.is-ready) .spotlight-copy{display:block;position:relative;left:0;top:auto;width:100%;margin-top:12px}
 .portfolio-page .spotlight:not(.is-ready) .spotlight-play{opacity:1}
 .portfolio-page .editorial-list-heading{margin-top:10px;padding-top:20px}
 .portfolio-page .editorial-row,.portfolio-page .editorial-row:nth-child(even){display:flex;flex-direction:column;gap:0;align-items:stretch;padding:18px 0 24px}
 .portfolio-page .editorial-row:first-child{padding-top:8px;margin-top:0}
 .portfolio-page .editorial-cover{order:0;aspect-ratio:21/9}
 .portfolio-page .editorial-cover img{object-position:var(--mobile-cover-position,var(--cover-position,50% 50%))}
 .portfolio-page .editorial-cover[data-mobile-custom="true"]{--frame-scale:1}
 .portfolio-page .editorial-copy{order:1;display:grid;grid-template-columns:minmax(0,1fr) 44px;column-gap:12px;padding:16px 0 0}
 .portfolio-page .editorial-row:first-child .editorial-copy{padding-top:16px}
 .portfolio-page .editorial-number{display:none}
 .portfolio-page .editorial-copy h2{grid-column:1;grid-row:1;font-size:23px;line-height:1.4;text-wrap:initial}
 .portfolio-page .editorial-category{grid-column:1;grid-row:2;font-size:12px;margin-top:5px}
 .portfolio-page .editorial-play{grid-column:2;grid-row:1/3;margin:0;justify-content:flex-end;align-self:center;gap:0}
 .portfolio-page .editorial-play .play-ring{width:40px;height:40px}
 .portfolio-page .editorial-play .play-label{display:none}
 .portfolio-page .cover-note{font-size:9px;padding:4px 6px;right:9px;bottom:9px}
 .portfolio-page .editorial-row{--cover-entry:76px}
 .portfolio-page .editorial-row:nth-child(even){--cover-entry:-76px}
 .portfolio-page .editorial-about{display:block;padding:58px var(--gutter) 40px}
 .portfolio-page .about-kicker{padding:0;margin-bottom:22px}
 .portfolio-page .editorial-about h2{font-size:24px;letter-spacing:-.025em}
 .portfolio-page .editorial-about div>p{font-size:13px;margin:17px 0}
 .portfolio-page .editorial-footer{flex-wrap:wrap;gap:5px 20px;margin:0 var(--gutter);padding:18px 0 24px}
 .portfolio-page .editorial-footer p{order:3;flex-basis:100%;font-size:10px}
 .portfolio-page dialog{--player-edge:16px;--player-close-size:58px;--player-close-gap:14px;--player-padding:16px;width:calc(100vw - 28px)}
 .portfolio-page .player-surface{border-radius:14px;padding-bottom:22px}
 .portfolio-page .player-heading{padding-top:16px;padding-bottom:16px}
 .portfolio-page .player-heading h2{font-size:20px}
 .portfolio-page .project-layout{padding-top:16px}
 .portfolio-page .player-surface video{max-height:48dvh}
}
@media(max-height:500px) and (orientation:landscape){.portfolio-page dialog{--player-edge:10px;--player-close-size:48px;--player-close-gap:10px;--player-padding:18px;width:min(1000px,calc(100vw - 80px))}.portfolio-page .player-heading{padding-top:12px;padding-bottom:12px}.portfolio-page .player-heading h2{font-size:19px}.portfolio-page .player-surface video{max-height:55dvh}.portfolio-page .player-surface{border-radius:12px}.portfolio-page .project-layout{padding-top:14px}}
@media(prefers-reduced-motion:reduce){.portfolio-page .editorial-row .editorial-copy,.portfolio-page .editorial-row .editorial-cover{opacity:1!important;transform:none!important;transition:none!important;will-change:auto!important}.portfolio-page .editorial-cover img,.portfolio-page .cover-play{transition:none}}
@media(prefers-reduced-motion:reduce){.portfolio-page dialog::backdrop{animation:none!important}.portfolio-page .close-player{transition:none}}