/* Ökumenische Hospizinitiative Krumbach · Aquarellbuch · Herzstück Web 2026 */
@import url('/schrift/schriften.css');

:root{
  --papier:#FBF8F0;
  --papier2:#F5EFE0;
  --tusche:#2B2924;
  --tusche2:#4A4740;
  --grau:#6B675E;
  --gelb:#F2B705;
  --gelb2:#FBD34D;
  --ocker:#B8781F;
  --ockerT:#8A5A12;   /* Ocker als Textfarbe, 5,1:1 auf Papier */
  --gruen:#7E9A4B;
  --gruenT:#4E6627;
  --himmel:#9DC3E0;
  --indigo:#2F2D6B;
  --rand:rgba(43,41,36,.14);
  --schatten:0 18px 40px -24px rgba(60,45,10,.35);
  --kopf:0;
  --fs:18px;
  --innen:1180px;
  --ease:cubic-bezier(.22,.8,.3,1);
}
html.gross{--fs:22px}
html.kontrast{--papier:#FFFFFF;--papier2:#F2F2F2;--tusche:#000;--tusche2:#000;--grau:#222;--ockerT:#5A3A00;--gruenT:#1F3300;--rand:rgba(0,0,0,.4)}
*{box-sizing:border-box}
html{font-size:var(--fs);-webkit-text-size-adjust:100%;scroll-behavior:smooth;overflow-x:hidden}
html.ruhig{scroll-behavior:auto}
body{margin:0;background:var(--papier);color:var(--tusche);font-family:'Figtree',system-ui,sans-serif;line-height:1.6;overflow-x:hidden;position:relative}
body::before{content:"";position:fixed;inset:0;pointer-events:none;z-index:0;opacity:.55;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='300' height='300'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .55 0 0 0 0 .48 0 0 0 0 .35 0 0 0 .08 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
html.kontrast body::before{display:none}
img{max-width:100%;height:auto;display:block}
a{color:var(--tusche)}
h1,h2,h3,h4{font-family:'Fraunces',Georgia,serif;font-weight:500;line-height:1.08;margin:0;letter-spacing:-.005em;font-variation-settings:"opsz" 120,"SOFT" 60}
h1{font-size:clamp(2.3rem,5.4vw,4.4rem)}
h2{font-size:clamp(1.75rem,3.6vw,2.9rem)}
h3{font-size:clamp(1.25rem,2vw,1.6rem)}
h4{font-size:1.05rem;font-family:'Figtree',sans-serif;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--ockerT)}
p{margin:0}
.innen{width:min(var(--innen),100% - 32px);margin-inline:auto}
.hand{font-family:'Kalam',cursive;font-weight:400;color:var(--ockerT)}
.vor{font-family:'Kalam',cursive;font-size:1.15rem;color:var(--ockerT);margin-bottom:10px;display:block}
.vor::before{content:"";display:inline-block;width:26px;height:8px;margin-right:10px;vertical-align:middle;border-radius:40% 60% 50% 50%;background:var(--gelb);opacity:.85;transform:rotate(-3deg)}
.lauf{font-size:1.02rem;color:var(--tusche2);max-width:62ch}
.lauf p+p{margin-top:1em}
.gross-t{font-size:clamp(1.2rem,1.9vw,1.45rem);line-height:1.5;max-width:40ch}
.skip{position:absolute;left:-9999px;top:8px;background:var(--gelb);color:var(--tusche);padding:10px 16px;z-index:200;font-weight:700}
.skip:focus{left:8px}
:focus-visible{outline:3px solid var(--ocker);outline-offset:3px;border-radius:3px}

/* Pinselknöpfe: ein Wasserfarben-Klecks hinter dem Wort */
.pinsel{position:relative;display:inline-block;padding:14px 30px;font-weight:700;text-decoration:none;color:var(--tusche);isolation:isolate;transition:transform .35s var(--ease);white-space:nowrap}
.pinsel::before{content:"";position:absolute;inset:-4px -8px;z-index:-1;background:var(--gelb);opacity:.95;transition:transform .45s var(--ease),opacity .3s;
  clip-path:polygon(3% 18%,14% 4%,40% 0,66% 3%,92% 0,100% 22%,97% 58%,100% 86%,84% 100%,55% 96%,28% 100%,6% 92%,0 60%);transform:rotate(-1.2deg)}
.pinsel:hover,.pinsel:focus-visible{transform:translateY(-2px)}
.pinsel:hover::before{transform:rotate(.8deg) scale(1.04)}
.pinsel.tusche{color:var(--papier)}
.pinsel.tusche::before{background:var(--tusche)}
.pinsel.leer::before{background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 52' preserveAspectRatio='none'%3E%3Cpath d='M4 20 C 6 10, 16 4, 30 3 C 50 1, 70 3, 92 2 C 98 6, 99 14, 98 24 C 97 32, 99 40, 95 46 C 88 50, 60 48, 40 49 C 24 50, 8 48, 4 44 C 1 36, 2 28, 4 20 Z' fill='none' stroke='%232B2924' stroke-width='2.2' vector-effect='non-scaling-stroke'/%3E%3C/svg%3E") center/100% 100% no-repeat;clip-path:none;opacity:1}
.pinsel.klein{padding:10px 20px;font-size:.95rem}
.pinsel.weich::before{background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 52' preserveAspectRatio='none'%3E%3Cpath d='M4 20 C 6 10, 16 4, 30 3 C 50 1, 70 3, 92 2 C 98 6, 99 14, 98 24 C 97 32, 99 40, 95 46 C 88 50, 60 48, 40 49 C 24 50, 8 48, 4 44 C 1 36, 2 28, 4 20 Z' fill='%23F5EFE0' stroke='%23B9B2A2' stroke-width='2.2' vector-effect='non-scaling-stroke'/%3E%3C/svg%3E") center/100% 100% no-repeat;clip-path:none;opacity:1}
.tel-zeile{font-family:'Fraunces',serif;font-size:1.5rem;font-variation-settings:"opsz" 60}

/* Kopf */
.kopf{position:sticky;top:0;z-index:60;background:linear-gradient(var(--papier) 70%,rgba(251,248,240,.92));backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);transition:box-shadow .3s}
.kopf.fest{box-shadow:0 8px 30px -22px rgba(60,45,10,.5)}
.kopf .innen{display:flex;align-items:center;justify-content:space-between;gap:18px;min-height:88px}
.marke{display:flex;align-items:center;gap:12px;text-decoration:none;color:var(--tusche)}
.marke svg{width:58px;height:58px;flex:none}
.marke .mt{font-family:'Fraunces',serif;font-size:1.05rem;line-height:1.1;font-variation-settings:"opsz" 40}
.marke .mt small{display:block;font-family:'Kalam',cursive;font-size:.95rem;color:var(--ockerT);font-weight:400}
.nav{display:flex;align-items:center;gap:4px}
.nav a{text-decoration:none;padding:10px 12px;font-weight:700;font-size:.98rem;position:relative;color:var(--tusche);white-space:nowrap}
.nav a::after{content:"";position:absolute;left:10px;right:10px;bottom:6px;height:7px;background:var(--gelb);opacity:0;border-radius:40% 60% 50% 50% / 60% 40% 60% 40%;transform:scaleX(.4) rotate(-1deg);transform-origin:left;transition:.35s var(--ease);z-index:-1}
.nav a:hover::after,.nav a.hier::after{opacity:.9;transform:scaleX(1) rotate(-1deg)}
.nav .sprache{font-family:'Kalam',cursive;font-weight:400;color:var(--ockerT);padding:10px 8px;font-size:1rem}
.nav .sprache::after{display:none}
.kopf-tel{display:flex;align-items:center;gap:10px}
.menu-wort{display:none;font-family:'Kalam',cursive;font-size:1.35rem;color:var(--tusche);background:none;border:0;padding:6px 4px;cursor:pointer;line-height:1}
.menu-wort u{text-decoration:none;position:relative}
.menu-wort u::after{content:"";position:absolute;left:-4px;right:-4px;bottom:-4px;height:6px;background:var(--gelb);border-radius:50% 50% 40% 60%;opacity:.9;transform:rotate(-2deg)}
@media(max-width:1000px){
  .nav,.kopf-tel .pinsel{display:none}
  .menu-wort{display:inline-block}
  .kopf .innen{min-height:72px}
  .marke svg{width:50px;height:50px}
  .marke .mt{font-size:.95rem}
}
/* Handy-Menü: ein aufgeschlagenes Blatt */
.blatt{position:fixed;inset:0;z-index:80;background:var(--papier);transform:translateY(-104%);transition:transform .55s var(--ease);overflow:auto;padding:88px 24px 120px}
.blatt.offen{transform:none}
.blatt::before{content:"";position:absolute;right:-60px;top:-40px;width:260px;height:260px;background:url('/bilder/sonnenblume.webp') center/contain no-repeat;opacity:.9;mix-blend-mode:multiply;pointer-events:none}
.blatt ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:4px;position:relative}
.blatt a{font-family:'Fraunces',serif;font-size:1.9rem;text-decoration:none;display:block;padding:8px 0;font-variation-settings:"opsz" 60}
.blatt a.hier{color:var(--ockerT)}
.blatt .klein{font-size:1.05rem;font-family:'Figtree',sans-serif;font-weight:700;color:var(--tusche2);padding:6px 0}
.blatt .zu{position:absolute;right:22px;top:18px;font-family:'Kalam',cursive;font-size:1.3rem;background:none;border:0;color:var(--tusche);cursor:pointer}
.blatt .sprachen{margin-top:22px;display:flex;gap:16px;font-family:'Kalam',cursive;font-size:1.2rem}
.blatt .sprachen a{font-family:'Kalam',cursive;font-size:1.2rem;padding:4px 0;color:var(--ockerT)}
.blatt .tel{margin-top:26px;font-size:1rem;color:var(--grau)}
.blatt .tel b{display:block;font-family:'Fraunces',serif;font-size:1.5rem;color:var(--tusche)}
body.menu-offen{overflow:hidden}

/* Held */
.held{position:relative;min-height:calc(100svh - 88px);display:grid;align-items:start;overflow:hidden}
.held-bild{position:absolute;inset:0;z-index:0}
.held-bild img{width:100%;height:100%;object-fit:cover;object-position:center 62%}
.held-film{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 62%;opacity:0;transition:opacity 1.6s ease;mix-blend-mode:multiply}
.held-film.da{opacity:1}
.held-licht{position:absolute;left:52%;top:24%;width:34vw;height:34vw;border-radius:50%;background:radial-gradient(circle,rgba(255,228,120,.55),rgba(255,228,120,0) 65%);mix-blend-mode:multiply;animation:atmen 9s ease-in-out infinite;pointer-events:none}
@keyframes atmen{0%,100%{transform:scale(.96);opacity:.7}50%{transform:scale(1.06);opacity:1}}
html.ruhig .held-film{display:none}
.held-bild::after{content:"";position:absolute;inset:0;background:radial-gradient(ellipse 48% 60% at 22% 30%,rgba(251,248,240,.86) 0%,rgba(251,248,240,.6) 45%,rgba(251,248,240,0) 100%)}
.held .innen{position:relative;z-index:1;padding:clamp(40px,7vh,90px) 0 70px}
.held h1{max-width:11ch}
.held .gross-t{margin-top:18px;max-width:30ch}
.held .nebenbei{max-width:600px}
.held-handy{display:none}
.held .knoepfe{display:flex;flex-wrap:wrap;gap:22px 26px;margin-top:30px;align-items:center}
.held .nebenbei{margin-top:30px;display:flex;gap:30px;flex-wrap:wrap;font-family:'Kalam',cursive;color:var(--ockerT);font-size:1.1rem}
@media(max-width:1000px){
  .held{min-height:0;align-items:start}
  .held-film,.held-licht{display:none}
  .held-bild{display:none}
  .held-handy{display:block;margin:14px -16px 6px}
  .held-handy img{width:100%;height:auto;-webkit-mask-image:linear-gradient(180deg,transparent 0,#000 14%,#000 86%,transparent 100%);mask-image:linear-gradient(180deg,transparent 0,#000 14%,#000 86%,transparent 100%);mix-blend-mode:multiply}
  .held .innen{padding:18px 0 40px}
  .held h1{font-size:clamp(2.1rem,9.5vw,3rem)}
  .held .gross-t{margin-top:6px;max-width:none}
  .held .knoepfe{margin-top:22px;gap:16px 20px}
  .held .nebenbei{display:none}
  .held .vor{font-size:1.02rem}
}

/* Abschnitte */
.abschnitt{padding:clamp(60px,8vw,120px) 0;position:relative}
.abschnitt.eng{padding:clamp(40px,5vw,70px) 0}
.wasch{position:relative;overflow:hidden}
.wasch::before{content:"";position:absolute;left:-10%;right:-10%;top:0;height:100%;background:url('/bilder/wash.webp') center/100% auto no-repeat;mix-blend-mode:multiply;opacity:.38;pointer-events:none;z-index:0}
.wasch>*{position:relative;z-index:1}
.zwei{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(30px,5vw,80px);align-items:center}
.zwei.tausch>:first-child{order:2}
@media(max-width:860px){.zwei{grid-template-columns:1fr}.zwei.tausch>:first-child{order:0}}
.bild-weich img{-webkit-mask-image:radial-gradient(ellipse 58% 56% at 50% 50%,#000 42%,transparent 98%);mask-image:radial-gradient(ellipse 58% 56% at 50% 50%,#000 42%,transparent 98%);mix-blend-mode:multiply}
.bild-weich.kante img{-webkit-mask-image:linear-gradient(90deg,transparent,#000 18%,#000 82%,transparent);mask-image:linear-gradient(90deg,transparent,#000 18%,#000 82%,transparent)}
.hand-note{font-family:'Kalam',cursive;color:var(--ockerT);font-size:1.15rem;transform:rotate(-2deg);display:inline-block;margin-top:14px}

/* Zahlen als Tuschezahlen auf Klecksen */
.zahlen{display:grid;grid-template-columns:repeat(4,1fr);gap:26px}
.zahl{position:relative;padding:26px 10px 10px}
.zahl b{display:block;font-family:'Fraunces',serif;font-weight:500;font-size:clamp(2.6rem,5vw,4.2rem);line-height:1;position:relative;z-index:1;font-variation-settings:"opsz" 144}
.zahl b::before{content:"";position:absolute;left:-14px;top:-6px;width:1.4em;height:1.1em;background:var(--gelb);opacity:.55;z-index:-1;border-radius:46% 54% 60% 40% / 52% 40% 60% 48%;transform:rotate(-6deg)}
.zahl span{display:block;margin-top:8px;color:var(--tusche2);font-size:.98rem;max-width:18ch}
@media(max-width:860px){.zahlen{grid-template-columns:1fr 1fr;gap:18px}}

/* Angebotskarten: eingeklebte Aquarellblätter */
.blaetter{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:clamp(22px,3vw,44px)}
.blatt-karte{position:relative;text-decoration:none;color:var(--tusche);display:flex;flex-direction:column;gap:14px;padding:0 0 10px;transition:transform .45s var(--ease)}
.blatt-karte .bk-bild{position:relative;aspect-ratio:4/3;overflow:hidden}
.blatt-karte .bk-bild img{width:100%;height:100%;object-fit:cover;mix-blend-mode:multiply;transition:transform .9s var(--ease);-webkit-mask-image:radial-gradient(ellipse 62% 60% at 50% 50%,#000 50%,transparent 98%);mask-image:radial-gradient(ellipse 62% 60% at 50% 50%,#000 50%,transparent 98%)}
.blatt-karte:hover .bk-bild img{transform:scale(1.05)}
.blatt-karte h3{font-size:1.45rem}
.blatt-karte p{color:var(--tusche2);font-size:.98rem}
.blatt-karte .weiter{font-family:'Kalam',cursive;color:var(--ockerT);font-size:1.15rem;margin-top:auto;position:relative;display:inline-block;align-self:flex-start}
.blatt-karte .weiter::after{content:"";position:absolute;left:-2px;right:-2px;bottom:-2px;height:6px;background:var(--gelb);opacity:.0;border-radius:50%;transition:.3s}
.blatt-karte:hover .weiter::after{opacity:.9}
.blatt-karte:nth-child(2){transform:rotate(.6deg)}
.blatt-karte:nth-child(3){transform:rotate(-.5deg)}
.blatt-karte:nth-child(2):hover{transform:rotate(0) translateY(-4px)}
.blatt-karte:nth-child(3):hover{transform:rotate(0) translateY(-4px)}
.blatt-karte:hover{transform:translateY(-4px)}
@media(max-width:900px){.blaetter{grid-template-columns:1fr 1fr}}
@media(max-width:600px){.blaetter{grid-template-columns:1fr;gap:34px}.blatt-karte .bk-bild{aspect-ratio:16/10}}

/* Zitat als Pinselstrich */
.zitat{position:relative;padding:40px 0;max-width:34ch;margin-inline:auto;text-align:center}
.zitat p{font-family:'Fraunces',serif;font-size:clamp(1.5rem,3vw,2.3rem);line-height:1.25;font-style:italic;font-variation-settings:"opsz" 100,"WONK" 1}
.zitat cite{display:block;margin-top:16px;font-style:normal;font-family:'Kalam',cursive;color:var(--ockerT);font-size:1.1rem}
.zitat::before{content:"";position:absolute;left:50%;top:0;width:120px;height:14px;transform:translateX(-50%) rotate(-2deg);background:var(--gelb);opacity:.8;border-radius:50% 50% 40% 60%}

/* Termine als Kalenderblätter */
.kalender{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:22px}
.k-blatt{background:#fff;border:1px solid var(--rand);padding:0 0 20px;position:relative;box-shadow:var(--schatten);transform:rotate(-.4deg)}
.k-blatt:nth-child(even){transform:rotate(.5deg)}
.k-blatt .kb-datum{background:var(--tusche);color:var(--papier);padding:12px 18px;display:flex;align-items:baseline;gap:10px;font-family:'Fraunces',serif}
.k-blatt .kb-datum b{font-size:2.1rem;font-weight:500;line-height:1}
.k-blatt .kb-datum span{font-family:'Kalam',cursive;color:var(--gelb2);font-size:1.1rem}
.k-blatt .kb-text{padding:16px 18px 0}
.k-blatt h3{font-size:1.2rem}
.k-blatt p{color:var(--tusche2);font-size:.95rem;margin-top:8px}
.k-blatt .kb-ort{font-family:'Kalam',cursive;color:var(--ockerT);margin-top:10px;font-size:1.05rem}
.k-blatt::after{content:"";position:absolute;left:50%;top:-10px;width:70px;height:22px;transform:translateX(-50%) rotate(-3deg);background:rgba(242,183,5,.55);mix-blend-mode:multiply}
html.kontrast .k-blatt .kb-datum span{color:#fff}

/* Chronik als gemalter Zeitstrahl */
.strahl{position:relative;padding-left:46px}
.strahl::before{content:"";position:absolute;left:14px;top:0;bottom:0;width:4px;background:linear-gradient(var(--ocker),var(--gelb));opacity:.6;border-radius:4px}
.ch-jahr{position:sticky;top:96px;z-index:2;display:inline-block;font-family:'Kalam',cursive;font-size:1.5rem;color:var(--tusche);background:var(--gelb);padding:4px 14px;margin:0 0 20px -46px;transform:rotate(-2deg);border-radius:40% 60% 50% 50% / 60% 40% 60% 40%}
.ch-eintrag{position:relative;display:grid;grid-template-columns:minmax(0,320px) 1fr;gap:26px;padding:0 0 50px;align-items:start}
.ch-eintrag::before{content:"";position:absolute;left:-40px;top:14px;width:20px;height:20px;border-radius:50%;background:var(--gelb);box-shadow:0 0 0 5px var(--papier)}
.ch-eintrag .ch-bilder{display:grid;gap:10px}
.ch-eintrag .ch-bilder img{border:6px solid #fff;box-shadow:0 10px 24px -14px rgba(0,0,0,.4);transform:rotate(-1.2deg)}
.ch-eintrag .ch-bilder img:nth-child(even){transform:rotate(1deg)}
.ch-eintrag h3{font-size:1.3rem}
.ch-eintrag .ch-datum{font-family:'Kalam',cursive;color:var(--ockerT);font-size:1.05rem;display:block;margin-bottom:6px}
.ch-eintrag p{color:var(--tusche2);font-size:.97rem;margin-top:10px}
@media(max-width:760px){.ch-eintrag{grid-template-columns:1fr}.strahl{padding-left:34px}.ch-jahr{margin-left:-34px;top:80px}.ch-eintrag::before{left:-28px}}

/* Vorstand und Team */
.gesichter{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:24px}
.gesicht img{aspect-ratio:1;object-fit:cover;width:100%;border-radius:48% 52% 50% 50% / 55% 45% 55% 45%;mix-blend-mode:multiply;filter:saturate(.85) contrast(1.02)}
.gesicht b{display:block;margin-top:10px;font-family:'Fraunces',serif;font-weight:500;font-size:1.1rem}
.gesicht span{display:block;color:var(--ockerT);font-family:'Kalam',cursive}

/* Listen mit Tuschepunkt */
.punkte{list-style:none;padding:0;margin:18px 0 0}
.punkte li{position:relative;padding-left:30px;margin-bottom:10px;color:var(--tusche2)}
.punkte li::before{content:"";position:absolute;left:0;top:.5em;width:14px;height:10px;background:var(--gelb);border-radius:60% 40% 50% 50%;transform:rotate(-10deg)}

/* Tabelle als Blatt */
.tabelle{width:100%;border-collapse:collapse;font-size:.98rem}
.tabelle th{text-align:left;font-family:'Kalam',cursive;font-weight:400;color:var(--ockerT);font-size:1.1rem;padding:10px 10px 10px 0;border-bottom:2px solid var(--rand)}
.tabelle td{padding:12px 10px 12px 0;border-bottom:1px solid var(--rand);vertical-align:top;color:var(--tusche2)}
.tabelle td b{color:var(--tusche)}

/* Kopfband der Unterseiten */
.kopfband{position:relative;padding:clamp(40px,6vw,80px) 0 10px;overflow:hidden}
.kopfband .innen{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center}
.kopfband h1{max-width:14ch}
.kopfband .kb-intro{margin-top:18px}
.kopfband .kb-bild{margin-right:calc((100vw - min(var(--innen),100vw - 32px))/-2)}
.kopfband .kb-bild img{width:100%;mix-blend-mode:multiply;-webkit-mask-image:radial-gradient(ellipse 66% 62% at 50% 50%,#000 48%,transparent 98%);mask-image:radial-gradient(ellipse 66% 62% at 50% 50%,#000 48%,transparent 98%)}
@media(max-width:860px){.kopfband .innen{grid-template-columns:1fr}.kopfband .kb-bild{order:-1;margin:-20px -20px 0}}

/* Band zum Weitergehen */
.band-weiter{padding:clamp(40px,6vw,80px) 0}
.band-weiter .innen{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:26px}
.band-weiter .bw-text{font-family:'Fraunces',serif;font-size:clamp(1.4rem,2.6vw,2rem);max-width:26ch;line-height:1.2}

/* Fuss */
.fuss{background:var(--tusche);color:var(--papier);padding:70px 0 40px;position:relative;margin-top:40px}
.fuss::before{content:"";position:absolute;left:0;right:0;top:-38px;height:40px;background:var(--tusche);-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 40' preserveAspectRatio='none'%3E%3Cpath d='M0 40V22c60-8 120 6 180-2s110-18 180-10 120 22 200 10 130-22 210-8 150 24 230 12 140-18 200-6V40z'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 40' preserveAspectRatio='none'%3E%3Cpath d='M0 40V22c60-8 120 6 180-2s110-18 180-10 120 22 200 10 130-22 210-8 150 24 230 12 140-18 200-6V40z'/%3E%3C/svg%3E");-webkit-mask-size:100% 100%;mask-size:100% 100%}
.fuss a{color:var(--papier)}
.fuss .spalten{display:grid;grid-template-columns:1.3fr 1fr 1fr 1fr;gap:34px}
.fuss h4{color:var(--gelb2);margin-bottom:12px}
.fuss ul{list-style:none;padding:0;margin:0}
.fuss li{margin-bottom:8px;font-size:.96rem;color:rgba(251,248,240,.85)}
.fuss li a{text-decoration:none}
.fuss li a:hover{text-decoration:underline;text-decoration-color:var(--gelb)}
.fuss .marke .mt,.fuss .marke .mt small{color:var(--papier)}
.fuss .u{margin-top:46px;padding-top:20px;border-top:1px solid rgba(251,248,240,.2);display:flex;flex-wrap:wrap;gap:12px 26px;font-size:.9rem;color:rgba(251,248,240,.7)}
.fuss .u a{text-decoration:none}
@media(max-width:860px){.fuss .spalten{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.fuss .spalten{grid-template-columns:1fr}}
.vermerk{background:#0b0b0c;display:flex;justify-content:center;align-items:center;padding:12px 16px 12px}
.vermerk a{display:inline-flex;align-items:center;gap:14px;text-decoration:none;color:#fff;font-size:14px;font-family:'Fraunces',serif;font-style:italic}
.vermerk img{width:180px;height:auto}
@media(max-width:700px){.vermerk a{font-size:13px}.vermerk img{width:150px}.vermerk{padding-bottom:12px}}
/* feste Handy-Leiste */
.leiste{display:none}
@media(max-width:1000px){
  .leiste{position:fixed;left:0;right:0;bottom:0;z-index:70;display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:10px 14px calc(10px + env(safe-area-inset-bottom));background:linear-gradient(transparent,var(--papier) 30%)}
  .leiste .pinsel{text-align:center;padding:14px 10px;font-size:1rem}
  .leiste .pinsel::before{inset:-2px -4px}
  body{padding-bottom:78px}
  .vermerk{margin-bottom:0}
  .fuss{padding-bottom:40px}
}

/* Reveal */
.rv{opacity:0;transform:translateY(22px);transition:opacity .9s var(--ease),transform .9s var(--ease)}
.rv.in{opacity:1;transform:none}
.d1{transition-delay:.12s}.d2{transition-delay:.24s}.d3{transition-delay:.36s}
html.ruhig .rv{opacity:1;transform:none;transition:none}
html.ruhig *{animation:none!important;transition-duration:.01s!important}

/* Lichtkasten für Chronikbilder */
.licht{position:fixed;inset:0;background:rgba(43,41,36,.92);z-index:90;display:none;align-items:center;justify-content:center;padding:20px}
.licht.offen{display:flex}
.licht img{max-width:min(96vw,1100px);max-height:86vh;border:8px solid #fff;object-fit:contain}
.licht button{position:absolute;right:16px;top:12px;font-family:'Kalam',cursive;font-size:1.4rem;background:var(--gelb);border:0;padding:6px 16px;cursor:pointer;color:var(--tusche)}
.licht p{position:absolute;bottom:18px;left:0;right:0;text-align:center;color:var(--papier);font-family:'Kalam',cursive}

/* Barrierefreiheit-Schalter */
.sicht{display:grid;gap:14px;max-width:560px}
.sicht-s{display:flex;gap:16px;align-items:center;text-align:left;background:#fff;border:1.5px solid var(--rand);padding:16px 18px;cursor:pointer;font:inherit;color:var(--tusche)}
.sicht-k{width:54px;height:30px;border-radius:30px;background:#D8D2C2;position:relative;flex:none;transition:.3s}
.sicht-k i{position:absolute;left:3px;top:3px;width:24px;height:24px;border-radius:50%;background:#fff;transition:.3s;box-shadow:0 2px 6px rgba(0,0,0,.25)}
.sicht-s[aria-pressed=true] .sicht-k{background:var(--gelb)}
.sicht-s[aria-pressed=true] .sicht-k i{left:27px}
.sicht-t b{display:block}
.sicht-t small{color:var(--grau)}

/* Rechtstexte */
.recht{max-width:72ch}
.recht h2{font-size:1.5rem;margin:40px 0 12px}
.recht h3{font-size:1.15rem;margin:26px 0 8px}
.recht p,.recht li{color:var(--tusche2);font-size:.98rem}
.recht p{margin-bottom:12px}
.recht ol,.recht ul{padding-left:22px}

/* Sonnenblumen-Zeichen frei auf der Seite */
.sb{position:absolute;pointer-events:none;mix-blend-mode:multiply;opacity:.95;z-index:0}
.sb img{width:100%}
.sb.re{right:-40px;top:-30px;width:clamp(140px,22vw,300px);transform:rotate(12deg)}
.sb.li{left:-60px;bottom:-20px;width:clamp(120px,18vw,240px);transform:rotate(-18deg) scaleX(-1)}
@media(max-width:700px){.sb.re{width:150px;right:-50px;top:-40px}}

/* Sternenkinder dunkel */
.nacht{background:#1E1C4A;color:var(--papier);overflow:hidden}
.nacht h1,.nacht h2,.nacht h3,.nacht .lauf,.nacht .gross-t{color:var(--papier)}
.nacht .vor{color:var(--gelb2)}
.nacht .lauf{color:rgba(251,248,240,.85)}
.nacht .punkte li{color:rgba(251,248,240,.85)}
.nacht a{color:var(--papier)}
.nacht .pinsel{color:var(--tusche)}
.nacht .hand-note{color:var(--gelb2)}
html.kontrast .nacht{background:#000;color:#fff}
.nacht-bild{margin:-10px -20px 0;position:relative}
.nacht-bild img{-webkit-mask-image:linear-gradient(180deg,#000 60%,transparent);mask-image:linear-gradient(180deg,#000 60%,transparent);width:100%}
.nacht-bild::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 40%,#1E1C4A)}

/* Runde 2 und Technik: Tippziele, Abstände, Bildlinks */
.ch-bilder a{display:block}
.ch-eintrag .ch-bilder img{aspect-ratio:auto;min-height:60px;background:var(--papier2)}
.fuss li a,.fuss .u a{display:inline-block;padding:10px 0;margin:-10px 0}
.fuss li{margin-bottom:12px}
.fuss .u{row-gap:4px}
.menu-wort{min-height:46px;min-width:64px;padding:8px 6px}
.blatt .zu{min-height:46px;padding:8px 10px}
.blatt .klein{padding:10px 0}
.recht a,.lauf a,.tabelle a,.k-blatt a,.kb-ort a,.blatt-karte .weiter,.sternen-tel a,p>a[href^="tel"],p>a[href^="mailto"]{display:inline-block;padding:9px 0;margin:-9px 0}
.k-blatt h3+p,.blatt-karte h3+p{margin-top:10px}
.zwei h2+div,.zwei h2+p{margin-top:16px}
.vermerk a{min-height:44px}
.nacht .pinsel{color:var(--tusche)!important}
.tabelle td:last-child{white-space:nowrap}
.kalender.zwei-k{grid-template-columns:1fr 1fr}
@media(max-width:560px){
  .kalender.zwei-k{grid-template-columns:1fr}
  .fuss .spalten{grid-template-columns:1fr 1fr;gap:26px 20px}
  .fuss .spalten>div:first-child{grid-column:1/-1}
}
@media(max-width:700px){.gesichter{grid-template-columns:1fr 1fr;gap:18px}.gesicht b{font-size:1rem}}
.gesichter{max-width:860px}
.blatt-karte h3 a{display:block;padding:6px 0}

/* Korrekturen nach Sichtkontrolle */
.held-film{mix-blend-mode:normal}
.held .nebenbei{display:none}
.held-licht{display:none}
@media(max-width:1000px){.held .knoepfe .pinsel.leer{display:none}}
.zahl{min-width:0}
.zahl span{overflow-wrap:anywhere;hyphens:auto}
.zahl b::before{width:calc(100% + 28px);left:-14px}
.sb{opacity:1;mix-blend-mode:normal}
.sb img{mix-blend-mode:multiply}
.kalender{grid-template-columns:repeat(auto-fill,minmax(250px,300px));align-items:start}
.ch-eintrag .ch-bilder img{min-height:0;aspect-ratio:auto;object-fit:cover}
.ch-eintrag .ch-bilder{grid-template-columns:repeat(auto-fill,minmax(140px,1fr))}
.ch-eintrag .ch-bilder a:only-child{grid-column:1/-1}
.foto,.ch-eintrag .ch-bilder img,.gesicht img{filter:sepia(.18) saturate(.82) contrast(1.02)}
html.kontrast .foto,html.kontrast .ch-eintrag .ch-bilder img{filter:none}
.gesichter{grid-template-columns:repeat(auto-fill,minmax(130px,160px));gap:26px}
.knopf-reihe{display:flex;flex-wrap:wrap;gap:14px 18px;align-items:center}
.blatt::before{top:auto;bottom:-40px;right:-60px;opacity:.55}
.blatt .klein{font-size:1.3rem;font-family:'Fraunces',serif;font-weight:400}
.fuss li{overflow-wrap:normal}
.nowrap{white-space:nowrap}
.licht{z-index:95}
body.licht-offen .leiste{display:none}
.nacht-bild img{max-height:46vh;object-fit:cover;object-position:center 30%}
@media(min-width:1001px){.nacht-bild{max-height:46vh;overflow:hidden}}
.tel-zeile,.iban{font-family:'Fraunces',serif;font-variant-numeric:lining-nums}
.zahl b{display:inline-block}

.sb img{mix-blend-mode:normal}
@media(max-width:520px){.marke .mt{font-size:.9rem}.marke .mt .lang{display:none}}