/* FAQ Page Styles */
.faq-hero { position: relative; padding: calc(var(--nav-height) + var(--space-10)) 0 var(--space-14); text-align: center; overflow: hidden; }
.faq-hero h1 { font-size: clamp(2rem, 5vw, 3rem); font-weight: 900; margin: var(--space-4) 0 var(--space-5); }
.faq-hero p { font-size: var(--text-lg); color: var(--clr-text-2); max-width: 500px; margin: 0 auto var(--space-8); }
.faq-search { display: flex; align-items: center; gap: var(--space-3); max-width: 460px; margin: 0 auto; background: rgba(255,255,255,0.04); border: 1px solid var(--clr-border-2); border-radius: var(--radius-full); padding: var(--space-3) var(--space-5); backdrop-filter: blur(12px); }
.faq-search input { flex: 1; background: transparent; border: none; outline: none; color: var(--clr-text); font-size: var(--text-base); }
.faq-search svg { color: var(--clr-text-3); flex-shrink: 0; }

/* Layout */
.faq-layout { display: grid; grid-template-columns: 240px 1fr; gap: var(--space-10); align-items: start; padding-bottom: var(--space-20); }
.faq-sidebar { position: sticky; top: calc(var(--nav-height) + var(--space-4)); display: flex; flex-direction: column; gap: var(--space-4); }
.faq-cat-nav { display: flex; flex-direction: column; gap: var(--space-1); }
.faq-cat { padding: var(--space-3) var(--space-4); background: transparent; border: 1px solid var(--clr-border); border-radius: var(--radius-md); color: var(--clr-text-2); font-size: var(--text-sm); text-align: left; cursor: pointer; transition: all var(--transition-fast); }
.faq-cat:hover { background: #f1f1f1; border-color: #d8d8d8; color: #111111; }
.faq-cat.active { background: #111111; border-color: #111111; color: #ffffff; }
.faq-contact-card { padding: var(--space-5); border: 1px solid var(--clr-border); }
.faq-contact-card h4 { font-size: var(--text-sm); font-weight: 700; margin-bottom: var(--space-2); }

/* FAQ Sections */
.faq-main { display: flex; flex-direction: column; gap: var(--space-10); }
.faq-section { scroll-margin-top: calc(var(--nav-height) + var(--space-4)); }
.faq-section-title { font-size: var(--text-xl); font-weight: 800; margin-bottom: var(--space-5); }
.disclaimer-block { background: rgba(255,184,48,0.06); border: 1px solid rgba(255,184,48,0.15); border-radius: var(--radius-lg); padding: var(--space-4) var(--space-5); margin-bottom: var(--space-5); font-size: var(--text-sm); color: var(--clr-text-2); line-height: 1.7; }
.disclaimer-block strong { color: var(--clr-warning); }

/* Accordion */
.accordion { display: flex; flex-direction: column; }
.acc-item { border-bottom: 1px solid var(--clr-border); overflow: hidden; }
.acc-item:first-child { border-top: 1px solid var(--clr-border); }
.acc-header { display: flex; align-items: center; justify-content: space-between; gap: var(--space-4); padding: var(--space-4) 0; cursor: pointer; font-weight: 600; font-size: var(--text-base); transition: color var(--transition-fast); }
.acc-header:hover { color: var(--clr-accent); }
.acc-icon { font-size: var(--text-xl); color: var(--clr-accent); transition: transform var(--transition-fast); flex-shrink: 0; }
.acc-body { max-height: 0; overflow: hidden; transition: max-height 0.3s ease, padding 0.3s ease; }
.acc-body p { color: var(--clr-text-2); line-height: 1.8; font-size: var(--text-sm); padding-bottom: var(--space-5); margin: 0; }
.acc-item.open .acc-icon { transform: rotate(45deg); }
.acc-item.open .acc-body { max-height: 400px; }

@media (max-width: 1024px) { .faq-layout { grid-template-columns: 1fr; } .faq-sidebar { position: static; } .faq-cat-nav { flex-direction: row; flex-wrap: wrap; } .faq-cat { flex: none; } }