/* German inquiry form (/de/kontakt.html). Tokens come from main.css. */

.inquiry-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.55fr) minmax(0, 1fr);
  gap: clamp(2rem, 5vw, 4rem);
  align-items: start;
}
@media (max-width: 860px) {
  .inquiry-layout { grid-template-columns: minmax(0, 1fr); }
}

.inquiry {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1.15rem 1.2rem;
  background: #fff;
  border: 1px solid var(--c-line);
  border-radius: var(--radius);
  box-shadow: var(--shadow-card);
  padding: clamp(1.3rem, 4vw, 2.2rem);
}
@media (max-width: 560px) {
  .inquiry { grid-template-columns: minmax(0, 1fr); }
}

.field { display: grid; gap: .35rem; }
.field--full, .inquiry__alert, .inquiry__submit { grid-column: 1 / -1; }

.field label { font-size: .92rem; font-weight: 700; color: var(--c-ink); }
.field__opt { font-weight: 500; color: var(--c-muted); }

.field input,
.field select,
.field textarea {
  width: 100%;
  font: inherit;
  font-size: 1rem; /* ≥16px: no zoom on focus in iOS Safari */
  color: var(--c-ink);
  background: #fff;
  border: 1px solid #b7c7d0;
  border-radius: 8px;
  padding: .72rem .85rem;
  transition: border-color .15s var(--ease-out), box-shadow .15s var(--ease-out);
}
.field select { appearance: none; padding-right: 2.4rem; background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%232095c1' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") no-repeat right .9rem center; }
.field textarea { resize: vertical; min-height: 7.5rem; }
.field input::placeholder, .field textarea::placeholder { color: #7d8f99; }
.field input:focus,
.field select:focus,
.field textarea:focus {
  outline: none;
  border-color: var(--c-accent);
  box-shadow: 0 0 0 3px rgba(32, 149, 193, .22);
}
.field input:user-invalid,
.field select:user-invalid { border-color: #b3261e; }

.inquiry__submit { display: grid; gap: .8rem; margin-top: .3rem; }
.inquiry__submit .btn { width: 100%; }
.inquiry__submit .btn:disabled { opacity: .7; cursor: progress; transform: none; box-shadow: none; }
.inquiry__note { font-size: .86rem; color: var(--c-muted); margin: 0; }

.inquiry__alert {
  border-left: 4px solid #b3261e;
  background: #fdf1f0;
  border-radius: 6px;
  padding: .9rem 1.1rem;
  font-size: .95rem;
  color: var(--c-ink);
  scroll-margin-top: 6.5rem; /* clear the sticky header */
}
.inquiry__alert:focus { outline: none; }
.inquiry__alert:target { display: block; } /* shown via #fehler-N even without JS */

/* Honeypot: off-screen for people, still in the form for bots */
.hp { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }

.inquiry-aside h2 { font-size: 1.3rem; }
.inquiry-aside h2:not(:first-child) { margin-top: 2.2rem; }
.inquiry-steps { list-style: none; counter-reset: step; padding: 0; margin: 0; display: grid; gap: 1.1rem; }
.inquiry-steps li { counter-increment: step; position: relative; padding-left: 2.7rem; font-size: .97rem; }
.inquiry-steps li::before {
  content: counter(step);
  position: absolute;
  left: 0;
  top: .05rem;
  width: 1.9rem;
  height: 1.9rem;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: var(--c-accent);
  color: #fff;
  font-weight: 800;
  font-size: .9rem;
}
.inquiry-steps b { display: block; color: var(--c-ink); }
.inquiry-direct { list-style: none; padding: 0; margin: 0; display: grid; gap: .5rem; font-weight: 600; }
