/* =============================================================
   IC7 GAME — Contact page
   ============================================================= */

.contact-split { display: grid; grid-template-columns: 1.4fr 1fr; gap: var(--space-12); align-items: start; }
@media (max-width: 900px) { .contact-split { grid-template-columns: 1fr; gap: var(--space-10); } }

.contact-form {
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-xl);
  padding: var(--space-10);
}
.form-group { margin-bottom: var(--space-5); }
.form-group label { display: block; font-size: var(--text-sm); color: var(--color-white-90); margin-bottom: var(--space-2); font-weight: 500; }
.form-group input, .form-group select, .form-group textarea {
  width: 100%;
  background: var(--color-bg);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  padding: 14px 16px;
  color: #fff;
  outline: none;
  transition: border-color var(--dur-base);
}
.form-group input::placeholder, .form-group textarea::placeholder { color: var(--color-white-38); }
.form-group input:focus, .form-group select:focus, .form-group textarea:focus { border-color: var(--color-red-500); box-shadow: var(--shadow-glow-sm); }
.form-group textarea { resize: vertical; min-height: 120px; }
.contact-form .btn { width: 100%; margin-top: var(--space-2); }
#form-note { margin-top: var(--space-4); font-size: var(--text-sm); text-align: center; min-height: 1.2em; }

/* contact cards */
.contact-cards { display: flex; flex-direction: column; gap: var(--space-4); }
.contact-card {
  display: flex; align-items: center; gap: var(--space-4);
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-left: 3px solid var(--color-red-500);
  border-radius: var(--radius-md);
  padding: var(--space-5);
}
.contact-card__icon { font-size: var(--text-2xl); flex: none; }
.contact-card__meta { flex: 1; min-width: 0; }
.contact-card__meta h4 { font-size: var(--text-base); color: #fff; margin-bottom: 2px; }
.contact-card__meta p { font-size: var(--text-sm); color: var(--color-white-65); }
.contact-card .btn { flex: none; }