/* ================================================
   FXCYCM - TEXT ANIMATIONS & COMMUNITY TAG
   Clean, Fast, No-Blur Animations
   ================================================ */

/* ================================================
   TELEGRAM COMMUNITY TAG
   Matches hero-label style with Telegram Blue
   ================================================ */

.community-tag {
    text-decoration: none;
    color: #0088cc !important;
    background: rgba(0, 136, 204, 0.12) !important;
    border: 1px solid rgba(0, 136, 204, 0.4) !important;
    box-shadow: 0 12px 35px rgba(0, 136, 204, 0.2), 
                0 0 20px rgba(0, 136, 204, 0.15) !important;
    margin-bottom: 15px !important;
    transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
    font-weight: 600;
    letter-spacing: 0.5px;
    position: relative;
    animation: subtlePulse 3s ease-in-out infinite;
}

@keyframes subtlePulse {
    0%, 100% { 
        box-shadow: 0 12px 35px rgba(0, 136, 204, 0.2), 
                    0 0 20px rgba(0, 136, 204, 0.15);
    }
    50% { 
        box-shadow: 0 12px 35px rgba(0, 136, 204, 0.25), 
                    0 0 25px rgba(0, 136, 204, 0.2);
    }
}

.community-tag:hover {
    background: rgba(0, 136, 204, 0.2) !important;
    border-color: rgba(0, 136, 204, 0.6) !important;
    box-shadow: 0 16px 45px rgba(0, 136, 204, 0.35), 
                0 0 30px rgba(0, 136, 204, 0.25) !important;
    transform: translateY(-3px) scale(1.02);
    animation: none;
}

.telegram-icon-blue {
    color: #0088cc;
    flex-shrink: 0;
}

/* ================================================
   FABULOUS TEXT ANIMATIONS
   Clean Transforms - NO BLUR - Always Readable
   ================================================ */

/* Animation base class */
.txt-animate {
    transform: translate3d(0, 18px, 0);
    opacity: 0;
    transition: transform 0.5s cubic-bezier(0.25, 0.1, 0.25, 1),
                opacity 0.5s cubic-bezier(0.25, 0.1, 0.25, 1);
    will-change: transform, opacity;
    backface-visibility: hidden;
    -webkit-font-smoothing: subpixel-antialiased;
    contain: layout style paint;
}

.txt-animate.in-view {
    transform: translate3d(0, 0, 0);
    opacity: 1;
    will-change: auto;
}

/* Slide from left */
.txt-slide-left {
    transform: translate3d(-22px, 0, 0);
    opacity: 0;
    transition: transform 0.45s cubic-bezier(0.25, 0.1, 0.25, 1),
                opacity 0.45s cubic-bezier(0.25, 0.1, 0.25, 1);
    will-change: transform, opacity;
    backface-visibility: hidden;
    -webkit-font-smoothing: subpixel-antialiased;
    contain: layout style paint;
}

.txt-slide-left.in-view {
    transform: translate3d(0, 0, 0);
    opacity: 1;
    will-change: auto;
}

/* Slide from right */
.txt-slide-right {
    transform: translate3d(22px, 0, 0);
    opacity: 0;
    transition: transform 0.45s cubic-bezier(0.25, 0.1, 0.25, 1),
                opacity 0.45s cubic-bezier(0.25, 0.1, 0.25, 1);
    will-change: transform, opacity;
    backface-visibility: hidden;
    -webkit-font-smoothing: subpixel-antialiased;
    contain: layout style paint;
}

.txt-slide-right.in-view {
    transform: translate3d(0, 0, 0);
    opacity: 1;
    will-change: auto;
}

/* Scale up effect for emphasis */
.txt-scale {
    transform: scale3d(0.93, 0.93, 1);
    opacity: 0;
    transition: transform 0.48s cubic-bezier(0.25, 0.1, 0.25, 1),
                opacity 0.48s cubic-bezier(0.25, 0.1, 0.25, 1);
    will-change: transform, opacity;
    backface-visibility: hidden;
    -webkit-font-smoothing: subpixel-antialiased;
    contain: layout style paint;
}

.txt-scale.in-view {
    transform: scale3d(1, 1, 1);
    opacity: 1;
    will-change: auto;
}

/* Fast pop for numbers/prices */
.txt-pop {
    transform: scale3d(0.9, 0.9, 1) translate3d(0, 6px, 0);
    opacity: 0;
    transition: transform 0.42s cubic-bezier(0.25, 0.1, 0.25, 1),
                opacity 0.42s cubic-bezier(0.25, 0.1, 0.25, 1);
    will-change: transform, opacity;
    backface-visibility: hidden;
    -webkit-font-smoothing: subpixel-antialiased;
    contain: layout style paint;
}

.txt-pop.in-view {
    transform: scale3d(1, 1, 1) translate3d(0, 0, 0);
    opacity: 1;
    will-change: auto;
}

/* ================================================
   GOLD TEXT SHIMMER (Existing Enhancement)
   ================================================ */

.gold-text {
    background: linear-gradient(90deg, #d4af37 0%, #f4e4bc 30%, #d4af37 50%, #f4e4bc 70%, #d4af37 100%);
    background-size: 200% auto;
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    animation: goldShimmer 3s linear infinite;
}

@keyframes goldShimmer {
    0% { background-position: 0% center; }
    100% { background-position: 200% center; }
}

/* ================================================
   STAGGERED DELAYS
   ================================================ */

/* Result cards */
.result-card:nth-child(1) .txt-animate { transition-delay: 0s; }
.result-card:nth-child(2) .txt-animate { transition-delay: 0.08s; }
.result-card:nth-child(3) .txt-animate { transition-delay: 0.16s; }

.result-card:nth-child(1) .txt-pop { transition-delay: 0.04s; }
.result-card:nth-child(2) .txt-pop { transition-delay: 0.12s; }
.result-card:nth-child(3) .txt-pop { transition-delay: 0.2s; }

/* Service tiles */
.service-tile:nth-child(1) .txt-animate { transition-delay: 0s; }
.service-tile:nth-child(2) .txt-animate { transition-delay: 0.08s; }
.service-tile:nth-child(3) .txt-animate { transition-delay: 0.16s; }

/* EA features */
.ea-feature:nth-child(1) .txt-animate { transition-delay: 0s; }
.ea-feature:nth-child(2) .txt-animate { transition-delay: 0.07s; }
.ea-feature:nth-child(3) .txt-animate { transition-delay: 0.14s; }
.ea-feature:nth-child(4) .txt-animate { transition-delay: 0.21s; }

/* FAQ items */
.faq-item:nth-child(1) .txt-slide-left { transition-delay: 0s; }
.faq-item:nth-child(2) .txt-slide-left { transition-delay: 0.07s; }
.faq-item:nth-child(3) .txt-slide-left { transition-delay: 0.14s; }
.faq-item:nth-child(4) .txt-slide-left { transition-delay: 0.21s; }

/* Feature items */
.feature-item:nth-child(1) .txt-slide-left { transition-delay: 0s; }
.feature-item:nth-child(2) .txt-slide-left { transition-delay: 0.07s; }
.feature-item:nth-child(3) .txt-slide-left { transition-delay: 0.14s; }
.feature-item:nth-child(4) .txt-slide-left { transition-delay: 0.21s; }

/* Benefits list */
.benefits-list li:nth-child(1) .txt-slide-left { transition-delay: 0s; }
.benefits-list li:nth-child(2) .txt-slide-left { transition-delay: 0.08s; }

/* Footer groups */
.footer-links-group:nth-child(1) .txt-animate { transition-delay: 0s; }
.footer-links-group:nth-child(2) .txt-animate { transition-delay: 0.07s; }
.footer-links-group:nth-child(3) .txt-animate { transition-delay: 0.14s; }
.footer-links-group:nth-child(4) .txt-animate { transition-delay: 0.21s; }

/* ================================================
   PERFORMANCE & ACCESSIBILITY
   ================================================ */

@media (prefers-reduced-motion: reduce) {
    .txt-animate,
    .txt-slide-left,
    .txt-slide-right,
    .txt-scale,
    .txt-pop {
        transform: none !important;
        opacity: 1 !important;
        transition: none !important;
    }
    
    .gold-text {
        animation: none !important;
    }
}

/* Mobile - smooth and elegant */
@media (max-width: 768px) {
    .txt-animate,
    .txt-slide-left,
    .txt-slide-right,
    .txt-scale,
    .txt-pop {
        transition-duration: 0.4s;
    }
    
    .community-tag {
        font-size: 11px !important;
        padding: 10px 20px !important;
        letter-spacing: 2px !important;
    }
}