.app-showcase{position:relative;background:radial-gradient(ellipse at 50% 50%,#35213b40,transparent 65%)}
.showcase-heading{display:grid;grid-template-columns:1.3fr 1fr;gap:64px;align-items:end;margin-bottom:40px}
.showcase-heading .eyebrow{margin:0 0 24px;font-size:11px;letter-spacing:2px;color:#d7bc80}.showcase-heading .eyebrow span{padding-inline:8px;color:#796883}
.showcase-kicker{color:#c9b5d4;font-size:15px;margin:0 0 10px}
.showcase-heading h2{font-size:clamp(34px,3.6vw,52px);letter-spacing:-1.8px;line-height:1.12;margin:0;max-width:590px;font-weight:400}
.showcase-intro{font-size:16px;line-height:1.8;color:#b8a9c4;margin:0;max-width:410px;justify-self:end}
.showcase-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.showcase-card{--glow:#8644a5;--tint:#2b193c;position:relative;min-width:0;border:1px solid #a78ab52e;border-radius:24px;background:linear-gradient(145deg,var(--tint),#160e21 75%);overflow:hidden}
.showcase-tone-1{--glow:#6271be;--tint:#20243f}.showcase-tone-2{--glow:#a57e43;--tint:#302638}
.showcase-copy{padding:28px 28px 0;min-height:215px}
.showcase-category{display:flex;align-items:center;justify-content:space-between;gap:12px;color:#e5ce9d;font-size:13px;margin:0 0 22px}.showcase-number{font-size:11px;color:#b8a5c2;letter-spacing:2px}
.showcase-copy h3{font-size:clamp(22px,2vw,28px);line-height:1.25;font-weight:400;letter-spacing:-.65px;margin:0 0 13px;max-width:290px}
.showcase-description{font-size:14px;line-height:1.7;color:#bcaec9;margin:0;max-width:300px}
.showcase-screen{position:relative;isolation:isolate;display:flex;justify-content:center;align-items:center;height:435px;margin:14px 10px 10px;border-radius:18px;text-decoration:none;overflow:hidden;cursor:zoom-in}
.showcase-screen::before{content:"";position:absolute;z-index:-1;width:100%;height:90%;background:radial-gradient(ellipse,var(--glow),transparent 68%);opacity:.4}
.showcase-orbit{position:absolute;z-index:-1;width:340px;height:340px;border:1px solid #dcc3eb17;border-radius:50%;transform:translateY(45px)}
.showcase-orbit::after{content:"";position:absolute;inset:26px;border:1px solid #dcc3eb12;border-radius:50%}
.showcase-screen img{height:394px;width:auto;max-width:80%;object-fit:contain;border:5px solid #36263d;border-radius:25px;box-shadow:0 22px 40px #08040f99,0 0 0 1px #b79acc50;transition:transform .25s ease,border-color .25s ease}
.showcase-tone-0 .showcase-screen img{transform:rotate(-4deg)}.showcase-tone-2 .showcase-screen img{transform:rotate(4deg)}
.showcase-expand{position:absolute;bottom:14px;right:14px;display:grid;place-items:center;width:42px;height:42px;border-radius:50%;border:1px solid #b99cc54d;background:#24182ef0;color:#eee0ca;transition:background .2s ease}
.showcase-screen:focus-visible{outline-offset:-4px}.showcase-screen:focus-visible img{transform:translateY(-5px);border-color:#776184}
@media(hover:hover){.showcase-screen:hover img{transform:translateY(-5px);border-color:#776184}.showcase-screen:hover .showcase-expand{background:#634576}}
.showcase-footer{display:flex;justify-content:space-between;gap:20px;align-items:center;margin-top:24px}.showcase-footer p{margin:0;color:#ac9cba;font-size:13px}.showcase-footer .text-link{font-size:14px}.showcase-mobile-hint{display:none}
.showcase-dialog{padding:20px 24px;width:min(540px,calc(100% - 24px));max-height:calc(100dvh - 24px);border:1px solid #8c719955;border-radius:22px;background:#180f24;color:#f4edde;box-shadow:0 24px 100px #000a;overscroll-behavior:contain}
.showcase-dialog::backdrop{background:#08040ee8}.showcase-dialog-top{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:16px}.showcase-dialog-top p{margin:0;font-size:20px}.showcase-dialog button{display:grid;place-items:center;flex-shrink:0;width:44px;height:44px;border:1px solid #ad90bf50;border-radius:50%;background:#2a1b38;color:#f4edde;cursor:pointer}.showcase-dialog button:disabled{opacity:.35;cursor:default}
.showcase-dialog-image{height:auto;max-height:calc(100dvh - 245px);width:auto;max-width:100%;margin-inline:auto;object-fit:contain;border-radius:12px}
#showcase-dialog-description{font-size:14px;line-height:1.5;color:#c9b7d5;text-align:center;margin:16px auto;max-width:390px}.showcase-dialog-nav{display:flex;align-items:center;justify-content:center;gap:30px}.showcase-dialog-nav span{font-size:13px;color:#d9c39c;min-width:40px;text-align:center}
@media(max-width:1050px){.showcase-heading{gap:32px}.showcase-copy{padding:22px 20px 0;min-height:235px}.showcase-grid{gap:14px}.showcase-screen{height:390px}.showcase-screen img{height:350px}.showcase-copy h3{font-size:23px}}
@media(max-width:760px){.showcase-heading{grid-template-columns:1fr;gap:20px;margin-bottom:28px}.showcase-heading h2{font-size:38px;max-width:430px}.showcase-heading .eyebrow{margin-bottom:20px}.showcase-intro{justify-self:start;font-size:15px;max-width:460px}.showcase-grid{display:flex;gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding-inline:20px;overscroll-behavior-x:contain;margin-inline:-20px;padding:5px 20px 18px;scrollbar-width:thin;scrollbar-color:#756080 #21152e}.showcase-card{flex:0 0 86%;max-width:365px;scroll-snap-align:center}.showcase-copy{padding:24px 24px 0;min-height:208px}.showcase-copy h3{font-size:25px}.showcase-screen{height:400px;margin-top:4px}.showcase-screen img{height:368px}.showcase-footer{align-items:start;flex-direction:column;gap:14px;margin-top:18px}.showcase-desktop-hint{display:none}.showcase-mobile-hint{display:inline}.showcase-mobile-hint span{margin-left:8px;color:#dfc28d}}
@media(max-width:360px){.showcase-heading h2{font-size:33px}.showcase-copy{padding:22px 20px 0;min-height:235px}.showcase-screen{height:350px}.showcase-screen img{height:320px}.showcase-copy h3{font-size:23px}}
@media(prefers-reduced-motion:reduce){html:has(.app-showcase){scroll-behavior:auto}.showcase-screen img,.showcase-expand{transition:none}.showcase-grid{scroll-behavior:auto}}