/* ════════════════════════════════════════════════════════════════════════════
   faq.css  —  FAQ page specific styles
   ════════════════════════════════════════════════════════════════════════════ */

/* ── FAQ ── */
@keyframes slideUp { from{opacity:0;transform:translateY(30px)} to{opacity:1;transform:translateY(0)} }
.header-icon { font-size:2.5rem; margin-bottom:.5rem; }
h1 { font-size:1.6rem; font-weight:800; color: var(--text); letter-spacing:-.5px; }

/* Outer card wraps all FAQ items */
.faq-card {
    width:100%;
    background:var(--card-bg);
    border:1px solid var(--glass-border);
    border-radius:24px;
    padding:1.75rem 2rem;
    box-shadow:0 8px 32px rgba(0,0,0,0.4),inset 0 1px 0 rgba(255,255,255,0.1),inset 0 -1px 0 rgba(0,0,0,0.1);
    backdrop-filter:blur(40px) saturate(150%);
    -webkit-backdrop-filter:blur(40px) saturate(150%);
    position:relative; overflow:hidden;
}
.faq-card::before { content:''; position:absolute; top:0; left:0; right:0; height:1px; background:linear-gradient(90deg,transparent,rgba(255,255,255,0.3),transparent); }
.faq-card::after  { content:''; position:absolute; top:0; left:0; right:0; bottom:0; background:var(--glass-shine); pointer-events:none; border-radius:24px; }
.section-title { font-size:.72rem; font-weight:700; letter-spacing:1.6px; text-transform:uppercase; color: var(--text); margin:0 0 1.1rem; position:relative; z-index:1; }

.faq-list { display:flex; flex-direction:column; gap:.6rem; position:relative; z-index:1; }

.faq-item {
    background:rgba(88,101,242,0.07);
    border:1px solid rgba(88,101,242,0.18);
    border-radius:12px; overflow:hidden;
    transition:border-color .2s;
    animation:fadeIn .4s ease both;
}
@keyframes fadeIn { from{opacity:0} to{opacity:1} }
.faq-item:nth-child(1){animation-delay:.05s}.faq-item:nth-child(2){animation-delay:.1s}
.faq-item:nth-child(3){animation-delay:.15s}.faq-item:nth-child(4){animation-delay:.2s}
.faq-item:nth-child(5){animation-delay:.25s}.faq-item:nth-child(6){animation-delay:.3s}
.faq-item:nth-child(7){animation-delay:.35s}
.faq-item.active { border-color:rgba(88,101,242,0.4); }

.faq-q {
    padding:1rem 1.25rem; font-weight:600; cursor:pointer;
    display:flex; justify-content:space-between; align-items:center; gap:1rem;
    transition:background .2s;
}
.faq-q:hover { background:rgba(88,101,242,0.1); }
.faq-q-text { flex:1; font-size:.95rem; }
.faq-arrow {
    width:24px; height:24px; display:flex; align-items:center; justify-content:center;
    border-radius:50%; background:rgba(88,101,242,0.15); color:var(--accent);
    font-size:.75rem; transition:all .3s; flex-shrink:0;
}
.faq-item.active .faq-arrow { transform:rotate(180deg); background:var(--accent); color: var(--text); }

.faq-a {
    max-height:0; overflow:hidden;
    transition:max-height .4s ease,padding .4s ease;
    color:var(--text-dim); line-height:1.7; font-size:.9rem;
    border-top:1px solid transparent;
}
.faq-item.active .faq-a { max-height:500px; padding:1rem 1.25rem; border-top-color:rgba(88,101,242,0.15); }

@media(max-width:600px) {
    h1{font-size:1.3rem} .header-icon{font-size:2rem}
    .faq-card{padding:1.25rem;border-radius:16px}
    .faq-q{padding:.85rem 1rem}
    .faq-item.active .faq-a{padding:.85rem 1rem}
}
@media(max-width:540px){body{padding-left:0.65rem;padding-right:0.65rem;}.card,.glass-card{padding:1.1rem 1.1rem;}}
