/* wabenwerke – gemeinsame Styles. Werte aus dem Markenhandbuch. */
@font-face { font-family: "Inter"; font-weight: 400; font-style: normal; font-display: swap; src: url("Inter-Regular.woff") format("woff"); }
@font-face { font-family: "Inter"; font-weight: 500; font-style: normal; font-display: swap; src: url("Inter-Medium.woff") format("woff"); }
@font-face { font-family: "Inter"; font-weight: 600; font-style: normal; font-display: swap; src: url("Inter-SemiBold.woff") format("woff"); }
@font-face { font-family: "Inter"; font-weight: 700; font-style: normal; font-display: swap; src: url("Inter-Bold.woff") format("woff"); }

:root {
  --honig: #E8A33D;
  --on-honig: #1C1A17;
  --bernstein: #8A6420;
  --ink: #1C1A17;
  --ink-muted: #5E584E;
  --label: #6B655B;
  --surface: #FFFFFF;
  --surface-alt: #FBFAF7;
  --line: #E4DFD5;
  --sans: "Inter", Arial, "Helvetica Neue", sans-serif;
}

* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  background: var(--surface);
  color: var(--ink);
  font-family: var(--sans);
  font-size: 17px;
  line-height: 1.6;
  font-feature-settings: "calt", "kern";
}
a { color: var(--ink); text-underline-offset: 3px; text-decoration-thickness: 1px; }
a:hover { text-decoration-thickness: 2px; }
a:focus-visible { outline: 2px solid var(--ink); outline-offset: 3px; border-radius: 2px; }

.wrap {
  width: 100%;
  max-width: 1120px;
  margin: 0 auto;
  padding-left: max(24px, env(safe-area-inset-left, 0px));
  padding-right: max(24px, env(safe-area-inset-right, 0px));
}

/* Kopf */
.site-head { padding-block: 28px; }
.site-head .wrap { display: flex; justify-content: space-between; align-items: center; gap: 16px; }
.logo img { display: block; height: 40px; width: auto; }
.status {
  display: inline-flex; align-items: center; gap: 8px;
  font-size: 12px; font-weight: 500; letter-spacing: .1em; text-transform: uppercase; color: var(--label);
}
.status::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--honig); animation: pulse 2.4s ease-in-out infinite; }

/* Fuß */
.site-foot { border-top: 1px solid var(--line); padding-block: 28px 36px; font-size: 14px; color: var(--ink-muted); }
.site-foot .wrap { display: flex; justify-content: space-between; gap: 12px 24px; flex-wrap: wrap; }
.site-foot nav { display: flex; gap: 20px; }
.site-foot a { color: var(--ink-muted); }

/* Textseiten (Impressum, Datenschutz) */
.legal { padding-block: 48px 80px; }
.legal .wrap { max-width: 760px; }
.legal h1 { font-size: 40px; line-height: 1.15; letter-spacing: -0.01em; margin: 0 0 32px; }
.legal h2 { font-size: 20px; line-height: 1.3; margin: 40px 0 8px; font-weight: 600; }
.legal p, .legal ul { margin: 0 0 14px; color: var(--ink); }
.legal ul { padding-left: 20px; }
.legal .back { display: inline-block; margin-bottom: 32px; font-size: 14px; color: var(--ink-muted); }

@keyframes pulse { 0%, 100% { opacity: 1; } 50% { opacity: .35; } }
@media (prefers-reduced-motion: reduce) { *, *::before { animation: none !important; transition: none !important; } }
@media (max-width: 520px) { .legal h1 { font-size: 32px; } .status { display: none; } }