.hero-badge-pulse {
    animation: badgePulse 3s ease-in-out infinite;
}

@keyframes badgePulse {
    0%, 100% { opacity: 1; transform: scale(1); }
    50% { opacity: 0.75; transform: scale(0.98); }
}

.floating-mockup {
    animation: floatElement 7s cubic-bezier(0.45, 0, 0.55, 1) infinite;
}

@keyframes floatElement {
    0%, 100% { transform: translateY(0px) rotateX(1.5deg) rotateY(-0.5deg); }
    50% { transform: translateY(-12px) rotateX(2.5deg) rotateY(0.5deg); }
}

.cta-glow-border {
    position: relative;
}

.cta-glow-border::before {
    content: '';
    position: absolute;
    inset: -1px;
    border-radius: 2.5rem;
    padding: 1px;
    background: linear-gradient(135deg, rgba(168, 85, 247, 0.5), transparent 60%, rgba(168, 85, 247, 0.15));
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    pointer-events: none;
}

.perspective-2000 {
    perspective: 2000px;
}

.reveal-section > div {
    opacity: 0;
    transform: translateY(40px);
    transition: opacity 1s cubic-bezier(0.16, 1, 0.3, 1), transform 1s cubic-bezier(0.16, 1, 0.3, 1);
}

.reveal-section.visible > div {
    opacity: 1;
    transform: translateY(0);
}

.marquee-container {
    display: flex;
    width: 100%;
    overflow: hidden;
    white-space: nowrap;
}

.marquee-content {
    animation: marquee 35s linear infinite;
}

@keyframes marquee {
    0% { transform: translateX(0); }
    100% { transform: translateX(-50%); }
}

@media (max-width: 768px) {
    .floating-mockup {
        animation: none;
        transform: none;
    }
}