.project-page{background:var(--yellow);color:var(--black);min-height:100vh}
.gallery-open{overflow:hidden}
.project-page .menu__row a{white-space:nowrap}
.project-page .menu__row a.is-active{color:#fff}
.project-shell{display:grid;grid-template-columns:minmax(260px,25vw) minmax(0,75vw);padding-top:72px;align-items:start}
.project-sidebar{min-height:100vh;padding:clamp(1.2rem,2.2vw,2.5rem);background:var(--yellow)}
.project-sidebar__sticky{position:sticky;top:2.4rem}
.project-back{display:inline-block;margin-bottom:clamp(3rem,7vh,6rem);font:600 .55rem/1 Nekst,Arial,sans-serif;letter-spacing:.12em;border-bottom:1px solid currentColor;padding-bottom:.3rem}
.project-kicker{margin:0 0 .7rem;font:600 .55rem/1 Nekst,Arial,sans-serif;letter-spacing:.14em}
.project-intro{margin:1.3rem 0 3.5rem;max-width:32rem;font:400 clamp(.75rem,1vw,1rem)/1.35 Nekst,Arial,sans-serif}
.project-team{padding-top:1.2rem;border-top:5px solid var(--black)}
.project-team h2{margin:0 0 1.8rem;font-size:clamp(1.45rem,2vw,2.3rem);line-height:.85;font-weight:400}
.project-team dl{margin:0;display:grid;gap:1rem}
.project-team dl div{display:grid;grid-template-columns:minmax(90px,.9fr) 1.1fr;gap:.6rem;border-top:1px solid rgba(5,5,5,.35);padding-top:.55rem}
.project-team dt,.project-team dd{margin:0;font-family:Nekst,Arial,sans-serif}
.project-team dt{font-size:.48rem;line-height:1.25;letter-spacing:.1em;opacity:.65}
.project-team dd{font-size:.62rem;line-height:1.25;font-weight:600;text-align:right}
.project-team dd a{display:block;margin-top:.16rem;color:#4b55b8;font-size:.54rem;overflow-wrap:anywhere}
.project-content{min-width:0;background:#f2f2ee}
.project-titlebar{background:var(--yellow);padding:clamp(1rem,2vw,2rem)}
.project-titlebar p{margin:0 0 .45rem;font:600 .55rem/1 Nekst,Arial,sans-serif;letter-spacing:.14em}
.project-titlebar h1{max-width:100%;margin:0;font-weight:400;font-size:clamp(2.4rem,5.2vw,6rem);line-height:.82;letter-spacing:-.055em;overflow-wrap:normal;word-break:normal;text-wrap:balance}
.project-film,.project-bts,.project-related{padding:clamp(1rem,2vw,2rem)}
.project-section-label{display:flex;align-items:baseline;gap:.75rem;margin:0 0 1rem}
.project-section-label span{font:600 .5rem Nekst,Arial,sans-serif;letter-spacing:.1em}
.project-section-label h2{margin:0;font-size:clamp(1.6rem,2.5vw,3.2rem);line-height:.85;font-weight:400;letter-spacing:-.04em}
.universal-player{width:100%;aspect-ratio:16/9;background:#1d1d1d;overflow:hidden}
.universal-player__root,.universal-player video,.universal-player iframe{display:block;width:100%;height:100%;border:0;background:#1d1d1d}
.universal-player video{object-fit:contain}
.project-film__stack{display:grid;gap:clamp(.7rem,1.4vw,1.4rem)}
.project-main-image{display:block;width:100%;height:auto;max-height:80vh;object-fit:contain;background:#1d1d1d}
.project-bts__video:empty{display:none}
.project-bts__video:not(:empty){margin-bottom:clamp(.7rem,1.4vw,1.4rem)}
.project-film__caption{display:flex;justify-content:space-between;margin:.75rem 0 0;font:600 .55rem Nekst,Arial,sans-serif;letter-spacing:.11em}
.project-bts{padding-top:clamp(4rem,8vw,8rem)}
.case-gallery{position:relative}
.case-gallery button{border:0;border-radius:0;padding:0;background:none;color:inherit;cursor:pointer}
.case-gallery__stage{position:relative;display:block;width:100%;aspect-ratio:16/9;overflow:hidden;background:#0b0b0b!important}
.case-gallery__stage>img{display:block;width:100%;height:100%;object-fit:cover;object-position:center 32%;transition:transform .55s cubic-bezier(.2,.75,.25,1)}
.case-gallery__stage:hover>img{transform:scale(1.012)}
.case-gallery__hint,.case-gallery__count{position:absolute;bottom:.8rem;z-index:2;background:var(--yellow);padding:.45rem .6rem;font:600 .5rem/1 Nekst,Arial,sans-serif;letter-spacing:.1em}
.case-gallery__hint{left:.8rem}.case-gallery__count{right:.8rem}.case-gallery__count b{font-weight:600}
.case-gallery__thumbs{display:flex;gap:.45rem;margin-top:.45rem;overflow-x:auto;overscroll-behavior-inline:contain;scrollbar-width:thin;scrollbar-color:var(--black) transparent;padding-bottom:.35rem;scroll-snap-type:x proximity}
.case-gallery__thumbs button{flex:0 0 calc((100% - 2.25rem)/6);aspect-ratio:4/3;overflow:hidden;background:#d7d7d2;opacity:.5;scroll-snap-align:start;transition:opacity .2s,transform .2s}
.case-gallery__thumbs button:hover,.case-gallery__thumbs button.is-active{opacity:1}.case-gallery__thumbs button.is-active{outline:4px solid var(--yellow);outline-offset:-4px}
.case-gallery__thumbs img{display:block;width:100%;height:100%;object-fit:cover}
.case-lightbox{position:fixed;inset:0;width:100vw;max-width:none;height:100dvh;max-height:none;margin:0;border:0;padding:0;background:rgba(5,5,5,.96);color:#fff;overflow:hidden}
.case-lightbox::backdrop{background:rgba(5,5,5,.96)}
.case-lightbox[open]{display:grid;grid-template-columns:72px minmax(0,1fr) 72px;align-items:center}
.case-lightbox figure{min-width:0;height:100%;margin:0;padding:4rem 0 3rem;display:grid;grid-template-rows:minmax(0,1fr) auto;justify-items:center;gap:.7rem}
.case-lightbox figure img{display:block;max-width:100%;width:auto;max-height:calc(100dvh - 7rem);height:100%;object-fit:contain;touch-action:pan-y;user-select:none;-webkit-user-drag:none}
.case-lightbox figcaption{font:400 .6rem/1.25 Nekst,Arial,sans-serif;opacity:.78;text-align:center}
.case-lightbox__close,.case-lightbox__arrow{position:relative;z-index:2;color:#fff!important;font:400 2rem/1 Nekst,Arial,sans-serif!important}
.case-lightbox__close{position:absolute!important;right:1.2rem;top:1rem;font-size:2.3rem!important}
.case-lightbox__arrow{height:100%;transition:background .2s}.case-lightbox__arrow:hover{background:rgba(255,255,255,.08)}
.case-lightbox__count{position:absolute;left:1.2rem;bottom:1rem;margin:0;font:600 .6rem Nekst,Arial,sans-serif;letter-spacing:.12em}
.project-related{padding-top:clamp(5rem,10vw,10rem);padding-bottom:clamp(4rem,8vw,7rem);background:var(--yellow)}
.project-related__grid{display:flex;gap:.7rem;overflow-x:auto;overscroll-behavior-inline:contain;scroll-snap-type:x mandatory;scrollbar-width:thin;scrollbar-color:var(--black) transparent;padding-bottom:1rem}
.project-related__card{display:block;flex:0 0 calc((100% - .7rem)/2);min-width:0;border-top:6px solid var(--black);padding-top:.7rem;scroll-snap-align:start}
.project-related__card img{display:block;width:100%;aspect-ratio:16/10;object-fit:cover;filter:grayscale(1);transition:filter .3s,transform .5s}
.project-related__card div{display:flex;justify-content:space-between;align-items:flex-end;gap:1rem;padding-top:.75rem}
.project-related__card h3{margin:0;font-size:clamp(1.4rem,2.3vw,3rem);line-height:.85;font-weight:400}
.project-related__card span{font:600 .5rem Nekst,Arial,sans-serif;letter-spacing:.1em;white-space:nowrap}
.project-related__card:hover img{filter:none;transform:scale(.99)}
.project-related__visual{position:relative;display:block;width:100%;aspect-ratio:16/10;overflow:hidden;background:#1d1d1d}
.project-related__visual>.project-related__gif{position:absolute;inset:0;width:100%;height:100%;aspect-ratio:auto;object-fit:cover;filter:grayscale(1);opacity:.72;transform:scale(1.01);transition:filter .35s,opacity .35s,transform .7s cubic-bezier(.2,.75,.25,1)}
.project-related__visual>.project-related__yes{position:absolute;z-index:2;left:3%;top:50%;width:94%;height:auto;aspect-ratio:auto;object-fit:contain;filter:none;opacity:.62;pointer-events:none;transform:translateY(-50%);transition:transform .65s cubic-bezier(.2,.75,.25,1),opacity .35s;will-change:transform}
.project-related__visual>.project-related__yes--top{clip-path:inset(0 0 49.5% 0)}
.project-related__visual>.project-related__yes--bottom{clip-path:inset(49.5% 0 0 0)}
.project-related__name{position:absolute;z-index:3;right:3%;top:50%;max-width:58%;padding:.42rem .6rem .36rem 3.5rem;background:linear-gradient(90deg,transparent 0,transparent 2.8rem,rgba(248,200,0,.9) 2.8rem);color:var(--black);font:600 .52rem/1 Nekst,Arial,sans-serif;letter-spacing:.12em;text-align:right;white-space:nowrap;transform:translateY(-50%);transition:transform .55s cubic-bezier(.2,.75,.25,1),opacity .3s}
.project-related__name:before{content:"";position:absolute;left:0;top:50%;width:2.8rem;height:2px;background:var(--yellow)}
.project-related__card:hover .project-related__gif,.project-related__card:focus-visible .project-related__gif{filter:none;opacity:1;transform:scale(1.035)}
.project-related__card:hover .project-related__yes--top,.project-related__card:focus-visible .project-related__yes--top{filter:none;opacity:.38;transform:translateY(-112%)}
.project-related__card:hover .project-related__yes--bottom,.project-related__card:focus-visible .project-related__yes--bottom{filter:none;opacity:.38;transform:translateY(12%)}
.project-related__card:hover .project-related__name,.project-related__card:focus-visible .project-related__name{opacity:0;transform:translate(18%, -50%)}
.project-related .project-section-label{justify-content:flex-start;align-items:center;flex-wrap:wrap}
.project-related__nav{display:flex;align-items:center;gap:.35rem;margin-left:auto}
.project-related__nav button,.project-related__nav a{border:2px solid var(--black);background:transparent;color:var(--black);min-height:2.25rem;padding:.48rem .7rem;font:600 .52rem/1 Nekst,Arial,sans-serif;letter-spacing:.1em;cursor:pointer}
.project-related__nav button{min-width:2.25rem;font-size:.85rem;padding:.3rem}
.project-related__nav button:hover,.project-related__nav a:hover{background:var(--black);color:var(--yellow)}
.project-footer{display:flex;justify-content:space-between;gap:2rem;background:#1d1d1d;color:#fff;padding:1.5rem 2rem;font:600 .6rem Nekst,Arial,sans-serif;letter-spacing:.11em}
@media(min-width:761px){.project-page .project-menu .menu__row{left:9.8vw;width:77.8vw}}
@media(max-width:1000px) and (min-width:761px){
  .project-shell{grid-template-columns:32vw 68vw}
  .project-team dl div{grid-template-columns:1fr}
  .project-team dd{text-align:left}
}
@media(max-width:760px){
  .project-shell{display:block;padding-top:68px}
  .project-sidebar{min-height:auto;padding:8vw 5vw 12vw}
  .project-sidebar__sticky{position:static}
  .project-back{margin-bottom:4rem}
  .project-intro{font-size:1rem;margin:2rem 0 3rem}
  .project-titlebar{padding:1.4rem 5vw}
  .project-titlebar h1{font-size:clamp(2.35rem,10vw,4rem)}
  .project-team dl{grid-template-columns:repeat(2,minmax(0,1fr));gap:1.25rem .8rem}
  .project-team dl div{display:block}
  .project-team dd{text-align:left;font-size:.72rem;margin-top:.25rem}
  .project-film,.project-bts,.project-related{padding:1rem 5vw}
  .project-film{padding-top:2rem;padding-bottom:4rem}
  .project-bts{padding-top:4rem}
  .case-gallery__stage{aspect-ratio:4/3}
  .case-gallery__thumbs button{flex-basis:calc((100% - 1.35rem)/4)}
  .case-lightbox[open]{grid-template-columns:48px minmax(0,1fr) 48px}
  .case-lightbox figure{padding:4rem 0 3rem}
  .case-lightbox figure img{max-height:calc(100dvh - 8rem)}
  .project-related{padding-top:5rem;padding-bottom:5rem}
  .project-related__grid{grid-template-columns:1fr;gap:3rem}
  .project-related__card{flex-basis:88%}
  .project-related__nav{width:100%;margin:.4rem 0 0}
  .project-related__nav a{margin-left:auto}
  .project-footer{flex-direction:column;padding:1.5rem 5vw}
}
@media(prefers-reduced-motion:reduce){.case-gallery__stage>img,.project-related__card img{transition:none}}
@media(prefers-reduced-motion:reduce){.project-related__visual>.project-related__yes{transition:none}.project-related__card:hover .project-related__yes--top{transform:translateY(-50%);opacity:.22}.project-related__card:hover .project-related__yes--bottom{transform:translateY(-50%);opacity:.22}}
