.contact{padding:120px 0 80px;background:#222a32;min-height:100vh;position:relative;overflow:hidden}
button,div,h1,h2,h3,h4,h5,h6,label,li,ol,option,p,section,span{font-family:Vazir,sans-serif}
.contact::before{content:"";position:absolute;top:0;left:0;width:100%;height:100%;background:radial-gradient(circle,rgba(0,221,235,.1),transparent);z-index:0}
.container{max-width:1200px;margin:0 auto;position:relative;z-index:1}
.section-title{font-size:36px;color:#00ddeb;text-align:center;margin-bottom:20px;text-shadow:0 0 10px rgba(0,221,235,.5);animation:fadeIn 1s ease-in-out}
.section-subtitle{font-size:18px;color:#ccc;text-align:center;margin-bottom:40px;animation:fadeIn 1s ease-in-out .2s}
@keyframes fadeIn{
from{opacity:0;transform:translateY(20px)}
to{opacity:1;transform:translateY(0)}
}
.contact-content{display:grid;grid-template-columns:1fr 1fr;gap:30px;margin-bottom:40px}
.contact-form{background:rgba(44,52,60,.95);backdrop-filter:blur(10px);padding:40px;border-radius:0 1em 0 1em;box-shadow:0 8px 25px rgba(0,221,235,.3);animation:slideInLeft .5s ease-in-out}
@keyframes slideInLeft{
from{opacity:0;transform:translateX(-50px)}
to{opacity:1;transform:translateX(0)}
}
.contact-form h3{font-size:28px;color:#00ddeb;margin-bottom:30px;text-align:center}
.form-group{margin-bottom:25px;position:relative}
.form-group label{display:block;font-size:14px;color:#ccc;margin-bottom:10px}
.form-group input,.form-group textarea{width:100%;padding:14px;border:none;border-radius:12px;background:#2e3740;color:#fff;font-size:16px;outline:0;transition:all .3s ease}
.form-group input:focus,.form-group textarea:focus{background:#3a4550;box-shadow:0 0 15px rgba(0,221,235,.5)}
.form-group textarea{min-height:140px;resize:vertical}
.contact-form .btn-primary{width:100%;padding:16px;border-radius:12px;background:linear-gradient(45deg,#00ddeb,#00b7c2);color:#222a32;font-size:16px;font-weight:700;border:none;cursor:pointer;position:relative;overflow:hidden;transition:all .3s ease}
.contact-form .btn-primary::before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.2),transparent);transition:.5s}
.contact-form .btn-primary:hover::before{left:100%}
.contact-form .btn-primary:hover{transform:translateY(-3px);box-shadow:0 10px 25px rgba(0,221,235,.5)}
.contact-info{display:flex;flex-direction:column;gap:20px;justify-content:center}
.contact-info h3{font-size:28px;color:#00ddeb;text-align:center;margin-bottom:20px}
.info-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:20px}
.info-card{background:rgba(44,52,60,.95);backdrop-filter:blur(10px);padding:20px;border-radius:15px;text-align:center;transition:all .3s ease;box-shadow:0 5px 15px rgba(0,221,235,.2)}
.info-card:hover{transform:translateY(-5px);box-shadow:0 10px 20px rgba(0,221,235,.4)}
.info-icon{font-size:32px;color:#00ddeb;margin-bottom:10px}
.info-card h4{font-size:18px;color:#fff;margin-bottom:10px}
.info-card p{font-size:14px;color:#ddd;margin:0}
.social-card{display:flex;flex-direction:column;align-items:center}
.social-icons{display:flex;gap:15px;justify-content:center}
.social-icons a{font-size:24px;color:#00ddeb;transition:all .3s ease}
.social-icons a:hover{transform:scale(1.3);color:#00b7c2}
.contact-map{background:rgba(44,52,60,.95);backdrop-filter:blur(10px);padding:30px;border-radius:15px;margin-bottom:40px;box-shadow:0 5px 15px rgba(0,221,235,.2);animation:fadeIn .5s ease-in-out .4s}
.contact-map h3{font-size:24px;color:#00ddeb;margin-bottom:20px}
.map-container{position:relative;overflow:hidden;border-radius:10px;height:300px}
.contact-faq{background:rgba(44,52,60,.95);backdrop-filter:blur(10px);padding:30px;border-radius:15px;box-shadow:0 5px 15px rgba(0,221,235,.2);animation:fadeIn .5s ease-in-out .6s}
.contact-faq h3{font-size:24px;color:#00ddeb;margin-bottom:20px}
.faq-item{margin-bottom:15px}
.faq-question{display:flex;justify-content:space-between;align-items:center;padding:15px;background:#3a4550;border-radius:10px;cursor:pointer;transition:background .3s}
.faq-question:hover{background:#00ddeb}
.faq-question h4{font-size:16px;color:#ddd;margin:0}
.faq-question i{font-size:16px;color:#00ddeb;transition:transform .3s}
.faq-item.active .faq-question i{transform:rotate(180deg)}
.faq-answer{display:none;padding:15px;background:rgba(0,221,235,.1);border-radius:10px;margin-top:10px}
.faq-item.active .faq-answer{display:block;animation:slideDown .3s ease-in-out}
@keyframes slideDown{
from{opacity:0;height:0}
to{opacity:1;height:auto}
}
.faq-answer p{font-size:14px;color:#ddd;margin:0}
@media (max-width:768px){
.contact{padding:100px 20px 60px}
.contact-content{grid-template-columns:1fr}
.contact-faq,.contact-form,.contact-info,.contact-map{width:100%}
.map-container{height:200px}
.contact-info{padding:20px 20px}
}
.contact-info{border:1px solid #00bfca;border-radius:1em 0 1em 0;padding:0 20px;box-shadow:0 8px 25px rgba(0,221,235,.3)}