/* Four complete posters on desktop, two on tablets, one on phones. */
.project-carousel{--visible:4;--gap:9px;--cut:.13;width:100%;margin:0 auto}
.project-carousel[hidden]{display:none}
.project-carousel .posters{--card-width:calc((100% - (var(--visible) - 1)*var(--gap))/(var(--visible) - (var(--visible) - 1)*var(--cut)));display:flex;flex-direction:row;gap:var(--gap);height:auto;min-height:0;width:100%;max-width:none;padding:4px 0 12px;margin:0;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;scroll-behavior:auto;overscroll-behavior-x:contain;scrollbar-width:none;cursor:grab;touch-action:pan-x pan-y;outline-offset:5px}
.project-carousel .posters::-webkit-scrollbar{display:none}
.project-carousel .posters:focus-visible{outline:2px solid var(--red)}
.project-carousel .posters .poster{flex:0 0 var(--card-width);width:auto;max-width:none;min-width:0;height:clamp(600px,54vw,800px);min-height:0;margin:0;border-radius:0;clip-path:polygon(13% 0,100% 0,87% 100%,0 100%);scroll-snap-align:start;scroll-snap-stop:normal;transition:filter .3s;container-type:inline-size;-webkit-user-drag:none}
.project-carousel .posters .poster:not([hidden]) ~ .poster:not([hidden]){margin-left:calc(-1*var(--cut)*var(--card-width))}
.project-carousel .posters .poster[hidden]{display:none}
.project-carousel .poster img{-webkit-user-drag:none;user-select:none}
.project-carousel .poster .poster-art{transition:transform .8s cubic-bezier(.18,.7,.2,1)}
.project-carousel.is-moving .poster .poster-art{transform:scale(1.035)}
.project-carousel.is-dragging .posters{cursor:grabbing;scroll-snap-type:none;user-select:none}
.project-carousel.is-moving .posters{scroll-snap-type:none}
.project-carousel .poster .poster-game{left:12%;right:7%;bottom:90px}
.project-carousel .posters .poster-game .game-title{font-size:clamp(46px,23cqw,85px);letter-spacing:-3px;line-height:1.05}
.project-carousel .posters .poster-copy h3{font-size:clamp(37px,18cqw,64px);letter-spacing:-2px}
.project-carousel .poster-copy{width:82%;padding-top:35px}
.project-carousel .poster-copy p{font-size:clamp(12px,5cqw,19px)}
.project-carousel .mini-poster-copy{left:12%;right:10%}
.project-carousel .mini-poster-title{font-size:clamp(40px,20cqw,72px)}
.project-carousel .mini-poster-tagline{font-size:clamp(12px,5cqw,17px)}
.project-carousel .garden-poster-copy h3{font-size:clamp(32px,14cqw,50px);letter-spacing:-1.4px}
.project-carousel .garden-poster-kicker{font-size:clamp(8px,3cqw,11px);letter-spacing:1px}
.project-carousel .jade-poster-copy{left:9%;right:9%;top:10%}
.project-carousel .jade-poster-copy>span{font-size:clamp(8px,3cqw,10px);letter-spacing:1.1px}
.project-carousel .jade-poster-copy h3{font-size:clamp(29px,12cqw,43px)}
.project-carousel .poster-bottom{left:12%;right:12%;font-size:clamp(8px,2.7cqw,10px);letter-spacing:.7px}
.project-carousel .poster:focus-visible{filter:drop-shadow(0 0 4px #f3483d)}
.carousel-controls{display:flex;align-items:center;gap:25px;padding:15px 1.4% 28px;color:var(--paper)}
.carousel-count{font:700 15px Manrope,sans-serif;letter-spacing:1px;font-variant-numeric:tabular-nums;white-space:nowrap;min-width:95px}
.carousel-count span{font-weight:400;color:#a5a09b;margin-left:9px}
.carousel-positions{display:flex;align-items:center;gap:6px}
.carousel-positions button{position:relative;width:28px;height:32px;padding:0;color:inherit}
.carousel-positions button:after{content:'';position:absolute;left:0;right:0;top:15px;height:2px;background:#565451;transition:background .25s,transform .25s}
.carousel-positions button[aria-current=true]:after{background:var(--red);transform:scaleY(2)}
.carousel-positions button:hover:after{background:var(--paper)}
.carousel-hint{margin-left:auto;color:#a5a09b;font-size:9px;letter-spacing:1px;text-transform:uppercase}
.carousel-arrows{display:flex;gap:10px;margin-left:auto}
.carousel-arrows button{display:grid;place-items:center;width:48px;height:48px;border:1px solid #66605b;border-radius:50%;font:400 25px Manrope,sans-serif;color:var(--paper);transition:background .25s,transform .25s,border-color .25s}
.carousel-arrows button:hover{background:var(--red);border-color:var(--red);transform:translateY(-2px)}
.carousel-arrows button:active{transform:scale(.94)}
.carousel-controls button:focus-visible{outline:2px solid var(--red);outline-offset:5px}
.project-carousel[data-static=true] .carousel-arrows,.project-carousel[data-static=true] .carousel-positions,.project-carousel[data-static=true] .carousel-hint{display:none}
.project-carousel[data-static=true] .posters{cursor:auto}
@media(max-width:1099px){.project-carousel{--visible:2;--gap:9px}.project-carousel .posters .poster{height:clamp(540px,70vw,740px)}}
@media(max-width:620px){.project-carousel{--visible:1;--gap:14px;--cut:0}.project-carousel .posters .poster{height:clamp(490px,135vw,630px);clip-path:polygon(9% 0,100% 0,91% 100%,0 100%)}.carousel-controls{gap:12px;padding:8px 2% 22px}.carousel-count{font-size:12px;min-width:80px}.carousel-count span{margin-left:6px}.carousel-positions{gap:4px}.carousel-positions button{width:17px}.carousel-hint{display:none}.carousel-arrows{gap:7px}.carousel-arrows button{width:40px;height:40px;font-size:22px}.project-carousel .poster-game{bottom:86px}}
@media(prefers-reduced-motion:reduce){.project-carousel *{transition:none!important}.project-carousel.is-moving .poster .poster-art{transform:none}}

.carousel-arrows [data-carousel-play]{font-size:18px;color:#aaa59e;border-color:#45423f}
.carousel-arrows [data-carousel-play]:hover{color:var(--paper)}
@media(max-width:620px){.carousel-controls{gap:8px}.carousel-count{min-width:68px}.carousel-positions{gap:4px}.carousel-positions button{width:10px}.carousel-arrows{gap:6px}}