/* Page Header */
.page-header{
    background:linear-gradient(165deg,#0f2044 0%,#1a3a6b 40%,#2563eb 100%);
    color:white;padding:60px 0 80px;position:relative;overflow:hidden;
}
.page-header::before{
    content:'';position:absolute;top:-30%;right:-10%;width:500px;height:500px;
    background:radial-gradient(circle,rgba(245,158,11,0.12) 0%,transparent 70%);border-radius:50%;
}
.page-header h1{font-size:42px;margin-bottom:12px;position:relative;z-index:2}
.page-header p{font-size:18px;opacity:0.85;position:relative;z-index:2}
.breadcrumb{font-size:13px;opacity:0.6;margin-bottom:20px}
.breadcrumb a{color:rgba(255,255,255,0.7)}
.breadcrumb a:hover{color:white}

/* Search Bar */
.search-section{margin-top:-40px;position:relative;z-index:10;margin-bottom:60px}
.search-box{
    background:white;border-radius:16px;padding:8px;box-shadow:var(--shadow-lg);
    display:flex;align-items:center;gap:12px;max-width:700px;margin:0 auto;
}
.search-box input{
    flex:1;border:none;padding:16px;font-size:16px;font-family:inherit;outline:none;
}
.search-box button{
    padding:14px 32px;background:linear-gradient(135deg,var(--primary),var(--primary-light));
    color:white;border:none;border-radius:12px;font-size:15px;font-weight:700;cursor:pointer;
    font-family:inherit;transition:transfoRM 0.2s;
}
.search-box button:hover{transfoRM:scale(1.02)}

/* Main Content */
.main-content{padding:40px 0 80px}
.content-grid{display:grid;grid-template-columns:1fr 320px;gap:40px}

/* Help Categories */
.help-categories{display:grid;grid-template-columns:repeat(2,1fr);gap:20px;margin-bottom:48px}
.category-card{
    background:white;border:1px solid var(--border);border-radius:16px;padding:28px;
    transition:all 0.3s;cursor:pointer;
}
.category-card:hover{box-shadow:var(--shadow);transfoRM:translateY(-3px);border-color:var(--primary-light)}
.category-icon{
    width:48px;height:48px;border-radius:12px;display:flex;align-items:center;justify-content:center;
    font-size:22px;margin-bottom:16px;
}
.category-card:nth-child(1) .category-icon{background:#dbeafe;color:var(--primary-light)}
.category-card:nth-child(2) .category-icon{background:#fef3c7;color:#92400e}
.category-card:nth-child(3) .category-icon{background:#d1fae5;color:#065f46}
.category-card:nth-child(4) .category-icon{background:#fce7f3;color:#9d174d}
.category-card h3{font-size:18px;margin-bottom:8px;color:var(--dark)}
.category-card p{font-size:14px;color:var(--text-muted);margin-bottom:12px}
.category-card .count{font-size:13px;color:var(--primary-light);font-weight:600}

/* FAQ List */
.faq-section{margin-bottom:48px}
.faq-section h2{
    font-size:24px;color:var(--dark);margin-bottom:24px;
    padding-bottom:12px;border-bottom:3px solid var(--primary-light);
}
.faq-item{
    background:white;border:1px solid var(--border);border-radius:12px;margin-bottom:12px;
    overflow:hidden;transition:all 0.2s;
}
.faq-item:hover{border-color:var(--primary-light)}
.faq-question{
    padding:20px 24px;display:flex;align-items:center;gap:12px;cursor:pointer;
    font-weight:600;font-size:15px;transition:background 0.2s;
}
.faq-question:hover{background:var(--bg)}
.faq-question .icon{
    width:28px;height:28px;border-radius:8px;
    background:linear-gradient(135deg,var(--primary),var(--primary-light));
    color:white;display:flex;align-items:center;justify-content:center;
    font-weight:700;font-size:13px;flex-shrink:0;
}
.faq-answer{
    padding:0 24px 20px 64px;font-size:14px;color:var(--text-muted);line-height:1.8;
    display:none;
}
.faq-item.open .faq-answer{display:block}
.faq-item.open .faq-question{background:var(--bg)}

/* Contact Section */
.contact-section{
    background:linear-gradient(135deg,var(--primary),var(--primary-light));
    border-radius:16px;padding:40px;color:white;text-align:center;
}
.contact-section h2{font-size:24px;margin-bottom:12px}
.contact-section p{font-size:15px;opacity:0.85;margin-bottom:24px}
.contact-btns{display:flex;gap:16px;justify-content:center;flex-wrap:wrap}
.contact-btn{
    padding:14px 28px;border-radius:50px;font-size:15px;font-weight:700;
    cursor:pointer;transition:all 0.2s;border:none;font-family:inherit;
}
.contact-btn.primary{background:var(--accent);color:var(--dark)}
.contact-btn.secondary{background:rgba(255,255,255,0.15);color:white;border:2px solid rgba(255,255,255,0.3)}
.contact-btn:hover{transfoRM:translateY(-2px)}

/* Sidebar */
.sidebar{display:flex;flex-direction:column;gap:24px}
.sidebar-card{background:white;border:1px solid var(--border);border-radius:16px;padding:24px}
.sidebar-card h4{font-size:16px;margin-bottom:16px;color:var(--dark);display:flex;align-items:center;gap:8px}
.sidebar-card h4::before{content:'';width:4px;height:18px;background:var(--accent);border-radius:2px}

/* Quick Links */
.quick-links{display:flex;flex-direction:column;gap:8px}
.quick-links a{
    display:flex;align-items:center;justify-content:space-between;padding:12px 14px;
    background:var(--bg);border-radius:10px;font-size:14px;font-weight:500;transition:all 0.2s;
}
.quick-links a:hover{background:var(--primary);color:white}
.quick-links a .arrow{opacity:0.4}

/* Contact Info */
.contact-info{display:flex;flex-direction:column;gap:12px}
.contact-item{display:flex;align-items:center;gap:12px;font-size:14px}
.contact-item .icon{
    width:36px;height:36px;border-radius:10px;background:var(--bg);
    display:flex;align-items:center;justify-content:center;font-size:16px;flex-shrink:0;
}

/* CTA */
.cta-box{
    background:linear-gradient(135deg,var(--primary),var(--primary-light));
    border-radius:16px;padding:28px;color:white;text-align:center;
}
.cta-box h4{font-size:18px;margin-bottom:8px}
.cta-box p{font-size:14px;opacity:0.85;margin-bottom:16px}
.cta-btn{
    display:inline-block;padding:12px 28px;background:var(--accent);
    color:var(--dark);font-weight:700;font-size:14px;border-radius:50px;transition:transfoRM 0.2s;
}
.cta-btn:hover{transfoRM:scale(1.05)}


@media(max-width:1024px){
    .content-grid{grid-template-columns:1fr}
    .sidebar{display:none}
    .help-categories{grid-template-columns:1fr}
}
@media(max-width:768px){
    .nav-links{display:none}
    .mobile-toggle{display:block}
    .page-header h1{font-size:28px}
    .footer-grid{grid-template-columns:1fr}
    .contact-btns{flex-direction:column;align-items:center}
}