.lwp,.lwp *{box-sizing:border-box}
.lwp{
	--lwp-accent:#8a1cf0;--lwp-title:#0e0e12;--lwp-w:370px;--lwp-gap:26px;
	width:100%;padding:56px 0 64px;overflow:hidden;
	font-family:"Poppins","Inter",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
}
.lwp-head{text-align:center;margin:0 auto 40px;padding:0 20px}
.lwp-title{margin:0;font-size:clamp(30px,4vw,46px);font-weight:700;color:var(--lwp-title);letter-spacing:-.01em;line-height:1.15}
.lwp-sub{margin:12px auto 0;max-width:620px;color:#6b6b75;font-size:17px;line-height:1.6}

.lwp-stage{position:relative;display:flex;align-items:center}
.lwp-viewport{flex:1;min-width:0;overflow:hidden;padding:14px 0 26px;touch-action:pan-y}
.lwp-fade .lwp-viewport{
	-webkit-mask-image:linear-gradient(to right,transparent 0,#000 7%,#000 93%,transparent 100%);
	mask-image:linear-gradient(to right,transparent 0,#000 7%,#000 93%,transparent 100%);
}
.lwp-track{display:flex;width:max-content;will-change:transform;transform:translate3d(0,0,0)}
.lwp-set{display:flex;gap:var(--lwp-gap);padding-right:var(--lwp-gap);flex:none}

/* card */
.lwp-card{
	flex:none;width:var(--lwp-w);background:#fff;border-radius:22px;overflow:hidden;
	box-shadow:0 10px 34px -10px rgba(20,20,40,.18),0 0 0 1px rgba(20,20,40,.04);
	transition:transform .35s cubic-bezier(.22,1,.36,1),box-shadow .35s ease;
}
.lwp-card:hover{transform:translateY(-6px);box-shadow:0 22px 44px -14px rgba(20,20,40,.28),0 0 0 1px rgba(20,20,40,.05)}
.lwp-img{position:relative;aspect-ratio:16/11;overflow:hidden;background:#ececf2}
.lwp-img img{width:100%;height:100%;object-fit:cover;object-position:top center;display:block;transition:transform .8s ease;-webkit-user-drag:none}
.lwp-card:hover .lwp-img img{transform:scale(1.04)}
.lwp-cover{position:absolute;inset:0}

.lwp-meta{padding:20px 22px 24px;display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 0;font-size:16px;line-height:1.5;min-height:84px}
.lwp-meta span+span::before{content:"\2022";margin:0 10px;color:#555;font-weight:400}
.lwp-cat{font-weight:600;color:#14141a}
.lwp-res{font-weight:600;color:var(--lwp-accent)}
.lwp-dur{color:#6b6b75;font-weight:400}

/* arrows */
.lwp-arrow{
	position:absolute;top:50%;transform:translateY(-50%);z-index:3;width:46px;height:46px;border-radius:50%;
	border:0;background:#fff;color:#14141a;cursor:pointer;display:flex;align-items:center;justify-content:center;
	box-shadow:0 8px 22px rgba(20,20,40,.22);transition:transform .2s ease,background .2s ease,color .2s ease;padding:0;
}
.lwp-arrow:hover{background:var(--lwp-accent);color:#fff;transform:translateY(-50%) scale(1.08)}
.lwp-arrow:focus-visible{outline:3px solid var(--lwp-accent);outline-offset:3px}
.lwp-prev{left:max(12px,2vw)}
.lwp-next{right:max(12px,2vw)}

@media (max-width:640px){
	.lwp{--lwp-gap:16px;padding:40px 0 48px}
	.lwp-card{width:min(var(--lwp-w),78vw)}
	.lwp-arrow{width:38px;height:38px}
	.lwp-meta{font-size:14.5px;padding:16px 18px 20px}
}
