.system-showcase{background:linear-gradient(145deg,#f4f9fc,#fff 60%,#edf8f8);overflow:hidden}
.showcase-heading{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;margin-bottom:28px}
.showcase-eyebrow{display:block;color:#168293;letter-spacing:.12em;font-size:12px;margin-bottom:10px}
.showcase-heading h2{font-size:30px;color:#173349;margin:0 0 10px}.showcase-heading p{margin:0;color:#637889}
.showcase-controls{display:flex;gap:10px}.showcase-controls button{width:42px;height:42px;border:1px solid #d1e3e9;border-radius:50%;background:#fff;color:#173349;font-size:20px;cursor:pointer}.showcase-controls button:hover{background:#173349;color:#fff}.showcase-controls button:disabled{opacity:.35;cursor:default}
.showcase-viewport{overflow:hidden;padding:10px 0 16px;touch-action:pan-y}.showcase-track{display:flex;width:max-content;will-change:transform}.showcase-group{display:flex;gap:18px;padding-right:18px;flex-shrink:0}
.showcase-card{display:block;flex:0 0 auto;width:clamp(260px,32vw,400px);padding:9px;border:1px solid #dae7ed;border-radius:14px;background:#ffffffd9;box-shadow:0 6px 16px #1733490a;color:#173349;text-decoration:none!important;transition:box-shadow .2s,border-color .2s}
.showcase-card:hover,.showcase-card:focus-visible{border-color:#3a9fb2;box-shadow:0 9px 24px #1733491a;outline:2px solid #67cfdf;outline-offset:2px}
.showcase-image-wrap{display:flex;align-items:center;justify-content:center;aspect-ratio:16/10;border-radius:8px;overflow:hidden;background:#edf3f7}.showcase-card img{display:block;width:100%;height:100%;object-fit:contain}.showcase-card-label{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:13px;padding:12px 5px 4px}
.showcase-status{margin:12px 0 0;color:#6b8191;font-size:13px}.showcase-status[hidden]{display:none}
.showcase-lightbox{position:fixed;inset:0;margin:auto;width:min(1440px,94vw);height:min(960px,92vh);height:min(960px,92dvh);max-width:94vw;max-height:92vh;padding:0;border:1px solid #65839366;border-radius:16px;background:#102532;color:#fff;box-shadow:0 24px 100px #0008;overflow:hidden}
.showcase-lightbox[open]{display:flex;flex-direction:column}.showcase-lightbox::backdrop{background:#06131edb;backdrop-filter:blur(7px)}
.showcase-lightbox-toolbar,.showcase-lightbox-footer{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:12px 18px;flex-shrink:0;background:#173349}
.showcase-caption{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:14px}.showcase-lightbox button{border:0;color:#fff;background:#ffffff0e;cursor:pointer;border-radius:8px;font-family:inherit}.showcase-lightbox button:hover{background:#ffffff25}.showcase-lightbox button:focus-visible{outline:2px solid #20e2ed}.showcase-lightbox [data-showcase-close]{width:38px;height:38px;font-size:28px;flex-shrink:0}
.showcase-full-stage{position:relative;min-height:0;flex:1;display:flex;align-items:center;justify-content:center;padding:8px 52px}.showcase-original{display:block;max-width:100%;max-height:100%;width:100%;height:100%;object-fit:contain}.showcase-full-stage button{position:absolute;top:calc(50% - 30px);width:40px;height:60px;font-size:40px;z-index:1}.showcase-full-stage [data-image-prev]{left:6px}.showcase-full-stage [data-image-next]{right:6px}
.showcase-lightbox-footer{font-size:12px;color:#b3cbd8}.showcase-original-link{color:#79e6ed!important}.showcase-lightbox button:disabled{visibility:hidden}
@media(max-width:575px){.showcase-heading{align-items:center;gap:14px}.showcase-heading h2{font-size:24px}.showcase-heading p{font-size:13px}.showcase-controls{gap:6px}.showcase-controls button{width:34px;height:34px}.showcase-card{width:78vw}.showcase-full-stage{padding:6px 36px}.showcase-full-stage button{width:28px;height:50px;font-size:30px}.showcase-lightbox-toolbar,.showcase-lightbox-footer{padding:10px 12px}.showcase-lightbox-footer{gap:8px}}
@media(prefers-reduced-motion:reduce){.showcase-card{transition:none}}