/* Kontakt-Seite — Formular (Design-Referenz: Reservierungsformular aus site.css) */

.k-formwrap { max-width: 760px; margin: 0 auto; }
.k-notice { text-align: center; margin: 0 auto 46px; max-width: 720px; }
.k-notice .btn-outline { display: inline-flex; margin-bottom: 20px; }
.k-notice p {
  font-size: 14px; font-weight: 300; line-height: 1.8;
  color: var(--ink-55); max-width: 560px; margin: 0 auto;
}
.k-formwrap .res-form { width: 100%; }
.k-thanks { text-align: center; padding: 30px 0 10px; }
.k-thanks-script {
  font-family: "Pinyon Script", cursive;
  font-size: clamp(44px, 6vw, 64px);
  color: var(--gold-light);
  line-height: 1.2;
}
.k-thanks h3 {
  margin: 18px 0 0;
  font-family: var(--font-serif, Georgia, serif);
  font-size: 24px;
  font-weight: 400;
  color: var(--ink);
}
.k-thanks p { margin: 12px 0 0; font-size: 15px; font-weight: 300; line-height: 1.8; color: var(--ink-70); }

/* Formular-Felder (Spiegel aus site.css — Unterseiten laden site.css nicht) */
.res-form { display: grid; grid-template-columns: 1fr 1fr; gap: 36px 40px; text-align: left; }
.field { display: flex; flex-direction: column; gap: 10px; }
.field label { font-size: 11px; letter-spacing: 0.3em; text-transform: uppercase; color: var(--ink-55); }
.field input, .field textarea {
  background: transparent; border: none; border-bottom: 1px solid rgba(245, 239, 227, 0.3);
  padding: 8px 0; color: var(--ink); font-family: var(--font-sans); font-size: 15px; font-weight: 300;
  outline: none; transition: border-color 0.3s; border-radius: 0; resize: vertical;
}
.field input:focus, .field textarea:focus { border-bottom-color: var(--gold); }
.field.span2 { grid-column: span 2; }
.res-submit {
  grid-column: span 2; margin-top: 8px; padding: 18px; cursor: pointer;
  background: linear-gradient(135deg, var(--gold-light), var(--gold-deep));
  border: none; border-radius: 999px; color: var(--navy);
  font-family: var(--font-sans); font-size: 13px; letter-spacing: 0.3em; text-transform: uppercase; font-weight: 500;
  transition: transform 0.4s, box-shadow 0.4s, background 0.4s;
}
.res-submit:hover { background: linear-gradient(135deg, var(--gold), var(--gold-dark)); transform: translateY(-2px); box-shadow: 0 14px 30px rgba(0, 0, 0, 0.35); }
.res-submit:disabled { opacity: 0.6; cursor: wait; transform: none; }
.res-error { display: none; grid-column: span 2; font-size: 13px; color: #E8A46C; }
.res-error.show { display: block; }

@media (max-width: 760px) {
  .k-formwrap .res-form { grid-template-columns: 1fr; }
  .field.span2, .res-submit, .res-error { grid-column: span 1; }
}