/* =================================
   Support Page-Specific Styles
   ================================= */
main { 
    padding: 120px 20px 40px; 
    position: relative; /* Added to ensure it's above canvas */
    z-index: 1;
}

.page-header { 
    text-align: center; 
    max-width: 800px; 
    margin: 0 auto 80px; 
}

.page-header h1 { 
    font-size: 48px; 
    color: #00d65b; 
    margin-bottom: 20px; 
}

.page-header p { 
    font-size: 18px; 
    color: #c0c0d0; 
    line-height: 1.6; 
}

.support-section { 
    max-width: 900px; 
    margin: 0 auto 80px; 
}

.support-section h2 { 
    font-size: 36px; 
    text-align: center; 
    margin-bottom: 50px; 
    color: #e0e0e0; 
}

.faq-item { 
    background-color: #101d35; 
    border: 1px solid #2a3a5e; 
    border-radius: 10px; 
    margin-bottom: 15px; 
    overflow: hidden; 
}

.faq-question { 
    width: 100%; 
    text-align: left; 
    background: none; 
    border: none; 
    padding: 20px; 
    font-size: 18px; 
    font-weight: 600; 
    color: #e0e0e0; 
    cursor: pointer; 
    display: flex; 
    justify-content: space-between; 
    align-items: center; 
}

.faq-question:hover { 
    background-color: #1b2a49; 
}

.faq-question::after { 
    content: '+'; 
    font-size: 28px; 
    color: #00d65b; 
    transition: transform 0.3s ease; 
}

.faq-question.active::after { 
    transform: rotate(45deg); 
}

.faq-answer { 
    max-height: 0; 
    overflow: hidden; 
    transition: max-height 0.5s ease; /* Removed padding from transition */
}

.faq-answer p { 
    padding: 0 20px 20px; 
    font-size: 16px; 
    color: #c0c0d0; 
    line-height: 1.7; 
}

.support-contact { 
    text-align: center; 
    background-color: rgba(13, 27, 42, 0.75); 
    backdrop-filter: blur(10px); 
    padding: 40px; 
    border-radius: 15px; 
    border: 1px solid rgba(0, 214, 91, 0.15); 
}

.support-contact p { 
    margin-bottom: 25px; 
}

.support-contact .btn { 
    display: inline-block; 
    background-color: #00d65b; 
    color: #0d1b2a; 
    padding: 14px 35px; 
    border-radius: 30px; 
    text-decoration: none; 
    font-weight: 700; 
    font-size: 16px; 
    transition: all 0.3s ease; 
}

.support-contact .btn:hover { 
    background-color: #00b84e; 
    transform: translateY(-2px); 
}

/* Media Queries (Page-Specific) */
@media (max-width: 768px) { 
    .page-header h1 {
        font-size: 36px;
    } 
}

@media (max-width: 576px) { 
    main { 
        padding: 80px 10px 20px; 
    } 
}