/* ===== Contact Page Specific Styles ===== */

.contact-grid {
  display: grid; grid-template-columns: 1fr 1fr; gap: 48px;
}
.contact-info h2 { margin-bottom: 12px; }
.contact-info > p { margin-bottom: 32px; }

.contact-item {
  display: flex; gap: 16px; padding: 20px 0;
  border-bottom: 1px solid var(--border);
}
.contact-item:last-child { border-bottom: none; }
.contact-icon { font-size: 28px; flex-shrink: 0; margin-top: 4px; }
.contact-item h3 { font-size: 15px; margin-bottom: 4px; }
.contact-item p { font-size: 15px; color: var(--text); }
.contact-note { font-size: 12px; color: var(--text-light); display: block; margin-top: 2px; }

.contact-form-wrapper {
  background: var(--bg-alt); border-radius: var(--radius-lg); padding: 32px;
}
.contact-form-wrapper h2 { margin-bottom: 8px; }
.contact-form-wrapper > p { margin-bottom: 24px; font-size: 14px; }

.form-group { margin-bottom: 16px; }
.form-group label { display: block; font-size: 14px; font-weight: 600; margin-bottom: 6px; color: var(--text); }
.form-group input, .form-group textarea {
  width: 100%; padding: 10px 14px; border: 1px solid var(--border);
  border-radius: 6px; font-size: 15px; font-family: inherit;
  transition: border-color var(--transition);
}
.form-group input:focus, .form-group textarea:focus {
  outline: none; border-color: var(--primary); box-shadow: 0 0 0 3px var(--primary-light);
}
.form-note { text-align: center; margin-top: 12px; font-size: 13px; color: var(--text-light); }

.map-placeholder {
  width: 100%; height: 400px; background: var(--bg-alt);
  display: flex; align-items: center; justify-content: center;
}
.map-content { text-align: center; }
.map-content h3 { margin-bottom: 8px; }
.map-content p { font-size: 14px; }
.map-note { font-size: 13px; color: var(--text-light); margin-top: 8px; }

@media (max-width: 768px) {
  .contact-grid { grid-template-columns: 1fr; gap: 32px; }
  .map-placeholder { height: 300px; }
}