/* ==================================
   15. CONTACT
================================== */
.contact-grid { display: grid; gap: 34px; align-items: start; }
.contact-info p { color: var(--muted); line-height: 1.8; margin-bottom: 24px; }
.info-list { display: grid; gap: 14px; margin-bottom: 24px; }
.info-list li { display: flex; align-items: center; gap: 12px; color: var(--brown); font-weight: 500; }
.info-list ion-icon { color: var(--orange); font-size: 1.2rem; }
.info-list a { color: inherit; }
.info-list a:hover { color: var(--orange); }

.social-list { display: flex; flex-wrap: wrap; gap: 10px; }
.social-link {
  width: 44px; height: 44px; border-radius: 14px; display: grid; place-items: center;
  background: var(--white); color: var(--brown); border: 1px solid rgba(61, 35, 20, 0.08);
  font-size: 1.2rem; transition: var(--transition-fast);
}
.social-link:hover { background: var(--orange); color: var(--white); transform: translateY(-3px); }

.contact-form { background: var(--white); padding: 30px; border-radius: 28px; box-shadow: var(--shadow-md); }
.contact-form h3 { font-family: var(--ff-display); text-transform: uppercase; font-size: 1.3rem; color: var(--brown); margin-bottom: 22px; }
.form-grid { display: grid; gap: 14px; }
.input-field {
  width: 100%; border: 1px solid rgba(61, 35, 20, 0.12); background: var(--cream);
  color: var(--brown); border-radius: 14px; padding: 14px 16px; outline: none; transition: var(--transition-fast);
}
.input-field:focus { border-color: var(--orange); box-shadow: 0 0 0 3px rgba(224, 122, 47, 0.12); }
.input-field::placeholder { color: rgba(111, 98, 89, 0.8); }
textarea.input-field { min-height: 130px; resize: vertical; }
.contact-form .btn { width: 100%; margin-top: 18px; }