@font-face { font-family: "Manrope"; src: url("fonts/manrope.woff2") format("woff2"); font-weight: 200 800; font-display: swap; }
:root { --tinte: #3b2416; --erdbeer: #e4507a; --minze: #2f9e83; --leise: rgba(59, 36, 22, .7); }
* { box-sizing: border-box; }
body {
  margin: 0; color: var(--tinte); font: 17px/1.65 "Manrope", system-ui, sans-serif;
  background: radial-gradient(120% 80% at 75% 20%, #fffaf2 0%, #fff1e2 50%, #ffe4d6 100%) fixed; min-height: 100vh;
}
main { max-width: 720px; margin: 0 auto; padding: 48px 16px 64px; }
.zurueck { display: inline-block; margin-bottom: 28px; color: var(--erdbeer); font-weight: 700; text-decoration: none; }
.zurueck:hover, .zurueck:focus-visible { text-decoration: underline; }
h1 { margin: 0 0 24px; font-size: clamp(34px, 6vw, 52px); font-weight: 800; letter-spacing: -.03em; line-height: 1.05; }
h2 { margin: 32px 0 8px; font-size: 19px; font-weight: 800; }
p { margin: 0 0 12px; }
a { color: var(--erdbeer); }
.stand { color: var(--leise); }

/* Kontaktformular */
.formular { display: grid; gap: 12px; margin: 8px 0 12px; max-width: 460px; }
.formular label { display: grid; gap: 4px; font-size: 14px; font-weight: 700; }
.formular input, .formular textarea {
  font: 16px/1.4 "Manrope", system-ui, sans-serif; color: var(--tinte); padding: 12px 14px; border-radius: 14px;
  border: 2px solid rgba(59, 36, 22, .14); background: rgba(255, 255, 255, .8); resize: vertical;
}
.formular input:focus, .formular textarea:focus { outline: none; border-color: var(--erdbeer); background: #fff; }
.formular .zustimmung { display: flex; gap: 8px; align-items: flex-start; font-weight: 500; }
.formular .zustimmung a { color: var(--erdbeer); }
.formular .zustimmung input { margin-top: 4px; width: 18px; height: 18px; accent-color: var(--erdbeer); }
.formular button {
  justify-self: start; padding: 13px 24px; border: 0; border-radius: 999px; cursor: pointer;
  background: var(--erdbeer); color: #fff; font: 700 15px/1 "Manrope", system-ui, sans-serif; box-shadow: 0 8px 22px rgba(228, 80, 122, .3);
}
.formular button:hover, .formular button:focus-visible { background: var(--tinte); outline: none; }
.formular button:disabled { opacity: .6; cursor: wait; }
.koeder { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
.form-status { margin: 0; min-height: 1.6em; font-weight: 700; }
.form-status.ok { color: var(--minze); }
.form-status.fehler { color: var(--erdbeer); }