/* ========================================
   ASTROCHEAT - CONSISTENT CARD TEMPLATE
   ======================================== */

/* Base Card Template - Applied to ALL card types */
.card,
.card *,
.feature-card,
.feature-card *,
.pricing-card,
.pricing-card *,
.contact-card,
.contact-card *,
.stat-card,
.stat-card *,
.result-card,
.result-card *,
.instructions-card,
.instructions-card *,
.script-section,
.script-section *,
.cta-section,
.cta-section * {
    /* Consistent Font Styling */
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    line-height: 1.6;
    color: #eaeaea;
}

/* Base Card Styling - Applied to ALL cards */
.card,
.feature-card,
.pricing-card,
.contact-card,
.stat-card,
.result-card,
.instructions-card,
.script-section,
.cta-section,
.validation-form,
.alert-card {
    /* Consistent Background */
    background: rgba(5, 5, 15, 0.95) !important;
    backdrop-filter: blur(10px) !important;

    /* Consistent Border & Radius */
    border: 1px solid rgba(0, 255, 255, 0.3) !important;
    border-radius: 20px !important;

    /* Consistent Shadow */
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.5) !important;

    /* Consistent Spacing */
    padding: 30px !important;
    margin-bottom: 30px !important;

    /* Consistent Animations */
    transition: all 0.3s ease !important;
    position: relative !important;
    overflow: hidden !important;
}

/* Additional styling for cards that don't have base .card class */
.feature-card:not(.card),
.pricing-card:not(.card),
.contact-card:not(.card),
.stat-card:not(.card),
.result-card:not(.card),
.instructions-card:not(.card),
.script-section:not(.card),
.cta-section:not(.card),
.validation-form:not(.card),
.alert-card:not(.card) {
    /* Apply same styling as base .card */
    background: rgba(5, 5, 15, 0.95) !important;
    backdrop-filter: blur(10px) !important;
    border: 1px solid rgba(0, 255, 255, 0.3) !important;
    border-radius: 20px !important;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.5) !important;
    padding: 30px !important;
    margin-bottom: 30px !important;
    transition: all 0.3s ease !important;
    position: relative !important;
    overflow: hidden !important;
}

/* Consistent Hover Effects - Applied to ALL cards */
.card:hover,
.feature-card:hover,
.pricing-card:hover,
.contact-card:hover,
.stat-card:hover,
.result-card:hover,
.instructions-card:hover,
.script-section:hover,
.cta-section:hover,
.validation-form:hover,
.alert-card:hover,
.feature-card:not(.card):hover,
.pricing-card:not(.card):hover,
.contact-card:not(.card):hover,
.stat-card:not(.card):hover,
.result-card:not(.card):hover,
.instructions-card:not(.card):hover,
.script-section:not(.card):hover,
.cta-section:not(.card):hover,
.validation-form:not(.card):hover,
.alert-card:not(.card):hover {
    transform: translateY(-5px) !important;
    box-shadow: 0 12px 40px rgba(0, 255, 255, 0.2) !important;
    border-color: #00ffff !important;
}

/* Special Hover Effects for Specific Card Types */
.pricing-card:hover,
.feature-card:hover,
.pricing-card:not(.card):hover,
.feature-card:not(.card):hover {
    transform: translateY(-8px) !important;
    box-shadow: 0 15px 45px rgba(0, 255, 255, 0.3) !important;
}

/* Gradient Border Animation for ALL Cards */
.card::before,
.feature-card::before,
.pricing-card::before,
.contact-card::before,
.stat-card::before,
.result-card::before,
.instructions-card::before,
.script-section::before,
.cta-section::before,
.validation-form::before,
.alert-card::before,
.card:not(.card)::before,
.feature-card:not(.card)::before,
.pricing-card:not(.card)::before,
.contact-card:not(.card)::before,
.stat-card:not(.card)::before,
.result-card:not(.card)::before,
.instructions-card:not(.card)::before,
.script-section:not(.card)::before,
.cta-section:not(.card)::before,
.validation-form:not(.card)::before,
.alert-card:not(.card)::before,
.pricing-card.popular::before,
.pricing-card.popular:not(.card)::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 2px;
    background: linear-gradient(90deg, #ff6b6b, #4ecdc4, #45b7d1, #96ceb4);
    animation: gradientShift 3s ease infinite;
    border-radius: 20px 20px 0 0;
}

/* Heading Consistency Across All Cards */
.card h1, .card h2, .card h3, .card h4, .card h5, .card h6,
.feature-card h1, .feature-card h2, .feature-card h3, .feature-card h4, .feature-card h5, .feature-card h6,
.pricing-card h1, .pricing-card h2, .pricing-card h3, .pricing-card h4, .pricing-card h5, .pricing-card h6,
.contact-card h1, .contact-card h2, .contact-card h3, .contact-card h4, .contact-card h5, .contact-card h6,
.stat-card h1, .stat-card h2, .stat-card h3, .stat-card h4, .stat-card h5, .stat-card h6,
.result-card h1, .result-card h2, .result-card h3, .result-card h4, .result-card h5, .result-card h6,
.instructions-card h1, .instructions-card h2, .instructions-card h3, .instructions-card h4, .instructions-card h5, .instructions-card h6,
.script-section h1, .script-section h2, .script-section h3, .script-section h4, .script-section h5, .script-section h6,
.cta-section h1, .cta-section h2, .cta-section h3, .cta-section h4, .cta-section h5, .cta-section h6,
.validation-form h1, .validation-form h2, .validation-form h3, .validation-form h4, .validation-form h5, .validation-form h6,
.alert-card h1, .alert-card h2, .alert-card h3, .alert-card h4, .alert-card h5, .alert-card h6,
.feature-card:not(.card) h1, .feature-card:not(.card) h2, .feature-card:not(.card) h3,
.pricing-card:not(.card) h1, .pricing-card:not(.card) h2, .pricing-card:not(.card) h3,
.contact-card:not(.card) h1, .contact-card:not(.card) h2, .contact-card:not(.card) h3,
.stat-card:not(.card) h1, .stat-card:not(.card) h2, .stat-card:not(.card) h3,
.result-card:not(.card) h1, .result-card:not(.card) h2, .result-card:not(.card) h3,
.instructions-card:not(.card) h1, .instructions-card:not(.card) h2, .instructions-card:not(.card) h3,
.script-section:not(.card) h1, .script-section:not(.card) h2, .script-section:not(.card) h3,
.cta-section:not(.card) h1, .cta-section:not(.card) h2, .cta-section:not(.card) h3,
.validation-form:not(.card) h1, .validation-form:not(.card) h2, .validation-form:not(.card) h3,
.alert-card:not(.card) h1, .alert-card:not(.card) h2, .alert-card:not(.card) h3 {
    color: #4ecdc4;
    margin-bottom: 1rem;
    font-weight: 700;
    text-shadow: 0 0 10px rgba(78, 205, 196, 0.3);
}

/* Paragraph Consistency */
.card p, .feature-card p, .pricing-card p, .contact-card p, .stat-card p, .result-card p, .instructions-card p, .script-section p, .cta-section p, .validation-form p, .alert-card p,
.feature-card:not(.card) p, .pricing-card:not(.card) p, .contact-card:not(.card) p, .stat-card:not(.card) p, .result-card:not(.card) p, .instructions-card:not(.card) p, .script-section:not(.card) p, .cta-section:not(.card) p, .validation-form:not(.card) p, .alert-card:not(.card) p {
    color: #b8b8b8;
    margin-bottom: 1rem;
    line-height: 1.6;
}

/* List Consistency */
.card ul, .card ol, .feature-card ul, .feature-card ol, .pricing-card ul, .pricing-card ol, .contact-card ul, .contact-card ol, .stat-card ul, .stat-card ol, .result-card ul, .result-card ol, .instructions-card ul, .instructions-card ol, .script-section ul, .script-section ol, .cta-section ul, .cta-section ol, .validation-form ul, .validation-form ol, .alert-card ul, .alert-card ol,
.feature-card:not(.card) ul, .feature-card:not(.card) ol, .pricing-card:not(.card) ul, .pricing-card:not(.card) ol, .contact-card:not(.card) ul, .contact-card:not(.card) ol, .stat-card:not(.card) ul, .stat-card:not(.card) ol, .result-card:not(.card) ul, .result-card:not(.card) ol, .instructions-card:not(.card) ul, .instructions-card:not(.card) ol, .script-section:not(.card) ul, .script-section:not(.card) ol, .cta-section:not(.card) ul, .cta-section:not(.card) ol, .validation-form:not(.card) ul, .validation-form:not(.card) ol, .alert-card:not(.card) ul, .alert-card:not(.card) ol {
    margin: 1rem 0;
    padding-left: 1.5rem;
}

.card li, .feature-card li, .pricing-card li, .contact-card li, .stat-card li, .result-card li, .instructions-card li, .script-section li, .cta-section li, .validation-form li, .alert-card li,
.feature-card:not(.card) li, .pricing-card:not(.card) li, .contact-card:not(.card) li, .stat-card:not(.card) li, .result-card:not(.card) li, .instructions-card:not(.card) li, .script-section:not(.card) li, .cta-section:not(.card) li, .validation-form:not(.card) li, .alert-card:not(.card) li {
    color: #b8b8b8;
    margin-bottom: 0.5rem;
}

/* Button Consistency in Cards */
.card .btn, .feature-card .btn, .pricing-card .btn, .contact-card .btn, .stat-card .btn, .result-card .btn, .instructions-card .btn, .script-section .btn, .cta-section .btn, .validation-form .btn, .alert-card .btn,
.feature-card:not(.card) .btn, .pricing-card:not(.card) .btn, .contact-card:not(.card) .btn, .stat-card:not(.card) .btn, .result-card:not(.card) .btn, .instructions-card:not(.card) .btn, .script-section:not(.card) .btn, .cta-section:not(.card) .btn, .validation-form:not(.card) .btn, .alert-card:not(.card) .btn {
    background: linear-gradient(45deg, #4ecdc4, #44a08d);
    color: #1a1a2e;
    border: none;
    border-radius: 25px;
    font-weight: bold;
    text-transform: uppercase;
    letter-spacing: 1px;
    cursor: pointer;
    transition: all 0.3s ease;
    box-shadow: 0 4px 15px rgba(78, 205, 196, 0.3);
    padding: 12px 24px;
    margin: 5px;
}

.card .btn:hover, .feature-card .btn:hover, .pricing-card .btn:hover, .contact-card .btn:hover, .stat-card .btn:hover, .result-card .btn:hover, .instructions-card .btn:hover, .script-section .btn:hover, .cta-section .btn:hover, .validation-form .btn:hover, .alert-card .btn:hover,
.feature-card:not(.card) .btn:hover, .pricing-card:not(.card) .btn:hover, .contact-card:not(.card) .btn:hover, .stat-card:not(.card) .btn:hover, .result-card:not(.card) .btn:hover, .instructions-card:not(.card) .btn:hover, .script-section:not(.card) .btn:hover, .cta-section:not(.card) .btn:hover, .validation-form:not(.card) .btn:hover, .alert-card:not(.card) .btn:hover {
    background: linear-gradient(45deg, #ff6b6b, #ee5a52);
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(255, 107, 107, 0.4);
}

/* Secondary Button Consistency */
.card .btn-secondary, .feature-card .btn-secondary, .pricing-card .btn-secondary, .contact-card .btn-secondary, .stat-card .btn-secondary, .result-card .btn-secondary, .instructions-card .btn-secondary, .script-section .btn-secondary, .cta-section .btn-secondary, .validation-form .btn-secondary, .alert-card .btn-secondary,
.feature-card:not(.card) .btn-secondary, .pricing-card:not(.card) .btn-secondary, .contact-card:not(.card) .btn-secondary, .stat-card:not(.card) .btn-secondary, .result-card:not(.card) .btn-secondary, .instructions-card:not(.card) .btn-secondary, .script-section:not(.card) .btn-secondary, .cta-section:not(.card) .btn-secondary, .validation-form:not(.card) .btn-secondary, .alert-card:not(.card) .btn-secondary {
    background: linear-gradient(45deg, #1a1a2e, #16213e);
    color: #4ecdc4;
    border: 2px solid #4ecdc4;
}

.card .btn-secondary:hover, .feature-card .btn-secondary:hover, .pricing-card .btn-secondary:hover, .contact-card .btn-secondary:hover, .stat-card .btn-secondary:hover, .result-card .btn-secondary:hover, .instructions-card .btn-secondary:hover, .script-section .btn-secondary:hover, .cta-section .btn-secondary:hover, .validation-form .btn-secondary:hover, .alert-card .btn-secondary:hover,
.feature-card:not(.card) .btn-secondary:hover, .pricing-card:not(.card) .btn-secondary:hover, .contact-card:not(.card) .btn-secondary:hover, .stat-card:not(.card) .btn-secondary:hover, .result-card:not(.card) .btn-secondary:hover, .instructions-card:not(.card) .btn-secondary:hover, .script-section:not(.card) .btn-secondary:hover, .cta-section:not(.card) .btn-secondary:hover, .validation-form:not(.card) .btn-secondary:hover, .alert-card:not(.card) .btn-secondary:hover {
    background: linear-gradient(45deg, #4ecdc4, #44a08d);
    color: #1a1a2e;
}

/* Badge/Label Consistency */
.feature-badge,
.badge-free,
.badge-vip,
.badge-popular {
    display: inline-block;
    padding: 4px 8px;
    border-radius: 12px;
    font-size: 0.8rem;
    font-weight: bold;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-left: 8px;
}

.badge-free {
    background: linear-gradient(45deg, #4ecdc4, #44a08d);
    color: #1a1a2e;
}

.badge-vip {
    background: linear-gradient(45deg, #ff6b6b, #ee5a52);
    color: #ffffff;
}

.badge-popular {
    background: linear-gradient(45deg, #ffd700, #ff8c00);
    color: #1a1a2e;
}

/* Animation Keyframes */
@keyframes gradientShift {
    0% {
        background-position: 0% 50%;
    }
    50% {
        background-position: 100% 50%;
    }
    100% {
        background-position: 0% 50%;
    }
}

/* Responsive Design for All Cards */
@media (max-width: 768px) {
    .card, .feature-card, .pricing-card, .contact-card, .stat-card, .result-card, .instructions-card, .script-section, .cta-section, .validation-form, .alert-card,
    .feature-card:not(.card), .pricing-card:not(.card), .contact-card:not(.card), .stat-card:not(.card), .result-card:not(.card), .instructions-card:not(.card), .script-section:not(.card), .cta-section:not(.card), .validation-form:not(.card), .alert-card:not(.card) {
        padding: 20px;
        margin-bottom: 20px;
    }

    .card h1, .card h2, .card h3, .feature-card h1, .feature-card h2, .feature-card h3, .pricing-card h1, .pricing-card h2, .pricing-card h3, .contact-card h1, .contact-card h2, .contact-card h3, .stat-card h1, .stat-card h2, .stat-card h3, .result-card h1, .result-card h2, .result-card h3, .instructions-card h1, .instructions-card h2, .instructions-card h3, .script-section h1, .script-section h2, .script-section h3, .cta-section h1, .cta-section h2, .cta-section h3, .validation-form h1, .validation-form h2, .validation-form h3, .alert-card h1, .alert-card h2, .alert-card h3,
    .feature-card:not(.card) h1, .feature-card:not(.card) h2, .feature-card:not(.card) h3, .pricing-card:not(.card) h1, .pricing-card:not(.card) h2, .pricing-card:not(.card) h3, .contact-card:not(.card) h1, .contact-card:not(.card) h2, .contact-card:not(.card) h3, .stat-card:not(.card) h1, .stat-card:not(.card) h2, .stat-card:not(.card) h3, .result-card:not(.card) h1, .result-card:not(.card) h2, .result-card:not(.card) h3, .instructions-card:not(.card) h1, .instructions-card:not(.card) h2, .instructions-card:not(.card) h3, .script-section:not(.card) h1, .script-section:not(.card) h2, .script-section:not(.card) h3, .cta-section:not(.card) h1, .cta-section:not(.card) h2, .cta-section:not(.card) h3, .validation-form:not(.card) h1, .validation-form:not(.card) h2, .validation-form:not(.card) h3, .alert-card:not(.card) h1, .alert-card:not(.card) h2, .alert-card:not(.card) h3 {
        font-size: 1.3rem;
    }
}