/* homigo — Corporate Design nach Brand Guidelines (Jonas Schwab Design)
   Navy #112033 · Signal Blue #214D9B · Smart Green #C0CD02
   Soft Lavender #AAAAD5 · Digital Lilac #EEEEF7 · Calm Beige #F3F2ED
   Schrift: Plus Jakarta Sans, selbst gehostet (kein Google-Aufruf) */

@font-face{
  font-family:'Plus Jakarta Sans';font-style:normal;font-weight:400;font-display:swap;
  src:url('/schrift/pjs-400.woff2') format('woff2');
}
@font-face{
  font-family:'Plus Jakarta Sans';font-style:normal;font-weight:600;font-display:swap;
  src:url('/schrift/pjs-600.woff2') format('woff2');
}

:root{
  --navy:#112033;
  --blau:#214D9B;
  --gruen:#C0CD02;
  --lavendel:#AAAAD5;
  --lilac:#EEEEF7;
  --beige:#F3F2ED;
  --weiss:#FFFFFF;

  --schrift:var(--navy);
  --schrift-leise:#4A5769;   /* Navy aufgehellt, bleibt in der Familie */
  --schrift-still:#6B7787;
  --linie:#D8D8E8;
}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;
  background:var(--lilac);
  color:var(--schrift);
  font-family:'Plus Jakarta Sans',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;
  font-size:16.5px;
  font-weight:400;
  line-height:1.68;
  -webkit-font-smoothing:antialiased;
}

.seite{max-width:800px;margin:0 auto;padding:0 22px 0}
.fussinhalt{max-width:800px;margin:0 auto}

/* ---------- Kopf ---------- */
.kopf{
  display:flex;align-items:flex-end;justify-content:space-between;
  flex-wrap:wrap;gap:10px 24px;
  padding:30px 0 18px;margin-bottom:26px;
  border-bottom:1px solid var(--linie);
}
.kopf .marke{margin:0;line-height:0}
.kopf .marke img{width:200px;height:auto;display:block}
.hinweiszeile{
  margin:0;font-size:13.5px;font-weight:600;color:var(--schrift-leise);
  padding-bottom:3px;
}

/* ---------- Brotkrumen ---------- */
.seitenweg{font-size:13.5px;color:var(--schrift-still);margin:0 0 24px}
.seitenweg a{color:var(--schrift-still)}
.seitenweg span{margin:0 5px;color:var(--lavendel)}

/* ---------- Text ---------- */
main{padding-bottom:8px}
h1{
  font-size:clamp(26px,4.8vw,34px);line-height:1.16;font-weight:600;
  letter-spacing:-.015em;margin:0 0 20px;text-wrap:balance;
}
h2{
  font-size:20px;font-weight:600;letter-spacing:-.005em;
  margin:38px 0 10px;padding-top:20px;border-top:1px solid var(--linie);
  scroll-margin-top:20px;
}
h3{font-size:17px;font-weight:600;margin:26px 0 6px}
h4{font-size:15.5px;font-weight:600;margin:20px 0 4px}
p{margin:0 0 15px}
a{color:var(--blau);text-underline-offset:2px}
a:hover{color:var(--navy)}
a:focus-visible{outline:2px solid var(--blau);outline-offset:2px;border-radius:2px}
ul,ol{margin:0 0 15px;padding-left:23px}
li{margin-bottom:7px}
li::marker{color:var(--lavendel)}
strong,b{font-weight:600}
em{font-style:italic}
address{font-style:normal;line-height:1.8}
table{border-collapse:collapse;width:100%;font-size:14.5px;margin:0 0 18px}
th,td{text-align:left;padding:9px 11px;border-bottom:1px solid var(--linie);vertical-align:top}

.fuehrung{font-size:18px;color:var(--schrift-leise);line-height:1.6}
.klein{font-size:14px;color:var(--schrift-leise)}

/* ---------- Hinweisflächen ---------- */
.banner{
  background:var(--beige);
  border-left:5px solid var(--blau);
  padding:16px 20px;border-radius:0 10px 10px 0;
  margin:0 0 26px;font-size:15px;
}
.banner p{margin:0}
.banner p + p{margin-top:10px}
.banner.gross{
  background:var(--lavendel);
  border-left-color:var(--navy);
  color:var(--navy);font-size:16px;
}

.karte{
  background:var(--weiss);
  border:1px solid var(--linie);
  border-radius:12px;padding:20px 22px;margin:20px 0;
}

.linkliste{list-style:none;padding:0}
.linkliste li{margin-bottom:9px;padding-left:16px;position:relative}
.linkliste li::before{
  content:"";position:absolute;left:0;top:.62em;
  width:7px;height:7px;background:var(--gruen);border-radius:1px;
}

.knopf{
  display:inline-block;background:var(--blau);color:var(--lilac);
  text-decoration:none;font-weight:600;font-size:15.5px;
  padding:12px 26px;border-radius:999px;margin-top:8px;
}
.knopf:hover{background:var(--navy);color:var(--lilac)}

/* ---------- Fuß ---------- */
.akzentband{height:5px;background:var(--gruen);margin-top:52px}
footer{
  background:var(--navy);color:var(--beige);
  padding:28px 22px 34px;
}
.fussinhalt{max-width:800px;margin:0 auto}
.fusslinks{display:flex;flex-wrap:wrap;gap:8px 20px;font-size:14px;margin-bottom:16px;font-weight:600}
.fusslinks a{color:var(--lavendel);text-decoration:none}
.fusslinks a:hover{color:var(--gruen);text-decoration:underline}
footer .klein{font-size:13px;color:#A9B4C2;margin-bottom:5px}
footer .klein a{color:var(--lavendel)}

@media (max-width:560px){
  .kopf{padding-top:24px}
  .kopf .marke img{width:172px}
  body{font-size:16px}
}

@media print{
  body{background:#fff;color:#000}
  .seitenweg,.fusslinks,.knopf,.akzentband{display:none}
  footer{background:none;color:#000;margin:0;padding-top:14px;border-top:1px solid #999}
  footer .klein{color:#000}
  .seite{max-width:none}
  .karte,.banner{border:1px solid #999;background:none}
}