.course-slider{position:relative;border-top:2px solid hsl(var(--fu-ink));background:hsl(var(--fu-paper));padding:4.5rem 0}.course-slider__head{display:flex;align-items:flex-end;justify-content:space-between;gap:1.5rem;margin-bottom:2.25rem}.course-slider__nav{display:inline-flex;align-items:center;gap:.5rem}.course-slider__counter{display:inline-flex;align-items:baseline;gap:.2rem;padding:0 .4rem;font-family:var(--font-mono);font-size:.8rem;letter-spacing:.1em;color:hsl(var(--fu-ink))}.course-slider__counter-total{color:hsl(var(--fu-muted));font-size:.68rem}.course-slider__play{display:inline-flex;align-items:center;justify-content:center;width:2rem;height:2rem;border:1.5px solid hsl(var(--fu-ink));background:hsl(var(--fu-paper));color:hsl(var(--fu-ink));cursor:pointer;transition:background .3s var(--ease-premium),color .3s var(--ease-premium)}.course-slider__play:hover{background:hsl(var(--fu-ink));color:hsl(var(--fu-paper))}.course-slider__frame{position:relative;overflow:hidden;border:2px solid hsl(var(--fu-ink));background:hsl(var(--fu-card));box-shadow:inset 0 1px hsl(var(--fu-paper) / .6);user-select:none;-webkit-user-select:none;touch-action:pan-y}.course-slider__progress{position:absolute;top:0;left:0;right:0;height:3px;z-index:5;background:hsl(var(--fu-link));transform-origin:left;transform:scaleX(0);opacity:0}.course-slider__progress.is-running{opacity:1;animation:course-slider-progress 7s linear forwards}@keyframes course-slider-progress{0%{transform:scaleX(0)}to{transform:scaleX(1)}}@media(prefers-reduced-motion:reduce){.course-slider__progress.is-running{animation:none;opacity:.35}}.course-slider__track{display:flex;transition:transform .7s var(--ease-premium)}.course-slider__shell{flex:0 0 calc(100% / 3);display:flex;padding:.5rem;text-decoration:none;color:inherit;opacity:0;transform:translateY(24px);transition:opacity .8s var(--ease-premium),transform .8s var(--ease-premium);transition-delay:var(--reveal-delay, 0s)}.course-slider__shell.reveal-visible{opacity:1;transform:translateY(0)}@media(prefers-reduced-motion:reduce){.course-slider__shell,.course-slider__shell.reveal-visible{opacity:1;transform:none;transition:none}}.course-slider__card{display:flex;flex:1;flex-direction:column;border:1px solid hsl(var(--fu-ink) / .9);background:hsl(var(--fu-paper));box-shadow:0 0 hsl(var(--fu-ink));transition:box-shadow .5s var(--ease-premium),transform .5s var(--ease-premium)}.course-slider__shell:hover .course-slider__card{box-shadow:5px 5px hsl(var(--fu-ink));transform:translate(-2px,-2px)}.course-slider__shell:active .course-slider__card{transform:scale(.985)}.course-slider__art{position:relative;display:block;overflow:hidden;aspect-ratio:16 / 9;border-bottom:1px solid hsl(var(--fu-ink) / .9);background:hsl(var(--fu-ink))}.course-slider__art img{width:100%;height:100%;object-fit:cover;opacity:.9;transform:scale(1.01);transition:transform .9s var(--ease-premium),opacity .5s var(--ease-premium);will-change:transform}.course-slider__shell:hover .course-slider__art img{transform:scale(1.06);opacity:1}.course-slider__shine{position:absolute;inset:0;pointer-events:none;background:linear-gradient(105deg,transparent 40%,hsl(var(--fu-paper) / .14) 50%,transparent 60%);transform:translate(-120%);transition:transform .9s var(--ease-premium)}.course-slider__shell:hover .course-slider__shine{transform:translate(120%)}.course-slider__index{position:absolute;top:.75rem;right:.75rem;padding:.3rem .55rem;background:hsl(var(--fu-paper) / .94);border:1px solid hsl(var(--fu-ink));font-family:var(--font-mono);font-size:.62rem;letter-spacing:.12em;color:hsl(var(--fu-ink));transition:background .4s var(--ease-premium),color .4s var(--ease-premium)}.course-slider__shell:hover .course-slider__index{background:hsl(var(--fu-ink));color:hsl(var(--fu-paper))}.course-slider__body{display:flex;flex:1;flex-direction:column;gap:.6rem;padding:1.35rem}.course-slider__meta{display:flex;align-items:center;justify-content:space-between;gap:.5rem}.course-slider__lang{font-family:var(--font-mono);font-size:.62rem;letter-spacing:.14em;color:hsl(var(--fu-muted))}.course-slider__title{font-family:var(--font-display);font-size:1.15rem;line-height:1.15;color:hsl(var(--fu-ink));transition:color .4s var(--ease-premium)}.course-slider__shell:hover .course-slider__title{color:hsl(var(--fu-link))}.course-slider__desc{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font-size:.82rem;line-height:1.55;color:hsl(var(--fu-muted))}.course-slider__foot{display:flex;align-items:center;justify-content:space-between;gap:.5rem;margin-top:auto;padding-top:.85rem;border-top:1px solid hsl(var(--fu-line))}.course-slider__rating{font-size:.75rem;color:hsl(var(--fu-ink))}.course-slider__new{font-family:var(--font-mono);font-size:.6rem;letter-spacing:.12em;color:hsl(var(--fu-muted))}.course-slider__price{font-family:var(--font-mono);font-size:.78rem;font-weight:600;color:hsl(var(--fu-teal))}.course-slider__cta{display:inline-flex;align-items:center;gap:.45rem;font-size:.78rem;font-weight:500;color:hsl(var(--fu-ink))}.course-slider__cta-icon{display:inline-flex;height:1.4rem;width:1.4rem;align-items:center;justify-content:center;border:1px solid hsl(var(--fu-ink));background:hsl(var(--fu-card));transition:transform .5s var(--ease-premium),background .4s var(--ease-premium),color .4s var(--ease-premium)}.course-slider__shell:hover .course-slider__cta-icon{transform:translate(3px);background:hsl(var(--fu-ink));color:hsl(var(--fu-paper))}.course-slider__dots{display:flex;justify-content:center;gap:.4rem;border-top:2px solid hsl(var(--fu-ink));padding:.9rem}.course-slider__dot{width:1.8rem;height:.35rem;padding:0;border:1px solid hsl(var(--fu-ink));background:hsl(var(--fu-card));cursor:pointer;overflow:hidden;transition:border-color .4s var(--ease-premium),transform .4s var(--ease-premium)}.course-slider__dot-fill{display:block;width:100%;height:100%;background:hsl(var(--fu-link));transform:scaleX(0);transform-origin:left;transition:transform .5s var(--ease-premium)}.course-slider__dot:hover{transform:translateY(-2px);border-color:hsl(var(--fu-link))}.course-slider__dot[aria-current=true] .course-slider__dot-fill{transform:scaleX(1)}@media(max-width:1023px){.course-slider__shell{flex-basis:50%}}@media(max-width:639px){.course-slider__shell{flex-basis:100%}.course-slider__head{align-items:flex-start;flex-direction:column}}
