/* SHAMANIC WAYS, stil.css: die gemeinsame Gestaltung aller Unterseiten in EINER Datei (11.11.2026).
   Zusammengeführt aus punk.css, plakat.css und plakat-lesbar.css, in dieser Reihenfolge. Farben: nur in sw-kern.css.
   Lädt nach den Dateien des Seitentyps (geruest*, artikel*, zusatz*) und nach sektionen, menue-panel, fuss-weg, fell. */
@import url("/assets/sw-kern.css?v=1");
@import url("/assets/sw-bauteile.css?v=1");


/* ═════ aus punk.css ═════ */
/* SHAMANIC WAYS Startseite, Punk-Entwurf 09.11.2026
   Nur Gestaltung, Wortlaut unverändert. Nur Naturfarben der Marke:
   Petrol, Petrol-tief, Nacht, Muschel, Rötel, Pfirsich. */



/* Blätter: keine weichen Rundungen mehr, harte Kanten, dicke Naht */
.blatt,section.blatt,.hero{border-radius:0!important}
main>section+section{border-top:var(--hart) solid var(--nacht)}
/* Titel: grösser, enger, lauter */
h1,h2{letter-spacing:-.045em!important}
.hero h1{line-height:.9!important}
.hero h1 b{background:var(--roetel);color:var(--muschel)}
section h2{line-height:.95!important}
/* Unterzeilen als Klebestreifen */
.hero .unter{display:inline-block;background:var(--pfirsich);color:var(--nacht)!important;padding:.35em .7em;font-weight:600;opacity:1!important}
/* Bilder: Fotokopie-Kante, harter versetzter Schatten */
.hero-bild img,.portrait img,.station img{filter:contrast(1.12) saturate(.85);border:var(--hart) solid var(--nacht);box-shadow:var(--schatten) var(--schatten) 0 var(--roetel);border-radius:0!important}
.hero-bild,.portrait,.station,.station .bild{border-radius:0!important}
/* Knöpfe: eckig, dicker Rand, harter Schatten */
.kn{border-radius:0!important;box-shadow:4px 4px 0 var(--nacht)!important;text-transform:uppercase;letter-spacing:.08em}
.kn-linie{border-width:2.5px!important}
/* Karten und Kacheln: eckig, Rahmen statt Weichzeichner */
.raum3 a,.station,.faehigkeit,.szene,.zeile,.m-tuer{border-radius:0!important}
.raum3 a{border:2.5px solid currentColor!important;box-shadow:5px 5px 0 var(--roetel);backdrop-filter:none!important}
/* Fähigkeiten: Frage als Stempel */
.faehigkeit .frage,.frage{display:inline-block;border:2px solid currentColor;padding:.2em .6em;text-transform:uppercase;letter-spacing:.14em;font-size:.72em;font-weight:700}
/* Kernsätze auf Pfirsich-Streifen */
.kern,.satz{display:inline;background:var(--pfirsich);color:var(--nacht)!important;padding:.05em .25em;box-decoration-break:clone;-webkit-box-decoration-break:clone}
/* Etiketten und kleine Labels: Versalien, kräftig */
.etikett,.zeit,.preis{text-transform:uppercase;letter-spacing:.12em;font-weight:700}
/* Termine: dicke Linien */
.spielplan,.zeile{border-color:var(--nacht)!important;border-width:2px!important}
/* Stempel im Hero */
.hero{position:relative}
.hero::after{display:none;content:"Kein Ritual ohne Rückweg";position:absolute;right:var(--rand);top:clamp(86px,11vw,140px);z-index:3;border:2.5px solid var(--pfirsich);color:var(--pfirsich);font:700 clamp(10px,.9vw,13px)/1.2 var(--sans);letter-spacing:.16em;text-transform:uppercase;padding:.6em .9em;max-width:11em;text-align:center}
@media(max-width:899px){.hero::after{display:none}}
/* Runde 2: alle weichen Karten eckig, harte Rahmen und Schatten */
article.t,a.d,a.kiental-band,li.auf,figure,figure.buecher,label,input,.f-glut,.f-kante{border-radius:0!important}
article.t{border:var(--hart) solid var(--nacht)!important;box-shadow:var(--schatten) var(--schatten) 0 var(--roetel)!important}
article.t h3{font-size:clamp(30px,3vw,46px)!important;letter-spacing:-.04em}
.regel-liste li{border-top:var(--hart) solid var(--pfirsich)!important;padding-top:1em}
label{border:2px solid var(--nacht)!important}
/* Einblenden aus, damit die Seite sofort steht */
.auf{opacity:1!important;transform:none!important}
/* Runde 3: der laute Teil jedes Titels klebt auf Rötel */
section h2 b,.zweiklang b{background:var(--roetel);color:var(--muschel)!important}
/* Regeln: ganzes Blatt in Rötel, die Erde der Marke */
section.regeln{--grund:var(--roetel)}
/* Etiketten als Stempel */
.etikett{display:inline-block;border:2px solid currentColor}
/* Zitat laut */
.zitat{font-size:clamp(30px,3.4vw,52px)!important;line-height:1.08!important;letter-spacing:-.03em}
/* Knopf-Linien kräftig */
.kn-linie{border-radius:0!important}
/* Kontrast auf Rötel: alles in Muschel */
/* Runde 4 (Andy: «mit den Farben mutiger»): jedes Blatt eine volle Naturfarbe */
/* Termine: Abendlicht */
section.va{background:var(--pfirsich)!important;--grund:var(--pfirsich)}
section.va h2,section.va .unter{color:var(--nacht)!important}
section.va article.t{box-shadow:var(--schatten) var(--schatten) 0 var(--nacht)!important}
/* Warum: Erde */
section.warum{background:var(--roetel)!important;--grund:var(--roetel)}
section.warum,section.warum *{color:var(--muschel)!important}
section.warum .kn-linie{border-color:var(--muschel)!important}
/* Drei Fähigkeiten: Nacht, Titel auf Pfirsich */
section#drei h2 b{background:var(--pfirsich)!important;color:var(--nacht)!important}
/* Regeln: Abendlicht statt Erde, damit Rötel und Pfirsich wechseln */
section.regeln{background:var(--pfirsich)!important;--grund:var(--pfirsich)}
section.regeln,section.regeln *{color:var(--nacht)!important}
section.regeln h2 b{background:var(--nacht)!important;color:var(--pfirsich)!important}
section.regeln .regel-liste li{border-top-color:var(--nacht)!important;background:transparent!important}
/* Schluss: Erde */
section.schluss{--grund:var(--roetel)}
/* Kopf immer auf Nacht, damit Marke und Menü auf jeder Farbe lesbar sind */
header.kopf,body>header{background:var(--nacht)!important;color:var(--muschel)!important;border-bottom:var(--hart) solid var(--nacht)}
header .marke,header .menue-knopf,header a{color:var(--muschel)!important}
html body header.kopf::before{background:var(--nacht)!important;opacity:1!important}
html body header.kopf{background:var(--nacht)!important}
html body header.kopf .marke{color:var(--muschel)!important}
/* Andy 09.11.: «1 Nacht». Petrol ist im Entwurf ersetzt */

/* Etiketten in den Szenen nur so gross wie ihr Wort */
.szene .etikett{align-self:start;justify-self:start;height:auto}
/* Termin-Karten ohne Petrol: Erde, tiefe Nacht, Nacht */
article.t.t1{background:var(--roetel)!important}
article.t.t2{background:var(--nacht-tief)!important}
article.t.t3{background:var(--nacht)!important}
article.t.t1 .preis,article.t.t1 a{color:var(--muschel)!important}
article.t.t1 *{color:var(--muschel)!important}
/* Alle Seiten: lauter Teil im H1 klebt auf Rötel, Schrift Muschel */
h1 b{background:var(--roetel);color:var(--muschel)!important}
/* Geräteprüfung 09.11.: auf schmalen Handys darf kein Titel über den Rand */
h1,h2,h3{overflow-wrap:break-word;hyphens:manual}
.hero h1{font-size:clamp(38px,8.4vw,132px)!important}
section h2{font-size:clamp(30px,6.4vw,96px)!important}
.warum-text,.warum h2,.hero-text,.eckzeile,main section>*{min-width:0;max-width:100%}
@media(max-width:440px){
  .hero h1 b,section h2 b,h1 b{padding:0 .06em}
  .hero .unter{font-size:16px}
}
/* Handy-Fix 09.11. abends (Andy: «es muss auf allen Telefonen super aussehen») */
/* 1 Kurzbeschreibung in den Termin-Karten: kein Streifen, klar lesbar */
article.t .satz{display:block!important;background:none!important;color:var(--muschel)!important;opacity:1!important;padding:0!important}
/* 2 Datumskacheln: dunkle Fläche, helle Schrift, eckig */
article.t .d{background:rgba(26,34,54,.35)!important;border-radius:0!important}
article.t .d span,article.t .d i,article.t .d b{color:var(--muschel)!important;opacity:1!important}
article.t .d em{color:var(--muschel)!important;text-decoration:underline;text-underline-offset:3px}
article.t.t2 .d em,article.t.t3 .d em{color:var(--pfirsich)!important}
/* 3 Etiketten überall gleich: Versalien-Stempel */
.etikett{font-family:var(--sans)!important;font-weight:700!important;text-transform:uppercase!important;letter-spacing:.14em!important;font-size:11px!important;line-height:1.2!important;padding:.45em .75em!important}
/* 4 Linien-Knopf ohne abgeschnittenen Schatten */
.kn-linie{box-shadow:none!important;max-width:100%}
/* 5 Kiental-Band: Nacht auf Pfirsich, klar abgesetzt */
a.kiental-band{background:var(--nacht)!important;color:var(--muschel)!important;border:0!important;box-shadow:6px 6px 0 var(--roetel)!important}
a.kiental-band *{color:var(--muschel)!important}
a.kiental-band .k-j{color:var(--pfirsich)!important}
/* ===== Runde Schrift und Kontrast (Andy 09.11. abends, Impeccable craft-floor) ===== */
/* Titel: der laute Teil steht als EIN Block auf eigener Zeile, nichts läuft mehr in die Zeile darüber */
h1,h2{font-weight:500!important;line-height:1.02!important;text-wrap:balance}
h1 b,h2 b,.zweiklang b,.hero h1 b,section h2 b{display:block!important;width:fit-content;max-width:100%;margin-top:.14em;padding:.06em .16em .12em!important;line-height:1.04!important;box-decoration-break:slice!important;-webkit-box-decoration-break:slice!important;font-weight:600!important;text-wrap:balance}
/* Kopf: Knopftext voll Muschel */
.kopf .kn,.kopf .kn *{color:var(--muschel)!important;opacity:1!important}
/* Hero-Kacheln: Text voll lesbar */
.raum3 a,.raum3 a *{opacity:1!important;color:var(--muschel)!important}
/* Nebentext auf hellem Grund dunkler */

.hell .kontakt-klein,.hell small,.hell .fein{color:var(--grau)!important;opacity:1!important}
section.va .unter{opacity:1!important}
/* Links im Lesetext auf hellem Grund: dunkles Rötel */
section.hell p a:not(.kn),section.hell li a:not(.kn),section.hell dd a,.recht-blatt a:not(.kn){color:var(--roetel-tief)!important}
/* Rötel-Blätter: Streifen Nacht statt Rötel auf Rötel */
section.schluss h2 b,section.warum h2 b{background:var(--nacht)!important;color:var(--muschel)!important}
/* Fuss: Nacht, Kleingedrucktes lesbar */
.sw-foot,.fuss{background:var(--nacht-tief)!important}
.sw-foot p,.sw-foot small,.sw-foot-recht,.fuss p,.fuss small{color:var(--muschel-2)!important;opacity:1!important}
/* Dunkle Kästen im Lesetext: helle Schrift */
.fk-in,.fk-in *{color:var(--muschel)!important}
/* Erzählung auf hellem Blatt: dunkle Schrift (Fehler schon vor dem Punk-Stil) */
section.hell:not(.schluss) .weiter{color:var(--rauch)!important}
section.hell:not(.schluss) .weiter b,section.hell:not(.schluss) .weiter strong{color:var(--roetel-tief)!important}
/* Schluss-Blatt mit Formular: Nacht statt Rötel, damit Formular, Links und Kleingedrucktes lesbar sind */
section.schluss{background:var(--nacht)!important;--grund:var(--nacht)}
section.schluss,section.schluss *{color:var(--muschel)!important}
section.schluss h2 b{background:var(--roetel)!important}
section.schluss a:not(.kn){color:var(--pfirsich)!important}
section.schluss .fein{color:var(--muschel-2)!important;opacity:1!important}
section.schluss label,section.schluss legend{opacity:1!important}
/* Rechtsseiten: Nebentext und Ziffern dunkler */
.recht-blatt .k{color:var(--rauch)!important}
.recht-blatt span{opacity:1}
section.hell [style*="opacity:.6"]{opacity:1!important;color:var(--grau)!important}
section.hell .recht-blatt span,.recht-blatt li span{color:inherit}
/* Alte Navigation der englischen Wissensübersicht: auf Nacht */
nav.top{background:var(--nacht)!important}
nav.top,nav.top *{color:var(--muschel)!important}
/* Schluss-Blatt ist dunkel, auch wenn es .hell heisst */
html body section.schluss p a,html body section.schluss li a,html body section.schluss a:not(.kn){color:var(--pfirsich)!important}
html body section.schluss b,html body section.schluss strong{color:var(--muschel)!important}
html body section.schluss h2 b{color:var(--muschel)!important}
/* Rechtsseiten */
html body .recht-blatt .stamp{color:var(--rauch)!important}
html body .recht-blatt span:not(.kn):not(.pf){color:var(--roetel-tief)!important}
html body section.schluss .weiter b{color:var(--muschel)!important}
section.hell dt{color:var(--roetel-tief)!important}
.stone p:not(.kn),.sec.stone p{color:var(--grau)!important}
/* Helle Blätter auf Muschel statt Muschel 2: Grau und Rötel im Lesetext erreichen so 4.5:1 */
section.blatt.hell:not(.va):not(.regeln):not(.schluss){background:var(--muschel)!important;--grund:var(--muschel)}
.sw-lead{background:var(--muschel)!important}
.sw-lead-eti{color:var(--roetel-tief)!important}
/* Geräteprüfung 10.11.: Kopfknopf nur als Pfeil, bis der Text sicher Platz hat; lange Knöpfe dürfen umbrechen */
@media(max-width:560px){.kopf .kn .tx{display:none}.kopf .kn{padding:6px}}
@media(max-width:600px){main .kn{white-space:normal;max-width:100%;line-height:1.25}}
@media(max-width:440px){h1{overflow-wrap:anywhere}}
/* Gesprächsseite: Titel nicht unter den Kopf ziehen */
.buch-hero .hero-text,.hero.nur-text .hero-text{margin-top:0!important}
@media(max-width:440px){h1 .nw{white-space:normal}}
/* 10.11.: lange Wörter im Titel (Spirituelles) nie mitten im Wort brechen, Titel am Rechner passend klein genug */
@media(min-width:900px){h1,h2,h3{overflow-wrap:normal}.hero h1{font-size:clamp(46px,6.2vw,108px)!important}}
/* 10.11.: Newsletter-Block als eigenes Blatt am Seitenende */
section.lead-blatt .post{margin-top:0!important;padding-top:0!important;border-top:0!important}
section.lead-blatt .post input[type=text],section.lead-blatt .post input[type=email]{border:2.5px solid var(--nacht)!important;border-radius:0!important;background:var(--papier)!important}
section.lead-blatt label{border:0!important}
section.lead-blatt fieldset.wahl{border:0;margin:0;padding:0;min-width:0}
section.lead-blatt fieldset.wahl legend{padding:0;margin:0 0 10px;font:600 14px/1.3 var(--sans);color:inherit}
section.lead-blatt fieldset.wahl label{position:relative;display:inline-flex;align-items:center;min-height:44px;margin:0 8px 8px 0;padding:0 18px;border:2px solid var(--nacht)!important;border-radius:0!important;font:600 16px/1 var(--sans);cursor:pointer}
section.lead-blatt fieldset.wahl input{position:absolute;opacity:0;width:1px;height:1px;pointer-events:none}
section.lead-blatt fieldset.wahl label:has(input:checked){background:var(--roetel-tief);color:var(--muschel);border-color:var(--roetel-tief)!important}
section.lead-blatt fieldset.wahl label:has(input:focus-visible){outline:3px solid var(--nacht);outline-offset:3px}
section.lead-blatt fieldset.wahl ~ .sw-lead-err:empty{display:none}
section.lead-blatt fieldset.wahl ~ div{margin-top:16px!important}
/* 10.11.: Zimmer zur Übernachtung als Reihe angeklebter Fotos */
.zimmer-reihe{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(14px,2vw,28px);margin-top:clamp(36px,4vw,56px);max-width:none!important}
.zimmer-reihe figure{margin:0;border:4px solid var(--nacht);box-shadow:6px 6px 0 var(--roetel-tief);background:var(--nacht)}
.zimmer-reihe figure:nth-child(odd){transform:rotate(-1.2deg)}
.zimmer-reihe figure:nth-child(even){transform:rotate(1deg)}
.zimmer-reihe img{display:block;width:100%;height:auto;aspect-ratio:4/5;object-fit:cover;border:0!important;box-shadow:none!important;border-radius:0!important}
@media(max-width:899px){.zimmer-reihe{grid-template-columns:repeat(2,minmax(0,1fr))}}
/* 10.11.: Übernachtung als eigenes Plakat (Andy: «nicht versteckt im Text») */
.uebern{margin-top:clamp(48px,6vw,88px);padding:clamp(24px,3.2vw,48px);background:var(--pfirsich);color:var(--nacht);border:4px solid var(--nacht);box-shadow:10px 10px 0 var(--nacht);max-width:none!important;scroll-margin-top:100px}
.uebern-kopf{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px 32px}
.uebern h3{font:800 clamp(34px,4.6vw,72px)/.92 var(--sans)!important;letter-spacing:-.05em;color:var(--nacht)!important;margin:0}
.uebern-preis{display:flex;align-items:baseline;gap:12px;margin:0;transform:rotate(-2deg)}
.uebern-preis b{display:inline-block;padding:.16em .4em .2em;background:var(--nacht);color:var(--muschel);font:800 clamp(30px,3.4vw,52px)/1 var(--sans);letter-spacing:-.03em}
.uebern-preis span{font:700 clamp(16px,1.3vw,20px)/1.2 var(--sans);color:var(--nacht)}
.uebern .zimmer-reihe{margin-top:clamp(24px,3vw,40px)}
.uebern .zimmer-reihe figure{box-shadow:6px 6px 0 var(--nacht)}
.fakten dd a{color:inherit;text-decoration:none;display:block}
.fakten dd a b{text-decoration:underline;text-decoration-thickness:3px;text-underline-offset:.18em}
@media(min-width:1400px){.hero .fakten{grid-template-columns:repeat(5,minmax(0,1fr))!important;max-width:820px!important}}
.fakten dd a span{overflow-wrap:break-word}

/* ═════ aus plakat.css ═════ */
html body.plakat{--korn:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='k'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 0.13 0 0 0 0 0.17 0 0 0 0 0.27 0 0 0 .18 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23k)'/%3E%3C/svg%3E")}
/* Kopfzeile wie auf der Startseite: Papier, Naht in Nacht */
html body.plakat header.kopf,html body.plakat header.kopf::before{background:var(--muschel)!important;opacity:1!important}
html body.plakat header.kopf{color:var(--nacht)!important;border-bottom:var(--hart) solid var(--nacht)!important;box-shadow:none!important}
html body.plakat header.kopf .marke,html body.plakat header.kopf .burger,html body.plakat header.kopf .b-wort{color:var(--nacht)!important}
html body.plakat header.kopf .b-linien i{height:3px;border-radius:0}
html body.plakat header.kopf .kn{background:var(--pfirsich)!important;box-shadow:4px 4px 0 var(--nacht)!important;text-transform:none;letter-spacing:0;font-weight:700}
html body.plakat header.kopf .kn,html body.plakat header.kopf .kn *{color:var(--nacht)!important}
html body.plakat header.kopf .kn .pf{background:rgba(34,45,68,.12)}
/* Seitenleiste der alten Gestaltung weg */
body.plakat .tiefe,body.plakat .hero-linie{display:none!important}
body.plakat{--rail:0px}
/* Hero: Pfirsich mit Kopierkorn, Schrift in Nacht */
html body.plakat .hero{background:var(--pfirsich) var(--korn)!important;color:var(--nacht)!important;--grund:var(--pfirsich)}
html body.plakat .hero h1{color:var(--nacht)!important;font:800 clamp(46px,6.2vw,108px)/.9 var(--sans)!important}
html body.plakat .hero h1 b{display:block!important;margin-top:.36em;background:none!important;color:var(--nacht)!important;padding:0!important;font:600 clamp(26px,2.9vw,46px)/1.12 var(--serif)!important;letter-spacing:-.025em!important;max-width:22ch}
html body.plakat .hero .unter{display:block!important;background:none!important;color:var(--nacht)!important;padding:0!important;font:500 clamp(17px,1.25vw,20px)/1.5 var(--sans)!important;max-width:44ch;margin-top:clamp(18px,2vw,28px)}
html body.plakat .hero .kn{background:var(--roetel-tief)!important;color:var(--muschel)!important;margin-top:clamp(22px,2.6vw,36px)}
html body.plakat .hero .kn *{color:var(--muschel)!important}
html body.plakat .hero .fakten{border-top:var(--hart) solid var(--nacht);gap:14px 20px}
html body.plakat .hero .fakten b{font:800 clamp(18px,1.5vw,22px)/1.1 var(--sans);letter-spacing:-.02em;color:var(--nacht)}
html body.plakat .hero .fakten span{color:var(--nacht);opacity:1}
/* Foto: angeklebte Fotokopie statt randloser Fläche */
html body.plakat .hero-bild{align-self:center;margin:clamp(40px,5vw,80px) var(--rand) clamp(40px,5vw,80px) 0;height:auto;aspect-ratio:4/5;max-height:78svh;border:var(--hart) solid var(--nacht);box-shadow:10px 10px 0 var(--roetel-tief);transform:rotate(1.6deg);overflow:visible}
html body.plakat .hero-bild::after{display:none}
html body.plakat .hero-bild img{filter:contrast(1.08) saturate(.9);border:0!important;box-shadow:none!important}
html body.plakat .hero-bild::before{content:"";position:absolute;z-index:2;left:50%;top:-16px;width:120px;height:30px;margin-left:-60px;background:rgba(243,231,225,.78);transform:rotate(-4deg);box-shadow:0 1px 2px rgba(34,45,68,.25)}
@media(max-width:899px){
  html body.plakat .hero-bild{order:2;width:min(86%,420px);height:auto;min-height:0;margin:8px 6px 56px auto;aspect-ratio:4/3}
  html body.plakat .hero h1{font-size:clamp(44px,13vw,72px)!important}
  html body.plakat .hero h1 b{font-size:clamp(24px,7vw,36px)!important}
}
/* Knöpfe ohne Glut und Glanz der alten Gestaltung: flach, harter Schatten */
html body.plakat .kn .f-fell,html body.plakat .kn .f-kante,html body.plakat .kn .f-glut,html body.plakat .kn .f-lauf{display:none!important}
html body.plakat .kn{background-image:none!important;filter:none!important;text-transform:none!important;letter-spacing:0!important;font-weight:800!important;border-radius:0!important}
html body.plakat .kn::before,html body.plakat .kn::after{display:none!important}
html body.plakat .hero .kn{box-shadow:5px 5px 0 var(--nacht)!important;border:0!important}
@media(max-width:899px){
  html body.plakat .hero-text{margin-top:0!important;padding-top:calc(64px + clamp(28px,7vw,48px))!important}
}
/* ── Ganze Seite: harte Kanten statt Rundungen ── */
html body.plakat main *,html body.plakat footer,html body.plakat footer *{border-radius:0!important}
html body.plakat .kn .pf{border-radius:0!important}
/* Karten auf Nacht (Fähigkeiten): Rahmen in Muschel, harter Schatten in Pfirsich */
html body.plakat .blatt.dunkel li.auge,html body.plakat .blatt.dunkel .auge>li,html body.plakat .blatt.dunkel .augen>*{background:var(--nacht-tief)!important;border:2.5px solid var(--muschel)!important;box-shadow:6px 6px 0 var(--pfirsich)!important}
/* Termin-Ticket wie die tiefste Stufe der Treppe */
html body.plakat .ticket{background:var(--nacht)!important;border:var(--hart) solid var(--nacht)}
html body.plakat .ticket .kn{background:var(--pfirsich)!important;box-shadow:5px 5px 0 var(--roetel)!important}
html body.plakat .ticket .kn,html body.plakat .ticket .kn *{color:var(--nacht)!important}
/* Fotos im Text: Fotokopie mit Rand und Schatten */
html body.plakat .portrait img,html body.plakat .ort img{border:var(--hart) solid var(--nacht)!important;box-shadow:8px 8px 0 var(--roetel-tief)!important;filter:contrast(1.08) saturate(.9)}
html body.plakat .portrait{transform:rotate(-1.2deg)}
html body.plakat .portrait::after,html body.plakat .portrait::before{display:none!important}
/* Knöpfe im Text: Rötel mit hartem Schatten, Linien-Knopf mit dickem Rand */
html body.plakat main .kn:not(.kn-linie){background:var(--roetel-tief)!important;box-shadow:5px 5px 0 var(--nacht)!important}
html body.plakat main .kn:not(.kn-linie),html body.plakat main .kn:not(.kn-linie) *{color:var(--muschel)!important}
html body.plakat main .kn-linie{background:none!important;border:2.5px solid currentColor!important;box-shadow:4px 4px 0 currentColor!important}
html body.plakat .blatt.dunkel main .kn:not(.kn-linie),html body.plakat .schluss .kn:not(.kn-linie){box-shadow:5px 5px 0 var(--pfirsich)!important}
html body.plakat .ticket .kn:not(.kn-linie){background:var(--pfirsich)!important}
html body.plakat .ticket .kn:not(.kn-linie),html body.plakat .ticket .kn:not(.kn-linie) *{color:var(--nacht)!important}
/* Formular: Papierfelder mit Rahmen in Nacht */
html body.plakat .schluss input:not([type=checkbox]):not([type=radio]){background:var(--muschel)!important;color:var(--nacht)!important;border:2.5px solid var(--muschel)!important}
html body.plakat .schluss .wahl label{border:2px solid var(--muschel)!important}
/* Fussbereich: gerade Oberkante */
html body.plakat footer.fuss{margin-top:0}
html body.plakat .tueren .tuer{background:var(--nacht-tief)!important;border:2.5px solid var(--muschel)!important;box-shadow:6px 6px 0 var(--pfirsich)!important}
html body.plakat .tueren .tuer:nth-child(2){transform:rotate(-.5deg)}
html body.plakat .tueren .tuer:nth-child(3){transform:rotate(.4deg)}
/* Abend-Termine als Tickets (wie die Termine in der Treppe der Startseite) */
html body.plakat ol.abende{display:grid;gap:18px;border:0!important}
html body.plakat ol.abende>li{background:var(--muschel)!important;color:var(--nacht)!important;border:2.5px solid var(--nacht)!important;border-left:12px solid var(--roetel-tief)!important;box-shadow:6px 6px 0 var(--pfirsich)!important;padding:18px 20px!important}
html body.plakat ol.abende>li:nth-child(2){transform:rotate(-.4deg)}
html body.plakat ol.abende>li:nth-child(3){transform:rotate(.3deg)}
html body.plakat ol.abende>li *{color:var(--nacht)!important}
html body.plakat ol.abende .zahl{color:var(--roetel-tief)!important;font:800 clamp(36px,3.2vw,52px)/1 var(--sans)!important;letter-spacing:-.05em}
html body.plakat ol.abende h3{font-weight:700}
html body.plakat ol.abende .pl-k i{border-color:var(--nacht)!important;background:transparent}
html body.plakat ol.abende .pl-k i.belegt{background:var(--nacht)!important}
html body.plakat ol.abende .kn:not(.kn-linie),html body.plakat ol.abende .kn:not(.kn-linie) *{color:var(--muschel)!important}
html body.plakat ol.abende .kn{box-shadow:4px 4px 0 var(--nacht)!important}
html body.plakat .hero .eckdaten{color:var(--nacht)!important;opacity:1!important;font-weight:600}

/* ═════ aus plakat-lesbar.css ═════ */
/* SHAMANIC WAYS Unterseiten im Plakat-Stil, Lese-Schicht (11.11.2026). Lädt nach plakat.css, wirkt nur mit <body class="plakat">.
   Gleiche Regel wie start-lesbar.css: Laut ist nur, was kurz ist. Schräg bleiben nur Fotos.
   Wortlaut und HTML der Seiten bleiben unverändert. */

/* Titel: Buchstaben berühren sich nicht mehr */
html body.plakat .hero h1{letter-spacing:-.04em!important;line-height:.94!important}
html body.plakat main h2{letter-spacing:-.03em!important;line-height:1.02!important}
/* Knöpfe, Preise und Türen stehen gerade */
html body.plakat .hero .kn{transform:none}
html body.plakat .uebern-preis{transform:none}
html body.plakat .tueren .tuer:nth-child(n){transform:none}
/* Nichts unter 15 Pixel */
html body.plakat .hero .fakten span{font-size:15px;line-height:1.4}
html body.plakat .fein{font-size:15px;line-height:1.5}
html body.plakat .ort dt{font-size:15px}
html body.plakat .ort dd{font-size:17px;color:var(--nacht)}
html body.plakat .termin-fein{font-size:16px}
/* Termin als Fahrschein wie auf der Startseite: oben was und wann, unten am Abriss Preis und Knopf */
html body.plakat .ticket{--tp:28px;position:relative;transform:none;padding:26px var(--tp) 30px;box-shadow:6px 6px 0 var(--roetel-tief)!important}
/* Wochenende: der Tag steht schon im Titel («5. und 6. Dezember»), die grosse Zahl fällt weg.
   Abende: der Tag steht nur in der Zahl, sie rückt vor den Titel («26. November, Zürich») */
html body.plakat .termine-grid[data-termine="wochenende"] .ticket .tag-zahl{display:none}
html body.plakat .termine-grid:not([data-termine="wochenende"]) .ticket .tag-zahl{display:inline;margin-right:.22em;font:800 clamp(26px,2.3vw,34px)/1.08 var(--sans);letter-spacing:-.03em;color:var(--pfirsich)}
html body.plakat .termine-grid:not([data-termine="wochenende"]) .ticket h3{display:inline}
html body.plakat .termine-grid:not([data-termine="wochenende"]) .ticket h3+p{margin-top:12px}
html body.plakat .ticket h3{margin-top:0;font:800 clamp(26px,2.3vw,34px)/1.08 var(--sans);letter-spacing:-.03em;color:var(--muschel)}
html body.plakat .ticket p{margin-top:10px;font-size:16px;line-height:1.5;color:var(--muschel)}
html body.plakat .ticket .preis{position:relative;margin:24px calc(var(--tp) * -1) 22px;padding:24px var(--tp) 0;border-top:5px dotted var(--muschel);font:800 30px/1 var(--sans);letter-spacing:-.02em;text-transform:none;color:var(--muschel)}
html body.plakat .ticket .preis span{margin-top:8px;font:500 16px/1.45 var(--sans);letter-spacing:0;text-transform:none;color:var(--muschel)}
html body.plakat .ticket .preis::before,html body.plakat .ticket .preis::after{content:"";position:absolute;top:-16px;width:28px;height:28px;border-radius:50%!important;background:var(--muschel)}
html body.plakat .ticket .preis::before{left:-16px;clip-path:inset(0 0 0 12px)}
html body.plakat .ticket .preis::after{right:-16px;clip-path:inset(0 12px 0 0)}
/* Ein Termin: zwei Spalten statt drei, keine leere Spalte rechts */
@media(min-width:1000px){html body.plakat .termine-grid:not(:has(.ticket ~ .ticket)){grid-template-columns:minmax(0,1fr) minmax(0,1fr)}html body.plakat .termine-grid:not(:has(.ticket ~ .ticket)) .ort img{aspect-ratio:16/10}}
/* Abend-Termine: Karten stehen gerade. Am Handy stehen Tag und Ort in einer Zeile, der Text läuft über die ganze Breite */
html body.plakat ol.abende>li:nth-child(n){transform:none}
html body.plakat .pl span.frei{font-size:15px}
@media(max-width:699px){
  html body.plakat ol.abende>li{grid-template-columns:auto minmax(0,1fr);gap:4px 14px;align-items:baseline}
  html body.plakat ol.abende>li>div:not(.pl){display:contents}
  html body.plakat ol.abende h3{font-size:20px}
  html body.plakat ol.abende p{grid-column:1/-1;margin-top:2px}
  html body.plakat ol.abende .pl{grid-column:1/-1;margin-top:10px}
  html body.plakat ol.abende .kn{margin-top:12px}
}
/* Hero mit lauter Zeile in <b> und ruhiger Zeile in <span> (Begleitung): laute Zeile gross wie auf Wochenende und Abend, alles in Nacht */
html body.plakat .hero h1.laut-oben b{margin-top:0;max-width:none;font:800 clamp(46px,5.6vw,96px)/.94 var(--sans)!important;letter-spacing:-.04em!important}
html body.plakat .hero h1.laut-oben span{display:block;margin-top:.4em;font:600 clamp(26px,2.9vw,46px)/1.12 var(--serif)!important;letter-spacing:-.025em!important;color:var(--nacht)!important}
html body.plakat .hero .eckzeile{color:var(--nacht)!important;opacity:1!important;font-size:16px;line-height:1.5}
@media(max-width:899px){
  html body.plakat .hero h1.laut-oben b{font-size:clamp(38px,11vw,64px)!important}
  html body.plakat .hero h1.laut-oben span{font-size:clamp(24px,7vw,36px)!important}
}
/* Treppe auf Unterseiten (Begleitung): Stufen stehen gerade, ohne Schattenkanten, weniger Einzug */
html body.plakat .treppe .stufe:nth-child(n){box-shadow:none!important;transform:none}
html body.plakat .treppe .s1{margin-left:4%}
html body.plakat .treppe .s2{margin-left:8%}
html body.plakat .treppe .s3{margin-left:12%}
html body.plakat .treppe .stufe h3{letter-spacing:-.035em;line-height:.98}
html body.plakat .treppe .stufe .s-satz{font:500 clamp(18px,1.3vw,20px)/1.5 var(--sans)}
@media(max-width:899px){
  html body.plakat .treppe .s1{margin-left:8px}
  html body.plakat .treppe .s2{margin-left:16px}
  html body.plakat .treppe .s3{margin-left:24px}
}
/* Stufe mit Verweis (Begleitung «Ein Tag.» führt zum Re:Charge Tag): die ganze Stufe ist klickbar, der Verweis steht sichtbar darunter */
html body.plakat .treppe .stufe .s-weiter{display:block;width:fit-content;margin-top:12px;font:800 17px/1.3 var(--sans);color:inherit;text-decoration:underline;text-decoration-thickness:2.5px;text-underline-offset:.24em}
html body.plakat .treppe .stufe .s-weiter::before{content:"";position:absolute;inset:0}
html body.plakat .treppe .stufe:has(.s-weiter:hover){background:var(--muschel)}
/* ───── Weitere Seitentypen: Wissen, Rechtstexte, FEUER, Kiental (v=5) ───── */
/* Alles Kleine im Pfirsich-Hero steht in Nacht statt in hellem Ton: Brotkrumen, Autor-Zeile */
html body.plakat .hero .crumb,html body.plakat .hero .crumb a,html body.plakat .hero .crumb b{color:var(--nacht)!important;opacity:1!important}
html body.plakat .hero .crumb{margin:0 0 16px!important;font-size:15px;letter-spacing:0;text-transform:none}
html body.plakat .hero .crumb b{font-weight:800}
html body.plakat .hero .meta,html body.plakat .hero .meta span{color:var(--nacht)!important;opacity:1!important}
html body.plakat .hero .meta{margin-top:22px;font-size:15px}
/* Kalender-Marke (FEUER): Zettel in Nacht */
html body.plakat .hero .kalender{background:var(--nacht)!important}
html body.plakat .hero .kalender,html body.plakat .hero .kalender span,html body.plakat .hero .kalender b{color:var(--muschel)!important}
/* Karten im Hero (Kiental-Übersicht): beide in Nacht mit hartem Schatten */
html body.plakat .hero .raum3 a{background:var(--nacht)!important;box-shadow:5px 5px 0 var(--roetel-tief)!important}
html body.plakat .hero .raum3 a,html body.plakat .hero .raum3 a *{color:var(--muschel)!important;opacity:1!important}
/* Reine Text-Köpfe (Wissen, Rechtstexte): weniger Leerraum über und unter dem Titel */
html body.plakat .hero.nur-text h1{max-width:none}
html body.plakat .hero.nur-text{min-height:0!important;padding-top:0!important;padding-bottom:0!important}
html body.plakat .hero.nur-text .hero-text{padding-top:clamp(104px,10vw,150px)!important;padding-bottom:clamp(76px,8vw,110px)!important}
/* 34px davon deckt das nächste Blatt zu */

/* 38 Seiten (Wissen, Rechtstexte) setzen in ihrem eigenen Seiten-CSS auf main.nv-bl eine alte Farbe für --nacht (Petrol-tief).
   Hier gilt wieder die zentrale Palette aus sw-kern.css: der Wert wird von html geerbt, kein Farbwert in dieser Datei. */
html body.plakat .nv-bl{--nacht:inherit}
/* Rechtstexte (Impressum, Datenschutz): Zwischentitel in Lesegrösse. Vorher 92 px, sie liefen am Rechner in die Textspalte daneben */
html body.plakat .recht-blatt h2{font-size:clamp(24px,2.2vw,34px)!important;line-height:1.14!important;letter-spacing:-.02em!important;overflow-wrap:break-word;-webkit-hyphens:auto;hyphens:auto}