.product-video-maker{background:radial-gradient(circle at 10% 20%,#d946ef08 0%,#0000 40%),radial-gradient(circle at 90% 80%,#14b8a608 0%,#0000 40%);min-height:100vh}.product-video-maker .glass-card{-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#ffffff08;border:1px solid #ffffff14}.product-preview-container{aspect-ratio:16/9;background:#000;border-radius:1rem;width:100%;position:relative;overflow:hidden;box-shadow:0 20px 50px #00000080}.product-preview-container video{-o-object-fit:cover;object-fit:cover;width:100%;height:100%}.product-thumbnail-overlay{aspect-ratio:1;z-index:10;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#ffffff0d;border:2px solid #fff3;border-radius:.75rem;width:120px;position:absolute;top:50%;left:1.5rem;overflow:hidden;transform:translateY(-50%);box-shadow:0 10px 20px #0000004d}.product-thumbnail-overlay img{-o-object-fit:cover;object-fit:cover;width:100%;height:100%}.product-video-maker .btn-generate{background-image:linear-gradient(to right, var(--tw-gradient-stops));--tw-gradient-from:#ff007a var(--tw-gradient-from-position);--tw-gradient-to:#14b8a6 var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from), var(--tw-gradient-to)}.product-video-maker .btn-generate:hover{--tw-gradient-from:#f25c9f var(--tw-gradient-from-position);--tw-gradient-to:#2dd4bf var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from), var(--tw-gradient-to)}.product-video-maker .btn-generate{transform:translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));--tw-text-opacity:1;color:rgb(255 255 255/var(--tw-text-opacity,1));border-radius:.75rem;padding:1rem 1.5rem;font-weight:700;transition-property:all;transition-duration:.3s;transition-timing-function:cubic-bezier(.4,0,.2,1)}.product-video-maker .btn-generate:hover{--tw-translate-y:-.25rem;transform:translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));--tw-shadow:var(--tw-shadow-colored);--tw-shadow-colored:0 20px 25px -5px var(--tw-shadow-color), 0 8px 10px -6px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000), var(--tw-ring-shadow,0 0 #0000), var(--tw-shadow);--tw-shadow-color:#ff007a33}.product-video-maker .btn-generate:disabled{cursor:not-allowed;opacity:.5}.feature-tag{color:#fff9;background-color:#ffffff0d;border-width:1px;border-color:#ffffff1a;border-radius:9999px;padding:.25rem .75rem;font-size:.75rem;font-weight:500;line-height:1rem}.product-video-maker h1{line-height:1.2}.product-video-maker .group:hover .group-hover\:opacity-100{opacity:1!important}.product-video-maker button:hover svg{transform:scale(1.1)}@media (max-width:768px){.product-thumbnail-overlay{width:80px;left:1rem}}
