:root {
  --bg: #f6f9fb;
  --card: #ffffff;
  --text: #1d2733;
  --muted: #63758a;
  --primary: #2a7cc7;
  --primary-600: #2267a5;
  --ring: rgba(42,124,199,0.25);
}
* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, sans-serif; color: var(--text); background: var(--bg); }

.container { max-width: 1100px; margin: 0 auto; padding: 0 1rem; }

.site-header { position: sticky; top: 0; backdrop-filter: blur(6px); background: rgba(255,255,255,0.7); border-bottom: 1px solid #e6eef5; z-index: 10; }
.header-inner { display:flex; align-items:center; justify-content:space-between; height:64px; }
.brand { display:flex; align-items:center; gap:.75rem; }
.logo { width:36px; height:36px; display:grid; place-items:center; background:#e6f1fb; border-radius:50%; font-size:20px; }
.brand-text { display:flex; flex-direction:column; font-size:14px; }
.brand-text strong { font-weight:800; }
.brand-text span { color: var(--muted); font-weight:400; }
.nav a { margin-left:1rem; text-decoration:none; color: var(--text); font-weight:600; }
.nav a:hover { color: var(--primary); }

.hero { background: linear-gradient(180deg, #eaf4ff 0%, #f6f9fb 100%); border-bottom:1px solid #e6eef5; }
.hero-inner { padding: 64px 0; text-align:center; }
.hero h1 { font-size: clamp(28px, 4vw, 40px); margin: 0 0 12px; }
.hero p { margin:0 0 24px; color: var(--muted); font-size:18px; }

.btn { display:inline-block; padding:12px 18px; border-radius:10px; text-decoration:none; border:1px solid transparent; cursor:pointer; font-weight:700; }
.btn-primary { background: var(--primary); color: #fff; }
.btn-primary:hover { background: var(--primary-600); }

.content { padding: 36px 0; }
.grid { display:grid; gap:16px; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); }
.card { background: var(--card); border:1px solid #e6eef5; border-radius:16px; padding:20px; box-shadow: 0 6px 24px rgba(18,38,63,0.04); }

.form-section { background: #fff; border-top:1px solid #e6eef5; padding: 36px 0 48px; }
.form { max-width: 860px; margin: 0 auto; }
.form fieldset { border:0; padding:0; margin: 14px 0 22px; }
.form legend { font-weight:800; margin-bottom:10px; }
.form label { display:block; margin-bottom:12px; font-weight:600; }
.form input, .form select { width:100%; padding:12px 12px; border:1px solid #ccd8e6; border-radius:10px; font-size:16px; outline:none; }
.form input:focus, .form select:focus { border-color: var(--primary); box-shadow: 0 0 0 4px var(--ring); }
.form .row { display:grid; gap:12px; grid-template-columns: 1fr 1fr; }
@media (max-width:640px){ .form .row { grid-template-columns: 1fr; } }
.radio, .checkbox { display:flex; align-items:center; gap:.5rem; font-weight:600; }
.small { font-size: 14px; }
.muted { color: var(--muted); }
.hp { position:absolute; left:-9999px; }

.site-footer { border-top:1px solid #e6eef5; background:#fff; }
.footer-inner { height:64px; display:flex; align-items:center; }

/* Logo-Bild im Header */
.site-header .logo {
  display: grid;
  place-items: center;
  width: 120px;           /* Wunschgröße */
  height: auto;
  border-radius: 12px;   /* wenn du die Ecken weich magst */
  background: transparent;  
  padding: 0;
  text-decoration: none;
}

.site-header .logo img {
  display: block;
  max-width: 100%;
  max-height: 100%;
  height: auto;
}

