/* Kontakt-Unterseite (gestaltete Fassung) */
.page-kontakt { background: #f2f5f9; }

.k-hero { background: linear-gradient(135deg, #0071BC 0%, #00538a 100%); color: #fff; padding: 64px 20px 92px; text-align: center; }
.k-hero__label { margin: 0 0 10px; font-size: 13px; letter-spacing: 3px; text-transform: uppercase; opacity: .85; }
.k-hero h1 { margin: 0 0 14px; color: #fff; font-size: 46px; text-transform: none; }
.k-hero__text { max-width: 560px; margin: 0 auto; font-size: 17px; line-height: 1.6; opacity: .95; }

.k-body { padding: 0 20px 70px; }
.k-wrap { display: grid; grid-template-columns: 360px 1fr; gap: 28px; max-width: 1140px; margin: -52px auto 0; align-items: start; }

.k-info { display: grid; gap: 16px; }
.k-card { background: #fff; border-radius: 12px; padding: 20px 22px; box-shadow: 0 4px 18px rgba(0, 40, 80, .08); display: flex; gap: 16px; align-items: flex-start; }
.k-card__icon { flex: none; width: 44px; height: 44px; border-radius: 50%; background: #e6f1fa; color: #0071BC; display: flex; align-items: center; justify-content: center; font-size: 18px; }
.k-card h2 { margin: 2px 0 4px; font-size: 13px; letter-spacing: 1.5px; text-transform: uppercase; color: #0071BC; font-weight: 700; }
.k-card p { margin: 0; font-size: 15px; line-height: 1.55; color: #222; }
.k-card a { color: #222; }
.k-card a:hover { color: #0071BC; }
.k-card ul { list-style: none; margin: 0; padding: 0; font-size: 15px; line-height: 1.7; color: #222; }

.k-form { background: #fff; border-radius: 12px; padding: 34px 34px 30px; box-shadow: 0 4px 18px rgba(0, 40, 80, .08); }
.k-form h2 { margin: 0 0 6px; font-size: 28px; color: #0071BC; text-transform: none; letter-spacing: 1px; }
.k-form__intro { margin: 0 0 24px; color: #666; font-size: 14px; line-height: 1.6; }

.page-kontakt .form-fields { margin: 0 -8px -6px; }
.page-kontakt .form-field { padding: 0 8px; margin-bottom: 18px; }
.page-kontakt .form-field label.sr-only { position: static; width: auto; height: auto; margin: 0 0 6px; overflow: visible; clip: auto; white-space: normal; display: block; font-size: 12px; font-weight: 600; letter-spacing: .4px; color: #555; }
.page-kontakt .form-field input[type="text"],
.page-kontakt .form-field input[type="tel"],
.page-kontakt .form-field input[type="email"],
.page-kontakt .form-field textarea { padding: 13px 14px; font-size: 14px; color: #222; background: #f8fafc; border: 1px solid #cfd8e3; border-radius: 8px; transition: border-color .2s, box-shadow .2s, background .2s; }
.page-kontakt .form-field textarea { min-height: 150px; }
.page-kontakt .form-field input:focus,
.page-kontakt .form-field textarea:focus { background: #fff; border-color: #0071BC; box-shadow: 0 0 0 3px rgba(0, 113, 188, .15); }
.page-kontakt .form-field input::placeholder,
.page-kontakt .form-field textarea::placeholder { color: #a3adba; }
.page-kontakt .form-field--check label { color: #444; font-size: 14px; line-height: 1.5; display: inline; font-weight: 400; letter-spacing: 0; }
.page-kontakt .form-field--check label.sr-only { display: none; }
.page-kontakt .form-field--check a { color: #0071BC; }
.page-kontakt .form-status { color: #1a7f37; font-size: 14px; margin-bottom: 12px; }
.page-kontakt .form-status.is-error { color: #c62828; }
.page-kontakt .form-submit { height: 52px; font-size: 16px; letter-spacing: .5px; color: #fff; background: #0071BC; border-radius: 8px; }
.page-kontakt .form-submit:hover, .page-kontakt .form-submit:focus { background: #005a96; color: #fff; }

@media (max-width: 900px) {
  .k-wrap { grid-template-columns: 1fr; margin-top: -44px; }
  .k-info { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 600px) {
  .k-hero { padding: 44px 16px 76px; }
  .k-hero h1 { font-size: 34px; }
  .k-hero__text { font-size: 15px; }
  .k-body { padding: 0 12px 50px; }
  .k-info { grid-template-columns: 1fr; }
  .k-form { padding: 24px 18px; }
  .page-kontakt .form-field--half { width: 100%; }
}

/* Fußzeile: kein roter Strich auf der Kontaktseite */
.page-kontakt .footbar { border-top: 0; box-shadow: 0 -1px 0 #e3e8ef; }

.page-kontakt .form-field select { padding: 13px 38px 13px 14px; font-size: 14px; color: #222; background-color: #f8fafc; background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'><path d='M1 1l5 5 5-5' fill='none' stroke='%23555' stroke-width='2'/></svg>"); border: 1px solid #cfd8e3; border-radius: 8px; transition: border-color .2s, box-shadow .2s; }
.page-kontakt .form-field select:focus { background-color: #fff; border-color: #0071BC; box-shadow: 0 0 0 3px rgba(0, 113, 188, .15); }

/* Karten liegen über dem Hero (Hero hat seit dem Feinschliff position: relative) */
.k-wrap { position: relative; z-index: 1; }
@media (max-width: 600px) { .k-hero__label { font-size: 10px; letter-spacing: 1.4px; padding: 5px 12px; white-space: nowrap; } }

/* Öffnungszeiten als kleine Tabelle */
.k-card > div { flex: 1; min-width: 0; }
.k-hours { margin: 6px 0 0; }
.k-hours > div { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; padding: 7px 0; border-top: 1px dashed #d6e0ea; }
.k-hours > div:first-child { border-top: 0; padding-top: 2px; }
.k-hours dt { font-size: 14px; font-weight: 600; color: #0a2c46; }
.k-hours dd { margin: 0; font-size: 14px; color: #222; white-space: nowrap; font-variant-numeric: tabular-nums; }
.page-kontakt .captcha-hint { color: #50657a; }
.page-kontakt .form-field--captcha.is-invalid .captcha-hint { color: #c62828; }
.page-kontakt .form-status.is-captcha { background: #fdecea; border-color: #f5c2c0; color: #b71c1c; }
