/* Tusu Works reference: one level strip, unequal image heights, compact captions. */
.about-page .studio-evidence.project-showcase{display:block;padding:clamp(80px,7vw,134px) 0 clamp(80px,7vw,134px);background:var(--musou-page);color:var(--musou-ink);overflow:visible;border:0}
.project-showcase-heading{text-align:center;padding:0 var(--agency-gutter);margin-bottom:60px}
.project-showcase-heading h2{font-size:clamp(84px,10vw,192px);font-weight:600;line-height:.95;letter-spacing:-.04em;text-transform:uppercase;margin:0;text-wrap:balance}
.project-showcase-heading p{font-size:12px;line-height:1.5;font-weight:500;text-transform:uppercase;letter-spacing:.04em;margin:24px 0 0}
.project-showcase-scene{position:relative;margin:0 var(--agency-gutter)}
.project-showcase-stage{position:relative}
.project-showcase-controls{display:none}
.project-showcase-controls[hidden]{display:none!important}
.project-showcase-track{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:50px 20px;align-items:start;padding:0;margin:0;list-style:none}
.showcase-project{min-width:0}
.showcase-project a{display:block;color:inherit;text-decoration:none;outline-offset:8px}
.showcase-project a:focus-visible{outline:2px solid currentColor}
.showcase-project figure{position:relative;margin:0;overflow:hidden;isolation:isolate;background:var(--musou-soft);aspect-ratio:calc(1 / var(--showcase-ratio))}
.showcase-project img{display:block;width:100%;height:100%;object-fit:cover;transform:none;border:0;border-radius:0}
.showcase-project h3{margin:20px 0 0;font-size:clamp(20px,1.25vw,24px);font-weight:600;letter-spacing:-.02em;line-height:1.2;text-transform:uppercase}
.showcase-project h3 span{background-image:linear-gradient(currentColor,currentColor);background-position:0 100%;background-size:0 1px;background-repeat:no-repeat;transition:background-size .45s cubic-bezier(.16,1,.3,1);padding-bottom:3px}
.showcase-project a:hover h3 span,.showcase-project a:focus-visible h3 span{background-size:100% 1px}
.showcase-project .showcase-missing{display:flex;align-items:center;justify-content:center;height:100%;padding:24px;font-size:24px}
/* Enhancement owns only the new strip. Its clipping stage is inside the sticky box. */
.project-showcase.is-scroll-showcase{--showcase-top:clamp(64px,10svh,100px);--showcase-width:clamp(280px,21.458vw,460px);--showcase-unit:min(var(--showcase-width),calc((100svh - var(--showcase-top) - 100px)*.8655))}
.is-scroll-showcase .project-showcase-stage{position:sticky;top:var(--showcase-top);overflow:clip;/* Focus outlines have their own inner space. */padding:10px;margin:-10px}
.is-scroll-showcase .project-showcase-track{display:flex;gap:20px;width:max-content;transform:translate3d(var(--showcase-x,0px),0,0);will-change:transform}
.is-scroll-showcase .showcase-project{width:var(--showcase-width);flex:none}
.is-scroll-showcase .showcase-project figure{height:calc(var(--showcase-unit)*var(--showcase-ratio));aspect-ratio:auto;clip-path:inset(var(--showcase-mask,0%) 0);will-change:clip-path}
.is-scroll-showcase .showcase-project img{transform:scale(var(--showcase-scale,1));filter:blur(var(--showcase-blur,0px))}
@media(max-width:900px), (max-width:1100px) and (hover:none) and (pointer:coarse){
 .project-showcase{--showcase-width:clamp(224px,76vw,360px);--showcase-unit:min(var(--showcase-width),55svh)}
 .project-showcase-heading{margin-bottom:40px}
 .project-showcase-heading h2{font-size:clamp(72px,19vw,130px)}
 .project-showcase-stage{overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x proximity;scroll-padding-inline:var(--agency-gutter);margin-inline:calc(-1*var(--agency-gutter));padding:8px var(--agency-gutter) 20px;width:100vw;scrollbar-width:thin;scrollbar-color:var(--agency-rule) transparent}
 .project-showcase-track{display:flex;gap:18px;width:max-content;align-items:start}
 .showcase-project{width:var(--showcase-width);flex:none;scroll-snap-align:start}
 .showcase-project figure{height:calc(var(--showcase-unit)*var(--showcase-ratio));max-height:none;aspect-ratio:auto;clip-path:inset(var(--showcase-mask,0%) 0)}
 .showcase-project img{transform:scale(var(--showcase-scale,1))}
 .showcase-project h3{font-size:22px;margin-top:16px}
 .project-showcase-controls{display:flex;justify-content:flex-start;gap:12px;margin-top:28px}
 .project-showcase-controls button{display:grid;place-items:center;width:50px;height:50px;padding:0;border:1px solid currentColor;border-radius:50%;background:transparent;color:inherit;cursor:pointer;transition:opacity 180ms ease,background-color 180ms ease}
 .project-showcase-controls svg{width:22px;height:22px}
 .project-showcase-controls button:disabled{opacity:.3;cursor:default}
 .project-showcase-controls button:focus-visible{outline:2px solid currentColor;outline-offset:5px}
 .project-showcase-controls button:active:not(:disabled){background:var(--musou-soft)}
}
@media(min-width:701px) and (max-width:900px), (min-width:701px) and (max-width:1100px) and (hover:none) and (pointer:coarse){
 .project-showcase{--showcase-width:clamp(360px,62vw,520px)}
}
@media(prefers-reduced-motion:reduce){.showcase-project h3 span,.project-showcase-controls button{transition:none}.showcase-project figure{clip-path:none!important}.showcase-project img{transform:none!important;filter:none!important}.project-showcase-stage{scroll-snap-type:none}}
@media print{
 .project-showcase-controls{display:none!important}
 .about-page .studio-evidence.project-showcase{padding:40px 0;background:white;color:black;break-inside:auto}
 .project-showcase-heading h2{font-size:64px}
 .project-showcase-scene{height:auto!important}
 .project-showcase .project-showcase-stage{position:static;overflow:visible;margin:0;padding:0;width:auto;scroll-snap-type:none}
 .project-showcase .project-showcase-track{display:grid;width:auto;transform:none;will-change:auto;grid-template-columns:1fr 1fr}
 .project-showcase .showcase-project{width:auto;break-inside:avoid}
 .project-showcase .showcase-project figure{height:auto;aspect-ratio:calc(1 / var(--showcase-ratio));clip-path:none;will-change:auto}
 .project-showcase .showcase-project img{filter:none;transform:none}
}
