/* WebsiteBU: two readable faces with a restrained 3D turn. */
.hero-showcase{min-width:0;width:100%;position:relative;color:#e7eef5;--showcase-turn:900ms}
.showcase-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:22px}
.showcase-kicker{display:flex;align-items:center;gap:8px;font-size:9px;letter-spacing:1.3px;color:#b8cad9;white-space:nowrap;font-weight:700}
.showcase-kicker>.icon{width:15px;height:15px;color:#ecaa62}
.showcase-faces{display:flex;gap:3px;padding:3px;border:1px solid #6d829648;border-radius:6px;background:#10273d80}
.showcase-faces button{background:transparent;color:#bccbd8;border:0;font-size:10px;border-radius:3px;white-space:nowrap;padding:7px 11px;line-height:1.5}
.showcase-faces button[aria-pressed=true]{background:#fff;color:#1a354d;box-shadow:0 1px 4px #0002}
.showcase-faces button:disabled{opacity:.4;cursor:not-allowed}
.showcase-stage{perspective:1500px;position:relative}
.showcase-card{min-width:0}
.showcase-rotor{position:relative;width:100%;aspect-ratio:1200/850;transform-style:preserve-3d;transition:transform var(--showcase-turn) cubic-bezier(.45,.02,.22,1);transform:rotateY(0deg)}
.showcase-card.is-back .showcase-rotor{transform:rotateY(180deg)}
.showcase-face{position:absolute;inset:0;display:grid;grid-template-rows:38px minmax(0,1fr) 36px;background:#f2f5f8;border:1px solid #c8d5e0;border-radius:10px;overflow:hidden;box-shadow:0 25px 40px #0003,0 4px 0 #9fb1c9;backface-visibility:hidden;-webkit-backface-visibility:hidden;transform:translateZ(2px);color:#19364d;text-decoration:none}
.showcase-back{transform:rotateY(180deg) translateZ(2px)}
.showcase-window{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:0 14px;background:#f0f4f7;border-bottom:1px solid #dce4eb;font-size:10px;color:#496477}
.showcase-dots{display:flex;gap:5px;direction:ltr}.showcase-dots i{display:block;width:6px;height:6px;background:#9aacbd;border-radius:50%}.showcase-dots i:first-child{background:#e4aa7b}
.showcase-window-brand{font-size:8px;letter-spacing:1px;color:#688093}
.showcase-image{min-height:0;background:#eaf0f5;overflow:hidden}
.showcase-image img{width:100%;height:100%;object-fit:contain;display:block}
.showcase-face-caption{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:0 14px;border-top:1px solid #dce4eb;background:white;font-size:9px;color:#4e687c}
.showcase-face-caption>span:last-child{display:flex;align-items:center;gap:6px;color:#1a577f}
.showcase-face-caption .icon{width:12px;height:12px}
.showcase-product{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-top:24px;padding:0 2px;color:white}
.showcase-product small{display:block;color:#a9c0d3;font-size:9px;letter-spacing:.4px;margin-bottom:5px}
.showcase-product strong{display:block;font-size:17px;line-height:1.5;font-weight:700}
.showcase-product-arrow{display:grid;place-items:center;flex:none;width:33px;height:33px;border:1px solid #7893a65c;border-radius:50%;color:#ffc17d}.showcase-product-arrow>.icon{width:16px;height:16px}
.showcase-product:hover strong{text-decoration:underline;text-underline-offset:5px}
.showcase-bottom{display:flex;align-items:center;justify-content:space-between;gap:14px;border-top:1px solid #6e8ba233;margin-top:21px;padding-top:14px}
.showcase-playback{display:flex;align-items:center;gap:11px;min-width:0}
.showcase-playback button{display:flex;align-items:center;gap:6px;padding:5px 8px;background:#f3f6fa0b;border:1px solid #7790a34f;border-radius:4px;font-size:10px;color:#c9d9e6;white-space:nowrap}
.showcase-playback button>.icon{width:12px;height:12px}
.showcase-hint{font-size:9px;color:#9eb5c8;line-height:1.4}
.showcase-pagination{display:flex;align-items:center;gap:10px;direction:ltr}
.showcase-pagination button{border:1px solid #7893a65c;border-radius:50%;background:transparent;color:#d5e2ec;width:29px;height:29px;font-size:21px;line-height:1;padding:0}
.showcase-pagination button:hover{background:#f1f6fa;color:#172f46}
.showcase-pagination button:disabled{opacity:.35;cursor:not-allowed}
.showcase-pagination>span{font-size:10px;min-width:33px;text-align:center;color:#b4c9da}
.showcase-live{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
.showcase-placeholder{height:100%;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:20px;padding:20px;text-align:center;color:#567186;font-size:17px}.showcase-placeholder>.icon{width:50px;height:50px}
.hero-showcase button:focus-visible,.hero-showcase a:focus-visible{outline:2px solid #ffbc72;outline-offset:4px}
html[dir=rtl] .showcase-kicker,html[dir=rtl] .showcase-product small{letter-spacing:0}
@media(max-width:1180px){.showcase-toolbar{flex-wrap:wrap;margin-bottom:18px}.showcase-product strong{font-size:15px}.showcase-hint{display:none}}
@media(max-width:720px){.hero-showcase{max-width:560px;justify-self:center}.showcase-toolbar{flex-wrap:nowrap}.showcase-kicker{font-size:8px;letter-spacing:.8px}.showcase-faces button{font-size:9px;padding:6px 8px}.showcase-rotor{aspect-ratio:1200/920}.showcase-face{grid-template-rows:32px minmax(0,1fr) 30px;border-radius:7px}.showcase-window{padding-inline:10px;font-size:9px}.showcase-window-brand{font-size:7px}.showcase-face-caption{padding-inline:10px;font-size:8px}.showcase-product{margin-top:20px}.showcase-product strong{font-size:15px}.showcase-bottom{margin-top:16px;padding-top:12px}}
@media(max-width:370px){.showcase-kicker>.icon{display:none}.showcase-faces button{padding:6px}.showcase-toolbar{gap:7px}.showcase-window-brand{display:none}}
@media(prefers-reduced-motion:reduce){.showcase-rotor{transition:none!important}}
