.app-showcase {
  position: relative;
  overflow: hidden;
  padding: clamp(82px,9vw,138px) 0 clamp(92px,10vw,150px);
  color: #f6fbff;
  background:
    radial-gradient(circle at 12% 24%,rgba(111,75,255,.13),transparent 28%),
    radial-gradient(circle at 88% 62%,rgba(31,211,255,.1),transparent 30%),
    linear-gradient(180deg,#030712 0%,#07101e 50%,#030712 100%);
  isolation: isolate;
}
.app-showcase::before { position:absolute;inset:0;z-index:-1;opacity:.38;pointer-events:none;content:"";background-image:linear-gradient(rgba(114,183,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(114,183,255,.035) 1px,transparent 1px);background-size:48px 48px;mask-image:linear-gradient(90deg,transparent,#000 18%,#000 82%,transparent); }
.app-showcase-head { display:flex;align-items:end;justify-content:space-between;gap:36px;width:min(1500px,calc(100% - 48px));margin:0 auto 42px; }
.app-showcase-kicker { margin:0 0 12px;color:#75e7ff;font:700 12px/1.2 ui-monospace,monospace;letter-spacing:.17em;text-transform:uppercase; }.app-showcase-kicker span{margin-right:10px;color:#a78bfa}.app-showcase h2{margin:0;font-size:clamp(38px,4.2vw,68px);line-height:1.08;letter-spacing:-.045em}.app-showcase h2 em{color:transparent;background:linear-gradient(100deg,#74eaff,#a78bfa 54%,#ff9c73);background-clip:text;-webkit-background-clip:text;font-style:normal}.app-showcase-intro{max-width:480px;margin:0;color:rgba(202,222,240,.68);font-size:16px;line-height:1.9}
.app-showcase-controls { display:flex;gap:10px;flex:0 0 auto; }.app-showcase-arrow{display:grid;width:48px;height:48px;padding:0;place-items:center;border:1px solid rgba(119,205,255,.22);border-radius:50%;color:#dff8ff;background:rgba(9,23,43,.82);font-size:23px;cursor:pointer;transition:.25s ease}.app-showcase-arrow:hover{transform:translateY(-2px);border-color:rgba(92,230,255,.65);background:rgba(25,68,101,.75);box-shadow:0 0 24px rgba(49,211,255,.15)}
.app-showcase-rail { display:flex;gap:22px;overflow-x:auto;overscroll-behavior-inline:contain;scroll-behavior:smooth;scroll-snap-type:x mandatory;padding:8px max(24px,calc((100vw - 1500px)/2)) 30px;scrollbar-width:none;cursor:grab; }.app-showcase-rail::-webkit-scrollbar{display:none}.app-showcase-rail:active{cursor:grabbing}
.app-case-card { position:relative;flex:0 0 clamp(238px,18vw,282px);overflow:hidden;border:1px solid rgba(132,190,238,.16);border-radius:26px;background:linear-gradient(155deg,rgba(13,27,48,.94),rgba(5,11,24,.97));box-shadow:0 28px 80px rgba(0,0,0,.36),inset 0 1px 0 rgba(255,255,255,.06);scroll-snap-align:center;transition:transform .35s ease,border-color .35s ease,box-shadow .35s ease}.app-case-card:hover{transform:translateY(-8px);border-color:rgba(var(--case-rgb),.52);box-shadow:0 35px 100px rgba(0,0,0,.48),0 0 38px rgba(var(--case-rgb),.12)}
.app-preview { position:relative;display:block;width:100%;height:auto;aspect-ratio:9/16;padding:0;overflow:hidden;border:0;border-bottom:1px solid rgba(132,190,238,.13);background:#07101f;cursor:zoom-in }.app-preview::before{position:absolute;inset:-18px;z-index:0;background-image:linear-gradient(rgba(3,8,18,.18),rgba(3,8,18,.42)),var(--preview-image);background-position:center;background-size:cover;filter:blur(16px) saturate(.9);content:"";transform:scale(1.08)}.app-preview::after{position:absolute;inset:auto 16px 16px auto;z-index:2;display:grid;width:40px;height:40px;place-items:center;border:1px solid rgba(255,255,255,.26);border-radius:50%;color:#fff;background:rgba(3,8,18,.65);backdrop-filter:blur(10px);font-size:19px;content:"↗";transition:.25s ease}.app-preview:hover::after{transform:scale(1.08);background:rgba(var(--case-rgb),.72)}.app-preview img{position:relative;z-index:1;display:block;width:100%;height:100%;object-fit:contain;object-position:center top;transition:transform 1.1s cubic-bezier(.2,.75,.2,1),filter .3s ease}.app-preview:hover img{transform:scale(1.012);filter:saturate(1.06)}
.app-case-copy { min-height:132px;padding:16px 18px 17px }.app-case-type{display:block;margin-bottom:6px;color:rgb(var(--case-rgb));font:700 9px/1.2 ui-monospace,monospace;letter-spacing:.11em}.app-case-copy h3{margin:0 0 6px;color:#f5fbff;font-size:18px;line-height:1.25;letter-spacing:-.01em}.app-case-copy p{display:-webkit-box;margin:0;padding-right:32px;overflow:hidden;color:rgba(198,218,236,.62);font-size:12px;line-height:1.55;-webkit-box-orient:vertical;-webkit-line-clamp:2}.app-case-index{position:absolute;right:17px;bottom:17px;color:rgba(190,215,235,.2);font:700 10px/1 ui-monospace,monospace}
.app-showcase-progress { position:relative;width:min(1500px,calc(100% - 48px));height:2px;margin:14px auto 0;overflow:hidden;background:rgba(134,188,232,.12) }.app-showcase-progress i{display:block;width:10%;height:100%;background:linear-gradient(90deg,#5ce6ff,#9e7aff,#ff9a70);box-shadow:0 0 18px #6bdfff;transform:translateX(var(--gallery-progress,0%));transition:transform .12s linear}
.app-lightbox { position:fixed;inset:0;z-index:1000;display:none;align-items:center;justify-content:center;padding:28px;background:rgba(1,4,12,.9);backdrop-filter:blur(18px) }.app-lightbox.is-open{display:flex}.app-lightbox-dialog{position:relative;display:flex;max-width:92vw;max-height:92vh;align-items:center;justify-content:center}.app-lightbox img{display:block;width:auto;height:auto;max-width:92vw;max-height:92vh;object-fit:contain;object-position:center;border:1px solid rgba(147,210,255,.28);border-radius:24px;box-shadow:0 40px 120px rgba(0,0,0,.72)}.app-lightbox-close{position:absolute;top:-16px;right:-16px;z-index:2;display:grid;width:44px;height:44px;padding:0;place-items:center;border:1px solid rgba(154,215,255,.3);border-radius:50%;color:#fff;background:#071225;font-size:24px;cursor:pointer}
@media(max-width:900px){.app-showcase-head{align-items:start;flex-direction:column;width:min(100% - 32px,720px);margin-bottom:30px}.app-showcase-intro{font-size:15px}.app-showcase-controls{align-self:flex-end}.app-showcase-rail{gap:16px;padding-inline:16px}.app-case-card{flex-basis:min(72vw,276px)}.app-preview{height:auto;aspect-ratio:9/16}.app-case-copy{min-height:128px;padding:15px 17px 16px}.app-case-copy h3{font-size:18px}.app-case-copy p{font-size:12px}.app-showcase-progress{width:calc(100% - 32px)}}
@media(prefers-reduced-motion:reduce){.app-showcase-rail{scroll-behavior:auto}.app-case-card,.app-preview img,.app-showcase-arrow{transition:none}}