.sr-only{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.client-carousel{position:relative;padding:18px 42px 10px;--client-slots:6}
.carousel-controls{display:contents}.carousel-controls button{border:1px solid #d7d2c7;color:#333;background:#fcfaf5;width:32px;height:32px;border-radius:50%;display:grid;place-items:center;font-size:18px}
[data-client-prev],[data-client-next]{position:absolute;top:50%;transform:translateY(-50%);z-index:2}[data-client-prev]{left:0}[data-client-next]{right:0}
.carousel-controls [data-client-pause]{position:absolute;right:42px;top:-25px;width:23px;height:23px;font-size:9px;border-color:transparent;color:#94836b;background:transparent}
.carousel-controls button:hover{background:#f4ead2;border-color:var(--accent)}.carousel-controls button:disabled{opacity:.3;cursor:default}
.client-viewport{overflow:hidden;touch-action:pan-y}.client-track{display:flex;align-items:center;will-change:transform}
.client-track>.client{flex:0 0 calc(100% / min(var(--client-slots),var(--client-count,6)));padding:0 12px;min-width:0}.client-track>.client .design-thumb{max-width:100%;flex-shrink:0}
.portrait-sample{width:100%;height:100%;background-image:url('/assets/portrait-interviews.png');background-size:300% 100%;background-repeat:no-repeat}
.client-track>.client img{width:100%;max-height:65px;object-fit:contain}.client-track>.client strong{font-size:14px;overflow-wrap:anywhere}
.cards.portrait-stories,.home-page .cards.portrait-stories{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:26px;max-width:1040px;margin:0 auto}
.portrait-stories .content-card:first-child{grid-row:auto}.portrait-poster{aspect-ratio:9/16;position:relative;overflow:hidden;background:#242623;border-radius:7px}
.portrait-stories .video-trigger{border-radius:7px;overflow:hidden}
.portrait-poster>img,.home-page .portrait-poster>img{width:100%;height:100%;aspect-ratio:9/16!important;object-fit:cover}
/* Preserve a sample image's native crop before centering it in the portrait frame. */
.portrait-poster>.design-thumb,.home-page .portrait-poster>.design-thumb,.inner-page .portrait-poster>.design-thumb{position:absolute;left:50%;top:0;transform:translateX(-50%);height:100%;width:auto;aspect-ratio:var(--sample-ratio)!important}
.portrait-stories .play,.home-page .portrait-stories .play{display:grid;width:64px;height:64px;font-size:22px}
.portrait-stories .duration{display:block}.portrait-stories .sample-card .duration{display:none}
.portrait-stories .card-copy,.home-page .portrait-stories .card-copy{padding:13px 0 6px}
.portrait-stories .card-copy h3,.home-page .portrait-stories .card-copy h3{font-size:15px;margin-bottom:5px}
.portrait-stories .card-copy p,.home-page .portrait-stories .card-copy p{font-size:11px;line-height:1.5}
dialog.portrait-video{width:min(440px,calc(76dvh * 9 / 16 + 28px),90vw);padding:42px 14px 12px;max-height:94dvh;overflow:auto}
dialog.portrait-video #video-container iframe,dialog.portrait-video #video-container video{width:100%;height:auto;aspect-ratio:9/16;object-fit:contain;background:#000}
@media(max-width:1000px){.client-carousel{--client-slots:4}.cards.portrait-stories,.home-page .cards.portrait-stories{gap:18px}}
@media(max-width:640px){.client-carousel{--client-slots:2;padding:15px 34px}.client-track>.client{padding:0 10px}.cards.portrait-stories,.home-page .cards.portrait-stories{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:16px;padding-bottom:12px;max-width:100%}.portrait-stories>.content-card{flex:0 0 76%;scroll-snap-align:start}.portrait-stories .card-copy h3,.home-page .portrait-stories .card-copy h3{font-size:14px}.carousel-controls [data-client-pause]{right:34px}.portrait-stories .play,.home-page .portrait-stories .play{width:55px;height:55px}}
@media(prefers-reduced-motion:reduce){.client-track{transition:none!important}}
/* Homepage work and team share the accessible client-carousel controller. */
.home-page .content-carousel{padding:0 38px;--client-slots:3}
.home-page .carousel-team{--client-slots:4}
.home-page .content-carousel .client-track{display:flex;gap:0;align-items:stretch}
.home-page .content-carousel .client-track>.content-card{flex:0 0 calc(100% / min(var(--client-slots),var(--client-count,3)));min-width:0;border:7px solid transparent;background-clip:padding-box}
.content-carousel .carousel-controls button{background:#202421;color:#f8f5ee;border-color:#635b47}
.content-carousel .carousel-controls button:hover{background:#38362b;border-color:var(--accent)}
.content-carousel .carousel-controls [data-client-pause]{top:-26px;background:transparent}
@media(max-width:900px){.home-page .carousel-team{--client-slots:3}.home-page .content-carousel .cards-projects .content-card{height:clamp(190px,26vw,260px)}}
@media(max-width:640px){.home-page .content-carousel{--client-slots:1;padding:0 28px}.home-page .content-carousel .client-track>.content-card{border-width:0 5px}.home-page .content-carousel .cards-projects .content-card{height:280px}.content-carousel .carousel-controls [data-client-pause]{right:28px}}
/* Screenshot-based preview crops retain their native ratio inside equal-width cards. */
.home-page .content-carousel .project-image{position:relative;overflow:hidden;display:block}
.home-page .content-carousel .project-image>.design-thumb{position:absolute;top:0;left:50%;transform:translateX(-50%);height:100%;width:auto;aspect-ratio:var(--sample-ratio)}