/* contacts.css */

/* общая секция */
.contacts-wrap {
  padding: 48px 0 64px;
}

/* сетка: инфо слева, форма справа */
.contacts-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 32px;
  margin-bottom: 40px;
}

/* мобильная адаптация */
@media (max-width: 768px) {
  .contacts-grid {
    grid-template-columns: 1fr;
  }
}

/* блок с адресом/телефоном */
.contact-info h3 {
  font-size: 16px;
  font-weight: 600;
  color: #0f172a; /* тёмно-синий графит */
  margin: 20px 0 6px;
}

.contact-info p,
.contact-info a {
  font-size: 15px;
  line-height: 1.5;
  color: #334155; /* приглушенный синий/серый */
  text-decoration: none;
}

.contact-info a:hover {
  text-decoration: underline;
  color: #1e40af; /* синий акцент */
}

/* сама форма */
.contact-form {
  background: #f8fafc;           /* очень светлый голубовато-серый */
  border: 1px solid #e2e8f0;      /* светлая граница */
  border-radius: 16px;
  padding: 24px 24px 20px;
}

/* подписи */
.contact-form label {
  display: block;
  font-size: 14px;
  font-weight: 500;
  color: #1e293b; /* тёмно-серо-синий */
  margin-bottom: 6px;
}

/* инпуты / textarea */
.contact-form input,
.contact-form textarea {
  width: 100%;
  font-family: inherit;
  font-size: 15px;
  line-height: 1.4;
  color: #0f172a;
  background: #ffffff;
  border: 1px solid #94a3b8; /* серо-синий бордер */
  border-radius: 10px;
  padding: 10px 12px;
  outline: none;
  margin-bottom: 16px;
  transition: border-color 0.15s, box-shadow 0.15s;
  box-shadow: none; /* без теней как ты просил */
}

.contact-form input:focus,
.contact-form textarea:focus {
  border-color: #14b8a6; /* мятно-зелёный акцент */
  box-shadow: 0 0 0 2px rgba(20,184,166,0.2); /* мягкая подсветка мяты */
}

/* кнопка отправки — можно использовать .btn-primary из общего css.
   Но если вдруг её нет/не нравится, на всякий случай: */
.contact-form .btn-primary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 15px;
  font-weight: 600;
  line-height: 1.2;
  padding: 12px 16px;
  border-radius: 10px;
  border: 0;
  cursor: pointer;
  background: linear-gradient(to right, #0ea5e9, #14b8a6); /* голубой → мята */
  color: #fff;
  width: 100%;
  transition: opacity 0.15s;
}

.contact-form .btn-primary:disabled {
  opacity: 0.6;
  cursor: default;
}

.contact-form .btn-primary:not(:disabled):hover {
  opacity: 0.9;
}

/* статус отправки */
.form-status {
  font-size: 14px;
  line-height: 1.4;
  min-height: 1.4em; /* чтобы блок не прыгал до появления текста */
  margin-top: 12px;
  text-align: center;
  font-weight: 500;
}

/* Варианты цветов статуса.
   JS будет менять data-state="ok" / "error" / "idle" / "sending" */
.form-status[data-state="ok"] {
  color: #059669; /* зелёный успешный */
}
.form-status[data-state="error"] {
  color: #dc2626; /* красный */
}
.form-status[data-state="sending"] {
  color: #475569; /* серо-синий */
}

/* карта */
.map-block iframe {
  border-radius: 16px;
  border: 1px solid #e2e8f0;
  width: 100%;
  height: 380px;
}

/* секция "шапка раздела" в контактах может смотреться компактнее */
.contacts-wrap .section-head {
  margin-bottom: 32px;
}