.contact-page{min-height:100vh}.contact-header{padding:var(--space-xl)0 var(--space-lg);text-align:center;background:linear-gradient(180deg,transparent,var(--color-bg-medium)80%)}.contact-content{padding:var(--space-3xl)0}.contact-grid{gap:var(--space-2xl);grid-template-columns:2fr 1fr;align-items:start;display:grid}.contact-form-section h2{margin-bottom:var(--space-md)}.form-intro{color:var(--color-text-secondary);margin-bottom:var(--space-xl)}.contact-form{margin-top:var(--space-xl)}.form-message{padding:var(--space-md);border-radius:var(--radius-md);margin-bottom:var(--space-lg);font-weight:600}.form-message.success{border:2px solid var(--color-success);color:var(--color-success);background:#4caf5033}.form-message.error{border:2px solid var(--color-error);color:var(--color-error);background:#f4433633}.contact-form .btn{justify-content:center;align-items:center;gap:var(--space-sm);width:100%;display:flex}.contact-form .btn:disabled{opacity:.6;cursor:not-allowed}.contact-info-section{gap:var(--space-lg);flex-direction:column;display:flex}.contact-info-card h3,.contact-social-card h3,.contact-faq-card h3{margin-bottom:var(--space-lg);color:var(--color-primary-light)}.contact-info-item{gap:var(--space-md);padding:var(--space-md);border-radius:var(--radius-md);margin-bottom:var(--space-md);transition:all var(--transition-base);background:#4a9b9f1a;display:flex}.contact-info-item:hover{background:#4a9b9f33;transform:translate(5px)}.contact-info-item:last-child{margin-bottom:0}.info-icon{font-size:var(--text-3xl);flex-shrink:0}.info-content h4{font-size:var(--text-base);margin-bottom:var(--space-xs);color:var(--color-text-primary)}.info-content p,.info-content a{font-size:var(--text-sm);color:var(--color-text-secondary);margin:0}.info-content a{transition:color var(--transition-fast);text-decoration:none}.info-content a:hover{color:var(--color-primary-light)}.contact-social-card p{color:var(--color-text-secondary);margin-bottom:var(--space-lg)}.social-links{gap:var(--space-sm);grid-template-columns:repeat(auto-fill,minmax(130px,1fr));display:grid}.social-link-btn{border-radius:var(--radius-md);color:var(--color-text-primary);transition:all var(--transition-base);background:#ffffff08;border:1px solid #ffffff1a;justify-content:center;align-items:center;gap:.6rem;padding:.75rem .5rem;font-size:.85rem;font-weight:600;text-decoration:none;display:flex}.social-link-btn:hover{background:var(--platform-color,var(--color-primary));border-color:var(--platform-color,var(--color-primary));color:#fff;transform:translateY(-3px);box-shadow:0 4px 12px #0003}.social-link-btn span{display:inline-block}.support-badge{border:1px solid var(--color-secondary);color:var(--color-secondary-light);text-transform:uppercase;margin-top:var(--space-md);background:#2646534d;border-radius:999px;padding:.2rem .6rem;font-size:.7rem;font-weight:700;display:inline-block}.contact-faq-section{padding:var(--space-3xl)0}.faq-accordion{gap:var(--space-md);flex-direction:column;display:flex}.faq-item{border-radius:var(--radius-lg);cursor:pointer;background:#ffffff08;border:1px solid #ffffff14;transition:all .3s;overflow:hidden}.faq-item:hover{background:#ffffff0d;border-color:#ffffff26}.faq-item.active{background:#2a9d8f0d;border-color:#2a9d8f4d}.faq-question{padding:var(--space-lg);color:var(--color-text-primary);justify-content:space-between;align-items:center;font-weight:700;display:flex}.faq-icon{color:var(--color-primary-light);transition:transform .3s}.faq-item.active .faq-icon{transform:rotate(180deg)}.faq-answer{max-height:0;transition:all .4s cubic-bezier(.4,0,.2,1);overflow:hidden}.faq-item.active .faq-answer{max-height:200px;padding:0 var(--space-lg)var(--space-lg)}.faq-answer p{color:var(--color-text-secondary);margin:0;line-height:1.6}@media (max-width:1024px){.contact-grid{grid-template-columns:1fr}.contact-info-section{order:2;grid-template-columns:1fr 1fr;display:grid}.contact-info-card{grid-column:1/-1}}@media (max-width:768px){.contact-header{padding:var(--space-2xl)0 var(--space-lg)}.page-title{font-size:var(--text-4xl)}.contact-info-section{grid-template-columns:1fr}}@media (max-width:480px){.contact-info-item{text-align:center;flex-direction:column}.info-icon{font-size:var(--text-4xl)}.social-links{grid-template-columns:1fr 1fr}}
