/* CTA panel entrance animations (editor preview + shared class names for router) */

.cta-anim-none {
    animation: none;
}

.cta-anim-fade-in {
    animation: cta-fade-in 0.55s ease-out both;
}

.cta-anim-fade-in-up {
    animation: cta-fade-in-up 0.6s ease-out both;
}

.cta-anim-fade-in-down {
    animation: cta-fade-in-down 0.6s ease-out both;
}

.cta-anim-slide-left {
    animation: cta-slide-left 0.55s cubic-bezier(0.22, 1, 0.36, 1) both;
}

.cta-anim-slide-right {
    animation: cta-slide-right 0.55s cubic-bezier(0.22, 1, 0.36, 1) both;
}

.cta-anim-slide-bottom {
    animation: cta-slide-bottom 0.55s cubic-bezier(0.22, 1, 0.36, 1) both;
}

.cta-anim-slide-top {
    animation: cta-slide-top 0.55s cubic-bezier(0.22, 1, 0.36, 1) both;
}

.cta-anim-zoom-in {
    animation: cta-zoom-in 0.5s cubic-bezier(0.22, 1, 0.36, 1) both;
}

.cta-anim-zoom-out {
    animation: cta-zoom-out 0.5s cubic-bezier(0.22, 1, 0.36, 1) both;
}

.cta-anim-bounce-in {
    animation: cta-bounce-in 0.75s cubic-bezier(0.34, 1.56, 0.64, 1) both;
}

.cta-anim-bounce-in-up {
    animation: cta-bounce-in-up 0.8s cubic-bezier(0.34, 1.56, 0.64, 1) both;
}

.cta-anim-bounce-in-left {
    animation: cta-bounce-in-left 0.75s cubic-bezier(0.34, 1.56, 0.64, 1) both;
}

.cta-anim-bounce-in-right {
    animation: cta-bounce-in-right 0.75s cubic-bezier(0.34, 1.56, 0.64, 1) both;
}

.cta-anim-flip-x {
    animation: cta-flip-x 0.65s ease-out both;
    transform-origin: center;
    backface-visibility: hidden;
}

.cta-anim-flip-y {
    animation: cta-flip-y 0.65s ease-out both;
    transform-origin: center;
    backface-visibility: hidden;
}

.cta-anim-rotate-in {
    animation: cta-rotate-in 0.6s ease-out both;
}

.cta-anim-pop-in {
    animation: cta-pop-in 0.45s cubic-bezier(0.34, 1.56, 0.64, 1) both;
}

.cta-anim-swing-in {
    animation: cta-swing-in 0.7s ease-out both;
    transform-origin: top center;
}

.cta-anim-expand-in {
    animation: cta-expand-in 0.55s ease-out both;
}

.cta-anim-shake-in {
    animation: cta-shake-in 0.7s ease-out both;
}

.cta-anim-pulse-in {
    animation: cta-pulse-in 0.85s ease-out both;
}

@keyframes cta-fade-in {
    from { opacity: 0; }
    to { opacity: 1; }
}

@keyframes cta-fade-in-up {
    from { opacity: 0; transform: translateY(1.25rem); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes cta-fade-in-down {
    from { opacity: 0; transform: translateY(-1.25rem); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes cta-slide-left {
    from { opacity: 0; transform: translateX(-2.5rem); }
    to { opacity: 1; transform: translateX(0); }
}

@keyframes cta-slide-right {
    from { opacity: 0; transform: translateX(2.5rem); }
    to { opacity: 1; transform: translateX(0); }
}

@keyframes cta-slide-bottom {
    from { opacity: 0; transform: translateY(2.5rem); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes cta-slide-top {
    from { opacity: 0; transform: translateY(-2.5rem); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes cta-zoom-in {
    from { opacity: 0; transform: scale(0.85); }
    to { opacity: 1; transform: scale(1); }
}

@keyframes cta-zoom-out {
    from { opacity: 0; transform: scale(1.2); }
    to { opacity: 1; transform: scale(1); }
}

@keyframes cta-bounce-in {
    0% { opacity: 0; transform: scale(0.3); }
    50% { opacity: 1; transform: scale(1.08); }
    70% { transform: scale(0.95); }
    100% { transform: scale(1); }
}

@keyframes cta-bounce-in-up {
    0% { opacity: 0; transform: translateY(2rem) scale(0.95); }
    60% { opacity: 1; transform: translateY(-0.35rem) scale(1.02); }
    100% { transform: translateY(0) scale(1); }
}

@keyframes cta-bounce-in-left {
    0% { opacity: 0; transform: translateX(-2rem); }
    60% { opacity: 1; transform: translateX(0.35rem); }
    100% { transform: translateX(0); }
}

@keyframes cta-bounce-in-right {
    0% { opacity: 0; transform: translateX(2rem); }
    60% { opacity: 1; transform: translateX(-0.35rem); }
    100% { transform: translateX(0); }
}

@keyframes cta-flip-x {
    from { opacity: 0; transform: perspective(600px) rotateX(85deg); }
    to { opacity: 1; transform: perspective(600px) rotateX(0deg); }
}

@keyframes cta-flip-y {
    from { opacity: 0; transform: perspective(600px) rotateY(85deg); }
    to { opacity: 1; transform: perspective(600px) rotateY(0deg); }
}

@keyframes cta-rotate-in {
    from { opacity: 0; transform: rotate(-12deg) scale(0.92); }
    to { opacity: 1; transform: rotate(0deg) scale(1); }
}

@keyframes cta-pop-in {
    0% { opacity: 0; transform: scale(0.6); }
    80% { opacity: 1; transform: scale(1.06); }
    100% { transform: scale(1); }
}

@keyframes cta-swing-in {
    0% { opacity: 0; transform: rotate(18deg); }
    60% { opacity: 1; transform: rotate(-6deg); }
    100% { transform: rotate(0deg); }
}

@keyframes cta-expand-in {
    0% { opacity: 0; transform: scaleY(0.15); }
    100% { opacity: 1; transform: scaleY(1); }
}

@keyframes cta-shake-in {
    0% { opacity: 0; transform: translateX(-0.75rem); }
    40% { opacity: 1; transform: translateX(0.35rem); }
    60% { transform: translateX(-0.2rem); }
    80% { transform: translateX(0.1rem); }
    100% { transform: translateX(0); }
}

@keyframes cta-pulse-in {
    0% { opacity: 0; transform: scale(0.94); }
    50% { opacity: 1; transform: scale(1.04); }
    100% { transform: scale(1); }
}

@media (prefers-reduced-motion: reduce) {
    [class*="cta-anim-"] {
        animation: cta-fade-in 0.01ms linear both !important;
    }
}