
.ks{position:relative;isolation:isolate;overflow:hidden;background:#1c1815;color:#fff;min-height:min(78vh,720px);aspect-ratio:16/9;border-radius:var(--ks-radius,0)}
.ks-track{position:absolute;inset:0;margin:0;padding:0;list-style:none}
.ks-slide{position:absolute;inset:0;margin:0;opacity:0;transition:opacity var(--ks-fade,1.6s) ease;will-change:opacity;pointer-events:none}
.ks-slide.on{opacity:1;z-index:1}
.ks-slide img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:var(--ks-fx,50%) var(--ks-fy,50%);transform:scale(1);transform-origin:var(--ks-fx,50%) var(--ks-fy,50%)}
.ks.zoom .ks-slide.on img{animation:ks-zoom var(--ks-zoom,8s) ease-out forwards}
@keyframes ks-zoom{from{transform:scale(1)}to{transform:scale(1.07)}}
.ks-scrim{position:absolute;inset:0;z-index:2;pointer-events:none;background:radial-gradient(130% 95% at 0% 100%,rgba(0,0,0,.72) 0%,rgba(0,0,0,.45) 38%,rgba(0,0,0,0) 72%),linear-gradient(180deg,rgba(0,0,0,.3) 0%,rgba(0,0,0,0) 22%,rgba(0,0,0,0) 55%,rgba(0,0,0,.5) 100%)}
.ks-over{position:absolute;inset:auto 0 0 0;z-index:3;padding:clamp(20px,4vw,56px);display:grid;gap:14px;max-width:min(100%,900px)}
.ks-over :is(h1,h2){margin:0;font-family:var(--serif,Georgia,serif);font-weight:400;font-size:clamp(2rem,5.4vw,4.4rem);line-height:1.05;color:#fff}
.ks-over :is(h1,h2) em{font-style:italic}
.ks-ui{position:absolute;z-index:4;right:clamp(14px,3vw,44px);bottom:clamp(16px,3vw,36px);display:flex;align-items:center;gap:12px;font:500 .8rem/1 var(--sans,system-ui,sans-serif);letter-spacing:.12em;color:#fff}
.ks-cap{position:absolute;z-index:4;right:clamp(14px,3vw,44px);bottom:clamp(64px,8vw,92px);font:500 .72rem/1.3 var(--sans,system-ui,sans-serif);letter-spacing:.18em;text-transform:uppercase;color:#fff;background:rgba(20,16,14,.6);padding:.4em .8em;border-radius:999px;text-align:right;max-width:46%}
.ks-count{font-variant-numeric:tabular-nums;min-width:4.2em;white-space:nowrap}
.ks .ks-btn{flex:none;min-width:0;min-height:0;padding:0;width:44px;height:44px;border-radius:50%;border:1px solid rgba(255,255,255,.7);background:rgba(0,0,0,.18);color:#fff;display:grid;place-items:center;cursor:pointer;font:inherit;backdrop-filter:blur(2px)}
.ks-btn:hover,.ks-btn:focus-visible{background:rgba(255,255,255,.22)}
.ks-btn:focus-visible,.ks:focus-visible{outline:2px solid #fff;outline-offset:3px}
.ks-btn svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.ks-dashes{display:flex;gap:8px}
.ks .ks-dash{flex:none;min-width:0;min-height:0;position:relative;width:28px;height:3px;border:0;border-radius:0;padding:0;background:rgba(255,255,255,.4);cursor:pointer;overflow:hidden}
.ks-dash::before{content:"";position:absolute;inset:-10px 0}
.ks-dash::after{content:"";position:absolute;inset:0;background:#fff;transform:scaleX(0);transform-origin:left}
.ks-dash.on::after{transform:scaleX(1)}
.ks.play .ks-dash.on::after{animation:ks-bar var(--ks-int,5.5s) linear forwards}
@keyframes ks-bar{from{transform:scaleX(0)}to{transform:scaleX(1)}}
.ks:hover .ks-dash.on::after,.ks.hold .ks-dash.on::after{animation-play-state:paused}
.ks:hover.zoom .ks-slide.on img,.ks.hold.zoom .ks-slide.on img{animation-play-state:paused}
@media (max-width:640px){.ks{aspect-ratio:4/5;min-height:68vh}.ks-ui{left:16px;right:16px;justify-content:space-between;gap:8px}.ks-cap{display:none}.ks-over{padding-bottom:84px}.ks .ks-dash{width:14px}.ks-dashes{gap:6px}.ks-count{min-width:0}}
@media (prefers-reduced-motion:reduce){.ks-slide{transition:none}.ks.zoom .ks-slide.on img,.ks.play .ks-dash.on::after{animation:none}.ks-dash.on::after{transform:scaleX(1)}}
.ks-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;color:#111;background:#fff}
.ks-cap:empty{display:none}
