:root {
  --contact-border: rgba(128,170,255,.3);
}

.contact-shell {
  padding-bottom: 8vh;
}

.contact-layout {
  display: grid;
  grid-template-columns: 1.3fr 0.9fr;
  gap: 20px;
}

.contact-card {
  border: 1px solid var(--contact-border);
  border-radius: 20px;
  background: linear-gradient(145deg, rgba(16,23,46,.82), rgba(10,14,30,.88));
  box-shadow: 0 18px 44px rgba(0,0,0,.28);
}

.contact-card-form { padding: 20px; }
.contact-card-side { padding: 20px; display: grid; gap: 20px; }

.contact-form { display: grid; gap: 14px; }
.field-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }

.field {
  display: grid;
  gap: 8px;
}

.field > span {
  color: var(--text);
  font-weight: 600;
}

.field > span small {
  color: var(--muted);
  font-weight: 500;
}

.field input,
.field select,
.field textarea {
  width: 100%;
  border: 1px solid rgba(128,170,255,.35);
  border-radius: 12px;
  padding: 12px 13px;
  background: rgba(6,12,26,.72);
  color: var(--text);
  font: 500 0.98rem/1.4 Inter, system-ui, sans-serif;
  outline: none;
}

.field select option {
  color: #d8e7ff;
  background: #0d1731;
}

.field textarea { resize: vertical; min-height: 140px; }

.field input::placeholder,
.field textarea::placeholder {
  color: rgba(168,181,214,.75);
}

.field input:focus,
.field select:focus,
.field textarea:focus {
  border-color: rgba(68,210,255,.88);
  box-shadow: 0 0 0 3px rgba(68,210,255,.16);
}

.contact-submit {
  width: 100%;
  text-align: left;
  border: 1px solid rgba(68,210,255,.6);
  cursor: pointer;
}

.contact-helper {
  margin: 0;
  color: var(--muted);
  font-size: .92rem;
}

.contact-side-block h2 {
  margin-top: 4px;
  margin-bottom: 12px;
  font: 700 clamp(1.4rem, 3.6vw, 2rem)/1.1 Orbitron, sans-serif;
}

.contact-list {
  margin: 0;
  padding-left: 18px;
  color: var(--muted);
  display: grid;
  gap: 8px;
}

.subtle-copy {
  color: var(--muted);
  margin: 0;
}

@media (max-width: 900px) {
  .contact-layout { grid-template-columns: 1fr; }
}

@media (max-width: 700px) {
  .field-grid { grid-template-columns: 1fr; }
}
