/* Photographic functional examples. Keep the existing card geometry and routing. */
.cl-home .pc-scene{position:relative;isolation:isolate;overflow:hidden;width:100%;height:100%;container-type:inline-size;background:#ecebee!important;border-radius:inherit}
.cl-home .pc-scene>img,.cl-home .pc-scene>video{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:cover}
.cl-home .pc-scene .cl-media-label{position:absolute;left:6%;top:7%;z-index:5;color:white;text-shadow:0 1px 8px #0009;font-weight:500}
.cl-home .cl-showcase .pc-scene .cl-media-label{display:none}
.cl-home .cl-showcase-row:nth-child(2) .cl-tile:has(.pc-packaging),.cl-home .cl-showcase-row:nth-child(2) .cl-tile:has(.pc-lineart){width:408.34px}
.pc-scene:after{content:"";position:absolute;inset:0 0 auto;height:27%;background:linear-gradient(#0003,transparent);pointer-events:none;z-index:3}
.pc-caption{position:absolute;z-index:4;bottom:5%;left:50%;transform:translateX(-50%);max-width:94%;white-space:nowrap;border-radius:99px;padding:1.5% 4%;background:#fffffff0;color:#444b53;font:2.8cqw/1.4 system-ui}
.cl-home .pc-cutout{background:#f0efed!important}.pc-backdrop,.pc-checker{position:absolute;inset:0}.pc-backdrop{background:radial-gradient(ellipse at 37% 27%,#f5e7d6,#b59984)}
.pc-checker{background:conic-gradient(#dedfdf 25%,#f8f8f8 0 50%,#dedfdf 0 75%,#f8f8f8 0) 0 0/5cqw 5cqw;clip-path:inset(0 100% 0 0);animation:pc-reveal 3.6s ease-in-out infinite}
.cl-home .pc-cutout>img{object-fit:contain;padding:7% 12% 12%}
.pc-soft{filter:blur(3px)}.pc-sharp,.pc-lines{clip-path:inset(0 100% 0 0);animation:pc-reveal 3.6s ease-in-out infinite}
.pc-scan{position:absolute;z-index:2;top:0;bottom:0;left:0;width:1px;background:#fffffff0;box-shadow:0 0 10px #ffffff90;animation:pc-scan 3.6s ease-in-out infinite}
.cl-home .pc-scene *{animation-play-state:var(--cl-motion-state,running)!important}
@keyframes pc-reveal{0%,15%{clip-path:inset(0 100% 0 0)}65%,88%{clip-path:inset(0 0 0 0)}100%{clip-path:inset(0 100% 0 0)}}
@keyframes pc-scan{0%,15%{left:0;opacity:0}20%{opacity:1}65%{left:100%;opacity:1}70%,100%{left:100%;opacity:0}}
@media(prefers-reduced-motion:reduce){.cl-home .pc-scene *{animation:none!important}.pc-sharp,.pc-lines,.pc-checker{clip-path:inset(0)}.pc-scan{display:none}}
@media(max-width:760px){.cl-home .cl-showcase-row:nth-child(2) .cl-tile:has(.pc-packaging),.cl-home .cl-showcase-row:nth-child(2) .cl-tile:has(.pc-lineart){width:310px}}