/* Shared primary "Chat Now" CTA used by the homepage and audience landing pages. */
.hero-cta {
    --hero-cta-a: #E100FF;
    --hero-cta-c: #5B6CFF;
    --hero-cta-ease: cubic-bezier(.16, .84, .44, 1);
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    height: 52px;
    min-width: 44px;
    padding: 0 30px;
    border: 2px solid transparent;
    border-radius: 999px;
    color: #1B1330;
    background: linear-gradient(#fff, #fff) padding-box,
                linear-gradient(135deg, #E100FF 0%, #7B4DFF 52%, #5B6CFF 100%) border-box;
    box-shadow: 0 12px 35px rgba(111, 80, 255, .30), 0 2px 8px rgba(0, 0, 0, .16);
    font: 700 .95rem/normal 'Inter', 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    letter-spacing: -.01em;
    text-decoration: none;
    white-space: nowrap;
    cursor: pointer;
    transition: transform .3s var(--hero-cta-ease), box-shadow .3s var(--hero-cta-ease);
    animation: heroCtaFadeUp .8s var(--hero-cta-ease) .22s both;
}

.hero-cta::before {
    content: '';
    flex: 0 0 18px;
    width: 18px;
    height: 18px;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231B1330' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 11.5a8.38 8.38 0 0 1-.9 3.8 8.5 8.5 0 0 1-7.6 4.7 8.38 8.38 0 0 1-3.8-.9L3 21l1.9-5.7a8.38 8.38 0 0 1-.9-3.8 8.5 8.5 0 0 1 4.7-7.6 8.38 8.38 0 0 1 3.8-.9h.5a8.48 8.48 0 0 1 8 8v.5z'/%3E%3C/svg%3E") center / contain no-repeat;
}

.hero-cta::after {
    content: '';
    position: absolute;
    inset: -7px;
    z-index: -1;
    border-radius: 999px;
    background: linear-gradient(135deg, var(--hero-cta-a) 0%, var(--hero-cta-c) 100%);
    filter: blur(20px);
    opacity: .34;
    animation: heroCtaGlow 4.5s ease-in-out infinite;
}

.hero-cta:hover {
    transform: translateY(-2px) scale(1.03);
    background: linear-gradient(#fff, #fff) padding-box,
                linear-gradient(135deg, #E100FF 0%, #7B4DFF 52%, #5B6CFF 100%) border-box;
    box-shadow: 0 18px 48px rgba(111, 80, 255, .45), 0 4px 14px rgba(0, 0, 0, .22);
}

.hero-cta:hover::after { opacity: .5; }
.hero-cta:active { transform: translateY(0) scale(.99); }
.hero-cta:focus-visible {
    outline: 3px solid rgba(255, 255, 255, .85);
    outline-offset: 3px;
}

@keyframes heroCtaFadeUp {
    from { opacity: 0; transform: translateY(24px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes heroCtaGlow {
    0%, 100% { opacity: .30; transform: scale(1); }
    50% { opacity: .52; transform: scale(1.045); }
}

@media (max-width: 768px) {
    .hero-cta {
        height: 49px;
        padding: 0 25px;
        gap: 9px;
        font-size: .9rem;
    }
}

@media (max-width: 480px) {
    .hero-cta {
        height: 47px;
        padding: 0 21px;
        font-size: .87rem;
    }
}

@media (prefers-reduced-motion: reduce) {
    .hero-cta,
    .hero-cta::after { animation: none !important; }
    .hero-cta:hover { transform: none; }
}