/* 价格页面专属样式 */

/* 价格卡片悬浮效果 - 桌面端 */
.price-card {
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}
.price-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 25px 50px -12px rgba(37, 99, 235, 0.25);
}

/* 价格卡片内部对齐 */
.price-card .price-features {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

/* 节省徽章 */
.save-badge {
    background: linear-gradient(135deg, #ef4444 0%, #dc2626 100%);
}

/* 动画类 - 与 home.css 保持一致 */
.animate-float {
    animation: float 6s ease-in-out infinite;
}
.animate-pulse-slow {
    animation: pulse 4s cubic-bezier(0.4, 0, 0.6, 1) infinite;
}

@keyframes float {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-20px); }
}

/* ================================================
   手机端响应式适配 - 价格页面
   ================================================ */
@media (max-width: 767px) {
    /* Hero 区域手机端适配 */
    #pricing-hero {
        padding-top: 5rem !important;
        padding-bottom: 3rem !important;
    }
    
    #pricing-hero h1 {
        font-size: 2rem !important;
        line-height: 1.2 !important;
        margin-bottom: 1rem !important;
    }
    
    #pricing-hero p {
        font-size: 1rem !important;
        margin-bottom: 1.5rem !important;
    }
    
    #pricing-hero .tags-container {
        gap: 0.5rem !important;
    }
    
    #pricing-hero .tags-container span {
        padding: 0.4rem 0.5rem !important;
        font-size: 0.7rem !important;
        text-align: center !important;
    }
    
    #pricing-hero .tags-container span i {
        width: 0.875rem !important;
        height: 0.875rem !important;
    }
    
    /* 价格卡片区域手机端适配 */
    #pricing-cards {
        padding-top: 2.5rem !important;
        padding-bottom: 2.5rem !important;
    }
    
    #pricing-cards .grid {
        gap: 1.5rem !important;
    }
    
    /* 成长包移除移动端突出效果 */
    #pricing-cards .md\:scale-105 {
        transform: none !important;
        margin-top: 0 !important;
        margin-bottom: 0 !important;
    }
    
    /* 价格卡片手机端样式 */
    #pricing-cards .price-card {
        border-radius: 1.5rem !important;
    }
    
    #pricing-cards .price-card > div:first-child {
        padding: 1.25rem !important;
    }
    
    #pricing-cards .price-card h3 {
        font-size: 1.35rem !important;
    }
    
    #pricing-cards .price-card .text-4xl,
    #pricing-cards .price-card .text-5xl {
        font-size: 2rem !important;
    }
    
    #pricing-cards .price-card .price-features {
        gap: 0.6rem !important;
    }
    
    #pricing-cards .price-card .price-features > div {
        font-size: 0.875rem !important;
    }
    
    /* 免费说明手机端 */
    #pricing-cards .mt-16 {
        margin-top: 2rem !important;
    }
    
    #pricing-cards .inline-flex {
        padding: 0.6rem 1rem !important;
        font-size: 0.8rem !important;
    }
    
    /* FAQ区域手机端适配 */
    #pricing-faq {
        padding-top: 2.5rem !important;
        padding-bottom: 2.5rem !important;
    }
    
    #pricing-faq h2 {
        font-size: 1.75rem !important;
        margin-bottom: 0.5rem !important;
    }
    
    #pricing-faq h3 {
        font-size: 1rem !important;
    }
    
    #pricing-faq .bg-slate-50 {
        padding: 1rem !important;
        border-radius: 1rem !important;
    }
    
    #pricing-faq .bg-slate-50 p {
        font-size: 0.85rem !important;
        line-height: 1.6 !important;
    }
}