/*
 * Moderne Kontakt- und Buchungsseite.
 * Die bestehenden Feld-IDs und das PHP-Versandskript bleiben unverändert.
 */

.contact-page-modern #ppmenuu1439 {
  padding-bottom: 0;
}

.contact-page-modern .contact-modern-content {
  box-sizing: border-box;
  clear: both;
  display: block;
  float: left;
  margin: 38px 0 0 64px;
  padding-bottom: 38px;
  position: relative;
  width: 840px;
}

.contact-page-modern .contact-hero {
  box-sizing: border-box;
  padding: 4px 46px 28px;
  text-align: center;
}

.contact-page-modern .contact-kicker {
  color: #aa6c4a;
  display: block;
  font-family: "Helvetica Neue", Arial, sans-serif;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.16em;
  line-height: 16px;
  margin-bottom: 7px;
  text-transform: uppercase;
}

.contact-page-modern .contact-hero h1,
.contact-page-modern .contact-card-heading h2,
.contact-page-modern .contact-map-card__heading h2 {
  color: #4b301a;
  font-family: Georgia, "Times New Roman", serif;
  font-weight: 400;
}

.contact-page-modern .contact-hero h1 {
  font-size: 34px;
  line-height: 41px;
  margin: 0 0 12px;
}

.contact-page-modern .contact-hero p {
  color: #73543d;
  font-family: "Helvetica Neue", Arial, sans-serif;
  font-size: 14px;
  line-height: 22px;
  margin: 0 auto;
  max-width: 650px;
}

.contact-page-modern .contact-quick-grid {
  display: grid;
  gap: 16px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin-bottom: 24px;
}

.contact-page-modern .contact-quick-card,
.contact-page-modern .contact-quick-card:visited {
  box-sizing: border-box;
  border: 1px solid #ead8c4;
  border-radius: 14px;
  background: rgba(255, 252, 247, 0.94);
  box-shadow: 0 12px 30px rgba(75, 47, 23, 0.09);
  color: #4b301a;
  padding: 18px 20px;
  text-decoration: none;
}

.contact-page-modern .contact-quick-card:hover,
.contact-page-modern .contact-quick-card:focus-visible {
  border-color: #d8b896;
  box-shadow: 0 15px 34px rgba(75, 47, 23, 0.14);
  text-decoration: none;
  transform: translateY(-2px);
}

.contact-page-modern .contact-quick-card span,
.contact-page-modern .contact-quick-card strong {
  display: block;
  font-family: "Helvetica Neue", Arial, sans-serif;
}

.contact-page-modern .contact-quick-card span {
  color: #a65f3e;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.12em;
  line-height: 14px;
  margin-bottom: 5px;
  text-transform: uppercase;
}

.contact-page-modern .contact-quick-card strong {
  color: #4b301a;
  font-size: 14px;
  line-height: 20px;
}

.contact-page-modern #u997.contact-form-card,
.contact-page-modern #pu776.contact-map-card {
  box-sizing: border-box;
  border: 1px solid #ead8c4;
  border-radius: 18px;
  background: rgba(255, 252, 247, 0.96);
  box-shadow: 0 18px 45px rgba(75, 47, 23, 0.11);
  float: none;
  margin: 0;
  overflow: hidden;
  position: relative;
  width: 100%;
}

.contact-page-modern .contact-card-heading,
.contact-page-modern .contact-map-card__heading {
  box-sizing: border-box;
  padding: 26px 30px 23px;
  border-bottom: 1px solid #ead8c4;
  background:
    radial-gradient(circle at 95% 0%, rgba(224, 178, 130, 0.28), transparent 34%),
    linear-gradient(135deg, #fffaf3 0%, #f7e6d2 100%);
}

.contact-page-modern .contact-card-heading h2,
.contact-page-modern .contact-map-card__heading h2 {
  font-size: 25px;
  line-height: 31px;
  margin: 0 0 7px;
}

.contact-page-modern .contact-card-heading p,
.contact-page-modern .contact-map-card__heading p {
  color: #76543c;
  font-family: "Helvetica Neue", Arial, sans-serif;
  font-size: 13px;
  line-height: 19px;
  margin: 0;
}

.contact-page-modern #widgetu998.modern-booking-form {
  box-sizing: border-box;
  display: grid;
  float: none;
  gap: 20px 22px;
  grid-template-areas:
    "name email"
    "arrival departure"
    "phone phone"
    "message message"
    "consent consent"
    "captcha submit"
    "status status";
  grid-template-columns: repeat(2, minmax(0, 1fr));
  height: auto;
  left: auto;
  margin: 0;
  padding: 28px 30px 30px;
  position: relative;
  width: 100%;
}

.contact-page-modern #widgetu998.modern-booking-form::after {
  content: none;
  display: none;
}

.contact-page-modern #widgetu999 { grid-area: name; }
.contact-page-modern #widgetu1005 { grid-area: email; }
.contact-page-modern #widgetu1056 { grid-area: phone; }
.contact-page-modern #widgetu1104 { grid-area: arrival; }
.contact-page-modern #widgetu1114 { grid-area: departure; }
.contact-page-modern #widgetu1011 { grid-area: message; }
.contact-page-modern #widgetu5409 { grid-area: consent; }
.contact-page-modern #widgetu5285 { grid-area: captcha; }
.contact-page-modern #u1010-4 { grid-area: submit; }
.contact-page-modern #u1003-4,
.contact-page-modern #u1009-4,
.contact-page-modern #u1004-4 { grid-area: status; }

.contact-page-modern #widgetu999,
.contact-page-modern #widgetu1005,
.contact-page-modern #widgetu1056,
.contact-page-modern #widgetu1104,
.contact-page-modern #widgetu1114,
.contact-page-modern #widgetu1011,
.contact-page-modern #widgetu5285,
.contact-page-modern #widgetu5409 {
  box-sizing: border-box;
  float: none !important;
  height: auto !important;
  left: auto !important;
  margin: 0 !important;
  min-height: 0 !important;
  position: relative !important;
  width: auto !important;
}

.contact-page-modern .contact-field-label {
  color: #68452d;
  display: block;
  font-family: "Helvetica Neue", Arial, sans-serif;
  font-size: 12px;
  font-weight: 700;
  line-height: 17px;
  margin: 0 0 7px;
}

.contact-page-modern #u1001-4,
.contact-page-modern #u1006-4,
.contact-page-modern #u1059-4,
.contact-page-modern #u1106-4,
.contact-page-modern #u1116-4,
.contact-page-modern #u1013-4,
.contact-page-modern #widgetu999:hover #u1001-4,
.contact-page-modern #widgetu1005:hover #u1006-4,
.contact-page-modern #widgetu1056:hover #u1059-4,
.contact-page-modern #widgetu1104:hover #u1106-4,
.contact-page-modern #widgetu1114:hover #u1116-4,
.contact-page-modern #widgetu1011:hover #u1013-4,
.contact-page-modern #widgetu999.non-empty-st #u1001-4,
.contact-page-modern #widgetu1005.non-empty-st #u1006-4,
.contact-page-modern #widgetu1056.non-empty-st #u1059-4,
.contact-page-modern #widgetu1104.non-empty-st #u1106-4,
.contact-page-modern #widgetu1114.non-empty-st #u1116-4,
.contact-page-modern #widgetu1011.non-empty-st #u1013-4,
.contact-page-modern #widgetu999.focus-st #u1001-4,
.contact-page-modern #widgetu1005.focus-st #u1006-4,
.contact-page-modern #widgetu1056.focus-st #u1059-4,
.contact-page-modern #widgetu1104.focus-st #u1106-4,
.contact-page-modern #widgetu1114.focus-st #u1116-4,
.contact-page-modern #widgetu1011.focus-st #u1013-4 {
  box-sizing: border-box;
  display: block !important;
  float: none !important;
  height: 48px !important;
  margin: 0 !important;
  min-height: 48px !important;
  padding: 0 !important;
  position: relative !important;
  width: 100% !important;
  border: 1px solid #d9c8b7 !important;
  border-radius: 11px !important;
  background: #fff !important;
}

.contact-page-modern #u1013-4,
.contact-page-modern #widgetu1011:hover #u1013-4,
.contact-page-modern #widgetu1011.focus-st #u1013-4 {
  height: 132px !important;
  min-height: 132px !important;
}

.contact-page-modern #widgetu998 .wrapped-input {
  box-sizing: border-box;
  color: #4a3423;
  font-family: "Helvetica Neue", Arial, sans-serif;
  font-size: 14px;
  background: transparent !important;
  border: 0 !important;
  left: 0 !important;
  line-height: 20px;
  margin: 0 !important;
  outline: 0 !important;
  padding: 13px 15px !important;
  position: absolute !important;
  top: 0 !important;
  width: 100% !important;
}

.contact-page-modern #widgetu998 input.wrapped-input {
  height: 46px !important;
}

.contact-page-modern #widgetu998 textarea.wrapped-input {
  height: 130px !important;
  resize: vertical;
}

.contact-page-modern #widgetu998 .fld-prompt {
  display: none !important;
}

.contact-page-modern #widgetu999.focus-st #u1001-4,
.contact-page-modern #widgetu1005.focus-st #u1006-4,
.contact-page-modern #widgetu1056.focus-st #u1059-4,
.contact-page-modern #widgetu1104.focus-st #u1106-4,
.contact-page-modern #widgetu1114.focus-st #u1116-4,
.contact-page-modern #widgetu1011.focus-st #u1013-4 {
  border-color: #a65f3e;
  box-shadow: 0 0 0 3px rgba(166, 95, 62, 0.12);
}

.contact-page-modern #widgetu999.fld-err-st #u1001-4,
.contact-page-modern #widgetu1005.fld-err-st #u1006-4,
.contact-page-modern #widgetu1056.fld-err-st #u1059-4,
.contact-page-modern #widgetu1104.fld-err-st #u1106-4,
.contact-page-modern #widgetu1114.fld-err-st #u1116-4,
.contact-page-modern #widgetu1011.fld-err-st #u1013-4 {
  border-color: #c44d3d;
  box-shadow: 0 0 0 3px rgba(196, 77, 61, 0.11);
  height: 48px;
  margin: 0;
  width: 100%;
}

.contact-page-modern #widgetu1011.fld-err-st #u1013-4 {
  height: 132px;
}

.contact-page-modern #widgetu5409 {
  align-items: flex-start;
  display: flex;
  gap: 12px;
  min-height: 48px;
}

.contact-page-modern #u5417 {
  flex: 0 0 18px;
  float: none;
  height: 18px;
  margin: 2px 0 0;
  position: relative;
  width: 18px;
}

.contact-page-modern #u5417 input.wrapped-input {
  box-sizing: border-box;
  height: 18px;
  left: 0;
  margin: 0;
  padding: 0 !important;
  clip: auto !important;
  opacity: 0 !important;
  position: absolute !important;
  top: 0;
  width: 18px !important;
  height: 18px !important;
}

.contact-page-modern #u5417 label {
  border: 1px solid #c9b39f;
  border-radius: 4px;
  box-sizing: border-box;
  cursor: pointer;
  display: block;
  height: 18px !important;
  position: absolute;
  inset: 0;
  width: 18px !important;
}

.contact-page-modern #u5412-6,
.contact-page-modern #widgetu5409.fld-err-st #u5412-6 {
  color: #76543c;
  float: none;
  font-family: "Helvetica Neue", Arial, sans-serif;
  font-size: 11px;
  height: auto;
  left: auto;
  line-height: 17px;
  margin: 0;
  min-height: 0;
  order: 2;
  position: relative;
  width: auto;
}

.contact-page-modern #widgetu5285,
.contact-page-modern #widgetu5285.fld-err-st {
  align-self: center;
  height: 78px;
  margin: 0;
  width: 304px;
}

.contact-page-modern #widgetu5285_recaptcha2 {
  float: none;
  margin: 0;
  position: relative;
  width: 304px;
}

.contact-page-modern #u1010-4,
.contact-page-modern #u1010-4:hover,
.contact-page-modern #u1010-4:active {
  align-self: center;
  justify-self: end;
  box-sizing: border-box;
  width: 190px;
  height: 48px;
  margin: 0;
  padding: 0 22px;
  left: auto;
  border: 1px solid #743b1f;
  border-radius: 999px;
  background: #673318;
  color: #fffaf2;
  cursor: pointer;
  font-family: "Helvetica Neue", Arial, sans-serif;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.02em;
  line-height: 46px;
  position: relative;
  text-transform: none;
}

.contact-page-modern #u1010-4:hover,
.contact-page-modern #u1010-4:focus-visible {
  background: #874725;
  box-shadow: 0 8px 20px rgba(92, 45, 21, 0.2);
}

.contact-page-modern #u1003-4,
.contact-page-modern #u1009-4,
.contact-page-modern #u1004-4 {
  box-sizing: border-box;
  float: none;
  height: 34px;
  left: auto;
  margin: 0;
  padding: 8px 12px;
  position: relative;
  width: 100%;
  border-radius: 9px;
  font-family: "Helvetica Neue", Arial, sans-serif;
  font-size: 12px;
  line-height: 18px;
  text-align: center;
}

.contact-page-modern #widgetu998.frm-sub-st #u1003-4 {
  background: #eff6e9;
}

.contact-page-modern #widgetu998.frm-subm-err-st #u1009-4 {
  background: #fff0ed;
}

.contact-page-modern #widgetu998.frm-subm-ok-st #u1004-4 {
  background: #eff6e9;
}

.contact-page-modern #pu776.contact-map-card {
  margin-top: 26px;
}

.contact-page-modern .contact-map-card__heading {
  align-items: center;
  display: flex;
  justify-content: space-between;
  gap: 24px;
}

.contact-page-modern .contact-map-card__heading > div {
  max-width: 520px;
}

.contact-page-modern .contact-map-card__heading > a,
.contact-page-modern .contact-map-card__heading > a:visited {
  flex: 0 0 auto;
  padding: 10px 17px;
  border: 1px solid #7b4224;
  border-radius: 999px;
  background: #6a351b;
  color: #fff8ef;
  font-family: "Helvetica Neue", Arial, sans-serif;
  font-size: 12px;
  font-weight: 700;
  line-height: 16px;
  text-decoration: none;
}

.contact-page-modern .contact-map-card__heading > a:hover,
.contact-page-modern .contact-map-card__heading > a:focus-visible {
  background: #8b4a26;
  color: #fff;
  text-decoration: none;
}

.contact-page-modern #u776,
.contact-page-modern #u776 iframe {
  display: block;
  float: none;
  height: 390px;
  margin: 0;
  min-height: 390px;
  position: relative;
  width: 100%;
}

.contact-page-modern #u776 iframe {
  border: 0;
}

.contact-page-modern #ppu1806 {
  margin-top: 7px !important;
}

@media (max-width: 760px) {
  html,
  body.contact-page-modern {
    box-sizing: border-box;
    min-width: 0 !important;
    width: 100% !important;
  }

  body.contact-page-modern {
    padding: 0 !important;
  }

  .contact-page-modern #page {
    box-shadow: none;
    box-sizing: border-box;
    margin: 0 auto !important;
    min-height: 0 !important;
    overflow: visible !important;
    padding: 0 0 22px !important;
    width: 100% !important;
  }

  .contact-page-modern #u1496,
  .contact-page-modern .verticalspacer {
    display: none !important;
  }

  .contact-page-modern #ppmenuu1439,
  .contact-page-modern #pmenuu1439 {
    box-sizing: border-box;
    float: none !important;
    height: auto !important;
    margin: 0 !important;
    min-height: 0 !important;
    padding: 0 !important;
    position: relative !important;
    width: 100% !important;
  }

  .contact-page-modern #pmenuu1439 {
    align-items: center;
    display: flex !important;
    flex-direction: column;
  }

  .contact-page-modern #u2338 {
    float: none !important;
    height: auto !important;
    left: auto !important;
    margin: 0 auto -20px !important;
    order: 1;
    position: relative !important;
    top: auto !important;
    width: 174px !important;
  }

  .contact-page-modern #u2338_img {
    height: auto !important;
    width: 174px !important;
  }

  .contact-page-modern #menuu1439 {
    box-sizing: border-box;
    display: grid !important;
    float: none !important;
    gap: 8px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    height: auto !important;
    left: auto !important;
    margin: 0 auto !important;
    order: 2;
    padding: 0 14px !important;
    position: relative !important;
    top: auto !important;
    width: 100% !important;
  }

  .contact-page-modern #menuu1439 > .MenuItemContainer {
    float: none !important;
    height: 42px !important;
    left: auto !important;
    margin: 0 !important;
    min-height: 42px !important;
    position: relative !important;
    top: auto !important;
    width: 100% !important;
  }

  .contact-page-modern #u2764 {
    grid-column: 1 / -1;
  }

  .contact-page-modern #u2741 {
    display: none !important;
  }

  .contact-page-modern #u1443,
  .contact-page-modern #u2737,
  .contact-page-modern #u2751,
  .contact-page-modern #u2760,
  .contact-page-modern #u2767 {
    height: 42px !important;
  }

  .contact-page-modern #menuu1439 .MenuItemLabel p {
    font-size: 13px !important;
  }

  .contact-page-modern .contact-modern-content {
    box-sizing: border-box;
    clear: both;
    float: none !important;
    margin: 26px auto 0 !important;
    padding: 0 14px 16px;
    width: 100% !important;
  }

  .contact-page-modern .contact-hero {
    padding: 13px 7px 25px;
  }

  .contact-page-modern .contact-hero h1 {
    font-size: 29px;
    line-height: 35px;
    margin-bottom: 10px;
  }

  .contact-page-modern .contact-hero p {
    font-size: 14px;
    line-height: 21px;
  }

  .contact-page-modern .contact-quick-grid {
    gap: 10px;
    grid-template-columns: 1fr;
    margin-bottom: 18px;
  }

  .contact-page-modern .contact-quick-card,
  .contact-page-modern .contact-quick-card:visited {
    padding: 14px 17px;
  }

  .contact-page-modern .contact-card-heading,
  .contact-page-modern .contact-map-card__heading {
    padding: 21px 20px 19px;
  }

  .contact-page-modern .contact-card-heading h2,
  .contact-page-modern .contact-map-card__heading h2 {
    font-size: 23px;
    line-height: 29px;
  }

  .contact-page-modern #widgetu998.modern-booking-form {
    gap: 17px;
    grid-template-areas:
      "name"
      "email"
      "arrival"
      "departure"
      "phone"
      "message"
      "consent"
      "captcha"
      "submit"
      "status";
    grid-template-columns: minmax(0, 1fr);
    padding: 22px 20px 24px;
  }

  .contact-page-modern #widgetu5409 {
    min-height: 0 !important;
  }

  .contact-page-modern #u5412-6,
  .contact-page-modern #widgetu5409.fld-err-st #u5412-6 {
    font-size: 12px;
    line-height: 18px;
  }

  .contact-page-modern #widgetu5285,
  .contact-page-modern #widgetu5285.fld-err-st,
  .contact-page-modern #widgetu5285_recaptcha2 {
    max-width: 100%;
    overflow: hidden;
  }

  .contact-page-modern #u1010-4,
  .contact-page-modern #u1010-4:hover,
  .contact-page-modern #u1010-4:active {
    justify-self: stretch;
    width: 100%;
  }

  .contact-page-modern .contact-map-card__heading {
    align-items: stretch;
    flex-direction: column;
    gap: 17px;
  }

  .contact-page-modern .contact-map-card__heading > a,
  .contact-page-modern .contact-map-card__heading > a:visited {
    box-sizing: border-box;
    text-align: center;
    width: 100%;
  }

  .contact-page-modern #u776,
  .contact-page-modern #u776 iframe {
    height: 320px;
    min-height: 320px;
  }

  .contact-page-modern #ppu1806 {
    box-sizing: border-box;
    clear: both;
    float: none !important;
    margin: 0 !important;
    padding: 0 !important;
    position: relative !important;
    width: 100% !important;
  }

  .contact-page-modern #pu1806 {
    display: none !important;
  }

  .contact-page-modern #u1831-bw,
  .contact-page-modern #u1831,
  .contact-page-modern #u1831_align_to_page {
    box-sizing: border-box;
    height: auto !important;
    left: auto !important;
    margin: 0 !important;
    min-height: 0 !important;
    position: relative !important;
    width: 100% !important;
  }

  .contact-page-modern #u1831_align_to_page {
    padding: 15px 18px !important;
  }

  .contact-page-modern #u1808-9 {
    float: none !important;
    font-size: 11px !important;
    height: auto !important;
    left: auto !important;
    line-height: 17px !important;
    margin: 0 !important;
    min-height: 0 !important;
    position: relative !important;
    width: 100% !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .contact-page-modern .contact-quick-card {
    transition: none !important;
  }
}
