@font-face { font-family: Fredoka; src: url(/bilder/Fredoka.ttf) format("truetype"); font-weight: 300 700; font-display: swap; }
:root {
  --pflaume: #4a2238; --altrosa: #925569; --rosa: #f6dde3; --gold: #d9a441;
  --papier: #fdf8f0; --creme: #fff6e7; --tinte: #2f1824;
  color-scheme: light;
}
* { box-sizing: border-box; }
html { background: var(--papier); color: var(--tinte); font: 400 1.0625rem/1.6 Fredoka, system-ui, sans-serif; }
body { margin: 0; min-height: 100vh; display: flex; flex-direction: column; }
main { flex: 1; width: min(42rem, 100% - 2.5rem); margin: 0 auto; padding: 2rem 0 3rem; }
a { color: var(--pflaume); text-underline-offset: .18em; }
a:focus-visible, button:focus-visible, input:focus-visible { outline: 3px solid var(--gold); outline-offset: 3px; }
h1, h2 { color: var(--pflaume); line-height: 1.2; font-weight: 600; }
h1 { font-size: 2rem; margin: 0 0 1rem; }
h2 { font-size: 1.2rem; margin: 2rem 0 .4rem; }
header { padding: 1rem 1.25rem; }
.marke { display: inline-flex; align-items: center; gap: .6rem; font-weight: 600; text-decoration: none; }
footer { display: flex; justify-content: center; gap: 1.5rem; padding: 1.5rem; font-size: .95rem; }

.start main { display: flex; flex-direction: column; align-items: center; text-align: center; padding-top: 3rem; }
.logo { width: min(280px, 70vw); height: auto; filter: drop-shadow(0 6px 14px rgb(74 34 56 / .18)); }
.start h1 { margin: 1.25rem 0 .25rem; }
.zeile { margin: 0 0 2rem; color: var(--altrosa); }
.knoepfe { display: grid; gap: .75rem; width: min(22rem, 100%); }
.knopf {
  display: block; padding: .8rem 1.2rem; border-radius: 999px; text-align: center; text-decoration: none; font-weight: 500;
  background: var(--creme); border: 2px solid var(--pflaume); color: var(--pflaume);
  transition: background .15s, color .15s;
}
.knopf:first-child { background: var(--pflaume); color: var(--creme); }
.knopf:hover { background: var(--rosa); color: var(--pflaume); }

form { display: grid; gap: .5rem; margin: 1.5rem 0; max-width: 30rem; }
label { font-weight: 500; }
input, textarea { font: inherit; padding: .7rem .9rem; border: 2px solid var(--altrosa); border-radius: 12px; background: #fff; color: var(--tinte); }
textarea { resize: vertical; }
.cf-turnstile:not(:empty) { min-height: 65px; }
button { font: inherit; font-weight: 500; padding: .8rem 1.2rem; border: 0; border-radius: 999px; background: var(--pflaume); color: var(--creme); cursor: pointer; }
button:hover { background: var(--altrosa); }
.falle { position: absolute; left: -9999px; }
.klein { font-size: .9rem; color: #5c4452; }
.leer { font-size: 1.3rem; color: var(--altrosa); }
.kontakt { display: block; max-width: 100%; height: auto; }
@media (prefers-reduced-motion: reduce) { * { transition: none !important; } }