@keyframes fade-in-up{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.animate-fade-in-up{animation:.5s ease-out both fade-in-up}.video-card{transition:transform .4s ease-out,box-shadow .4s ease-out,border-color .4s ease-out}.video-card:hover{border-color:color-mix(in srgb, var(--color-primary) 35%, transparent);transform:translateY(-2px)}.video-shimmer{pointer-events:none;border-radius:1rem;position:absolute;inset:-1px 0 0;overflow:hidden}.video-shimmer:before{content:"";background:linear-gradient(90deg,#0000,#ffffff2e,#0000);transition:transform 1s ease-out;position:absolute;inset:0;transform:skew(-12deg)translate(-100%)}.video-card:hover .video-shimmer:before{transform:skew(-12deg)translate(100%)}.play-button-container{opacity:0;transition:all .3s ease-out;transform:scale(.75)}.video-card:hover .play-button-container{opacity:1;transform:scale(1)}.play-button-bg{-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#fff3;border-radius:50%;animation:2s ease-in-out infinite pulse;position:absolute;inset:0}@keyframes pulse{0%,to{opacity:.7;transform:scale(1)}50%{opacity:1;transform:scale(1.05)}}.play-button{background:linear-gradient(135deg, color-mix(in srgb, var(--color-primary) 90%, transparent), var(--color-primary), color-mix(in srgb, var(--color-secondary) 90%, transparent));box-shadow:0 10px 25px -5px color-mix(in srgb, var(--color-primary) 30%, transparent);border:1px solid #fff3;border-radius:50%;padding:1rem;position:relative}.video-gradient-overlay{opacity:0;pointer-events:none;background:linear-gradient(#0000 40%,#0000008c);transition:opacity .3s;position:absolute;inset:0}.video-card:hover .video-gradient-overlay{opacity:1}.duration-badge{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);color:#fff;opacity:0;background:#000000b3;border-radius:9999px;padding:.25rem .5rem;font-size:.75rem;font-weight:500;transition:opacity .3s;position:absolute;top:.75rem;right:.75rem}.video-card:hover .duration-badge{opacity:1}.video-title{transition:color .3s}.video-card:hover .video-title{color:var(--color-primary-on-surface)}.video-description{opacity:.85;transition:opacity .3s}.video-card:hover .video-description{opacity:1}.video-bottom-border{background:linear-gradient(90deg, var(--color-primary), var(--color-secondary), var(--color-tertiary));transform-origin:0;height:3px;transition:transform .5s ease-out;position:absolute;bottom:0;left:0;right:0;transform:scaleX(0)}.video-card:hover .video-bottom-border{transform:scaleX(1)}.video-glow{opacity:0;filter:blur(20px);pointer-events:none;background:linear-gradient(90deg,#0000,#ffffff0d,#0000);border-radius:1rem;transition:opacity .5s;position:absolute;inset:0}.video-card:hover .video-glow{opacity:1}.video-image{object-fit:cover;transition:transform .5s}.video-card:hover .video-image{transform:scale(1.05)}