

@font-face{font-family:"Inter";font-style:normal;font-weight:400;font-display:swap;src:url("/schriften/inter-400.a758fd5467.woff2") format("woff2")}
@font-face{font-family:"Inter";font-style:normal;font-weight:500;font-display:swap;src:url("/schriften/inter-500.d7bee9ef82.woff2") format("woff2")}
@font-face{font-family:"Inter";font-style:normal;font-weight:600;font-display:swap;src:url("/schriften/inter-600.c1915a8df5.woff2") format("woff2")}
@font-face{font-family:"JetBrains Mono";font-style:normal;font-weight:400;font-display:swap;src:url("/schriften/jbmono-400.96ab64fcc4.woff2") format("woff2")}
@font-face{font-family:"JetBrains Mono";font-style:normal;font-weight:500;font-display:swap;src:url("/schriften/jbmono-500.06fd2b5df7.woff2") format("woff2")}

:root{
  color-scheme:light;
  --grund:#F5F5F7; --grund-tief:#EBEBF0; --karte:#FFFFFF; --karte-hoch:#FFFFFF;
  --tinte:#1D1D1F; --tinte-leise:#6E6E73; --haarlinie:#D2D2D7;
  --fokus:#0B69D4; --fokus-leise:rgba(11,105,212,.10); --fokus-glut:rgba(11,105,212,.28);

  --schatten:0 30px 60px -30px rgba(0,0,0,.28);
  --geraet:#0B0B0D; --geraet-kante:rgba(0,0,0,.10);
  --hilea:#E5483A;

  --sans:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",system-ui,sans-serif;
  --mono:"JetBrains Mono",ui-monospace,"SF Mono",Menlo,monospace;

  --riese:clamp(2.6rem,7vw,5.6rem);
  --gross:clamp(2.1rem,5.4vw,3.9rem);
  --mittel:clamp(1.45rem,2.8vw,2.1rem);
  --fuehrung:clamp(1.12rem,2vw,1.38rem);

  --breite:min(1180px,100% - 36px);
  --kopf-hoehe:56px;
  --rund:24px;
  --kurve:cubic-bezier(.2,.7,.2,1);
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    color-scheme:dark;
    --grund:#000000; --grund-tief:#0A0A0C; --karte:#1C1C1E; --karte-hoch:#242428;
    --tinte:#F5F5F7; --tinte-leise:#98989D; --haarlinie:#38383A;
    --fokus:#0A84FF; --fokus-leise:rgba(10,132,255,.14); --fokus-glut:rgba(10,132,255,.40);
    --schatten:0 30px 60px -30px rgba(0,0,0,.8);
    --geraet-kante:#3A3A3C; --hilea:#FF6B5E;
  }
}
:root[data-theme="dark"]{
  color-scheme:dark;
  --grund:#000000; --grund-tief:#0A0A0C; --karte:#1C1C1E; --karte-hoch:#242428;
  --tinte:#F5F5F7; --tinte-leise:#98989D; --haarlinie:#38383A;
  --fokus:#0A84FF; --fokus-leise:rgba(10,132,255,.14); --fokus-glut:rgba(10,132,255,.40);
  --schatten:0 30px 60px -30px rgba(0,0,0,.8);
  --geraet-kante:#3A3A3C; --hilea:#FF6B5E;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-padding-top:calc(var(--kopf-hoehe) + 12px);background:var(--grund)}
body{margin:0;min-height:100vh;background:var(--grund);color:var(--tinte);font-family:var(--sans);font-size:17px;line-height:1.5;
  -webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow-x:clip}
main{display:block;padding-top:var(--kopf-hoehe)}
img,video,canvas,svg{max-width:100%}
img,video{display:block;height:auto}
a{color:inherit}
h1,h2,h3,h4,p,figure,blockquote{margin:0}
h1,h2,h3,h4{font-weight:600}
button{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--fokus);outline-offset:3px}
::selection{background:var(--fokus-glut)}

.riese{font-size:var(--riese);line-height:1.02;letter-spacing:-.035em;font-weight:600;text-wrap:balance}
.gross{font-size:var(--gross);line-height:1.05;letter-spacing:-.03em;font-weight:600;text-wrap:balance}
.mittel{font-size:var(--mittel);line-height:1.15;letter-spacing:-.02em;font-weight:600;text-wrap:balance}
.fuehrung{font-size:var(--fuehrung);line-height:1.45;color:var(--tinte-leise);max-width:38ch;text-wrap:pretty}
.leise{color:var(--tinte-leise)}
.zentriert{text-align:center}
.zentriert .fuehrung,.zentriert.fuehrung{margin-inline:auto}

.etikett{font:500 .72rem/1.2 var(--mono);letter-spacing:.2em;text-transform:uppercase;color:var(--tinte-leise);margin:0}
.etikett + .riese,.etikett + .gross,.etikett + .mittel{margin-top:12px}
.riese + .fuehrung,.gross + .fuehrung,.mittel + .fuehrung{margin-top:16px}

.verweis{color:var(--fokus);text-decoration:none;font-weight:500}
.verweis:hover{text-decoration:underline;text-underline-offset:3px}
.verweis::after{content:" \2192"}

.knopf{display:inline-flex;align-items:center;justify-content:center;gap:.5em;padding:.85em 1.4em;border:0;border-radius:999px;
  font-weight:600;font-size:1rem;line-height:1.1;text-decoration:none;cursor:pointer;white-space:nowrap;
  transition:transform .2s var(--kurve),background-color .2s,box-shadow .2s}
.knopf:hover{transform:translateY(-2px)}
.knopf:active{transform:translateY(0) scale(.98)}
.knopf-voll{background:var(--tinte);color:var(--grund)}
.knopf-leer{background:transparent;color:var(--tinte);box-shadow:inset 0 0 0 1px var(--haarlinie)}
.knopf-leer:hover{box-shadow:inset 0 0 0 1px var(--tinte-leise)}
.knopf-klein{padding:.55em 1.05em;font-size:.875rem}
.knoepfe{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}
.zentriert .knoepfe,.knoepfe.zentriert{justify-content:center}

.abschnitt{width:var(--breite);margin-inline:auto;padding-block:clamp(80px,12vh,140px)}
.abschnitt.eng{padding-block:clamp(48px,7vh,80px)}

.tief{background:var(--karte)}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .tief{background:var(--grund-tief)}}
:root[data-theme="dark"] .tief{background:var(--grund-tief)}
.abschnitt > * + .raster,.abschnitt > * + .buehne-geraete{margin-top:clamp(32px,5vh,52px)}

.held{position:relative;margin-top:calc(-1 * var(--kopf-hoehe));padding:calc(var(--kopf-hoehe) + clamp(56px,12vh,140px)) 0 clamp(64px,11vh,130px);
  min-height:min(88svh,880px);display:grid;align-items:center}
.held-innen{width:var(--breite);margin-inline:auto}
.held .fuehrung{margin-top:18px}

.karte{position:relative;display:block;padding:clamp(22px,3vw,30px);border-radius:var(--rund);background:var(--karte);
  box-shadow:inset 0 0 0 1px var(--haarlinie);color:inherit;text-decoration:none}
.karte h3{font-size:1.35rem;letter-spacing:-.02em;line-height:1.2}
.karte p{color:var(--tinte-leise)}
.karte > * + *{margin-top:8px}
a.karte{transition:transform .35s var(--kurve),box-shadow .35s}
a.karte:hover{transform:translateY(-6px);box-shadow:inset 0 0 0 1px var(--fokus),0 30px 60px -30px var(--fokus-glut)}
.raster{display:grid;gap:16px;grid-template-columns:repeat(auto-fill,minmax(min(100%,var(--spalte,300px)),1fr))}

.handy{--handy:clamp(210px,24vw,300px);position:relative;flex:none;width:var(--handy);padding:calc(var(--handy) * .032);
  border-radius:calc(var(--handy) * .165);background:var(--geraet);
  box-shadow:0 0 0 1px var(--geraet-kante),inset 0 0 0 1.5px #2C2C30,var(--schatten)}
.handy .scheibe{position:relative;aspect-ratio:780/1688;border-radius:calc(var(--handy) * .133);overflow:hidden;background:#111;isolation:isolate}
.handy .scheibe > img,.handy .scheibe > video,.handy .scheibe > img.video-ersatz{width:100%;height:100%;object-fit:cover;object-position:50% calc(var(--lauf,0) * 100%)}
.handy::after{content:"";position:absolute;z-index:2;top:calc(var(--handy) * .058);left:50%;width:calc(var(--handy) * .27);height:calc(var(--handy) * .078);
  transform:translateX(-50%);border-radius:999px;background:#000;pointer-events:none}
.handy.ohne-insel::after{content:none}

.handy.lang .scheibe > img{object-position:50% calc(var(--lauf,0) * 100%)}

.breit{position:relative;width:100%;max-width:var(--breit,760px);border-radius:16px;overflow:hidden;background:var(--geraet);
  box-shadow:0 0 0 1px var(--geraet-kante),var(--schatten)}
.breit > img,.breit > video,.breit .scheibe > img,.breit .scheibe > video{width:100%;height:auto;aspect-ratio:var(--format,1400/904);object-fit:cover}
.breit .scheibe{position:relative}
.breit.fenster{padding-top:30px}
.breit.fenster::before{content:"";position:absolute;top:11px;left:14px;width:8px;height:8px;border-radius:50%;background:#48484A;box-shadow:14px 0 0 #48484A,28px 0 0 #48484A}

.geraet-unterschrift{margin-top:16px;font-size:.95rem;text-align:center}
.geraet-unterschrift b{display:block;font-weight:600}
.geraet-unterschrift span{color:var(--tinte-leise);font-size:.85rem}
.buehne-geraete{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:clamp(24px,5vw,64px)}

.video-schalter{position:absolute;z-index:3;right:calc(var(--handy,60px) * .07);bottom:calc(var(--handy,60px) * .07);width:34px;height:34px;padding:0;border:0;border-radius:50%;
  display:grid;place-items:center;cursor:pointer;color:#fff;background:rgba(0,0,0,.52);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);
  opacity:0;transition:opacity .25s}
.breit .video-schalter{right:12px;bottom:12px}
.video-schalter svg{width:14px;height:14px}
.video-schalter .i-start{display:none}
.video-schalter[data-zustand="pause"] .i-start{display:block}
.video-schalter[data-zustand="pause"] .i-pause{display:none}
.handy:hover .video-schalter,.breit:hover .video-schalter,.video-schalter:focus-visible,.video-schalter[data-zustand="pause"]{opacity:1}
@media (hover:none){.video-schalter{opacity:.85}}

@media (prefers-reduced-motion:no-preference){
  .bereit .auf{opacity:0;transform:translateY(28px);transition:opacity .8s ease,transform .8s var(--kurve);transition-delay:calc(var(--verzug,0) * 90ms)}
  .bereit .auf.da{opacity:1;transform:none}
}

.pixelgrund{position:relative;isolation:isolate}
.pixelgrund-leinwand{position:absolute;inset:0;z-index:-1;display:block;width:100%;height:100%;max-width:none;pointer-events:none;
  -webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 96px,#000 58%,transparent 100%);
          mask-image:linear-gradient(to bottom,transparent 0,#000 96px,#000 58%,transparent 100%)}
@media (max-width:760px){
  .pixelgrund > .pixelgrund-leinwand{
    -webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 90px,#000 22%,rgba(0,0,0,.25) 42%,rgba(0,0,0,.1) 70%,transparent 100%);
            mask-image:linear-gradient(to bottom,transparent 0,#000 90px,#000 22%,rgba(0,0,0,.25) 42%,rgba(0,0,0,.1) 70%,transparent 100%)}
}
@media (min-width:761px){
  .pixelgrund.frei-links > .pixelgrund-leinwand{
    -webkit-mask-image:linear-gradient(to right,transparent 0%,rgba(0,0,0,.35) 26%,rgba(0,0,0,.9) 52%,#000 70%),linear-gradient(to bottom,transparent 0,#000 96px,#000 70%,transparent 100%);
            mask-image:linear-gradient(to right,transparent 0%,rgba(0,0,0,.35) 26%,rgba(0,0,0,.9) 52%,#000 70%),linear-gradient(to bottom,transparent 0,#000 96px,#000 70%,transparent 100%);
    -webkit-mask-composite:source-in;mask-composite:intersect}
}

.pixelgrund.frei-mitte > .pixelgrund-leinwand{
  -webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 96px,#000 70%,transparent 100%);
          mask-image:linear-gradient(to bottom,transparent 0,#000 96px,#000 70%,transparent 100%)}

#kopf{position:fixed;inset:0 0 auto;z-index:50;height:var(--kopf-hoehe)}
.sprung{position:absolute;left:12px;top:10px;z-index:9;padding:8px 14px;border-radius:999px;background:var(--tinte);color:var(--grund);
  font-size:.875rem;font-weight:600;text-decoration:none;transform:translateY(-200%)}
.sprung:focus{transform:none}
.kopf-grund{position:absolute;inset:0;z-index:1;background:color-mix(in srgb,var(--grund) 76%,transparent);
  -webkit-backdrop-filter:saturate(180%) blur(20px);backdrop-filter:saturate(180%) blur(20px);
  box-shadow:0 1px 0 0 transparent;transition:box-shadow .3s,background-color .25s}
#kopf.gescrollt .kopf-grund{box-shadow:0 1px 0 0 var(--haarlinie)}
#kopf.ausgeklappt .kopf-grund,#kopf.tafel-offen .kopf-grund{background:var(--grund)}
.kopf-leiste{position:relative;z-index:4;height:100%;width:var(--breite);margin-inline:auto;display:flex;align-items:center;gap:20px}

.marke{flex:none;display:inline-flex;align-items:center;gap:9px;color:var(--tinte);text-decoration:none;font-weight:600;font-size:1.02rem;letter-spacing:-.01em;border-radius:8px}
.marke svg{width:22px;height:22px;flex:none}
.marke .ai{font-family:var(--mono);font-weight:400;letter-spacing:0}

.kopf-nav{flex:1;display:flex;justify-content:center;min-width:0}
.kopf-nav > ul{list-style:none;margin:0;padding:0;display:flex;align-items:center;gap:2px}
.nav-punkt{display:inline-flex;align-items:center;gap:6px;height:34px;padding:0 11px;border:0;border-radius:999px;background:none;cursor:pointer;
  font-size:.875rem;font-weight:400;color:var(--tinte-leise);text-decoration:none;white-space:nowrap;transition:color .2s,background-color .2s}
.nav-punkt:hover,.nav-punkt[aria-expanded="true"],.nav-punkt.aktiv,.nav-punkt[aria-current="page"]{color:var(--tinte)}
.nav-punkt.aktiv,.nav-punkt[aria-current="page"]{font-weight:500}
.nav-punkt .pfeil{width:10px;height:10px;transition:transform .3s var(--kurve)}
.nav-punkt[aria-expanded="true"] .pfeil{transform:rotate(180deg)}
.nav-hilea{color:var(--tinte);font-weight:600;background:var(--karte);box-shadow:inset 0 0 0 1px var(--haarlinie);margin-inline:4px}
.nav-hilea:hover,.nav-hilea[aria-expanded="true"]{box-shadow:inset 0 0 0 1px var(--tinte-leise)}
.hilea-h{width:14px;height:14px;flex:none;color:var(--hilea)}

.kopf-rechts{flex:none;margin-left:auto;display:flex;align-items:center;gap:10px}
.thema-knopf{width:34px;height:34px;padding:0;border:0;border-radius:50%;display:grid;place-items:center;cursor:pointer;background:none;color:var(--tinte-leise);
  box-shadow:inset 0 0 0 1px var(--haarlinie);transition:color .2s,box-shadow .2s}
.thema-knopf:hover{color:var(--tinte);box-shadow:inset 0 0 0 1px var(--tinte-leise)}
.thema-knopf svg{width:16px;height:16px;display:none}
.thema-knopf[data-wert="auto"] .i-auto,.thema-knopf[data-wert="light"] .i-hell,.thema-knopf[data-wert="dark"] .i-dunkel{display:block}

.burger{display:none;width:44px;height:44px;margin-right:-10px;padding:0;border:0;border-radius:50%;background:none;cursor:pointer;position:relative;color:var(--tinte)}
.burger span{position:absolute;left:13px;width:18px;height:1.5px;border-radius:1px;background:currentColor;transition:transform .35s var(--kurve)}
.burger span:first-child{top:18px}
.burger span:last-child{top:24.5px}
.burger[aria-expanded="true"] span:first-child{transform:translateY(3.25px) rotate(45deg)}
.burger[aria-expanded="true"] span:last-child{transform:translateY(-3.25px) rotate(-45deg)}

.ausklapp{position:absolute;z-index:3;left:0;right:0;top:100%;background:var(--grund);
  box-shadow:0 1px 0 0 var(--haarlinie),0 40px 60px -40px rgba(0,0,0,.25);
  visibility:hidden;clip-path:inset(0 0 100% 0);transition:clip-path .36s var(--kurve),visibility 0s linear .36s}
.ausklapp.offen{visibility:visible;clip-path:inset(0 0 -80px 0);transition:clip-path .42s var(--kurve),visibility 0s}
.ausklapp-innen{width:var(--breite);margin-inline:auto;padding:30px 0 44px;opacity:0;transform:translateY(-8px);transition:opacity .2s,transform .3s var(--kurve)}
.ausklapp.offen .ausklapp-innen{opacity:1;transform:none;transition:opacity .35s .08s,transform .45s .08s var(--kurve)}

.aus-bereiche{list-style:none;margin:16px -16px 0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.aus-bereiche a{display:grid;grid-template-columns:44px 1fr;column-gap:14px;align-items:center;padding:14px 16px;border-radius:16px;text-decoration:none;transition:background-color .2s}
.aus-bereiche a:hover,.aus-bereiche a[aria-current="page"]{background:var(--karte);box-shadow:inset 0 0 0 1px var(--haarlinie)}
.aus-bereiche .mini-h{grid-row:span 2;width:44px;height:44px}
.aus-bereiche b{font-size:1.12rem;letter-spacing:-.015em}
.aus-bereiche span{font-size:.85rem;color:var(--tinte-leise);line-height:1.35}

.mini-h .rest{stroke:var(--haarlinie)}
.mini-h .dies{stroke:var(--fokus)}

.aus-hilea{display:grid;grid-template-columns:minmax(220px,1fr) 2.6fr;gap:40px;align-items:start}
.hilea-zeichen{display:inline-flex;align-items:center;gap:9px;font-size:1.5rem;font-weight:600;letter-spacing:-.02em;text-decoration:none;color:var(--tinte)}
.hilea-zeichen .hilea-h{width:22px;height:22px}
.aus-hilea-satz{margin-top:10px;color:var(--tinte-leise);font-size:.92rem;line-height:1.45}
.aus-hilea .verweis{display:inline-block;margin-top:14px;font-size:.92rem}
.aus-apps{list-style:none;margin:-12px -6px 0 0;padding:0;display:grid;grid-template-columns:repeat(5,1fr);gap:6px}
.aus-apps a{display:grid;justify-items:center;gap:8px;padding:12px 6px;border-radius:16px;text-decoration:none;font-size:.85rem;text-align:center;transition:background-color .2s}
.aus-apps a:hover,.aus-apps a[aria-current="page"]{background:var(--karte);box-shadow:inset 0 0 0 1px var(--haarlinie)}
.aus-apps img{width:48px;height:48px;border-radius:22.4%;box-shadow:0 6px 16px -8px rgba(0,0,0,.45);transition:transform .3s var(--kurve)}
.aus-apps a:hover img{transform:translateY(-3px)}

.schleier{position:fixed;inset:var(--kopf-hoehe) 0 0;z-index:0;background:color-mix(in srgb,var(--grund) 40%,transparent);
  -webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);opacity:0;visibility:hidden;transition:opacity .3s,visibility 0s linear .3s}
#kopf.ausgeklappt .schleier{opacity:1;visibility:visible;transition:opacity .3s,visibility 0s}

.tafel{position:fixed;z-index:2;inset:var(--kopf-hoehe) 0 0;background:var(--grund);overflow-y:auto;overscroll-behavior:contain;
  visibility:hidden;opacity:0;transition:opacity .25s,visibility 0s linear .25s}
.tafel.offen{visibility:visible;opacity:1;transition:opacity .25s,visibility 0s}
.tafel-innen{width:var(--breite);margin-inline:auto;padding:14px 0 calc(48px + env(safe-area-inset-bottom))}
.tafel-innen > *{transition:opacity .4s,transform .5s var(--kurve);transition-delay:calc(var(--i,0) * 45ms)}
.tafel:not(.offen) .tafel-innen > *{opacity:0;transform:translateY(-10px)}
.tafel .etikett{margin:10px 0 10px}
.tafel-bereiche{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:8px}
.tafel-bereiche a{display:flex;align-items:center;gap:10px;min-height:52px;padding:10px 12px;border-radius:14px;background:var(--karte);
  box-shadow:inset 0 0 0 1px var(--haarlinie);text-decoration:none;font-weight:600;font-size:.95rem;letter-spacing:-.01em}
.tafel-bereiche .mini-h{width:24px;height:24px;flex:none}
.tafel-bereiche a[aria-current="page"]{box-shadow:inset 0 0 0 1.5px var(--fokus)}
.tafel-hilea{margin-top:22px}
.tafel-hilea-kopf{display:flex;align-items:center;justify-content:space-between;gap:12px}
.tafel-hilea-kopf .hilea-zeichen{font-size:1.25rem}
.tafel-hilea-kopf .hilea-zeichen .hilea-h{width:18px;height:18px}
.tafel-hilea-kopf .etikett{margin:0}
.tafel-apps{list-style:none;margin:12px -18px 0;padding:4px 18px 10px;display:flex;gap:10px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding-inline:18px;
  scrollbar-width:none;-webkit-overflow-scrolling:touch}
.tafel-apps::-webkit-scrollbar{display:none}
.tafel-apps li{flex:none;scroll-snap-align:start}
.tafel-apps a{display:grid;justify-items:center;gap:7px;width:74px;text-decoration:none;font-size:.72rem;color:var(--tinte-leise);text-align:center}
.tafel-apps a span{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tafel-apps img{width:58px;height:58px;border-radius:22.4%;box-shadow:0 8px 18px -10px rgba(0,0,0,.5)}
.tafel-apps a[aria-current="page"] span{color:var(--tinte);font-weight:600}
.tafel-gross{list-style:none;margin:18px 0 0;padding:0;border-top:1px solid var(--haarlinie)}
.tafel-gross a{display:flex;align-items:center;justify-content:space-between;padding:13px 0;border-bottom:1px solid var(--haarlinie);
  font-size:1.45rem;font-weight:600;letter-spacing:-.02em;text-decoration:none}
.tafel-gross a::after{content:"\203A";color:var(--tinte-leise);font-weight:400}
.tafel-gross a[aria-current="page"]{color:var(--fokus)}
.tafel-kontakt{display:flex;width:100%;margin-top:22px}
.tafel-fuss{margin-top:26px;display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;color:var(--tinte-leise);font-size:.85rem}

.thema-wahl{display:inline-grid;grid-auto-flow:column;gap:2px;padding:3px;border-radius:999px;background:var(--grund-tief);box-shadow:inset 0 0 0 1px var(--haarlinie)}
.thema-wahl button{border:0;background:none;padding:7px 13px;border-radius:999px;font-size:.82rem;color:var(--tinte-leise);cursor:pointer}
.thema-wahl button[aria-pressed="true"]{background:var(--karte-hoch);color:var(--tinte);box-shadow:0 1px 3px rgba(0,0,0,.14),inset 0 0 0 1px var(--haarlinie)}

html.menue-offen,html.menue-offen body{overflow:hidden}

@media (max-width:999.98px){
  .kopf-nav,.thema-knopf,.ausklapp,.schleier{display:none}
  .burger{display:inline-block}
  .kopf-rechts{gap:8px}
}
@media (min-width:1000px){
  .tafel{display:none}
}
@media (min-width:1000px) and (max-width:1119.98px){
  .kopf-leiste{gap:12px}
  .nav-punkt{padding:0 8px}
}

#fuss{border-top:1px solid var(--haarlinie);background:var(--grund);color:var(--tinte-leise);font-size:.82rem;line-height:1.5}
.fuss-innen{width:var(--breite);margin-inline:auto;padding:44px 0 92px}
.fuss-spalten{display:grid;grid-template-columns:1fr 2fr 1fr;gap:32px 28px}
.fuss-titel{margin:0 0 12px;color:var(--tinte);font-weight:600;font-size:.82rem}
.fuss-spalten ul{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.fuss-hilea ul{grid-template-columns:1fr 1fr;grid-template-rows:repeat(6,auto);grid-auto-flow:column;column-gap:24px}
#fuss a{text-decoration:none;border-radius:4px}
#fuss a:hover{color:var(--tinte);text-decoration:underline;text-underline-offset:3px}
#fuss a[aria-current="page"]{color:var(--tinte)}
.fuss-zeile{margin-top:36px;padding-top:18px;border-top:1px solid var(--haarlinie);display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:10px 24px}
.fuss-firma{display:inline-flex;align-items:center;gap:8px}
.fuss-firma svg{width:14px;height:14px;color:var(--tinte)}
.fuss-recht{display:flex;gap:18px}
@media (max-width:760px){
  .fuss-spalten{grid-template-columns:1fr 1fr}
  .fuss-hilea{grid-column:1 / -1;order:3}
}

.kopf-statisch{position:relative;z-index:4;height:100%;display:flex;align-items:center;justify-content:space-between;gap:16px;
  padding-inline:max(18px,calc((100% - 1180px) / 2));background:var(--grund);box-shadow:0 1px 0 0 var(--haarlinie)}
.kopf-statisch .kopf-menue{display:inline-flex;align-items:center;min-height:44px;padding:0 4px;color:var(--tinte);font-size:.95rem;font-weight:500;text-decoration:none}
.fuss-statisch ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:10px 20px}
.fuss-statisch .fuss-titel{margin-top:22px}
.fuss-statisch .fuss-titel:first-child{margin-top:0}




@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{scroll-behavior:auto!important}
  .knopf,.knopf:hover,a.karte,a.karte:hover{transition:none;transform:none}
  .ausklapp,.ausklapp-innen,.tafel,.tafel-innen > *,.schleier,.burger span,.nav-punkt .pfeil{transition:none!important}
}

.rechtstext-spalte{width:var(--breite);margin-inline:auto}
.rechtstext-spalte > *{max-width:68ch}
.rechtstext-kopf{margin-top:calc(-1 * var(--kopf-hoehe));padding:calc(var(--kopf-hoehe) + clamp(48px,9vh,104px)) 0 clamp(28px,5vh,48px)}
.rechtstext-kopf > .pixelgrund-leinwand{opacity:.75}
.rechtstext-kopf .etikett a{color:inherit;text-decoration:none;border-radius:3px}
.rechtstext-kopf .etikett a:hover{color:var(--tinte);text-decoration:underline;text-underline-offset:3px}
.rechtstext-kopf .fuehrung{margin-top:20px;max-width:44rem}
.rechtstext-kopf h1 + p:not(.fuehrung),.rechtstext-kopf .fuehrung + p{margin-top:16px;color:var(--tinte-leise);font-size:1rem;line-height:1.6}
.rechtstext{padding:0 0 clamp(72px,12vh,128px);overflow-wrap:break-word}
.rechtstext-bloecke > *{padding-block:clamp(24px,3.6vh,34px);border-top:1px solid var(--haarlinie)}
.rechtstext h2{font-size:clamp(1.14rem,1.5vw,1.28rem);line-height:1.3;letter-spacing:-.012em;color:var(--tinte)}
.rechtstext h2 + *{margin-top:12px}
.rechtstext p,.rechtstext li,.rechtstext dd{font-size:1.0625rem;line-height:1.65;color:var(--tinte)}
.rechtstext p + p,.rechtstext p + ul,.rechtstext ul + p{margin-top:.9em}
.rechtstext ul{margin:.9em 0 0;padding-left:1.25em}
.rechtstext li{padding-left:.2em}
.rechtstext li + li{margin-top:.55em}
.rechtstext li::marker{color:var(--tinte-leise)}
.rechtstext li > span{display:block}
.rechtstext li > span + span{margin-top:.55em}
.rechtstext strong,.rechtstext b{font-weight:600;color:var(--tinte)}
.rechtstext a{color:var(--fokus);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.2em;
  text-decoration-color:color-mix(in srgb,var(--fokus) 45%,transparent);border-radius:3px}
.rechtstext a:hover{text-decoration-color:currentColor}
.rechtstext a[href^="tel:"]{color:inherit;text-decoration-color:var(--haarlinie)}
.rechtstext a:focus-visible,.rechtstext-kopf a:focus-visible{outline:2px solid var(--fokus);outline-offset:2px}
.rechtstext .kennliste{margin:14px 0 0;border-top:1px solid var(--haarlinie)}
.rechtstext .kennzeile{display:grid;grid-template-columns:minmax(0,11rem) minmax(0,1fr);gap:2px 24px;padding:12px 0;border-bottom:1px solid var(--haarlinie)}
.rechtstext dt{color:var(--tinte-leise);font-size:.94rem;line-height:1.75}
.rechtstext dd{margin:0}
@media (max-width:560px){.rechtstext .kennzeile{grid-template-columns:minmax(0,1fr)}}

@media (max-width:760px){.rechtstext p,.rechtstext li{-webkit-hyphens:auto;hyphens:auto;hyphenate-limit-chars:12 5 5}}

@media (min-width:761px){
  .rechtstext-kopf.pixelgrund.frei-links > .pixelgrund-leinwand{
    -webkit-mask-image:linear-gradient(to right,transparent 0%,transparent 46%,rgba(0,0,0,.5) 62%,#000 82%),linear-gradient(to bottom,transparent 0,#000 96px,#000 64%,transparent 100%);
            mask-image:linear-gradient(to right,transparent 0%,transparent 46%,rgba(0,0,0,.5) 62%,#000 82%),linear-gradient(to bottom,transparent 0,#000 96px,#000 64%,transparent 100%);
    -webkit-mask-composite:source-in;mask-composite:intersect}
}
@media print{
  :root:has(main.rechtsseite){color-scheme:light;--grund:#fff;--karte:#fff;--tinte:#000;--tinte-leise:#444;--haarlinie:#bbb;--fokus:#000}
  :root:has(main.rechtsseite) #kopf,:root:has(main.rechtsseite) #fuss,.rechtstext-kopf > .pixelgrund-leinwand{display:none!important}
  main.rechtsseite{padding-top:0}
  .rechtstext-kopf{margin-top:0;padding:0 0 12pt}
  .rechtstext-spalte{width:auto}
  .rechtstext-spalte > *{max-width:none}
  .rechtstext h2{break-after:avoid}
}
