.showreel{position:relative;overflow:hidden;background:#0d161a;color:#f4f5f2;padding:42px 0 54px;scroll-margin-top:80px}
.showreel-rail{display:flex;gap:18px;overflow-x:auto;overflow-y:hidden;scrollbar-width:none;padding:0;touch-action:auto;cursor:grab;user-select:none}
.showreel-rail::-webkit-scrollbar{display:none}
.showreel-rail.is-dragging{cursor:grabbing}
.showreel-card{position:relative;flex:0 0 min(68vw,1050px);aspect-ratio:16/9;overflow:hidden;text-align:left;border:0;padding:0;background:#1e3035;color:#fff;cursor:pointer;isolation:isolate}
.showreel-card img{width:100%;height:100%;object-fit:cover;display:block;pointer-events:none;transition:transform .65s cubic-bezier(.2,.8,.2,1)}
.showreel-card::after{content:"";position:absolute;inset:60% 0 0;background:linear-gradient(transparent,#071013ab);pointer-events:none}
.showreel-card:hover img,.showreel-card:focus-visible img{transform:scale(1.055)}
.showreel-card-meta{position:absolute;z-index:1;left:32px;bottom:26px;pointer-events:none}
.showreel-card-meta strong{font-size:clamp(24px,3vw,38px);font-weight:700}
.showreel-play{position:absolute;z-index:1;top:50%;left:50%;transform:translate(-50%,-50%);display:grid;place-items:center;width:74px;height:74px;border:1px solid #ffffffb8;border-radius:50%;background:#07101388;font-size:23px;pointer-events:none;transition:transform .25s,background .25s}
.showreel-card:hover .showreel-play,.showreel-card:focus-visible .showreel-play{transform:translate(-50%,-50%) scale(1.12);background:#071013c9}
.showreel-arrow{position:absolute;z-index:5;top:50%;transform:translateY(-50%);display:grid;place-items:center;width:58px;height:58px;cursor:pointer;border:1px solid #e2eeee9c;border-radius:50%;color:#fff;background:#071013bd;font:inherit;font-size:26px;transition:background .2s,color .2s}
.showreel-arrow-prev{left:20px}.showreel-arrow-next{right:20px}
.showreel-arrow:hover{background:#f4f5f2;color:#0d161a}
.showreel-card:focus-visible,.showreel-arrow:focus-visible,.showreel-close:focus-visible{outline:3px solid #73c8f4;outline-offset:3px}
.showreel-dialog{width:min(92vw,1200px);max-width:none;max-height:92vh;padding:0;background:#070d11;color:#fff;border:1px solid #52666d;box-shadow:0 24px 80px #0009}
.showreel-dialog::backdrop{background:#03070bdc}
.showreel-dialog-head{display:flex;align-items:center;justify-content:space-between;padding:12px 18px;gap:16px}
.showreel-dialog-title{font-weight:650;font-size:16px}
.showreel-close{cursor:pointer;border:1px solid #617075;color:#f4f5f2;background:transparent;font:inherit;padding:8px 12px;font-size:14px}
.showreel-dialog video{display:block;width:100%;max-height:calc(92vh - 58px);aspect-ratio:16/9;background:#000}
@media(max-width:700px){.showreel{padding:30px 0 36px}.showreel-rail{gap:10px}.showreel-card{flex-basis:86vw}.showreel-card-meta{left:16px;bottom:14px}.showreel-card-meta strong{font-size:23px}.showreel-play{width:48px;height:48px;font-size:16px}.showreel-arrow{width:40px;height:40px;font-size:18px}.showreel-arrow-prev{left:8px}.showreel-arrow-next{right:8px}}
@media(prefers-reduced-motion:reduce){.showreel-card img,.showreel-play{transition:none}}
