/* Blaumann – Website (statisch, ohne Cookies, ohne Tracking, Schriften lokal) */
@font-face { font-family: 'Barlow'; font-weight: 400; font-display: swap; src: url('fonts/barlow-400.woff2') format('woff2'); }
@font-face { font-family: 'Barlow'; font-weight: 500; font-display: swap; src: url('fonts/barlow-500.woff2') format('woff2'); }
@font-face { font-family: 'Barlow'; font-weight: 600; font-display: swap; src: url('fonts/barlow-600.woff2') format('woff2'); }
@font-face { font-family: 'Barlow'; font-weight: 700; font-display: swap; src: url('fonts/barlow-700.woff2') format('woff2'); }
@font-face { font-family: 'Barlow Semi Condensed'; font-weight: 700; font-display: swap; src: url('fonts/barlow-semi-condensed-700.woff2') format('woff2'); }
:root { --blau: #1F3A6B; --blau-900: #142847; --blau-100: #E6ECF6; --gelb: #F2B705; --text: #1A1F27; --text-2: #475164; --linie: #DCE1E8; --flaeche: #F4F6F9; }
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; font-family: 'Barlow', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif; color: var(--text); background: #fff; font-size: 18px; line-height: 1.55; }
a { color: var(--blau); }
.breit { max-width: 1080px; margin: 0 auto; padding: 0 22px; }
.kopf { background: var(--blau-900); color: #fff; }
.kopf .breit { display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: 76px; }
.marke { display: flex; align-items: center; gap: 12px; color: #fff; text-decoration: none; }
.marke img { width: 42px; height: 42px; display: block; }
.marke b { font-family: 'Barlow Semi Condensed', 'Barlow', sans-serif; font-size: 26px; letter-spacing: .07em; text-transform: uppercase; }
.kopf nav { display: flex; gap: 18px; font-weight: 600; font-size: 16px; }
.kopf nav a { color: #C9D3E3; text-decoration: none; }
.kopf nav a:hover { color: #fff; }
.held { background: linear-gradient(170deg, var(--blau) 0%, var(--blau-900) 100%); color: #fff; padding: 64px 0 72px; }
.held h1 { font-family: 'Barlow Semi Condensed', 'Barlow', sans-serif; font-size: clamp(34px, 5vw, 54px); line-height: 1.08; margin: 0 0 16px; max-width: 760px; }
.held p { font-size: 20px; color: #C9D3E3; max-width: 680px; margin: 0 0 28px; }
.marker { display: inline-block; background: var(--gelb); color: var(--text); font-weight: 700; font-size: 14px; letter-spacing: .06em; text-transform: uppercase; border-radius: 6px; padding: 3px 10px; margin-bottom: 18px; }
.knoepfe { display: flex; gap: 12px; flex-wrap: wrap; }
.knopf { display: inline-flex; align-items: center; min-height: 52px; padding: 0 22px; border-radius: 12px; font-weight: 700; text-decoration: none; }
.knopf--gelb { background: var(--gelb); color: var(--text); }
.knopf--hell { border: 2px solid rgba(255,255,255,.4); color: #fff; }
section { padding: 56px 0; }
section h2 { font-family: 'Barlow Semi Condensed', 'Barlow', sans-serif; font-size: 34px; margin: 0 0 8px; color: var(--blau); }
.unter { color: var(--text-2); margin: 0 0 28px; max-width: 720px; }
.raster { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 18px; }
.karte { border: 1px solid var(--linie); border-radius: 16px; padding: 22px; background: #fff; }
.karte h3 { margin: 0 0 8px; font-size: 21px; }
.karte ul { margin: 0; padding-left: 20px; color: var(--text-2); }
.karte small { display: block; font-weight: 700; color: #6E5200; text-transform: uppercase; letter-spacing: .06em; font-size: 12.5px; margin-bottom: 6px; }
.grau { background: var(--flaeche); }
.punkte { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 14px 28px; padding: 0; list-style: none; margin: 0; }
.punkte li { padding-left: 30px; position: relative; color: var(--text-2); }
.punkte li::before { content: ''; position: absolute; left: 0; top: 9px; width: 16px; height: 6px; background: var(--gelb); border-radius: 2px; }
.punkte b { color: var(--text); }
.kontakt { background: var(--blau-900); color: #fff; }
.kontakt h2 { color: #fff; }
.kontakt p { color: #C9D3E3; }
.kontakt a { color: #fff; font-weight: 700; }
.fuss { background: #0E1D35; color: #8E9BB0; font-size: 15px; padding: 26px 0; }
.fuss .breit { display: flex; justify-content: space-between; gap: 16px; flex-wrap: wrap; }
.fuss a { color: #C9D3E3; text-decoration: none; margin-left: 18px; }
.recht { max-width: 820px; padding-top: 40px; padding-bottom: 60px; }
.recht h1 { font-family: 'Barlow Semi Condensed', 'Barlow', sans-serif; color: var(--blau); font-size: 40px; margin: 0 0 18px; }
.recht h2 { font-size: 22px; margin: 32px 0 8px; color: var(--text); font-family: 'Barlow', sans-serif; }
.recht h3 { font-size: 18px; margin: 20px 0 6px; }
.recht p, .recht li { color: var(--text-2); }
.platzhalter { background: #FFF3CC; color: #6E5200; border-radius: 4px; padding: 0 4px; font-weight: 600; }
.hinweis-entwurf { border: 2px dashed #F2B705; background: #FFFBEA; border-radius: 12px; padding: 12px 16px; font-size: 15px; color: #6E5200; }
@media (max-width: 640px) { .kopf nav { display: none; } section { padding: 40px 0; } }