/* Страница контактов: способы связи, шаги после обращения. Только токены из tokens.css. */
.contacts-hero { padding-bottom: 90px; }
.contacts-hero .contacts-grid { align-items: start; }
.contacts-hero h1 { max-width: 20ch; }
.contacts-aside { display: grid; gap: 16px; align-content: start; }
.contacts-aside__title { margin-bottom: 2px; font-size: 18px; letter-spacing: -.02em; }
.contact-channels { display: grid; gap: 10px; margin: 0; padding: 0; list-style: none; }
.contact-channel { display: grid; grid-template-columns: 46px 1fr 18px; gap: 16px; align-items: center; padding: 17px 20px; border: 1px solid var(--line); border-radius: var(--radius-sm); background: var(--surface); box-shadow: var(--shadow-sm); transition: border-color .2s, transform .2s, box-shadow .2s, color .2s; }
.contact-channel:hover { transform: translateY(-2px); border-color: var(--blue); box-shadow: var(--shadow-md); }
.contact-channel__icon { display: grid; width: 46px; height: 46px; place-items: center; border: 1px solid color-mix(in srgb, var(--blue) 24%, var(--line)); border-radius: 12px; background: var(--blue-soft); color: var(--blue); }
.contact-channel__body { display: grid; min-width: 0; gap: 3px; }
.contact-channel__label { color: var(--text-faint); font-size: 11px; font-weight: 650; letter-spacing: .04em; text-transform: uppercase; }
.contact-channel__value { overflow-wrap: anywhere; color: var(--text); font-size: 19px; font-weight: 650; letter-spacing: -.02em; transition: color .2s; }
.contact-channel__hint { color: var(--text-soft); font-size: 13px; line-height: 1.45; }
.contact-channel > .icon { color: var(--blue); }
.contact-channel:hover .contact-channel__value { color: var(--blue); }
.contacts-meta { box-shadow: none; }
.contacts-meta > div:last-child { padding-bottom: 0; border-bottom: 0; }
.contacts-steps { display: grid; grid-template-columns: repeat(4, 1fr); }

@media (max-width: 1100px) {
  .contacts-hero { padding-bottom: 70px; }
  .contacts-aside { max-width: 650px; }
  .contacts-steps { grid-template-columns: repeat(2, 1fr); row-gap: 42px; }
  .contacts-steps .process-step:nth-child(2n)::before { display: none; }
}

@media (max-width: 800px) {
  .contact-channel__value { font-size: 18px; }
}

@media (max-width: 600px) {
  .contacts-hero { padding-bottom: 52px; }
  .contacts-hero h1 { max-width: 100%; }
  .contacts-aside { max-width: none; }
  .contacts-steps { grid-template-columns: 1fr; row-gap: 0; }
  .contacts-steps .process-step:nth-child(2n)::before { display: block; }
  .contacts-steps .process-step:last-child::before { display: none; }
  .contact-channel { grid-template-columns: 40px 1fr; gap: 14px; padding: 15px 16px; }
  .contact-channel:hover { transform: none; }
  .contact-channel > .icon { display: none; }
  .contact-channel__icon { width: 40px; height: 40px; border-radius: 10px; }
  .contact-channel__value { font-size: 17px; }
  .contacts-hero .button-row { display: grid; gap: 10px; }
  .contacts-hero .button-row .button { width: 100%; }
}

@media (max-width: 400px) {
  .contact-channel { padding: 13px 14px; }
  .contact-channel__hint { font-size: 12px; }
}