.contact-main { background: #F7F5F2; }
.contact-main__grid { display: grid; grid-template-columns: 1fr 1.4fr; gap: 100px; align-items: start; }

.contact-info > p { color: rgba(17,17,17,.68); font-size: 1rem; line-height: 1.9; margin-bottom: 36px; }

.contact-cards { display: flex; flex-direction: column; gap: 12px; margin-bottom: 40px; }
.contact-card { display: flex; align-items: center; gap: 16px; padding: 16px 20px; background: #fff; border: 1px solid rgba(17,17,17,.08); border-radius: 14px; box-shadow: 0 2px 8px rgba(0,0,0,.04); transition: all .3s; }
.contact-card:hover { border-color: var(--orange); box-shadow: 0 6px 24px rgba(232,98,10,.1); transform: translateX(6px); }
.contact-card--location { cursor: default; }
.contact-card--location:hover { transform: none; }
.contact-card__icon { width: 46px; height: 46px; background: var(--orange-dim); border-radius: 12px; display: flex; align-items: center; justify-content: center; color: var(--orange); flex-shrink: 0; }
.contact-card span { display: block; font-size: 10px; font-weight: 600; letter-spacing: 2px; text-transform: uppercase; color: rgba(17,17,17,.4); margin-bottom: 2px; }
.contact-card strong { font-family: var(--display); font-size: 14px; font-weight: 600; color: #111; }

.contact-social p { font-family: var(--display); font-size: 11px; font-weight: 600; letter-spacing: 2px; text-transform: uppercase; color: rgba(17,17,17,.4); margin-bottom: 14px; }
.contact-social__links { display: flex; gap: 12px; }
.contact-social__links a { width: 44px; height: 44px; border: 1px solid rgba(17,17,17,.15); border-radius: 50%; display: flex; align-items: center; justify-content: center; color: rgba(17,17,17,.45); transition: all .3s; }
.contact-social__links a:hover { border-color: var(--orange); color: var(--orange); background: var(--orange-dim); }

/* FORM */
.contact-form-wrap { background: #fff; border: 1px solid rgba(17,17,17,.08); border-radius: 24px; padding: 48px; box-shadow: 0 4px 32px rgba(0,0,0,.06); }
.contact-form h3 { font-family: var(--serif); font-size: 1.8rem; font-weight: 300; color: #111; margin-bottom: 8px; }
.contact-form > p { font-size: 13px; color: rgba(17,17,17,.5); margin-bottom: 32px; }

.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.form-field { position: relative; margin-bottom: 20px; }
.form-field input, .form-field select, .form-field textarea { width: 100%; background: #F7F5F2; border: 1px solid rgba(17,17,17,.12); border-radius: 12px; padding: 20px 16px 8px; color: #111; font-family: var(--sans); font-size: 15px; outline: none; transition: border-color .3s, background .3s; resize: vertical; appearance: none; }
.form-field input:focus, .form-field select:focus, .form-field textarea:focus { border-color: var(--orange); background: #fff; }
.form-field label { position: absolute; top: 14px; left: 16px; font-size: 12px; font-weight: 600; letter-spacing: 1px; text-transform: uppercase; color: rgba(17,17,17,.4); pointer-events: none; transition: all .3s; }
.form-field input:focus ~ label, .form-field input:not(:placeholder-shown) ~ label,
.form-field select:focus ~ label, .form-field select:valid ~ label,
.form-field textarea:focus ~ label, .form-field textarea:not(:placeholder-shown) ~ label { top: 6px; font-size: 9px; color: var(--orange); }
.form-field input::placeholder, .form-field textarea::placeholder { color: transparent; }
.form-field select option { background: #fff; color: #111; }
.form-field input[type="date"]::-webkit-calendar-picker-indicator { filter: none; opacity: .5; }
.form-success { text-align: center; font-size: 13px; color: var(--orange); margin-top: 16px; min-height: 20px; font-style: italic; }

/* MAP */
.contact-map { position: relative; height: 480px; overflow: hidden; }
.contact-map iframe { display: block; width: 100%; height: 100%; border: 0; }

@media (max-width: 1024px) { .contact-main__grid { gap: 60px; } }
@media (max-width: 900px) { .contact-main__grid { grid-template-columns: 1fr; } .contact-form-wrap { padding: 32px 24px; } }
@media (max-width: 768px) {
  .contact-main__grid { gap: 40px; }
  .contact-form-wrap { padding: 28px 20px; }
  .contact-social__links { flex-wrap: wrap; gap: 10px; }
}
@media (max-width: 640px) {
  .form-row { grid-template-columns: 1fr; }
  .contact-main { padding: 0 20px; }
  .contact-info { padding: 0; }
  .contact-cards { gap: 10px; }
  .contact-card { padding: 14px 16px; }
  .contact-form h3 { font-size: 1.3rem; }
  .contact-map { height: 300px; }
}
