/* vars: --c-accent,--c-bg,--c-ink,--c-ink-mid,--c-ink-faint,--c-ink-ghost,--c-surface,--f-serif,--f-sans */
.contact-form-section {
  padding: clamp(60px, 8vw, 100px) clamp(16px, 5vw, 80px);
  background: var(--c-surface);
  border-top: 1px solid var(--c-ink-ghost);
}
.contact-form-section__h2 {
  font-family: var(--f-serif);
  font-size: clamp(2.5rem, 5vw, 4rem);
  line-height: 1.1;
  text-transform: uppercase;
  margin-bottom: 8px;
  color: var(--c-ink);
}
.contact-form-section__h2 em {
  color: var(--c-accent);
  font-style: normal;
  display: block;
}
.contact-form-section__sub {
  font-size: clamp(1rem, 1.3vw, 1.125rem);
  color: var(--c-ink-mid);
  margin-bottom: clamp(32px, 5vw, 48px);
  max-width: 600px;
}

.contact-form {
  max-width: 720px;
  margin: 0 auto;
}
.contact-form__grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(16px, 3vw, 24px);
  margin-bottom: clamp(24px, 4vw, 32px);
}
@media (max-width: 640px) {
  .contact-form__grid { grid-template-columns: 1fr; }
}
.contact-form__field { display: flex; flex-direction: column; gap: 8px; }
.contact-form__field--full { grid-column: 1 / -1; }

.contact-form__label {
  font-family: var(--f-serif);
  font-size: 0.875rem;
  text-transform: uppercase;
  letter-spacing: 2px;
  color: var(--c-ink);
}
.contact-form__required { color: var(--c-accent2); margin-left: 4px; }

.contact-form__input {
  font-family: var(--f-sans);
  font-size: 1rem;
  background: var(--c-bg);
  border: 1px solid var(--c-ink-ghost);
  color: var(--c-ink);
  padding: 14px 16px;
  transition: border-color .2s, box-shadow .2s;
}
.contact-form__input:focus {
  outline: none;
  border-color: var(--c-accent);
  box-shadow: 0 0 0 3px rgba(245, 154, 0, .15);
}
.contact-form__input::placeholder { color: var(--c-ink-faint); }
.contact-form__input--textarea {
  resize: vertical;
  min-height: 120px;
  font-family: inherit;
}
.contact-form__help {
  font-size: 0.8125rem;
  color: var(--c-ink-faint);
  margin: 0;
}

.contact-form__submit {
  width: 100%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  min-height: 56px;
}
.contact-form__submit:disabled { opacity: .7; cursor: not-allowed; }
.contact-form__submit-loading { display: flex; align-items: center; gap: 10px; }
.spinner {
  width: 20px; height: 20px;
  animation: spin 1s linear infinite;
}
@keyframes spin { to { transform: rotate(360deg); } }

.contact-form__message {
  margin-top: 16px;
  padding: 16px;
  border-radius: 4px;
  font-size: 1rem;
  line-height: 1.6;
  text-align: center;
}
.contact-form__message--success {
  display: block;
  background: rgba(34, 197, 94, .15);
  border: 1px solid #22c55e;
  color: #86efac;
}
.contact-form__message--error {
  display: block;
  background: rgba(232, 32, 32, .15);
  border: 1px solid var(--c-accent2);
  color: #fca5a5;
}

.contact-form__field--error .contact-form__input {
  border-color: var(--c-accent2);
}
.contact-form__field--error .contact-form__input:focus {
  box-shadow: 0 0 0 3px rgba(232, 32, 32, .15);
}
.contact-form__error-text {
  font-size: 0.8125rem;
  color: var(--c-accent2);
  margin: 4px 0 0;
}