.contact-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 80px;
  align-items: start;
}
.contact-image img { height: 75vh; object-fit: cover; }
.contact-map { height: 75vh; overflow: hidden; }
.contact-map iframe { height: 100%; min-height: 400px; filter: grayscale(30%) contrast(1.05); }
.contact-form-col { padding-top: 20px; }

.contact-form h2 { font-size: var(--fs-h2); }
.contact-sub { font-size: 1rem; color: var(--white-60); margin: 8px 0 32px; }

.form-row { display: flex; gap: 20px; }
.form-group { flex: 1; margin-bottom: 24px; }
.form-group label { display: block; font-size: var(--fs-small); margin-bottom: 8px; color: var(--white-80); }
.contact-form input, .contact-form textarea {
  width: 100%;
  background: var(--black-soft);
  border: var(--border-gold-30);
  color: var(--white);
  padding: 14px 16px;
  font-family: var(--font-body);
  font-size: 1rem;
  outline: none;
  transition: border-color var(--dur-fast) var(--ease-luxury);
}
.contact-form input:focus, .contact-form textarea:focus { border-color: var(--gold); }
.contact-submit { width: auto; min-width: 200px; margin-top: 8px; }

.form-result {
  margin-top: 16px;
  font-family: var(--font-body);
  font-size: 0.9rem;
  font-style: italic;
  min-height: 1.4em;
}
.form-result--success { color: var(--gold); }
.form-result--error   { color: #e07070; }

.contact-divider {
  text-align: center; margin: 40px 0; position: relative;
}
.contact-divider span { background: var(--black); padding: 0 16px; color: var(--gold-dim); position: relative; z-index: 1; }
.contact-divider::before {
  content:''; position: absolute; left:0; right:0; top: 50%; height: 1px; background: var(--border-gold-30);
}

.contact-booking { margin-bottom: 40px; }
.contact-booking h3 { font-size: var(--fs-h3); margin-bottom: 8px; }
.contact-booking p { color: var(--white-60); font-size: var(--fs-small); margin-bottom: 20px; }

.contact-instagram a { display: inline-flex; align-items: center; gap: 8px; font-style: italic; color: var(--white-60); }
.contact-instagram a:hover { color: var(--gold); }

@media (max-width: 768px) {
  .contact-grid {
    grid-template-columns: 1fr; /* single column */
  }

  /* Hide left column on mobile — form takes full width */
  .contact-image { display: none; }
  .contact-map { display: none; }

  .contact-form-col { padding: 0; }

  .form-row { flex-direction: column; gap: 0; }

  .contact-form input,
  .contact-form textarea,
  .contact-form select {
    font-size: 16px; /* prevent iOS zoom on focus */
  }

  .contact-submit { width: 100%; }
  .contact-cal-btn { display: block; text-align: center; }
}
