/* ═════════════════════════════════════════════════════════════════
 *  CONTACTS PAGE  (ct-*) — reuses dlv-main / dlv-block / dlv-addr /
 *  dlv-map / dlv-cost scaffolding; adds phone cards, requisites,
 *  feedback form.
 * ═════════════════════════════════════════════════════════════════ */

/* ── Phone cards ── */
.ct-phones { display: grid; grid-template-columns: 1fr 1fr; gap: var(--sp-4); }
.ct-phone {
  display: flex; flex-direction: column; gap: 10px;
  padding: var(--sp-5); border: 1px solid var(--c-border); border-radius: var(--r-card);
  background: var(--c-bg); transition: border-color var(--dur-fast) var(--ease-out), box-shadow var(--dur-fast) var(--ease-out);
}
.ct-phone:hover { border-color: color-mix(in srgb, var(--c-blue) 45%, var(--c-border)); box-shadow: var(--sh-sm); }
.ct-phone__top { display: flex; align-items: center; gap: 12px; }
.ct-phone__icon {
  width: 44px; height: 44px; flex: none; border-radius: 50%;
  display: inline-flex; align-items: center; justify-content: center;
  background: var(--c-blue-light); color: var(--c-blue);
}
.ct-phone--orange .ct-phone__icon { background: var(--c-orange-tint); color: var(--c-orange); }
.ct-phone__label { font: 600 var(--fs-sm)/1.2 var(--ff-body); color: var(--c-text-2); }
.ct-phone__badge {
  margin-left: auto; font: 600 11px/1 var(--ff-body); color: var(--c-success);
  background: color-mix(in srgb, var(--c-success) 12%, var(--c-bg));
  padding: 5px 10px; border-radius: var(--r-pill); white-space: nowrap;
}
.ct-phone__num {
  font: 700 26px/1 var(--ff-display); color: var(--c-text); text-decoration: none; letter-spacing: -.01em;
}
a.ct-phone__num:hover { color: var(--c-blue); }
.ct-phone__note { color: var(--c-text-2); font-size: var(--fs-sm); }
.ct-phone__msgrs { display: flex; gap: 8px; margin-top: 2px; }
.ct-msgr {
  display: inline-flex; align-items: center; gap: 7px; text-decoration: none;
  padding: 7px 13px; border-radius: var(--r-pill); font: 600 13px/1 var(--ff-body); color: #fff;
}
.ct-msgr svg { width: 16px; height: 16px; }
/* Сплошная заливка как в хэндофе — глобальный градиент кнопок/ссылок перебиваем. */
.ct-msgr, .ct-msgr:link, .ct-msgr:visited { color: #fff !important; background-image: none !important; }
.ct-msgr--wa { background: #25D366 !important; }
.ct-msgr--tg { background: #29A9EB !important; }
.ct-msgr:hover { filter: brightness(.95); color: #fff !important; }

/* ── Hours ── */
.ct-hours { display: grid; grid-template-columns: 1fr 1fr; gap: var(--sp-4); }

/* ── Requisites ── */
.ct-req {
  padding: var(--sp-5); background: var(--c-bg-soft);
  border: 1px solid var(--c-border); border-radius: var(--r-card);
  display: grid; grid-template-columns: max-content 1fr; gap: 2px var(--sp-5);
}
.ct-req__k { padding: 10px 0; color: var(--c-text-2); font-size: var(--fs-sm); }
.ct-req__v {
  padding: 10px 0; color: var(--c-text); font-weight: 500;
  border-bottom: 1px solid var(--c-border-soft, #E4EAEE); display: flex; align-items: center; gap: 10px;
}
.ct-req__k { border-bottom: 1px solid var(--c-border-soft, #E4EAEE); }
.ct-req > .ct-req__k:nth-last-of-type(1),
.ct-req > .ct-req__v:last-of-type { border-bottom: 0; }
.ct-req__v a { color: var(--c-blue); text-decoration: none; }
.ct-req__v a:hover { text-decoration: underline; }
.ct-req__mono { font-variant-numeric: tabular-nums; letter-spacing: .01em; }
.ct-copy {
  margin-left: auto; flex: none; width: 30px; height: 30px; border-radius: var(--r-sm);
  display: inline-flex; align-items: center; justify-content: center; cursor: pointer;
  background: var(--c-bg); border: 1px solid var(--c-border); color: var(--c-text-2);
  transition: color var(--dur-fast) var(--ease-out), border-color var(--dur-fast) var(--ease-out);
}
.ct-copy:hover { color: var(--c-blue); border-color: var(--c-blue); }
.ct-copy.is-copied { color: var(--c-success); border-color: var(--c-success); }
.ct-copy svg { width: 15px; height: 15px; }

/* ── Feedback form ── */
.ct-form {
  padding: var(--sp-5); border: 1px solid var(--c-border); border-radius: var(--r-card);
  background: var(--c-bg); display: flex; flex-direction: column; gap: var(--sp-4);
}
.ct-form__foot { display: flex; align-items: center; justify-content: space-between; gap: var(--sp-4); flex-wrap: wrap; }
.ct-consent { display: flex; align-items: center; gap: 10px; font: 400 13px/1.4 var(--ff-body); color: var(--c-text-2); }
.ct-consent a { color: var(--c-blue); text-decoration: underline; text-underline-offset: 3px; }
.ct-consent input { width: 18px; height: 18px; flex: none; accent-color: var(--c-blue); }
.ct-form__ok {
  display: flex; flex-direction: column; align-items: center; gap: 10px; text-align: center;
  padding: var(--sp-6) var(--sp-5);
}
.ct-form__ok-badge {
  width: 56px; height: 56px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center;
  background: color-mix(in srgb, var(--c-success) 14%, var(--c-bg)); color: var(--c-success);
}
.ct-form__ok-badge svg { width: 28px; height: 28px; }

@media (max-width: 990px) {
  .ct-phones, .ct-hours { grid-template-columns: 1fr; }
  .ct-req { grid-template-columns: 1fr; gap: 0; }
  .ct-req__k { padding-bottom: 0; border-bottom: 0; }
  .ct-req__v { padding-top: 2px; }
}

/* ── Форма контактов: input/textarea/select как в fm-card (в бою scoped) ── */
.ct-form .fm-field { display: flex; flex-direction: column; gap: 7px; }
.ct-form .fm-field--full { grid-column: 1 / -1; }
.ct-form .req { color: var(--c-orange); }
.ct-form .v2-input,
.ct-form .v2-select,
.ct-form .fm-textarea {
  width: 100%; box-sizing: border-box; padding: 12px 14px;
  border: 1px solid var(--c-border); border-radius: var(--r-input, 8px);
  background: var(--c-white, #fff); color: var(--c-text);
  font: 400 15px/1.3 var(--ff-body); transition: border-color var(--dur-fast) var(--ease-out);
}
.ct-form .fm-textarea { min-height: 120px; resize: vertical; }
.ct-form .v2-input:focus,
.ct-form .v2-select:focus,
.ct-form .fm-textarea:focus { outline: none; border-color: var(--c-blue); }
.ct-form .fm-selectwrap { position: relative; }
.ct-form .v2-select { appearance: none; -webkit-appearance: none; padding-right: 40px; cursor: pointer; }
.ct-form .fm-selectwrap__chev { position: absolute; right: 12px; top: 50%; transform: translateY(-50%); pointer-events: none; color: var(--c-text-2); display: inline-flex; }
.ct-form .btn--primary { background: var(--c-orange); color: #fff; border: 0; height: 46px; padding: 0 28px; border-radius: var(--r-pill); font: 600 14px/1 var(--ff-body); cursor: pointer; }
.ct-form .btn--primary:hover { background: var(--c-orange-dk, #d8540f); }
