.video-cards-section{--card-height: 560px;--card-radius: 20px;--card-gap: 1.25rem;--content-pad: 1.75rem;--tag-color: rgba(255,255,255,.15);--btn-bg: #ffffff;--btn-text: #1a1a1a;--transition: .3s cubic-bezier(.16, 1, .3, 1);--dot-color: rgba(255,255,255,.35);--dot-active: #ffffff}.video-cards-section{background:var(--section-bg, #0a0a0a);padding:4rem 0 3rem;overflow:hidden}.video-cards-section__header{text-align:center;padding:0 2rem 2.5rem;max-width:640px;margin:0 auto}.video-cards-section__heading{font-size:clamp(1.75rem,3vw,2.5rem);font-weight:700;color:#fff;margin:0 0 .625rem;letter-spacing:-.02em;line-height:1.15}.video-cards-section__subheading{font-size:1rem;color:#ffffff8c;margin:0;line-height:1.6}.video-cards-track-wrap{position:relative;padding:0 2rem}.video-cards-track{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--card-gap);transition:transform var(--transition)}.video-cards-section[data-columns="2"] .video-cards-track{grid-template-columns:repeat(2,1fr)}.video-cards-section[data-columns="4"] .video-cards-track{grid-template-columns:repeat(4,1fr)}.video-card{position:relative;border-radius:var(--card-radius);overflow:hidden;height:var(--card-height);background:#1a1a1a;cursor:pointer;opacity:0;transform:translateY(20px);animation:cardEntrance .5s cubic-bezier(.16,1,.3,1) forwards;animation-delay:calc(var(--card-index, 1) * .1s)}@keyframes cardEntrance{to{opacity:1;transform:translateY(0)}}.video-card:hover{transform:translateY(-4px) scale(1.01);transition:transform var(--transition);z-index:2}.video-card__media{position:absolute;top:0;right:0;bottom:0;left:0;z-index:0}.video-card__video,.video-card__fallback{width:100%;height:100%;object-fit:cover;display:block;transition:transform .6s cubic-bezier(.16,1,.3,1)}.video-card:hover .video-card__video,.video-card:hover .video-card__fallback{transform:scale(1.04)}.video-card__placeholder{width:100%;height:100%;background:#222;display:flex;align-items:center;justify-content:center}.video-card__placeholder-svg{width:100%;height:100%;opacity:.3}.video-card__overlay{position:absolute;top:0;right:0;bottom:0;left:0;z-index:1;pointer-events:none}.video-card__content{position:absolute;bottom:0;left:0;right:0;z-index:2;padding:var(--content-pad);display:flex;flex-direction:column;gap:.625rem;transform:translateY(4px);transition:transform var(--transition)}.video-card:hover .video-card__content{transform:translateY(0)}.video-card__tag{display:inline-flex;align-items:center;padding:.25rem .75rem;background:var(--tag-color);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,.2);border-radius:100px;font-size:.75rem;font-weight:600;color:#fff;letter-spacing:.06em;text-transform:uppercase;width:fit-content}.video-card__heading{font-size:clamp(1.1rem,2vw,1.5rem);font-weight:700;color:#fff;margin:0;line-height:1.2;letter-spacing:-.01em}.video-card__subtext{font-size:.875rem;color:#ffffffbf;margin:0;line-height:1.5;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;max-height:0;opacity:0;transition:max-height var(--transition),opacity var(--transition)}.video-card:hover .video-card__subtext{max-height:60px;opacity:1}.video-card__btn{display:inline-flex;align-items:center;gap:.5rem;padding:.625rem 1.25rem;background:var(--btn-bg);color:var(--btn-text);border-radius:100px;font-size:.875rem;font-weight:600;text-decoration:none;width:fit-content;letter-spacing:.01em;transition:background var(--transition),transform var(--transition),gap var(--transition);opacity:0;transform:translateY(8px);transition:opacity var(--transition),transform var(--transition)}.video-card:hover .video-card__btn{opacity:1;transform:translateY(0)}.video-card__btn:hover{background:#f0f0f0}.video-card__btn svg{transition:transform var(--transition)}.video-card__btn:hover svg{transform:translate(3px)}.video-card__sound{position:absolute;top:1rem;right:1rem;z-index:3;width:36px;height:36px;border-radius:50%;border:none;background:#0006;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;cursor:pointer;color:#fff;opacity:0;transition:opacity var(--transition),background var(--transition)}.video-card:hover .video-card__sound{opacity:1}.video-card__sound:hover{background:#000000a6}.video-cards-dots{display:none;justify-content:center;gap:.5rem;margin-top:1.25rem}.video-cards-dot{width:6px;height:6px;border-radius:50%;border:none;background:var(--dot-color);cursor:pointer;padding:0;transition:background var(--transition),width var(--transition),border-radius var(--transition)}.video-cards-dot.is-active{background:var(--dot-active);width:20px;border-radius:3px}@media(max-width:768px){.video-cards-section{padding:3rem 0 2rem}.video-cards-section__header{padding:0 1.25rem 2rem}.video-cards-track-wrap{padding:0}.video-cards-track{display:flex!important;gap:var(--card-gap);padding:0 1.25rem .5rem;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding:0 1.25rem;-webkit-overflow-scrolling:touch;scrollbar-width:none;cursor:grab;scroll-behavior:smooth}.video-card{scroll-snap-align:center;scroll-snap-stop:normal}.video-cards-track::-webkit-scrollbar{display:none}.video-cards-track.is-dragging{cursor:grabbing;scroll-snap-type:none}.video-card{flex:0 0 82vw;max-width:320px;scroll-snap-align:center;scroll-snap-stop:always;height:480px}.video-card__subtext{max-height:60px;opacity:1}.video-card__btn{opacity:1;transform:none}.video-card__sound{opacity:1}.video-cards-dots{display:flex}}@media(max-width:480px){.video-card{flex:0 0 88vw;height:440px}}.video-card__play-indicator{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);z-index:4;opacity:0;pointer-events:none;transition:opacity .2s ease}.video-card__play-indicator.is-visible{opacity:1}.video-card__play-indicator svg{filter:drop-shadow(0 2px 8px rgba(0,0,0,.3))}
/*# sourceMappingURL=/cdn/shop/t/23/assets/video-cards.css.map */