/* =========================================================================
   صفحه تماس با ما - طراحی پریمیوم روشن و یک‌دست بر پایه‌ی تم سایت
   همه‌ی متغیرهای رنگی از :root در site.css گرفته می‌شن
   سیستم فاصله‌گذاری: مضرب‌های ۸ پیکسل (۸، ۱۶، ۲۴، ۳۲، ۴۰، ۴۸، ۶۴)
   ========================================================================= */
.contact-dark-page{
  background:linear-gradient(180deg, #F7F9FC 0%, #FFFFFF 100%);
  display:flex; flex-direction:column; gap:40px; padding-bottom:8px;
  --glass-bg:#ffffff;
  --glass-bg-hover:#f7f9fc;
  --glass-border:var(--line);
  --glass-border-hover:var(--blue-accent);
  --text-soft:var(--gray-600);
  --text-faint:#8a93a6;
  --glow:rgba(47,111,237,.16);
}
.contact-dark-page section{padding:0; margin:0;}
@media (max-width:640px){ .contact-dark-page{gap:28px;} }

/* ---------- هیرو ---------- */
.contact-hero-dark{
  padding:56px 0 0; text-align:center; position:relative; overflow:hidden;
  background:
    radial-gradient(circle at 20% 20%, var(--glow), transparent 55%),
    radial-gradient(circle at 85% 15%, rgba(200,30,44,.08), transparent 50%);
}
.contact-hero-dark .container{position:relative;}
.contact-hero-dark .eyebrow{color:#60a5fa; justify-content:center;}
.contact-hero-dark h1{font-size:clamp(28px,4.6vw,48px); font-weight:900; margin:8px 0; color:#fff;}
.contact-hero-dark p{font-size:16px; color:rgba(255,255,255,.78); max-width:640px; margin:0 auto 16px; line-height:1.8;}
.contact-hero-dark .hero-cta{display:flex; gap:16px; justify-content:center; flex-wrap:wrap; margin-bottom:8px;}
.contact-hero-dark.page-hero-dark{padding-bottom:64px;}
@media (max-width:640px){ .contact-hero-dark.page-hero-dark{padding-bottom:44px;} }

/* ---------- کارت‌های تماس ---------- */
.glass-cards-section{padding:0;}
.glass-cards-grid{display:grid; grid-template-columns:repeat(6,1fr); gap:24px; align-items:stretch;}
@media (max-width:1180px){ .glass-cards-grid{grid-template-columns:repeat(3,1fr);} }
@media (max-width:640px){ .glass-cards-grid{grid-template-columns:1fr 1fr;} }
@media (max-width:420px){ .glass-cards-grid{grid-template-columns:1fr;} }

.glass-card{
  display:flex; flex-direction:column; align-items:center; height:100%;
  background:var(--glass-bg); border:1px solid var(--glass-border); border-radius:20px; padding:24px 16px; text-align:center;
  box-shadow:0 10px 26px -16px rgba(10,21,48,.14);
  transition:transform var(--speed), box-shadow var(--speed), border-color var(--speed), background var(--speed);
}
.glass-card:hover{transform:translateY(-6px); box-shadow:0 20px 40px -16px rgba(10,21,48,.16); border-color:var(--glass-border-hover); background:var(--glass-bg-hover);}
.glass-card .value, .glass-card .mini-btn, .glass-card .hours-row:last-of-type{margin-top:auto;}
.glass-card .hours-row{width:100%;}
.glass-card .ic{
  width:48px; height:48px; border-radius:50%; background:rgba(47,111,237,.1); color:var(--blue-accent);
  display:flex; align-items:center; justify-content:center; margin:0 auto 16px;
}
.glass-card h4{font-size:14.5px; font-weight:800; margin-bottom:8px; color:var(--navy-900);}
.glass-card p{font-size:12px; color:var(--text-faint); line-height:1.7; margin-bottom:8px;}
.glass-card .value{font-size:13px; font-weight:700; color:var(--navy-900); direction:ltr; display:block;}
.glass-card .mini-btn{
  display:inline-block; margin-top:8px; padding:8px 16px; border-radius:30px;
  background:rgba(47,111,237,.1); color:var(--blue-accent); font-size:12px; font-weight:700;
  border:1px solid rgba(47,111,237,.25); transition:background var(--speed), color var(--speed);
}
.glass-card .mini-btn:hover{background:var(--blue-accent); color:#fff;}

/* ---------- فرم تماس با لیبل شناور ---------- */
.contact-form-section{padding:0;}
.contact-form-box{
  max-width:760px; margin:0 auto; background:var(--glass-bg);
  border:1px solid var(--glass-border); border-radius:24px; padding:40px;
  box-shadow:0 16px 40px -22px rgba(10,21,48,.12);
}
@media (max-width:640px){ .contact-form-box{padding:24px 16px; border-radius:20px;} }
.contact-form-box h2{font-size:23px; font-weight:800; margin-bottom:8px; text-align:center; color:var(--navy-900);}
.contact-form-box .form-sub{text-align:center; font-size:13px; color:var(--text-faint); margin-bottom:24px;}

.cf-grid{display:grid; grid-template-columns:1fr 1fr; gap:0 16px;}
@media (max-width:600px){ .cf-grid{grid-template-columns:1fr;} }

.cf-float{position:relative; margin-bottom:16px;}
.cf-float.full{grid-column:1 / -1;}
.cf-float input, .cf-float textarea{
  width:100%; padding:16px; border-radius:14px; border:1px solid var(--glass-border);
  background:var(--ice); color:var(--navy-900); font-size:16px; font-family:inherit;
  transition:border-color var(--speed), background var(--speed);
}
.cf-float textarea{resize:vertical; min-height:112px;}
.cf-float input:focus, .cf-float textarea:focus{outline:none; border-color:var(--blue-accent); background:#fff;}
.cf-float label{
  position:absolute; right:16px; top:16px; font-size:14px; color:var(--text-faint);
  pointer-events:none; transition:all .18s ease; background:transparent;
}
.cf-float input:focus + label, .cf-float input:not(:placeholder-shown) + label,
.cf-float textarea:focus + label, .cf-float textarea:not(:placeholder-shown) + label{
  top:-8px; font-size:11px; font-weight:700; color:var(--blue-accent); background:#fff; padding:0 8px; border-radius:6px;
}

.cf-submit-btn{
  width:100%; padding:16px; border-radius:16px; background:var(--blue-accent); color:#fff;
  font-weight:800; font-size:15.5px; transition:background var(--speed), box-shadow var(--speed), transform var(--speed); border:none;
}
.cf-submit-btn:hover{background:var(--blue-accent-light); box-shadow:0 14px 34px -8px var(--glow); transform:translateY(-2px);}
.cf-submit-btn:disabled{opacity:.6; cursor:default; transform:none;}
.cf-success{
  display:none; text-align:center; padding:16px; border-radius:14px; background:rgba(34,197,94,.08);
  border:1px solid rgba(34,197,94,.3); color:#15803d; font-size:13.5px; font-weight:700; margin-top:16px; line-height:1.8;
}
.cf-success.show{display:block;}
.cf-error{color:var(--danger); font-size:12.5px; margin-top:-8px; margin-bottom:16px; display:none;}
.cf-error.show{display:block;}

/* ---------- چت زنده‌ی تیکت پشتیبانی ---------- */
.support-chat-box{
  max-width:760px; margin:0 auto; background:#fff; border:1px solid var(--line);
  border-radius:24px; overflow:hidden; display:flex; flex-direction:column;
  height:540px; max-height:72vh; box-shadow:0 16px 40px -22px rgba(10,21,48,.12);
}
@media (max-width:640px){ .support-chat-box{border-radius:20px; height:480px;} }
.tc-head{
  display:flex; align-items:center; justify-content:space-between; gap:10px;
  padding:16px 20px; border-bottom:1px solid var(--line); background:var(--ice);
}
.tc-head-title{font-weight:800; font-size:15px; color:var(--navy-900);}
.tc-head-status{font-size:12px; color:var(--gray-600); margin-top:3px;}
.tc-head-status.answered{color:#15803d; font-weight:700;}
.tc-new-btn{
  border:1px solid var(--line); background:#fff; border-radius:9px; padding:7px 13px;
  font-size:12px; font-weight:700; color:var(--navy-900); cursor:pointer; white-space:nowrap;
}
.tc-new-btn:hover{background:var(--ice);}
.tc-messages{
  flex:1; overflow-y:auto; padding:18px 16px; display:flex; flex-direction:column; gap:10px;
}
.tc-bubble{
  max-width:78%; padding:10px 14px; border-radius:14px; font-size:13.5px; line-height:1.9;
  white-space:pre-wrap; word-break:break-word;
}
.tc-bubble .tc-text{display:block;}
.tc-bubble .tc-time{display:block; font-size:10.5px; margin-top:4px; opacity:.65;}
.tc-bubble.customer{align-self:flex-end; background:var(--blue-accent); color:#fff; border-bottom-left-radius:4px;}
.tc-bubble.admin{align-self:flex-start; background:var(--ice); color:var(--navy-900); border-bottom-right-radius:4px;}
.tc-empty{margin:auto; color:var(--gray-600); font-size:13px; text-align:center; padding:0 20px; line-height:1.9;}
.tc-input-row{
  display:flex; gap:10px; align-items:flex-end; padding:12px 14px; border-top:1px solid var(--line); background:#fff;
}
.tc-input-row textarea{
  flex:1; resize:none; border:1px solid var(--line); border-radius:12px; padding:11px 14px;
  font-family:inherit; font-size:13.5px; min-height:44px; max-height:110px; background:var(--ice);
}
.tc-input-row textarea:focus{outline:none; border-color:var(--blue-accent); background:#fff;}
.tc-send-btn{
  width:44px; height:44px; flex-shrink:0; border:none; border-radius:12px; background:var(--blue-accent);
  color:#fff; display:flex; align-items:center; justify-content:center; cursor:pointer; transition:background .18s ease;
}
.tc-send-btn:hover{background:var(--blue-accent-light);}
.tc-send-btn:disabled{opacity:.6; cursor:default;}

/* ---------- نقشه ---------- */
.map-section{padding:0;}
.map-card{
  max-width:1080px; margin:0 auto; border-radius:24px; overflow:hidden; border:1px solid var(--glass-border);
  background:var(--glass-bg); padding:8px; box-shadow:var(--shadow-md);
}
.map-card iframe{width:100%; height:380px; border:0; border-radius:18px; display:block;}
@media (max-width:640px){ .map-card iframe{height:280px;} }

/* ---------- ساعات پاسخگویی ---------- */
.glass-card.hours-card .hours-row{display:flex; justify-content:space-between; font-size:11.5px; padding:4px 0; color:var(--text-faint);}
.glass-card.hours-card .hours-row span:last-child{color:var(--navy-900); font-weight:700;}

/* ---------- پیش‌نمایش سوالات متداول (آکاردئون) ---------- */
.faq-section{padding:0;}
.faq-section .section-title-dark{text-align:center; font-size:23px; font-weight:800; color:var(--navy-900); margin-bottom:8px;}
.faq-section .section-sub-dark{text-align:center; font-size:13px; color:var(--text-faint); margin-bottom:24px;}
.faq-accordion{max-width:760px; margin:0 auto;}
.faq-acc-item{
  background:var(--glass-bg); border:1px solid var(--glass-border); border-radius:16px; margin-bottom:8px; overflow:hidden;
  transition:border-color var(--speed), background var(--speed);
}
.faq-acc-item.open, .faq-acc-item:hover{border-color:var(--glass-border-hover);}
.faq-acc-question{
  display:flex; align-items:center; justify-content:space-between; gap:16px; padding:16px 24px; cursor:pointer;
  font-size:14.5px; font-weight:800; color:var(--navy-900);
}
.faq-acc-question .chev{
  flex-shrink:0; width:24px; height:24px; border-radius:50%; background:rgba(47,111,237,.1); color:var(--blue-accent);
  display:flex; align-items:center; justify-content:center; transition:transform var(--speed);
}
.faq-acc-item.open .faq-acc-question .chev{transform:rotate(180deg); background:var(--blue-accent); color:#fff;}
.faq-acc-answer{max-height:0; overflow:hidden; transition:max-height .3s ease;}
.faq-acc-answer p{padding:0 24px 16px; font-size:13px; color:var(--text-soft); line-height:1.9; margin:0;}
.faq-view-all{text-align:center; margin-top:24px;}

/* ---------- چرا محمودی اسپورت؟ ---------- */
.why-us-section{padding:0;}
.why-us-section .section-title-dark{text-align:center; font-size:23px; font-weight:800; color:var(--navy-900); margin-bottom:24px;}
.why-us-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:24px;}
@media (max-width:900px){ .why-us-grid{grid-template-columns:1fr 1fr;} }
@media (max-width:480px){ .why-us-grid{grid-template-columns:1fr;} }
.why-us-card{
  display:flex; flex-direction:column; align-items:center; height:100%;
  background:var(--glass-bg); border:1px solid var(--glass-border); border-radius:20px; padding:24px 16px; text-align:center;
  box-shadow:0 10px 26px -18px rgba(10,21,48,.12);
  transition:transform var(--speed), border-color var(--speed);
}
.why-us-card:hover{transform:translateY(-5px); border-color:var(--glass-border-hover);}
.why-us-card .ic{
  width:48px; height:48px; border-radius:16px; background:rgba(47,111,237,.1); color:var(--blue-accent);
  display:flex; align-items:center; justify-content:center; margin:0 auto 16px;
}
.why-us-card h4{font-size:14px; font-weight:800; color:var(--navy-900); margin-bottom:8px;}
.why-us-card p{font-size:12px; color:var(--text-faint); line-height:1.7;}

/* ---------- شبکه‌های اجتماعی ---------- */
.social-cta-section{padding:0;}
.social-cta-box{
  max-width:820px; margin:0 auto; text-align:center; padding:40px 24px; border-radius:24px;
  background:var(--glass-bg); border:1px solid var(--glass-border);
  box-shadow:0 14px 34px -20px rgba(10,21,48,.12);
}
.social-cta-box h3{font-size:19px; font-weight:800; color:var(--navy-900); margin-bottom:24px;}
.social-btn-row{display:flex; gap:16px; justify-content:center; flex-wrap:wrap;}
.social-btn{
  display:flex; align-items:center; gap:8px; padding:13px 24px; border-radius:16px;
  background:var(--ice); border:1px solid var(--glass-border); color:var(--navy-900);
  font-size:13.5px; font-weight:700; transition:all var(--speed);
}
.social-btn:hover{background:var(--blue-accent); border-color:var(--blue-accent); color:#fff; transform:translateY(-3px); box-shadow:0 14px 30px -10px var(--glow);}

/* ---------- CTA پایانی ---------- */
.contact-final-cta{padding:0 0 40px;}
.contact-final-box{
  max-width:820px; margin:0 auto; text-align:center; padding:48px 24px; border-radius:24px;
  background:linear-gradient(135deg, rgba(47,111,237,.08), rgba(200,30,44,.06));
  border:1px solid var(--glass-border);
}
.contact-final-box h3{font-size:23px; font-weight:800; color:var(--navy-900); margin-bottom:16px;}
.contact-final-box p{font-size:14px; color:var(--text-soft); line-height:1.9; max-width:560px; margin:0 auto 24px;}

@media (max-width:640px){
  .contact-hero-dark{padding:32px 0 0;}
  .contact-final-cta{padding-bottom:32px;}
  .contact-final-box, .social-cta-box{padding:32px 16px;}
}
