/* =========================================================
   تماس با ما
   همان قانون تایپوگرافی «درباره ما»: عنوان‌ها یک اندازه، متن‌ها یک اندازه
   ========================================================= */

.contact {
  --ab-h: var(--fs-h);
  --ab-t: var(--fs-t);
  overflow-x: clip;
}
.page { padding-top: var(--header-h); }

[data-reveal] { opacity: 0; transform: translate3d(0, 28px, 0); transition: opacity .9s var(--ease-out), transform 1.1s var(--ease-out); }
[data-reveal].is-in { opacity: 1; transform: none; }

.ct {
  --ab-h: var(--fs-h);              /* روی خود بخش، تا در صفحه‌ی اول هم کار کند */
  --ab-t: var(--fs-t);
  position: relative;
  max-width: 1280px;
  margin: 0 auto;
  padding: clamp(56px, 9vh, 120px) var(--gutter) clamp(80px, 12vh, 140px);
  isolation: isolate;
}
.ct::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 0 -20% auto -20%;
  height: 80%;
  background: radial-gradient(40% 50% at 30% 40%, rgba(255, 106, 0, .12), transparent 70%);
  pointer-events: none;
}
.ct-h {
  margin: 0 0 clamp(28px, 4vh, 44px);
  font-size: var(--ab-h);
  font-weight: 700;
  line-height: 1.6;
  color: var(--brand);
}

.ct-grid {
  display: grid;
  grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr);
  gap: clamp(20px, 3vw, 40px);
  align-items: stretch;
}

/* ---------- کارت‌های تماس ---------- */
.ct-cards { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; align-content: start; }
.ct-card {
  position: relative;
  display: flex;
  align-items: center;
  gap: 14px;
  min-height: 84px;
  padding: 16px 18px;
  border: 1px solid rgba(255, 255, 255, .08);
  border-radius: 18px;
  background: linear-gradient(160deg, rgba(255, 255, 255, .05), rgba(255, 255, 255, .01) 50%), #120803;
  color: #fff;
  text-decoration: none;
  transition: border-color .4s var(--ease-out), transform .5s var(--ease-out), box-shadow .5s var(--ease-out);
}
a.ct-card:hover,
a.ct-card:focus-visible {
  border-color: rgba(255, 140, 60, .45);
  transform: translateY(-3px);
  box-shadow: 0 24px 50px -28px rgba(255, 106, 0, .45);
}
a.ct-card:focus-visible { outline: 2px solid var(--brand); outline-offset: 3px; }
.ct-card--address { grid-column: 1 / -1; }

.ct-card__icon {
  flex: none;
  display: grid;
  place-items: center;
  width: 46px;
  height: 46px;
  border-radius: 14px;
  background: rgba(255, 106, 0, .12);
  box-shadow: inset 0 0 0 1px rgba(255, 140, 60, .3);
  color: var(--brand);
  transition: background .4s var(--ease-out), color .4s var(--ease-out);
}
.ct-card__icon svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.ct-card__icon svg .dot { fill: currentColor; stroke: none; }
a.ct-card:hover .ct-card__icon { background: var(--brand); color: #fff; }

.ct-card__text { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.ct-card__label { font-size: var(--ab-t); font-weight: 300; line-height: 1.6; color: var(--fg-mute); }
.ct-card__value {
  font-size: var(--ab-t);
  font-weight: 600;
  line-height: 1.7;
  color: #fff;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  unicode-bidi: isolate;
  text-align: right;
}
.ct-card--address .ct-card__value { white-space: normal; }

.ct-card__go {
  flex: none;
  width: 18px;
  height: 18px;
  margin-inline-start: auto;
  fill: none;
  stroke: var(--fg-mute);
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
  transition: transform .45s var(--ease-out), stroke .3s;
}
a.ct-card:hover .ct-card__go { transform: translateX(-4px); stroke: var(--brand); }

/* تلگرام: فعلاً بدون لینک */
.ct-card--off { opacity: .45; cursor: default; }
.ct-card--off .ct-card__icon { background: rgba(255, 255, 255, .05); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .12); color: var(--fg-dim); }

/* ---------- نقشه ---------- */
.ct-map { display: flex; flex-direction: column; gap: 14px; }
.ct-map__frame {
  position: relative;
  flex: 1;
  min-height: 340px;
  overflow: hidden;
  border-radius: 22px;
  border: 1px solid rgba(255, 255, 255, .08);
  background: #120803;
  box-shadow: 0 50px 100px -60px rgba(0, 0, 0, .9);
}
.ct-map__iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
  /* نقشه‌ی روشن ← تیره، هماهنگ با سایت؛ نشانگر آبی OSM با این فیلتر نارنجی می‌شود */
  filter: invert(.92) hue-rotate(180deg) saturate(.55) brightness(.92) contrast(1.05);
}
/* هاله‌ی نارنجی تپنده روی نقطه‌ی مرکز (نشانگر در مرکز نقشه است) */
.ct-map__pulse {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 18px;
  height: 18px;
  margin: -9px 0 0 -9px;
  border-radius: 50%;
  pointer-events: none;
}
.ct-map__pulse::before,
.ct-map__pulse::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 50%;
  border: 2px solid var(--brand);
  animation: ct-pulse 2.4s var(--ease-out) infinite;
}
.ct-map__pulse::after { animation-delay: 1.2s; }
@keyframes ct-pulse { from { transform: scale(1); opacity: .9; } to { transform: scale(4.5); opacity: 0; } }

.ct-map__actions { display: flex; flex-wrap: wrap; gap: 10px; }
.ct-btn {
  display: inline-flex;
  align-items: center;
  height: 46px;
  padding: 0 20px;
  border-radius: 999px;
  background: var(--brand);
  color: #fff;
  font-size: var(--ab-t);
  font-weight: 600;
  line-height: 1;
  white-space: nowrap;
  text-decoration: none;
  transition: background .3s var(--ease-out), transform .4s var(--ease-out);
}
.ct-btn:hover, .ct-btn:focus-visible { background: var(--brand-hover); transform: translateY(-2px); }
.ct-btn:focus-visible { outline: 2px solid #fff; outline-offset: 3px; }
.ct-btn--ghost { background: transparent; border: 1px solid rgba(255, 255, 255, .2); }
.ct-btn--ghost:hover, .ct-btn--ghost:focus-visible { background: rgba(255, 255, 255, .08); }

/* ---------------------------------------------------------
   ریسپانسیو
   --------------------------------------------------------- */
@media (max-width: 899px) {
  .ct-grid { grid-template-columns: 1fr; }
  .ct-map__frame { min-height: 300px; }
}
@media (max-width: 479px) {
  .ct-cards { grid-template-columns: 1fr; }
  .ct-map__actions .ct-btn { flex: 1 1 auto; justify-content: center; }
}
@media (prefers-reduced-motion: reduce) {
  [data-reveal] { opacity: 1; transform: none; transition: none; }
  .ct-map__pulse::before, .ct-map__pulse::after { animation: none; opacity: 0; }
}

/* نسخه‌ی صفحه‌ی اول — فاصله‌ی بالا/پایین را services.js برابر بقیه‌ی بخش‌ها تنظیم می‌کند */
.ct--home { padding-top: 0; padding-bottom: 0; overflow-x: clip; }   /* هاله‌ی ::before از عرض صفحه بیرون نزند */