.contact-panel {
  display: grid;
  grid-template-columns: minmax(0, 0.75fr) minmax(0, 1.65fr);
  gap: clamp(1.5rem, 1.5rem + 1.5rem, 3rem);
  border: 1px solid var(--color-border);
  border-radius: 18px;
  padding: clamp(1.15rem, 2.4vw, 2rem);
  background:
    linear-gradient(135deg, rgba(255,255,255,0.96), rgba(232, 243, 247, 0.82)),
    radial-gradient(circle at 100% 0, rgba(122, 185, 211, 0.28), transparent 16rem);
  box-shadow: 0 18px 44px rgba(3, 91, 127, 0.09);
}

.contact-panel__intro p:not(.eyebrow) {
  margin-top: 1rem;
  color: var(--color-text-muted);
}

.contact-form {
  display: grid;
  gap: 0.9rem;
}

.form-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0.75rem;
}

.field {
  display: grid;
  grid-column: span 2;
  gap: 0.3rem;
}

.field-full {
  grid-column: 1 / -1;
}

.field label,
.checkbox-field {
  color: var(--color-primary-dark);
  font-weight: 700;
}

.field input,
.field select,
.field textarea {
  width: 100%;
  min-height: 48px;
  border: 1px solid var(--color-border);
  border-radius: 12px;
  padding: 0.78rem 0.9rem;
  color: var(--color-text);
  background:
    linear-gradient(var(--color-white), var(--color-white)) padding-box,
    linear-gradient(135deg, rgba(4, 122, 172, 0.12), rgba(122, 185, 211, 0.24)) border-box;
  transition: border-color 180ms ease, box-shadow 180ms ease, transform 180ms ease, background 180ms ease;
}

.field textarea {
  resize: vertical;
}

.field input:focus,
.field select:focus,
.field textarea:focus {
  border-color: var(--color-primary);
  box-shadow: 0 0 0 4px rgba(122, 185, 211, 0.24), 0 12px 26px rgba(4, 122, 172, 0.12);
  transform: translateY(-1px);
  outline: 0;
}

.field [aria-invalid="true"] {
  border-color: #9f2d2d;
}

.field-error {
  color: #7d1f1f;
  font-size: 0.92rem;
}

.checkbox-field {
  display: flex;
  gap: 0.7rem;
  align-items: flex-start;
  border: 1px solid rgba(4, 122, 172, 0.12);
  border-radius: 12px;
  padding: 0.8rem;
  background: rgba(255, 255, 255, 0.72);
}

.checkbox-field input {
  width: 1.1rem;
  height: 1.1rem;
  margin-top: 0.18rem;
  accent-color: var(--color-primary);
}

.checkbox-field a {
  color: var(--color-primary-dark);
}

.privacy-note {
  margin-top: 0.4rem;
  color: var(--color-text-muted);
  font-size: 0.94rem;
}

.hp-field {
  position: absolute;
  left: -10000px;
  width: 1px;
  height: 1px;
  overflow: hidden;
}

.contact-form__actions {
  display: flex;
  justify-content: flex-end;
  padding-top: 0.25rem;
}

.form-message {
  border-radius: 12px;
  padding: 0.85rem 1rem;
  font-weight: 700;
}

.form-message-error {
  color: #7d1f1f;
  background: #fff0f0;
}

.form-message-notice {
  color: var(--color-primary-dark);
  background: var(--color-primary-soft);
}