@font-face{font-family:Barlow;src:url(../gemeinsam/schriften/barlow-condensed-latin-600-normal.woff2) format("woff2");font-weight:600;font-display:swap}
@font-face{font-family:Barlow;src:url(../gemeinsam/schriften/barlow-condensed-latin-700-normal.woff2) format("woff2");font-weight:700;font-display:swap}
@font-face{font-family:SSerif;src:url(../gemeinsam/schriften/source-serif-4-latin-wght-normal.woff2) format("woff2");font-weight:200 900;font-display:swap}
:root{
  --cw-canvas:#EFE5CC;--cw-surface:#1C4D37;--cw-ink:#15382A;--cw-ink-soft:#35523F;--cw-accent:#C22F63;--cw-accent-ink:#fff;
  --cw-font-display:Barlow,"Arial Narrow",sans-serif;--cw-font-text:SSerif,Georgia,serif;
  --abwaerts-schrift:SSerif,Georgia,serif;--abwaerts-unten:18px;--gruen:#1C4D37;--creme:#FBF3DF;--pink:#B8255A;--rand:clamp(20px,5vw,84px);--maxb:1320px;
  --af-grund:#F6EEDC;--af-tinte:#15382A;--af-weich:#35523F;--af-akzent:#1C4D37;--af-akzent-tinte:#FBF3DF;--af-rand:#6F8574;--af-schrift:SSerif,Georgia,serif;--af-titel:700 2.3rem/1 Barlow,sans-serif;
}
html{background:#23180F}
body{background:#23180F;color:var(--cw-ink);font-size:clamp(1.1875rem,1.05rem + .35vw,1.375rem);line-height:1.5;overflow-x:clip}
::selection{background:var(--gruen);color:var(--creme)}
:focus-visible{outline:3px solid var(--pink);outline-offset:3px}
h1,h2,h3{font-family:Barlow,"Arial Narrow",sans-serif;font-weight:700;text-transform:uppercase;letter-spacing:.003em;margin:0;text-wrap:balance}
p{margin:0;text-wrap:pretty}
.sprung{position:fixed;left:12px;top:-80px;z-index:60;padding:.7em 1em;background:var(--creme);color:inherit}
.sprung:focus{top:12px}
.knopf{display:inline-flex;align-items:center;justify-content:center;min-height:54px;padding:.2em 1.2em;background:var(--creme);color:var(--gruen);font:700 1.45rem/1 Barlow,sans-serif;letter-spacing:.02em;text-transform:uppercase;text-decoration:none;white-space:nowrap;cursor:pointer;border:0;transition:transform .13s cubic-bezier(.23,1,.32,1),background-color .15s}
.knopf:hover{background:#fff}
.knopf:active{transform:scale(.97)}

/* Tisch und Plan */
main{display:block;overflow-x:clip}
.startblatt,.runde__buehne{position:relative;height:100svh;min-height:540px;background:#23180F;overflow:clip;contain:paint}
.tisch{position:absolute;inset:0;background:url(../gemeinsam/bilder/runde-tisch.webp) center/cover}
.welt{position:absolute;left:0;top:0;transform-origin:0 0;will-change:transform}
.blatt{position:absolute;inset:0;perspective:2600px;transform-style:preserve-3d}
.falz{position:absolute;width:50%;height:50%;background-image:url(plan.webp);background-size:200% 200%;box-shadow:0 18px 34px -14px rgba(15,8,2,.65);backface-visibility:hidden;will-change:transform}
.falz--ol{left:0;top:0;background-position:0 0;z-index:1}
.falz--or{left:50%;top:0;background-position:100% 0;transform-origin:0 50%;z-index:3}
.falz--ul{left:0;top:50%;background-position:0 100%;transform-origin:50% 0;z-index:2}
.falz--ur{left:50%;top:50%;background-position:100% 100%;transform-origin:0 0;z-index:4}
@media(max-width:860px){.falz{background-image:url(plan-m.webp)}}
.route{position:absolute;inset:0;width:100%;height:100%;z-index:6;overflow:visible}
#linie{fill:none;stroke:var(--pink);stroke-width:9;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:.5 17}
.halt{fill:#fff;stroke:var(--pink);stroke-width:7}
.halt--start{fill:var(--pink);stroke:#fff}
#auto{filter:drop-shadow(0 3px 2px rgba(20,10,0,.55))}

.deckblatt{position:absolute;z-index:8;left:50%;top:50%;translate:-50% -50%;width:min(92vw,720px);max-height:calc(100svh - 24px);padding:clamp(20px,3vw,44px);background:var(--gruen);color:var(--creme);outline:1.5px solid rgba(251,243,223,.6);outline-offset:-10px;box-shadow:0 34px 60px -24px rgba(10,5,0,.85)}
.deckblatt__logo{width:clamp(128px,14vw,190px);height:auto;display:block}
.deckblatt h1{font-size:min(clamp(2.8rem,6vw,5.6rem),11.4svh);line-height:.98;margin-top:.22em}
.deckblatt p{margin-top:.7em;color:#E9E9D4}
.deckblatt__knoepfe{display:flex;flex-wrap:wrap;align-items:center;gap:.7em 1.2em;margin-top:.9em}
.deckblatt__tel{color:var(--creme);font:700 1.7rem/1 Barlow,sans-serif;letter-spacing:.02em;text-decoration:none;white-space:nowrap}
.alle{position:absolute;z-index:9;top:clamp(14px,2.6vh,28px);right:clamp(14px,2.6vw,40px);display:inline-flex;align-items:center;min-height:44px;padding:0 1em;background:rgba(251,243,223,.92);color:var(--gruen);font:700 1.125rem/1 Barlow,sans-serif;letter-spacing:.03em;text-transform:uppercase;text-decoration:none}

/* Fenster an den Halten */
.fenster{position:absolute;z-index:7;left:clamp(16px,4.6vw,76px);top:50%;width:min(42vw,560px);translate:0 -50%;display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(12px,1.5vw,22px);align-items:center;padding:clamp(10px,1.1vw,16px);background:#F8F0DC;box-shadow:0 26px 44px -20px rgba(15,8,2,.8);outline:1.5px solid rgba(28,77,55,.55);outline-offset:-6px;opacity:0;visibility:hidden;transform:translateY(16px) scale(.97);transition:opacity .22s,transform .3s cubic-bezier(.23,1,.32,1),visibility 0s .22s}
.fenster.offen{opacity:1;visibility:visible;transform:none;transition:opacity .22s,transform .3s cubic-bezier(.23,1,.32,1)}
.fenster figure{margin:0}
.fenster img{display:block;width:100%;height:auto;aspect-ratio:4/5;object-fit:cover}
.fenster h2{font-size:clamp(2rem,3.1vw,3.1rem);line-height:.98}
.fenster p{margin-top:.35em;color:var(--cw-ink-soft);line-height:1.34;font-size:1.0625rem}
.fenster--text h2{font-size:clamp(1.7rem,2.5vw,2.45rem)}
.merken{display:inline-flex;align-items:center;gap:.5em;min-height:44px;margin-top:.5em;padding:0 .8em 0 .5em;border:2px solid var(--gruen);background:none;color:var(--gruen);font:700 1.15rem/1 Barlow,sans-serif;letter-spacing:.02em;text-transform:uppercase;cursor:pointer;transition:background-color .15s,color .15s}
.merken:hover{background:rgba(28,77,55,.12)}
.merken__punkt{width:16px;height:16px;border-radius:50%;border:2px solid currentColor}
.merken[aria-pressed=true]{background:var(--gruen);color:var(--creme)}
.merken[aria-pressed=true] .merken__punkt{background:var(--creme)}
.beispiel{position:absolute;z-index:7;left:clamp(16px,4.6vw,76px);top:clamp(14px,2.6vh,28px);max-width:min(58vw,700px);padding:.5em .8em;background:rgba(248,240,220,.95);font-size:1rem;line-height:1.3;opacity:0;transition:opacity .25s}
.beispiel.sichtbar{opacity:1}
.halte-leiste{position:absolute;z-index:7;left:clamp(16px,4.6vw,76px);top:calc(clamp(14px,2.6vh,28px) + 62px);display:flex;gap:6px;opacity:0;visibility:hidden;transition:opacity .25s}
.halte-leiste.sichtbar{opacity:1;visibility:visible}
.halte-leiste button{min-height:44px;padding:0 .9em;border:1.5px solid var(--gruen);background:rgba(248,240,220,.96);color:var(--gruen);font:700 1.15rem/1 Barlow,sans-serif;letter-spacing:.03em;text-transform:uppercase;cursor:pointer}
.halte-leiste button:hover{background:#fff}

/* Legende als Menü */
.legende{position:fixed;z-index:30;transition:opacity .2s;right:clamp(14px,2.6vw,40px);bottom:clamp(14px,2.6vw,36px);width:236px;padding:12px 14px 14px;background:rgba(248,240,220,.97);border:1.5px solid #6d6a55;box-shadow:0 18px 30px -16px rgba(15,8,2,.7);color:var(--cw-ink)}
.legende b{font:700 1.2rem/1 Barlow,sans-serif;letter-spacing:.05em;text-transform:uppercase}
.legende ul{list-style:none;padding:0;margin:6px 0 8px}
.legende li a{display:flex;align-items:center;gap:.6em;min-height:36px;color:inherit;font-size:1rem;text-decoration:none}
.legende li a:hover{text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:3px}
.z{flex:none;width:30px;height:3px;background:var(--gruen)}
.z--0{height:0;background:none;border-top:4px dotted var(--pink)}
.z--1{height:6px;background:#D2AC58;outline:1px solid #7A5A18}
.z--2{height:0;background:none;border-top:3px dashed #3A3A32}
.z--3{width:14px;height:14px;margin-inline:8px;border-radius:50%;background:var(--pink);outline:2px solid #fff;outline-offset:-4px}
.z--4{height:12px;background:#9DB893}
.legende__tel{display:block;color:inherit;font:700 1.55rem/1.1 Barlow,sans-serif;letter-spacing:.02em;text-decoration:none;font-variant-numeric:tabular-nums}
.legende__melden{width:100%;min-height:46px;margin-top:6px;font-size:1.25rem;background:var(--gruen);color:var(--creme)}
.legende__melden:hover{background:#25634A}
.auf-deckblatt .legende{opacity:0;visibility:hidden}
.legende__inhalt{display:none}
@media(min-width:861px){
  .nach-plan .legende{left:0;right:0;bottom:0;width:auto;display:flex;align-items:center;justify-content:flex-end;gap:1.1em;padding:9px max(var(--rand),calc((100% - 1560px)/2));border:0;border-top:1.5px solid #6d6a55}
  .nach-plan .legende b,.nach-plan .legende ul{display:none}
  .nach-plan .legende__inhalt{display:inline-flex;align-items:center;min-height:46px;margin-right:auto;padding:0 1em;border:2px solid var(--gruen);background:none;color:var(--gruen);font:700 1.25rem/1 Barlow,sans-serif;letter-spacing:.03em;text-transform:uppercase;cursor:pointer}
  .nach-plan .legende__melden{width:auto;margin:0;padding:0 1.2em}
  .menue{left:auto;right:0;width:min(440px,100vw);bottom:0}
}
.handyleiste{display:none}
.menue{position:fixed;inset:auto 0 0 0;width:100%;max-width:none;margin:0;border:0;padding:22px 20px;background:#F8F0DC;color:var(--cw-ink)}
.menue::backdrop{background:rgba(30,20,8,.65)}
.menue ul{list-style:none;padding:0;margin:0 0 12px}
.menue li{border-bottom:1.5px solid rgba(28,77,55,.45)}
.menue li a{display:flex;align-items:center;min-height:66px;color:inherit;font:700 1.9rem/1 Barlow,sans-serif;text-transform:uppercase;text-decoration:none}
.menue .knopf{margin-top:12px;width:100%;background:var(--gruen);color:var(--creme)}
.menue .nummer{color:var(--gruen)}
.menue__zu{position:absolute;right:12px;top:12px;width:48px;height:48px;border:0;background:none;color:inherit;font-size:2rem;cursor:pointer}

/* Papier-Abschnitte */
.papier{background:#EFE5CC url(papier.webp) center/1672px;color:var(--cw-ink)}
.beiblatt{padding:clamp(4rem,9vh,8rem) 0}
.beiblatt__raster{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(1.4rem,3vw,2.6rem) clamp(14px,2vw,28px);max-width:var(--maxb);margin:auto;padding-inline:var(--rand)}
.beiblatt__bild{margin:0}
.beiblatt__bild img{display:block;width:100%;height:auto;box-shadow:0 18px 30px -18px rgba(40,25,5,.7)}
.beiblatt__bild figcaption{margin-top:.25em;font:700 clamp(1.9rem,3vw,2.8rem)/1 Barlow,sans-serif;text-transform:uppercase}
.beiblatt__text{grid-column:1/3}
.beiblatt__text p{max-width:34em}
.beiblatt h2{font-size:clamp(3.2rem,6.4vw,6.4rem);line-height:.94}
.beiblatt p{margin-top:.7em;color:var(--cw-ink-soft)}
.grade-zeile{display:flex;flex-wrap:wrap;align-items:center;gap:.5em .8em;margin-top:.9em;font:700 1.45rem/1 Barlow,sans-serif;text-transform:uppercase;letter-spacing:.02em}
.grade{list-style:none;display:flex;gap:7px;margin:0;padding:0}
.grade li{display:grid;place-items:center;width:46px;height:46px;background:var(--gruen);color:var(--creme);font:700 1.45rem/1 Barlow,sans-serif}

.still__buehne{min-height:78svh;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:3rem var(--rand);background:#14291F;color:var(--creme)}
.still h2{font-size:clamp(2.6rem,5.2vw,5.2rem);line-height:1;max-width:15em}
.still p{margin-top:.8em;color:#D8DDC8;max-width:30em}

.stempel__buehne{position:relative;height:100svh;min-height:540px;background:#EFE5CC url(papier.webp) center/1672px;color:var(--cw-ink);overflow:clip;contain:paint}
.stempel__auftakt{pointer-events:none}
.stempel__marke{position:absolute;left:50%;top:48%;display:flex;flex-direction:column;align-items:center;padding:.1em .4em;border:clamp(7px,1vw,14px) solid #B8255A;border-radius:18px;color:#B8255A;font-family:Barlow,sans-serif;font-weight:700;text-transform:uppercase;-webkit-mask-image:url(stempel-maske.webp);mask-image:url(stempel-maske.webp);-webkit-mask-size:640px;mask-size:640px;opacity:0;mix-blend-mode:multiply;will-change:transform}
.s-gross{font-size:min(clamp(6rem,23vw,19rem),33svh);line-height:.9;letter-spacing:-.01em;white-space:nowrap}
.s-klein{font-size:min(clamp(1.8rem,5vw,4.2rem),8.5svh);line-height:1.05;letter-spacing:.04em}
.stempel__ring{position:absolute;left:50%;top:48%;width:min(84vw,1000px);aspect-ratio:1.5;border-radius:50%;background:radial-gradient(closest-side,rgba(60,35,10,.34),transparent);opacity:0;pointer-events:none}
.stempel__auftakt{position:absolute;left:0;right:0;top:44%;text-align:center;font:700 clamp(2.4rem,5vw,4.6rem)/1 Barlow,sans-serif;text-transform:uppercase;color:var(--cw-ink)}
.stempel__text{opacity:0;position:absolute;left:0;right:0;bottom:clamp(136px,17vh,160px);text-align:center;padding:0 var(--rand)}
.stempel h2{font-size:clamp(2.1rem,4.4vw,4.2rem);line-height:1}

.geldtext{padding:clamp(1rem,4vh,3rem) 0 clamp(4rem,9vh,8rem)}
.geldtext__raster{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:clamp(14px,2vw,28px);row-gap:1.3em;max-width:var(--maxb);margin:auto;padding-inline:var(--rand)}
.geldtext p{grid-column:span 6}
.geldtext__gross{grid-column:1/13!important;font:700 clamp(2.1rem,4vw,3.6rem)/1 Barlow,sans-serif;text-transform:uppercase}
.geldtext .klein{font-size:1.0625rem;color:var(--cw-ink-soft)}

.fragen{padding:clamp(2rem,6vh,5rem) 0 clamp(4rem,9vh,8rem)}
.fragen__raster{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:clamp(14px,2vw,28px);max-width:var(--maxb);margin:auto;padding-inline:var(--rand)}
.fragen h2{grid-column:1/6;font-size:clamp(2.6rem,4.6vw,4.7rem);line-height:.98}
.fragen__liste{grid-column:6/13}
.fragen details{border-top:1.5px solid rgba(28,77,55,.5)}
.fragen details:last-child{border-bottom:1.5px solid rgba(28,77,55,.5)}
.fragen summary{display:flex;justify-content:space-between;gap:1em;padding:.75em 0;min-height:56px;font-weight:650;cursor:pointer;list-style:none}
.fragen summary::-webkit-details-marker{display:none}
.fragen summary::after{content:"+";font:700 1.7em/1 Barlow,sans-serif;flex:none;transition:transform .2s}
.fragen details[open] summary::after{transform:rotate(45deg)}
.fragen details p{padding:0 0 1em;color:var(--cw-ink-soft);max-width:36em}

.schluss{position:relative;background:#23180F url(../gemeinsam/bilder/runde-tisch.webp) center/cover;padding:clamp(3rem,8vh,6rem) var(--rand) clamp(5rem,10vh,7rem)}
.schluss__tafel{position:relative;max-width:760px;margin:auto;padding:clamp(22px,3.4vw,50px);background:var(--gruen);color:var(--creme);outline:1.5px solid rgba(251,243,223,.6);outline-offset:-10px;box-shadow:0 34px 60px -24px rgba(10,5,0,.85)}
.schluss h2{font-size:clamp(3rem,6.6vw,5.8rem);line-height:.94}
.schluss__tafel>p{margin-top:.6em;color:#E9E9D4}
.stadtteile{border:0;margin:1.1em 0 0;padding:0}
.stadtteile legend{padding:0;font:700 1.55rem/1.1 Barlow,sans-serif;text-transform:uppercase;letter-spacing:.02em}
.stadtteile>div{display:flex;flex-wrap:wrap;gap:6px;margin-top:.45em}
.teil{position:relative;cursor:pointer}
.teil input{position:absolute;inset:0;opacity:0;width:100%;height:100%;margin:0;cursor:pointer}
.teil span{display:flex;align-items:center;min-height:46px;padding:0 .75em;border:1.5px solid rgba(251,243,223,.75);font-size:1.0625rem;transition:background-color .14s,color .14s}
.teil:hover span{background:rgba(251,243,223,.14)}
.teil input:checked+span{background:var(--creme);color:var(--gruen);font-weight:650}
.teil input:focus-visible+span{outline:3px solid var(--creme);outline-offset:2px}
#teil-antwort{margin-top:.5em;min-height:1.5em;color:#E9E9D4}
.zettel-zeile{font-style:italic}
.nummer{display:block;margin-top:.45em;color:var(--creme);font:700 clamp(3rem,7vw,5.2rem)/1 Barlow,sans-serif;letter-spacing:.01em;text-decoration:none;font-variant-numeric:tabular-nums;white-space:nowrap}
.nummer--zwei{font-size:clamp(1.6rem,3vw,2.2rem);margin-top:.15em}
.schluss__wege{display:flex;flex-wrap:wrap;align-items:center;gap:.7em 1.2em;margin-top:.9em}
.mail{color:var(--creme)}
.assistent{margin-top:1em;font-size:1rem}

.seitenfuss{background:#14291F;color:#D8DDC8;font-size:1rem;padding:1.4rem max(var(--rand),calc((100% - 1560px)/2)) 6rem}
.seitenfuss__zeile{display:flex;flex-wrap:wrap;gap:.5em 1.6em;justify-content:space-between}
.seitenfuss nav{display:flex;flex-wrap:wrap;gap:0 1.2em}
.seitenfuss a{color:var(--creme);display:inline-block;padding:.5em 0}
.seitenfuss p{margin-top:.6em;font-size:.9375rem}

@media(max-width:860px){
  .legende{display:none}
  .handyleiste{position:fixed;z-index:30;left:0;right:0;bottom:0;display:flex;gap:8px;padding:8px 12px calc(8px + env(safe-area-inset-bottom));background:rgba(248,240,220,.98);border-top:1.5px solid #6d6a55}
  .handyleiste button,.handyleiste a{flex:1;display:flex;align-items:center;justify-content:center;min-height:52px;font:700 1.45rem/1 Barlow,sans-serif;letter-spacing:.02em;text-transform:uppercase;text-decoration:none;cursor:pointer}
  .handyleiste button{background:none;border:2px solid var(--gruen);color:var(--gruen);flex:0 0 112px}
  .handyleiste a{background:var(--gruen);color:var(--creme)}
  .deckblatt{translate:-50% -54%;width:calc(100vw - 24px);padding:22px 22px 20px}
  .deckblatt__logo{width:118px}
  .deckblatt h1{font-size:clamp(2.5rem,11.6vw,3.3rem)}
  .deckblatt p{font-size:1.0625rem;line-height:1.38}
  .alle{top:10px;right:10px;font-size:1rem;min-height:40px}
  .fenster{left:10px;right:10px;width:auto;top:auto;bottom:80px;translate:0 0;grid-template-columns:minmax(0,4fr) minmax(0,7fr)}
  .fenster h2{font-size:1.95rem}
  .fenster--text h2{font-size:1.5rem}
  .fenster p{font-size:1rem}
  .beispiel{left:10px;right:10px;top:10px;max-width:none;font-size:.9375rem}
  .halte-leiste{left:10px;top:56px}
  .fragen__raster{display:block}
  .beiblatt__raster{grid-template-columns:1fr}
  .beiblatt__text{grid-column:auto}
  .geldtext p{grid-column:1/13}
  .fragen h2{margin-bottom:.5em}
  .schluss{padding:1.5rem 12px 2rem}
  .schluss__tafel{padding:24px 22px}
  .nummer{font-size:clamp(2.7rem,12.6vw,3.6rem)}
  .nummer.nummer--zwei{font-size:1.75rem}
  .beispiel__lang{display:none}
  .seitenfuss{padding-bottom:calc(1.8rem + 72px)}
  .stempel__text{bottom:158px}
  :root{--abwaerts-unten:78px}
}
@media(prefers-reduced-motion:reduce){.fenster{transition:none}.fenster.offen{transition:none}}

@media(min-width:861px){.nach-plan{--abwaerts-unten:76px}}