/* For You Section - Beautiful Animations & Design */

/* Particle Animations */
@keyframes forYouParticleFloat1 {
    0%, 100% {
        transform: translate(0, 0) scale(1);
        opacity: 0.3;
    }
    25% {
        transform: translate(30px, -40px) scale(1.2);
        opacity: 0.6;
    }
    50% {
        transform: translate(-20px, -80px) scale(0.8);
        opacity: 0.4;
    }
    75% {
        transform: translate(40px, -120px) scale(1.1);
        opacity: 0.7;
    }
}

@keyframes forYouParticleFloat2 {
    0%, 100% {
        transform: translate(0, 0) rotate(0deg) scale(1);
        opacity: 0.4;
    }
    33% {
        transform: translate(-30px, 50px) rotate(120deg) scale(1.3);
        opacity: 0.7;
    }
    66% {
        transform: translate(20px, 100px) rotate(240deg) scale(0.9);
        opacity: 0.5;
    }
}

@keyframes forYouParticleFloat3 {
    0%, 100% {
        transform: translate(0, 0) scale(1);
        opacity: 0.5;
    }
    50% {
        transform: translate(-40px, -60px) scale(1.4);
        opacity: 0.8;
    }
}

@keyframes forYouParticleFloat4 {
    0%, 100% {
        transform: translate(0, 0) rotate(0deg);
        opacity: 0.3;
    }
    25% {
        transform: translate(25px, -30px) rotate(90deg);
        opacity: 0.6;
    }
    50% {
        transform: translate(-15px, -60px) rotate(180deg);
        opacity: 0.8;
    }
    75% {
        transform: translate(35px, -90px) rotate(270deg);
        opacity: 0.5;
    }
}

.for-you-particle {
    animation: forYouParticleFloat1 15s ease-in-out infinite;
}

.for-you-particle-2 {
    animation: forYouParticleFloat2 18s ease-in-out infinite;
}

.for-you-particle-3 {
    animation: forYouParticleFloat3 12s ease-in-out infinite;
}

.for-you-particle-4 {
    animation: forYouParticleFloat4 20s ease-in-out infinite;
}

/* Circle Float Animations */
@keyframes forYouCircleFloat {
    0%, 100% {
        transform: translate(0, 0) scale(1);
        opacity: 0.3;
    }
    50% {
        transform: translate(50px, -50px) scale(1.2);
        opacity: 0.5;
    }
}

@keyframes forYouCircleFloat2 {
    0%, 100% {
        transform: translate(0, 0) scale(1);
        opacity: 0.3;
    }
    50% {
        transform: translate(-60px, 60px) scale(1.3);
        opacity: 0.4;
    }
}

.for-you-circle-float {
    animation: forYouCircleFloat 20s ease-in-out infinite;
}

.for-you-circle-float-2 {
    animation: forYouCircleFloat2 25s ease-in-out infinite;
}

/* Title Reveal Animation */
@keyframes forYouTitleReveal {
    0% {
        opacity: 0;
        transform: translateY(30px);
        filter: blur(10px);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
        filter: blur(0);
    }
}

.for-you-title-reveal {
    animation: forYouTitleReveal 1s ease-out forwards;
}

/* Divider Animation */
@keyframes forYouDividerGrow {
    0% {
        width: 0;
        opacity: 0;
    }
    100% {
        width: 6rem;
        opacity: 1;
    }
}

@keyframes forYouDividerShine {
    0%, 100% {
        background: linear-gradient(90deg, transparent, #d4af37, transparent);
    }
    50% {
        background: linear-gradient(90deg, transparent, #d4af37, #f5e1a8, #d4af37, transparent);
    }
}

.for-you-divider {
    animation: forYouDividerGrow 0.8s ease-out 0.5s forwards, forYouDividerShine 3s ease-in-out infinite;
    width: 0;
}

/* Section Fade In */
@keyframes forYouSectionFade {
    0% {
        opacity: 0;
        transform: translateY(40px);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

.for-you-section-fade {
    animation: forYouSectionFade 0.8s ease-out 0.7s forwards;
    opacity: 0;
}

.for-you-section-fade-2 {
    animation: forYouSectionFade 0.8s ease-out 1s forwards;
    opacity: 0;
}

.for-you-section-fade-3 {
    animation: forYouSectionFade 0.8s ease-out 1.2s forwards;
    opacity: 0;
}

/* Bullet Item Animation - Staggered */
@keyframes forYouBulletSlide {
    0% {
        opacity: 0;
        transform: translateX(50px);
    }
    100% {
        opacity: 1;
        transform: translateX(0);
    }
}

.for-you-bullet-item {
    opacity: 0;
    animation: forYouBulletSlide 0.6s ease-out forwards;
}

.for-you-bullet-item:nth-child(1) {
    animation-delay: 0.9s;
}

.for-you-bullet-item:nth-child(2) {
    animation-delay: 1s;
}

.for-you-bullet-item:nth-child(3) {
    animation-delay: 1.1s;
}

.for-you-bullet-item:nth-child(4) {
    animation-delay: 1.2s;
}

.for-you-bullet-item:nth-child(5) {
    animation-delay: 1.3s;
}

.for-you-bullet-item:nth-child(6) {
    animation-delay: 1.4s;
}

.for-you-bullet-item:nth-child(7) {
    animation-delay: 1.5s;
}

.for-you-bullet-item:nth-child(8) {
    animation-delay: 1.6s;
}

.for-you-bullet-item:nth-child(9) {
    animation-delay: 1.7s;
}

.for-you-bullet-item:nth-child(10) {
    animation-delay: 1.8s;
}

/* Bullet Icon Pulse */
@keyframes forYouIconPulse {
    0%, 100% {
        box-shadow: 0 0 0 0 rgba(212, 175, 55, 0.7);
    }
    50% {
        box-shadow: 0 0 0 10px rgba(212, 175, 55, 0);
    }
}

.for-you-bullet-icon {
    animation: forYouIconPulse 2s infinite;
}

/* Heart Reveal Animation */
@keyframes forYouHeartReveal {
    0% {
        opacity: 0;
        transform: scale(0.8);
        filter: blur(5px);
    }
    50% {
        transform: scale(1.05);
    }
    100% {
        opacity: 1;
        transform: scale(1);
        filter: blur(0);
    }
}

.for-you-heart-reveal {
    animation: forYouHeartReveal 0.8s ease-out 1.9s forwards;
    opacity: 0;
}

/* Decorative Divider Animation */
@keyframes forYouDecorativeFade {
    0% {
        opacity: 0;
        transform: scaleX(0);
    }
    100% {
        opacity: 1;
        transform: scaleX(1);
    }
}

.for-you-decorative-divider {
    animation: forYouDecorativeFade 0.8s ease-out 2.1s forwards;
    opacity: 0;
}

/* Feature Card Animation */
@keyframes forYouFeatureSlide {
    0% {
        opacity: 0;
        transform: translateY(30px) rotateX(-10deg);
    }
    100% {
        opacity: 1;
        transform: translateY(0) rotateX(0deg);
    }
}

.for-you-feature-card {
    opacity: 0;
    animation: forYouFeatureSlide 0.6s ease-out forwards;
}

.for-you-feature-card:nth-child(1) {
    animation-delay: 1.2s;
}

.for-you-feature-card:nth-child(2) {
    animation-delay: 1.3s;
}

.for-you-feature-card:nth-child(3) {
    animation-delay: 1.4s;
}

.for-you-feature-card:nth-child(4) {
    animation-delay: 1.5s;
}

.for-you-feature-card:nth-child(5) {
    animation-delay: 1.6s;
}

.for-you-feature-card:nth-child(6) {
    animation-delay: 1.7s;
}

/* Final Bullet Animation */
@keyframes forYouFinalBulletSlide {
    0% {
        opacity: 0;
        transform: translateX(-50px);
    }
    100% {
        opacity: 1;
        transform: translateX(0);
    }
}

.for-you-final-bullet {
    opacity: 0;
    animation: forYouFinalBulletSlide 0.6s ease-out forwards;
}

.for-you-final-bullet:nth-child(1) {
    animation-delay: 1.4s;
}

.for-you-final-bullet:nth-child(2) {
    animation-delay: 1.5s;
}

.for-you-final-bullet:nth-child(3) {
    animation-delay: 1.6s;
}

.for-you-final-bullet:nth-child(4) {
    animation-delay: 1.7s;
}

.for-you-final-bullet:nth-child(5) {
    animation-delay: 1.8s;
}

/* Final Message Animation */
@keyframes forYouFinalMessageReveal {
    0% {
        opacity: 0;
        transform: scale(0.9) translateY(20px);
    }
    60% {
        transform: scale(1.02) translateY(-5px);
    }
    100% {
        opacity: 1;
        transform: scale(1) translateY(0);
    }
}

.for-you-final-message {
    animation: forYouFinalMessageReveal 1s ease-out 1.9s forwards;
    opacity: 0;
}

/* CTA Button Animation */
@keyframes forYouCtaReveal {
    0% {
        opacity: 0;
        transform: translateY(30px) scale(0.9);
    }
    70% {
        transform: translateY(-10px) scale(1.05);
    }
    100% {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

.for-you-cta-reveal {
    animation: forYouCtaReveal 1s ease-out 2.1s forwards;
    opacity: 0;
}

/* Button Shine Effect */
@keyframes forYouButtonShine {
    0% {
        left: -100%;
    }
    20%, 100% {
        left: 100%;
    }
}

.for-you-button-shine {
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg,
        transparent,
        rgba(255, 255, 255, 0.3),
        transparent);
    animation: forYouButtonShine 3s infinite;
}

/* Hover Effects Enhancement */
.for-you-bullet-item:hover .for-you-bullet-icon {
    animation: forYouIconPulse 0.5s ease-out;
}

/* Responsive Adjustments */
@media (max-width: 768px) {
    .for-you-bullet-item,
    .for-you-feature-card,
    .for-you-final-bullet {
        animation-delay: 0s !important;
        opacity: 1;
    }

    .for-you-section-fade,
    .for-you-section-fade-2,
    .for-you-section-fade-3 {
        animation-delay: 0s;
        opacity: 1;
    }
}

/* Desktop - Show content immediately without waiting for scroll */
@media (min-width: 769px) {
    /* Fallback: show all content if animations fail */
    .for-you-bullet-item,
    .for-you-feature-card,
    .for-you-final-bullet {
        opacity: 1 !important;
        animation: none !important;
    }

    .for-you-section-fade,
    .for-you-section-fade-2,
    .for-you-section-fade-3 {
        opacity: 1 !important;
        animation: none !important;
    }

    .for-you-heart-reveal,
    .for-you-decorative-divider,
    .for-you-final-message,
    .for-you-cta-reveal {
        opacity: 1 !important;
        animation: none !important;
    }
}

/* Scroll-triggered animations for mobile */
@media (max-width: 768px) {
    @keyframes mobileSlideIn {
        from {
            opacity: 0;
            transform: translateY(20px);
        }
        to {
            opacity: 1;
            transform: translateY(0);
        }
    }

    .for-you-bullet-item,
    .for-you-feature-card,
    .for-you-final-bullet {
        animation: mobileSlideIn 0.6s ease-out forwards;
    }
}

/* Gradient Glow Effect */
@keyframes forYouGradientGlow {
    0%, 100% {
        box-shadow: 0 4px 20px rgba(212, 175, 55, 0.3);
    }
    50% {
        box-shadow: 0 8px 40px rgba(212, 175, 55, 0.6);
    }
}

.for-you-bullet-item:hover > div,
.for-you-feature-card:hover > div {
    animation: forYouGradientGlow 2s ease-in-out infinite;
}

/* Text Shimmer Effect */
@keyframes forYouTextShimmer {
    0% {
        background-position: -500%;
    }
    100% {
        background-position: 500%;
    }
}

.for-you-heart-reveal span {
    background: linear-gradient(90deg,
        #d4af37 0%,
        #f5e1a8 50%,
        #d4af37 100%);
    background-size: 200% auto;
    -webkit-background-clip: text;
    background-clip: text;
    animation: forYouTextShimmer 3s linear infinite;
}

/* Pulse Animation for Decorative Elements */
@keyframes forYouPulseGlow {
    0%, 100% {
        opacity: 0.6;
        transform: scale(1);
    }
    50% {
        opacity: 1;
        transform: scale(1.2);
    }
}

.for-you-decorative-divider .animate-pulse {
    animation: forYouPulseGlow 2s ease-in-out infinite;
}

