/* Schriften liegen lokal in schriften/, keine Verbindung zu Google Fonts */
@font-face { font-family: "Newsreader"; font-style: normal; font-weight: 200 800; font-display: swap; src: url("schriften/newsreader-normal.woff2") format("woff2-variations"); }
@font-face { font-family: "Newsreader"; font-style: italic; font-weight: 200 800; font-display: swap; src: url("schriften/newsreader-italic.woff2") format("woff2-variations"); }
@font-face { font-family: "Archivo"; font-style: normal; font-weight: 400; font-display: swap; src: url("schriften/archivo-400.woff2") format("woff2"); }
@font-face { font-family: "Archivo"; font-style: normal; font-weight: 500; font-display: swap; src: url("schriften/archivo-500.woff2") format("woff2"); }
@font-face { font-family: "Archivo"; font-style: normal; font-weight: 600; font-display: swap; src: url("schriften/archivo-600.woff2") format("woff2"); }

:root {
  --bg:         #FFFFFF;
  --bg2:        #F7F4F2;
  --ink:        #16110F;
  --ink2:       #5C534F;
  --ink3:       #8A807B;
  --accent:     #8A1B4A;
  --accent-ink: #FFF7FA;
  --accent-dp:  #5E1234;
  --rule:       #E7E0DC;
  --foot-bg:    #16110F;
  --foot-ink:   #EDE7E4;
  --foot-ink2:  #9C918C;
  --foot-rule:  #332A26;
  --shade:      rgba(22,17,15,0.55);

  --serif: "Newsreader", "Iowan Old Style", Georgia, serif;
  --sans:  "Archivo", -apple-system, "Helvetica Neue", Arial, sans-serif;
  --pad:   clamp(1.25rem, 5vw, 4.5rem);
  --max:   80rem;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
html, body { overflow-x: hidden; }

body {
  margin: 0; background: var(--bg); color: var(--ink);
  font-family: var(--sans); font-size: 17px; line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}

img { max-width: 100%; display: block; }
a { color: inherit; }
:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }

.skip {
  position: absolute; left: -9999px;
  background: var(--ink); color: #fff; padding: 0.75rem 1.25rem; z-index: 50;
}
.skip:focus { left: 1rem; top: 1rem; }

.shell { max-width: var(--max); margin: 0 auto; padding-inline: var(--pad); }
.shell.schmal { max-width: 52rem; }

/* Kopf */

header.site { position: sticky; top: 0; z-index: 20; background: var(--bg); border-bottom: 1px solid var(--rule); }
.site-inner { display: flex; align-items: center; gap: 2rem; height: 4.5rem; }
.wordmark { font-family: var(--serif); font-size: 1.2rem; font-weight: 500; text-decoration: none; white-space: nowrap; }
nav.main { display: flex; gap: 1.6rem; margin-left: auto; font-size: 0.86rem; }
nav.main a { text-decoration: none; color: var(--ink2); padding-bottom: 2px; border-bottom: 1px solid transparent; }
nav.main a:hover, nav.main a.hier { color: var(--ink); border-bottom-color: var(--accent); }

.btn {
  display: inline-block; font-size: 0.78rem; font-weight: 500;
  letter-spacing: 0.13em; text-transform: uppercase; text-decoration: none;
  background: var(--accent); color: var(--accent-ink); padding: 0.85rem 1.7rem; border: 1px solid var(--accent);
}
.btn:hover { background: transparent; color: var(--accent); }
.btn-sm { padding: 0.6rem 1.15rem; font-size: 0.72rem; }

.mehr {
  font-size: 0.78rem; letter-spacing: 0.13em; text-transform: uppercase;
  color: var(--accent); text-decoration: none; white-space: nowrap;
  border-bottom: 1px solid currentColor; padding-bottom: 2px;
}

.label { font-size: 0.72rem; letter-spacing: 0.2em; text-transform: uppercase; color: var(--accent); margin: 0 0 0.7rem; }

/* Startseite */

/* Hero: Foto ueber die volle Breite, Ueberschrift links im aufgehellten Bereich */
.hero {
  position: relative; isolation: isolate; overflow: hidden;
  display: grid; align-items: center;
  /* Die Hoehe folgt dem Seitenverhaeltnis des Fotos. Sonst schneidet ein
     breites Fenster oben und unten etwas ab, zum Beispiel die Haende. */
  aspect-ratio: 2400 / 1153;
  min-height: 29rem;
  max-height: 92vh;
}
.hero .hero-bild {
  position: absolute; inset: 0; z-index: -2;
  width: 100%; height: 100%;
  object-fit: cover; object-position: 50% 62%;
}
/* Aufheller von links nach innen, damit die Schrift sicher lesbar bleibt */
.hero::before {
  content: ""; position: absolute; inset: 0; z-index: -1;
  background: linear-gradient(260deg,
    rgba(255,255,255,0) 46%,
    rgba(255,255,255,0.42) 56%,
    rgba(255,255,255,0.88) 66%,
    rgba(255,255,255,0.97) 100%);
}
.hero .shell { width: 100%; }
.hero-text { max-width: 34rem; }
.hero h1 { font-family: var(--serif); font-weight: 300; font-size: clamp(2.3rem, 3.8vw, 4rem); line-height: 1.05; letter-spacing: -0.02em; margin: 0 0 1.4rem; text-wrap: balance; }
.hero h1 em { font-style: italic; color: var(--accent); }
.roles { font-size: 0.72rem; letter-spacing: 0.22em; text-transform: uppercase; color: var(--ink2); margin: 0 0 1.9rem; }
.hero .btn { margin-top: 0; }
.hero .credit {
  position: absolute; left: 1rem; bottom: 0.6rem; z-index: 1;
  margin: 0; font-size: 0.7rem; letter-spacing: 0.04em; color: var(--ink3);
}
/* Der Fliesstext steht unter dem Bild, nicht darin */
/* Unterseiten-Hero: gleiche Machart wie die Startseite, nur flacher */
.seitenhero { aspect-ratio: 2400 / 1000; min-height: 22rem; max-height: 72vh; }
.seitenhero .hero-bild { object-position: 50% 38%; }
/* Journalismus: Motiv links, deshalb Text rechts und Aufheller von rechts */
.journalismus-hero .hero-bild { object-position: 50% 30%; }
.journalismus-hero::before { background: linear-gradient(100deg, rgba(255,255,255,0) 50%, rgba(255,255,255,0.5) 60%, rgba(255,255,255,0.9) 70%, rgba(255,255,255,0.97) 100%); }
.journalismus-hero .hero-text { margin-left: auto; max-width: 30rem; }
.journalismus-hero .credit { left: auto; right: 1rem; }
.seitenhero h1 { font-size: clamp(2rem, 3.2vw, 3.4rem); margin-bottom: 0; }
.seitenhero .label { margin-bottom: 0.9rem; }
@media (max-width: 76rem) {
  .seitenhero .hero-bild { aspect-ratio: 16 / 9; object-position: 50% 34%; }
}

.hero-nach { padding-block: clamp(2.5rem, 6vw, 4.5rem) 0; }
.hero-nach .spalte { max-width: 38rem; }
.hero-nach p { font-size: 1.04rem; color: var(--ink2); margin: 0 0 1.1rem; }
.credit { font-size: 0.7rem; color: var(--ink2); margin: 0.6rem 0 0; }

.band-book { background: var(--accent); color: var(--accent-ink); padding-block: clamp(3rem, 7vw, 5.5rem); }
/* Cover links, Text in der Mitte, Autorenfoto rechts */
.band-book .grid { display: grid; grid-template-columns: 14rem 1fr 15rem; gap: clamp(2rem, 4vw, 3.5rem); align-items: start; }
.band-book .cover    { grid-column: 1; grid-row: 1; }
.band-book .booktext { grid-column: 2; grid-row: 1; min-width: 0; }
.band-book .authors  { grid-column: 3; grid-row: 1; }
.band-book .cover { margin: 0; }
.band-book .cover img { width: 100%; box-shadow: 0 18px 45px rgba(0,0,0,0.28); }
.band-book .authors { margin: 0; }
.band-book .authors figcaption { font-size: 0.72rem; opacity: 0.78; padding-top: 0.45rem; }
.eyebrow { font-size: 0.72rem; letter-spacing: 0.2em; text-transform: uppercase; margin: 0 0 1rem; opacity: 0.85; }
.band-book h2 { font-family: var(--serif); font-weight: 400; font-size: clamp(2rem, 4.4vw, 3.1rem); line-height: 1.08; margin: 0 0 0.9rem; }
.band-book .sub { font-family: var(--serif); font-style: italic; font-size: 1.15rem; line-height: 1.45; margin: 0 0 1.4rem; max-width: 34rem; }
.band-book p { max-width: 34rem; margin: 0 0 1.1rem; font-size: 0.98rem; opacity: 0.92; }
.band-book .btn { background: var(--accent-ink); color: var(--accent); border-color: var(--accent-ink); margin-top: 0.9rem; }
.band-book .btn:hover { background: transparent; color: var(--accent-ink); }

section.block { padding-block: clamp(3.5rem, 8vw, 6rem); }
section.block.tint { background: var(--bg2); }

.block-head { display: flex; align-items: baseline; justify-content: space-between; gap: 1.5rem; border-bottom: 1px solid var(--rule); padding-bottom: 1rem; margin-bottom: clamp(2rem, 4vw, 3rem); }
.block-head h2 { font-family: var(--serif); font-weight: 400; font-size: clamp(1.7rem, 3.4vw, 2.4rem); margin: 0; }
.block-head .lead { margin: 0.7rem 0 0; color: var(--ink2); font-size: 0.96rem; max-width: 38rem; }

.cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(1.25rem, 3vw, 2.25rem); }
.card figure { margin: 0 0 1.1rem; }
.card img { width: 100%; aspect-ratio: 16/9; object-fit: cover; }
.card .tag { font-size: 0.68rem; letter-spacing: 0.16em; text-transform: uppercase; color: var(--accent); margin: 0 0 0.5rem; }
.card h3 { font-family: var(--serif); font-weight: 400; font-size: 1.35rem; line-height: 1.25; margin: 0 0 0.5rem; }
.card p { font-size: 0.92rem; color: var(--ink2); margin: 0; }

.awardstrip { margin-top: clamp(2rem, 4vw, 3rem); border-top: 1px solid var(--rule); border-bottom: 1px solid var(--rule); padding: 1rem 0; display: flex; flex-wrap: wrap; align-items: baseline; gap: 0.6rem 1.75rem; }
.awardstrip .lead-label { font-size: 0.7rem; font-weight: 600; letter-spacing: 0.18em; text-transform: uppercase; color: var(--accent); flex: none; }
.awardstrip ul { list-style: none; display: flex; flex-wrap: wrap; gap: 0.35rem 1.4rem; margin: 0; padding: 0; font-size: 0.92rem; color: var(--ink2); }
.awardstrip li { white-space: nowrap; }
.awardstrip .mehr { margin-left: auto; }

.gigs { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(1.25rem, 3vw, 2.25rem); }
.gig { margin: 0; }
.gig img { width: 100%; aspect-ratio: 3/2; object-fit: cover; }
.gig figcaption { font-size: 0.88rem; color: var(--ink2); padding-top: 0.7rem; line-height: 1.45; }
.gig figcaption strong { color: var(--ink); font-weight: 600; }
.venues-inline { margin: 2rem 0 0; font-size: 0.92rem; color: var(--ink2); }
.venues-big { font-family: var(--serif); font-weight: 300; font-size: clamp(1.3rem, 2.8vw, 2.1rem); line-height: 1.45; margin: 0; }

.quote-band { position: relative; min-height: 30rem; display: flex; align-items: center; background: var(--foot-bg); }
.quote-band img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 30% 45%; }
/* links dunkler, damit das Zitat traegt, rechts heller, damit das Gesicht frei bleibt */
.quote-band .veil { position: absolute; inset: 0;
  background: linear-gradient(90deg, rgba(20,32,58,0.74) 0%, rgba(20,32,58,0.66) 38%, rgba(20,32,58,0.34) 62%, rgba(20,32,58,0.22) 100%); }
.quote-band .shell { position: relative; width: 100%; padding-block: 4rem; }
.quote-band blockquote { margin: 0; max-width: 32rem; font-family: var(--serif); font-weight: 300; font-style: italic; font-size: clamp(1.5rem, 3.4vw, 2.5rem); line-height: 1.28; color: #fff; text-wrap: balance; }
.quote-band cite { display: block; margin-top: 1.5rem; font-family: var(--sans); font-style: normal; font-size: 0.74rem; letter-spacing: 0.18em; text-transform: uppercase; color: rgba(255,255,255,0.78); }

.pods { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(1.5rem, 3vw, 2.5rem); }
.pcover { aspect-ratio: 1/1; display: flex; flex-direction: column; justify-content: space-between; padding: 1.2rem; margin-bottom: 1.1rem; color: #FFF6F9; }
.pcover.echt { display: block; padding: 0; width: 100%; object-fit: cover; }
.ptitel { margin: 0 0 0.5rem; font-family: var(--serif); font-weight: 400; font-size: 1.35rem; line-height: 1.15; }
.pcover.c1 { background: var(--accent); }
.pcover.c2 { background: var(--ink); }
.pcover.c3 { background: var(--accent-dp); }
.pfoot { font-size: 0.64rem; font-weight: 600; letter-spacing: 0.18em; text-transform: uppercase; opacity: 0.78; }
.pmark { margin: 0; font-family: var(--serif); font-weight: 400; font-size: clamp(1.5rem, 3.2vw, 2.1rem); line-height: 1.08; }
.rhythm { font-size: 0.68rem; letter-spacing: 0.16em; text-transform: uppercase; color: var(--ink2); margin: 0 0 0.5rem; }
.pod p { font-size: 0.92rem; color: var(--ink2); margin: 0 0 0.9rem; }
.listen { font-size: 0.74rem; letter-spacing: 0.13em; text-transform: uppercase; color: var(--accent); text-decoration: none; border-bottom: 1px solid currentColor; padding-bottom: 2px; }

.kontakt-teaser { display: grid; grid-template-columns: 1.1fr 1fr; gap: clamp(2rem, 5vw, 4rem); align-items: start; }
.kontakt-teaser h2 { font-family: var(--serif); font-weight: 300; font-size: clamp(1.8rem, 4vw, 2.6rem); line-height: 1.12; margin: 0 0 1rem; }
.kontakt-teaser p { color: var(--ink2); font-size: 0.96rem; margin: 0 0 1rem; max-width: 30rem; }
.wege { display: grid; gap: 1.5rem; }
.wege h4 { font-size: 0.7rem; letter-spacing: 0.2em; text-transform: uppercase; color: var(--ink3); margin: 0 0 0.5rem; }

/* Unterseiten */

.seitenkopf { padding-block: clamp(3rem, 7vw, 5.5rem) clamp(1.5rem, 3vw, 2.5rem); }
.seitenkopf h1 { font-family: var(--serif); font-weight: 300; font-size: clamp(2.1rem, 4.4vw, 3.4rem); line-height: 1.06; letter-spacing: -0.02em; margin: 0 0 1.25rem; max-width: 22ch; text-wrap: balance; }
.seitenkopf p { color: var(--ink2); max-width: 42rem; margin: 0 0 1rem; }
.seitenkopf.mit-bild { display: grid; grid-template-columns: 1fr 26rem; gap: clamp(2rem, 5vw, 4rem); align-items: start; }
.seitenkopf.mit-bild figure { margin: 0; }
.seitenkopf.mit-bild figcaption { font-size: 0.7rem; color: var(--ink3); padding-top: 0.5rem; }

ol.rows { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--ink); }
ol.rows > li { border-bottom: 1px solid var(--rule); }
.row { display: grid; grid-template-columns: 14rem 1fr; gap: clamp(1.25rem, 3vw, 2.5rem); align-items: start; padding: 1.5rem 0; text-decoration: none; }
a.row:hover .rtitle { color: var(--accent); }
.rthumb img { width: 100%; aspect-ratio: 16/9; object-fit: cover; }
.rtag { display: block; font-size: 0.68rem; letter-spacing: 0.16em; text-transform: uppercase; color: var(--accent); margin-bottom: 0.4rem; }
.rtitle { display: block; font-family: var(--serif); font-size: 1.5rem; line-height: 1.2; margin-bottom: 0.5rem; }
.rdesc { display: block; font-size: 0.94rem; color: var(--ink2); max-width: 42rem; }

/* Themen: redaktionelle Liste statt Farbkacheln */
.themen { list-style: none; margin: 0; padding: 0; }
.thema { display: grid; grid-template-columns: 3.5rem 1fr; gap: clamp(1rem, 3vw, 2.5rem); align-items: start; padding: clamp(1.4rem, 3vw, 2rem) 0; border-bottom: 1px solid var(--rule); }
.thema:first-child { border-top: 1px solid var(--rule); }
.thema .tnum { font-size: 0.7rem; font-weight: 600; letter-spacing: 0.18em; color: var(--accent); padding-top: 0.55rem; }
.thema h3 { font-family: var(--serif); font-weight: 400; font-size: clamp(1.35rem, 2.6vw, 1.9rem); line-height: 1.15; margin: 0; }
.thema .tsub { font-family: var(--serif); font-style: italic; font-size: 1.02rem; line-height: 1.35; color: var(--ink2); margin: 0.35rem 0 0; max-width: 40rem; }
.thema p { margin: 0.7rem 0 0; color: var(--ink2); font-size: 0.96rem; max-width: 44rem; }
.venues-inline.nachfotos { margin-top: clamp(1.5rem, 3vw, 2.25rem); }
.buehnenband { margin-top: 0; }
.fotonachweis { color: var(--ink3); font-size: 0.72rem; }
.gigs.hoch { margin-top: clamp(1.75rem, 4vw, 2.5rem); }
.gigs.hoch img { aspect-ratio: 3 / 4; }
.rtext-schmal p { max-width: 42rem; }
.standgrid { display: grid; grid-template-columns: 1fr 22rem; gap: clamp(2rem, 5vw, 4rem); align-items: start; }
.standbild { margin: 0; }
.standbild img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.standbild figcaption { font-size: 0.72rem; color: var(--ink3); padding-top: 0.5rem; }
.vitagrid { display: grid; grid-template-columns: 1fr 20rem; gap: clamp(2rem, 5vw, 4rem); align-items: start; }
.stationsbild { margin: 0; }
.stationsbild img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.stationsbild figcaption { font-size: 0.72rem; color: var(--ink3); padding-top: 0.5rem; }
.awards.eins { grid-template-columns: 1fr; }
.azusatz { display: block; font-size: 0.82rem; color: var(--ink3); padding-top: 0.15rem; }
.shell.nopad { padding-inline: 0; margin-inline: 0; }
.anfragezeile { display: flex; flex-wrap: wrap; align-items: center; gap: 1rem 1.5rem; margin: clamp(2rem, 4vw, 3rem) 0 0; color: var(--ink2); font-size: 0.95rem; }
.anfragezeile p { margin: 0; max-width: 34rem; }

.block.schmalluft { padding-block: clamp(1.75rem, 4vw, 3rem); }
.gigs.zwei { grid-template-columns: 1fr 1fr; margin-top: clamp(1.75rem, 4vw, 2.75rem); }
.bandtitel { font-family: var(--serif); font-weight: 400; font-size: clamp(1.8rem, 3.6vw, 2.6rem); line-height: 1.1; margin: 0 0 0.9rem; }
.rollen { margin-top: clamp(1.75rem, 4vw, 2.75rem); }

/* Tagesaktuelles Band auf der Projekteseite */
.aktuell { display: grid; grid-template-columns: 1fr 18rem; gap: clamp(2rem, 5vw, 4rem); align-items: start; }
.aktuell h2 { font-family: var(--serif); font-weight: 400; font-size: clamp(1.7rem, 3.4vw, 2.4rem); line-height: 1.12; margin: 0 0 0.9rem; }
.aktuell p { color: var(--ink2); margin: 0 0 1rem; max-width: 40rem; }
.sendungen { list-style: none; margin: 0; padding: 0; }
.sendungen li { border-top: 1px solid var(--rule); padding: 0.6rem 0; font-size: 0.9rem; color: var(--ink2); }
.sendungen li:last-child { border-bottom: 1px solid var(--rule); }

.topics { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(0.9rem, 2vw, 1.4rem); }
.topic { background: var(--accent); color: var(--accent-ink); padding: clamp(1.6rem, 3vw, 2.4rem); display: flex; flex-direction: column; min-height: 13rem; }
.topic:nth-child(even) { background: var(--accent-dp); }
.topic .num { font-size: 0.7rem; font-weight: 600; letter-spacing: 0.2em; margin-bottom: auto; opacity: 0.8; }
.topic h3 { font-family: var(--serif); font-weight: 400; font-size: clamp(1.3rem, 2.4vw, 1.7rem); line-height: 1.18; margin: 1.5rem 0 0.6rem; }
.topic p { margin: 0; font-size: 0.92rem; opacity: 0.9; }

.format-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(1.5rem, 3vw, 2.75rem); }
.format { border-top: 3px solid var(--accent); padding-top: 1.2rem; }
.format h3 { font-family: var(--serif); font-weight: 400; font-size: 1.45rem; line-height: 1.2; margin: 0 0 0.5rem; }
.format p { margin: 0 0 0.75rem; color: var(--ink2); font-size: 0.94rem; }
.format .spec { font-size: 0.78rem; font-weight: 500; letter-spacing: 0.06em; color: var(--accent); text-transform: uppercase; }

.anfrage { display: grid; grid-template-columns: 1.1fr 1fr; gap: clamp(2rem, 5vw, 4rem); align-items: start; }
.checkliste { list-style: none; margin: 0; padding: 0; }
.checkliste li { border-top: 1px solid rgba(255,255,255,0.25); padding: 0.85rem 0 0.85rem 1.5rem; position: relative; font-size: 0.94rem; }
.checkliste li::before { content: ""; position: absolute; left: 0; top: 1.35rem; width: 0.5rem; height: 1px; background: var(--accent-ink); }

.podbigs { display: grid; gap: clamp(2rem, 4vw, 3.5rem); }
.podbig { display: grid; grid-template-columns: 16rem 1fr; gap: clamp(1.5rem, 4vw, 3rem); align-items: start; }
.podbig .pcover { margin-bottom: 0; }
.podbig h3 { font-family: var(--serif); font-weight: 400; font-size: 1.7rem; margin: 0 0 0.7rem; }
.podbig p { color: var(--ink2); margin: 0 0 0.9rem; max-width: 38rem; }

.awards { display: grid; grid-template-columns: 1fr 1fr; gap: 0 clamp(2rem, 5vw, 4rem); }
.award { display: grid; grid-template-columns: 4.5rem 1fr; gap: 1rem; border-bottom: 1px solid var(--rule); padding: 0.75rem 0; }
.award .ayear { font-size: 0.85rem; color: var(--ink3); font-variant-numeric: tabular-nums; }
.award .aname { font-size: 0.95rem; }

.zitierbar { background: var(--bg2); padding: clamp(1.25rem, 3vw, 2rem); margin-bottom: 2.5rem; }
.zitierbar p:last-child { margin-bottom: 0; }

.pressfotos { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(1.25rem, 3vw, 2.25rem); }
.pressfoto { margin: 0; }
.pressfoto img { width: 100%; aspect-ratio: 4/5; object-fit: cover; }
.pressfoto figcaption { display: flex; flex-direction: column; gap: 0.25rem; padding-top: 0.7rem; font-size: 0.88rem; color: var(--ink2); }
.pressfoto .nachweis { font-size: 0.76rem; color: var(--ink3); }
.pressfoto a { font-size: 0.74rem; letter-spacing: 0.13em; text-transform: uppercase; color: var(--accent); text-decoration: none; border-bottom: 1px solid currentColor; align-self: flex-start; margin-top: 0.3rem; padding-bottom: 2px; }

.wege-gross { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(1.75rem, 4vw, 3.5rem); }
.weg { border-top: 3px solid var(--accent); padding-top: 1.2rem; }
.weg h2 { font-family: var(--serif); font-weight: 400; font-size: 1.5rem; margin: 0 0 0.7rem; }
.weg p { color: var(--ink2); font-size: 0.95rem; margin: 0 0 0.7rem; }

.rechtstext p { color: var(--ink2); font-size: 0.95rem; }
.rechtstext h2, .rechtstext h3 { font-family: var(--serif); font-weight: 500; }

/* Fuß */

footer.site { background: var(--foot-bg); color: var(--foot-ink); padding-block: clamp(2.5rem, 5vw, 3.5rem) 2rem; }
.foot-top { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 1rem 2rem; padding-bottom: 2rem; border-bottom: 1px solid var(--foot-rule); }
.foot-claim { font-family: var(--serif); font-size: 1.35rem; font-weight: 300; margin: 0; }
.foot-rechts { text-align: right; }
.foot-mail { margin: 0; font-size: 1rem; }
.foot-netz { margin: 0.6rem 0 0; font-size: 0.8rem; letter-spacing: 0.08em; text-transform: uppercase; }
.foot-netz a { color: var(--foot-ink2); text-decoration: none; margin-left: 1.25rem; border-bottom: 1px solid transparent; }
.foot-netz a:first-child { margin-left: 0; }
.foot-netz a:hover { color: var(--foot-ink); border-bottom-color: var(--foot-ink2); }
@media (max-width: 42rem) { .foot-rechts { text-align: left; } }
.foot-mail a { color: var(--foot-ink); text-underline-offset: 3px; }
.foot-bottom { display: flex; flex-wrap: wrap; gap: 0.75rem 2rem; padding-top: 1.5rem; font-size: 0.8rem; color: var(--foot-ink2); }
.foot-bottom a { color: var(--foot-ink2); }

/* Rollen im Kopf sind Links */
.roles a { text-decoration: none; color: inherit; border-bottom: 1px solid transparent; padding-bottom: 2px; }
.roles a:hover, .roles a:focus-visible { color: var(--ink); border-bottom-color: var(--accent); }

/* Markierung: im Grundstil bewusst unauffaellig */
.strich { }

/* Forschungsband auf der Startseite */
.forschungsband { padding-block: 0 clamp(3.5rem, 8vw, 6rem); }
.fband { display: flex; flex-wrap: wrap; align-items: baseline; gap: 0.6rem 1.75rem; border-top: 1px solid var(--rule); border-bottom: 1px solid var(--rule); padding: 1.25rem 0; }
.fband .lead-label { font-size: 0.7rem; font-weight: 600; letter-spacing: 0.18em; text-transform: uppercase; color: var(--accent); flex: none; }
.fband p { margin: 0; font-size: 0.95rem; color: var(--ink2); max-width: 44rem; }
.fband .mehr { margin-left: auto; }

/* Forschungsseite */
.projektkasten { border: 1px solid var(--rule); padding: clamp(1.25rem, 3vw, 2rem); margin-top: 2rem; }
.projektkasten h3 { font-family: var(--serif); font-weight: 400; font-size: 1.5rem; margin: 0 0 0.7rem; }
.projektkasten p { color: var(--ink2); font-size: 0.95rem; margin: 0 0 1rem; }
.trenner { border: 0; border-top: 2px solid var(--ink); max-width: var(--max); margin: 0 auto; width: calc(100% - 2 * var(--pad)); }
.workshop { display: grid; grid-template-columns: 1.1fr 1fr; gap: clamp(2rem, 5vw, 4rem); align-items: start; }
.workshop h2 { font-family: var(--serif); font-weight: 300; font-size: clamp(1.8rem, 4vw, 2.6rem); line-height: 1.12; margin: 0 0 1rem; }
.workshop p { color: var(--ink2); margin: 0 0 1rem; max-width: 32rem; }
.checkliste.dunkel li { border-top: 1px solid var(--rule); color: var(--ink2); }
.checkliste.dunkel li::before { background: var(--accent); }

@media (max-width: 60rem) {
  .workshop { grid-template-columns: 1fr; }
  .fband .mehr { margin-left: 0; }
}

/* Unter 76rem reicht die aufgehellte Flaeche nicht mehr aus. Dann klappt der
   Hero auseinander: Foto oben, Text darunter auf Weiss. */
@media (max-width: 76rem) {
  .hero {
    display: flex; flex-direction: column; align-items: stretch;
    /* Gestapelt darf die Hoehe nicht mehr am Seitenverhaeltnis haengen,
       sonst laeuft der Text aus dem Kasten heraus. */
    aspect-ratio: auto; min-height: 0; max-height: none; overflow: visible;
  }
  .hero .hero-bild {
    position: static; z-index: auto; order: 1;
    height: auto; aspect-ratio: 3 / 2; object-position: 68% 22%;
  }
  .hero::before { display: none; }
  .hero .credit {
    position: static; order: 2;
    padding: 0.45rem var(--pad) 0; text-align: left;
  }
  .hero .shell { order: 3; }
  .hero-text { max-width: none; padding-top: 1.8rem; }
}

/* Schmale Schirme */

/* Mittlere Breiten: Cover links, Text rechts, Autorenfoto darunter neben dem Cover */
@media (max-width: 72rem) {
  .band-book .grid { grid-template-columns: 12rem 1fr; }
  .band-book .cover    { grid-column: 1; grid-row: 1; }
  .band-book .booktext { grid-column: 2; grid-row: 1 / span 2; }
  .band-book .authors  { grid-column: 1; grid-row: 2; }
}

@media (max-width: 60rem) {
  .band-book .grid { grid-template-columns: 11rem 1fr; }
  .cards, .gigs, .pods, .format-grid, .pressfotos, .wege-gross { grid-template-columns: 1fr 1fr; }
  .kontakt-teaser, .anfrage, .seitenkopf.mit-bild, .aktuell, .standgrid, .vitagrid { grid-template-columns: 1fr; }
  .seitenkopf.mit-bild figure { max-width: 20rem; }
  .row { grid-template-columns: 10rem 1fr; }
  .podbig { grid-template-columns: 11rem 1fr; }
}

@media (max-width: 42rem) {
  .hero .hero-bild { aspect-ratio: 4 / 3; }
  .cards, .gigs, .pods, .format-grid, .topics, .pressfotos, .wege-gross, .awards { grid-template-columns: 1fr; }
  .thema { grid-template-columns: 1fr; gap: 0.3rem; }
  .thema .tnum { padding-top: 0; }
  .block-head { flex-direction: column; align-items: flex-start; gap: 0.6rem; }
  .awardstrip .mehr { margin-left: 0; }
  .awardstrip li { white-space: normal; }
  .row { grid-template-columns: 1fr; }
  .rthumb { max-width: 16rem; }
  .podbig { grid-template-columns: 1fr; }
  .podbig .pcover { max-width: 14rem; }
  .band-book .grid { grid-template-columns: 1fr; }
  .band-book .cover, .band-book .booktext, .band-book .authors { grid-column: 1; grid-row: auto; }
  .band-book .authors { max-width: 20rem; }
  .band-book .cover { max-width: 13rem; }
}


/* ============================================================
   Probefassung: tiefes Dunkelblau als Schriftfarbe,
   Brombeer bleibt der einzige Akzent, dazu der Pinselstrich.
   ============================================================ */

:root {
  --ink:       #14203A;
  --ink2:      #47536E;
  --ink3:      #6E778D;
  --rule:      #DEE1E8;
  --bg2:       #F4F5F8;
  --foot-bg:   #14203A;
  --foot-ink:  #E8EAF0;
  --foot-ink2: #9AA3B8;
  --foot-rule: #2C3A57;
  --shade:     rgba(20,32,58,0.55);
}

.pcover.c2 { background: #14203A; }

/* Textmarker: gerader Balken, Brombeer bei 30 Prozent, Schrift bleibt dunkel */
.strich {
  background-image: linear-gradient(rgba(138, 27, 74, 0.30), rgba(138, 27, 74, 0.30));
  background-repeat: no-repeat;
  background-position: 0 64%;
  background-size: 100% 0.72em;
  padding: 0 0.14em;
  box-decoration-break: clone;
  -webkit-box-decoration-break: clone;
}

/* in der grossen Ueberschrift etwas flacher, damit es nicht klotzig wird */
.hero h1 .strich { background-size: 100% 0.62em; background-position: 0 62%; }
.seitenkopf h1 .strich { background-size: 100% 0.62em; background-position: 0 62%; }

/* im markierten Wort bleibt die Schriftfarbe dunkel, auch kursiv.
   Sonst laege Brombeer auf Brombeer und der Kontrast waere zu gering. */
.hero h1 .strich em,
.strich em { color: inherit; }

/* auf farbigem oder dunklem Grund wird der Balken hell */
.band-book .strich,
.quote-band .strich {
  background-image: linear-gradient(rgba(255, 255, 255, 0.28), rgba(255, 255, 255, 0.28));
}


/* ============================================================
   Unterseiten: einheitlicher Kopf mit Bild, Listen, Baender
   ============================================================ */

/* Kopfbild rechts: festes Seitenverhaeltnis, damit hohe Fotos den Kopf nicht strecken */
.kopfbild { margin: 0; }
.kopfbild img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.kopfbild.hoch img { aspect-ratio: 4 / 5; }
.kopfbild.breit img { aspect-ratio: 3 / 2; }
.kopfbild figcaption { font-size: 0.7rem; color: var(--ink3); padding-top: 0.5rem; }
.seitenkopf.mit-bild { padding-bottom: clamp(2rem, 4vw, 3rem); }
.seitenkopf.mit-bild > div > p:last-child { margin-bottom: 0; }

/* Baender direkt unter dem Kopf */
.format-grid + .buehnenband { margin-top: clamp(2.5rem, 5vw, 4rem); }
.gigs.nachband { margin-top: clamp(1.75rem, 4vw, 2.75rem); }
.buehnenband ul { color: var(--ink); }

/* Zwei Textspalten (Forschung: Frage und Weg) */
.zweispalt { display: grid; grid-template-columns: 1.1fr 1fr; gap: clamp(2rem, 6vw, 5rem); align-items: start; }
.zweispalt p { color: var(--ink2); max-width: 36rem; margin: 0 0 1rem; }
.h2-klein { font-family: var(--serif); font-weight: 400; font-size: clamp(1.6rem, 3vw, 2.2rem); line-height: 1.15; margin: 0 0 1.25rem; padding-bottom: 0.9rem; border-bottom: 1px solid var(--rule); }

.schritte { list-style: none; margin: 0; padding: 0; }
.schritte li { border-bottom: 1px solid var(--rule); padding: 0.85rem 0; font-size: 0.93rem; color: var(--ink2); line-height: 1.5; }
.schritte li strong { display: block; color: var(--accent); font-weight: 600; font-size: 0.68rem; letter-spacing: 0.16em; text-transform: uppercase; margin-bottom: 0.25rem; }

.standgrid .projektkasten { margin-top: 1.75rem; }
.standgrid .standbild { margin: 0; }

/* Podcasts */
.podcover .pcover { margin-bottom: 0; }
.fakten { list-style: none; margin: 0 0 1.3rem; padding: 0; border-top: 1px solid var(--rule); max-width: 38rem; }
.fakten li { border-bottom: 1px solid var(--rule); padding: 0.5rem 0; font-size: 0.88rem; color: var(--ink2); }

/* Presse: Fakten auf einen Blick */
.faktentabelle { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 0 clamp(2rem, 5vw, 4rem); }
.faktentabelle li { display: grid; grid-template-columns: 7rem 1fr; gap: 1rem; border-bottom: 1px solid var(--rule); padding: 0.65rem 0; font-size: 0.93rem; color: var(--ink2); }
.faktentabelle li strong { color: var(--ink3); font-weight: 600; font-size: 0.68rem; letter-spacing: 0.16em; text-transform: uppercase; padding-top: 0.25rem; }

/* Schmale Textspalte, aber linksbuendig am Raster */
.shell.schmal.links { max-width: var(--max); }
.shell.schmal.links > * { max-width: 52rem; }

/* Anfrage-Band auf der Auftrittsseite */
.klein-label { font-size: 0.7rem; letter-spacing: 0.2em; text-transform: uppercase; color: var(--ink3); margin: 0.4rem 0 0.75rem; }
.kontakt-teaser .checkliste.dunkel li { border-top: 1px solid var(--rule); }
.hinweis { font-size: 0.9rem; color: var(--ink2); margin: 1.25rem 0 0; }
.hinweis a { color: var(--accent); }

/* Ueber mich: Stationen einspaltig, damit die Reihenfolge stimmt */
.fband p a { color: var(--accent); }
.awards.stationen { grid-template-columns: 1fr; max-width: 56rem; }
.stationen .award { grid-template-columns: 6.5rem 1fr; }

/* Buchband: Zitat unter dem Text */
.buchzitat { margin: 1.4rem 0 0.6rem; max-width: 34rem; font-family: var(--serif); font-style: italic; font-size: 1.12rem; line-height: 1.45; border-left: 2px solid rgba(255,255,255,0.45); padding-left: 1rem; }
.buchzitat cite { display: block; margin-top: 0.5rem; font-family: var(--sans); font-style: normal; font-size: 0.7rem; letter-spacing: 0.16em; text-transform: uppercase; opacity: 0.8; }

/* Fruehere Filme: Reihenfolge spaltenweise */
.awards.spaltenweise { grid-auto-flow: column; }

/* Vortraege: Themen als kompaktes Raster, Anfrage in einer Zeile */
.themen-kompakt { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 0 clamp(2rem, 5vw, 4rem); }
.thema-kompakt { border-bottom: 1px solid var(--rule); padding: 1.1rem 0 1.2rem; }
.thema-kompakt h3 { font-family: var(--serif); font-weight: 400; font-size: 1.3rem; line-height: 1.2; margin: 0; }
.thema-kompakt .tsub { font-family: var(--serif); font-style: italic; font-size: 0.98rem; color: var(--ink2); margin: 0.25rem 0 0; }
.thema-kompakt p { margin: 0.5rem 0 0; font-size: 0.9rem; color: var(--ink2); }
.gigs.nachband + .buehnenband { margin-top: clamp(2.5rem, 5vw, 4rem); }
.anfrage-schlank { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1.5rem 3rem; border-top: 1px solid var(--ink); padding-top: clamp(1.75rem, 4vw, 2.5rem); }
.anfrage-schlank h2 { font-family: var(--serif); font-weight: 300; font-size: clamp(1.6rem, 3.4vw, 2.3rem); line-height: 1.12; margin: 0 0 0.6rem; }
.anfrage-schlank p { margin: 0; color: var(--ink2); max-width: 40rem; font-size: 0.96rem; }
.anfrage-schlank p a { color: var(--accent); }
.anfrage-schlank .btn { flex: none; }

/* Forschung: langer Kopftext neben hohem Bild, darunter Foto und Kasten */
.seitenkopf.lang.mit-bild { grid-template-columns: 1fr 22rem; align-items: stretch; }
/* Das Bild ist genau so hoch wie der Text daneben und schliesst mit ihm ab */
.seitenkopf.lang .kopfbild { display: flex; flex-direction: column; }
.seitenkopf.lang .kopfbild img { flex: 1; aspect-ratio: auto; height: 100%; min-height: 18rem; object-position: 50% 40%; }
.seitenkopf.lang .kopfbild figcaption { flex: none; }
.seitenkopf.lang > div > p:last-child { margin-bottom: 0; }
.seitenkopf.lang p a { color: var(--accent); }
.forschung-unten { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(2rem, 5vw, 4rem); align-items: start; }
.forschung-unten .projektkasten { margin-top: 0; background: var(--bg); }
.standbild.breit img { aspect-ratio: 4 / 3; }

/* Bildband: ein Kopf fuer Journalismus, Vortraege und Ueber mich */
.bildband { position: relative; }
.bildband img { width: 100%; aspect-ratio: 2400 / 900; max-height: 68vh; object-fit: cover; }
.bildband .credit { position: absolute; right: 1rem; bottom: 0.6rem; margin: 0; font-size: 0.7rem; letter-spacing: 0.04em; color: rgba(255,255,255,0.85); text-shadow: 0 0 6px rgba(0,0,0,0.5); }
.seitenkopf.nach-band { padding-block: clamp(2.5rem, 6vw, 4.5rem) 0; }
.seitenkopf.nach-band h1 { margin-bottom: 0; }
.seitenkopf.nach-band + .hero-nach { padding-top: clamp(1.25rem, 3vw, 2rem); }

/* Ueber mich: Lead, Fliesstext und Kurzfakten */
.vita-grid { display: grid; grid-template-columns: minmax(0, 38rem) 1fr; gap: clamp(2rem, 6vw, 6rem); align-items: start; }
.lead-gross { font-family: var(--sans); font-size: clamp(1.1rem, 1.6vw, 1.25rem); line-height: 1.55; color: var(--ink) !important; margin: 0 0 1.4rem !important; }
.kurzfakten { padding-top: 0.4rem; max-width: 24rem; }
.faktentabelle.eins { grid-template-columns: 1fr; }
.faktentabelle.eins li { grid-template-columns: 6rem 1fr; }
.buchhinweis { font-size: 0.86rem !important; opacity: 0.9; margin-top: 1.1rem !important; }
.buchhinweis a { color: inherit; }

/* Themen mit kleinen Nummern */
.thema-kompakt { display: grid; grid-template-columns: 2.5rem 1fr; column-gap: 0.5rem; }
.thema-kompakt .tnum { grid-row: 1 / span 3; font-size: 0.7rem; font-weight: 600; letter-spacing: 0.18em; color: var(--accent); padding-top: 0.45rem; }
.thema-kompakt h3, .thema-kompakt .tsub, .thema-kompakt p { grid-column: 2; }

/* Logoband: eine ruhige Zeile in Grau */
.logoband { border-top: 1px solid var(--rule); border-bottom: 1px solid var(--rule); padding: 1.4rem 0 1.6rem; }
.logoband .lead-label { display: block; font-size: 0.7rem; font-weight: 600; letter-spacing: 0.18em; text-transform: uppercase; color: var(--ink3); margin-bottom: 1.1rem; }
.logos { display: flex; flex-wrap: wrap; align-items: center; gap: 1.25rem clamp(1.75rem, 4vw, 3.5rem); }
.logos img { height: 1.7rem; width: auto; max-width: 10rem; filter: grayscale(1); opacity: 0.55; transition: opacity 0.2s; }
.logos img.gross { height: 2.6rem; }
.logos img.klein { height: 1.3rem; }
.logos a:hover img, .logos a:focus-visible img { opacity: 0.9; }
.logos a, .logos span { display: inline-flex; align-items: center; }

/* Forschungskasten unter dem Einleitungstext der Startseite */
.forschungskasten { margin-top: clamp(1.75rem, 4vw, 2.5rem); border-top: 1px solid var(--ink); padding: 1.4rem 0 0.5rem; }
.forschungskasten .label { margin-bottom: 0.6rem; }
.forschungskasten p { font-size: 0.98rem; color: var(--ink2); margin: 0 0 1rem; }
.forschungskasten .mehr { display: inline-block; }

/* Keine doppelten Linien direkt unter einer Blockueberschrift */
.block-head + ol.rows { border-top: 0; }
.block-head + .themen .thema:first-child { border-top: 0; }

/* Navigation auf schmalen Schirmen: eine Zeile zum Wischen statt ausgeblendet */
@media (max-width: 60rem) {
  .zweispalt, .forschung-unten, .seitenkopf.lang.mit-bild { grid-template-columns: 1fr; }
  .awards.spaltenweise { grid-auto-flow: row; grid-template-rows: none !important; }
  .vita-grid { grid-template-columns: 1fr; }
}
@media (max-width: 42rem) {
  .bildband img { aspect-ratio: 4 / 3; }
}
@media (max-width: 42rem) {
  .themen-kompakt { grid-template-columns: 1fr; }
}
@media (max-width: 42rem) {
  .faktentabelle { grid-template-columns: 1fr; }
  .faktentabelle li { grid-template-columns: 6rem 1fr; }
  .kopfbild { max-width: 22rem; }
}


/* ============================================================
   Oktober 2026: Menueknopf, Sprachlink, Buchband auf Dunkelblau,
   Zitatband ohne Gesicht, Schriftzuordnung
   ============================================================ */

/* Navigation: zweiteilige Menuepunkte bleiben zusammen */
nav.main a { white-space: nowrap; }
nav.main a.sprache { margin-left: 0.4rem; font-size: 0.72rem; letter-spacing: 0.12em; border: 1px solid var(--rule); padding: 0.3rem 0.55rem 0.25rem; }
nav.main a.sprache:hover { border-color: var(--ink2); }
nav.main a.sprache .lang { display: none; }
.menue-knopf { display: none; }

@media (max-width: 64rem) {
  .site-inner { gap: 1rem; }
  nav.main { display: none; }
  .header-cta { margin-left: auto; }
  .menue-knopf {
    display: inline-flex; flex-direction: column; justify-content: center; gap: 5px;
    width: 2.75rem; height: 2.75rem; padding: 0; margin: 0;
    background: none; border: 1px solid var(--rule); cursor: pointer; flex: none;
  }
  .menue-knopf span { display: block; width: 1.15rem; height: 1.5px; background: var(--ink); margin: 0 auto; transition: transform 0.2s, opacity 0.2s; }
  .menue-offen .menue-knopf span:nth-child(1) { transform: translateY(6.5px) rotate(45deg); }
  .menue-offen .menue-knopf span:nth-child(2) { opacity: 0; }
  .menue-offen .menue-knopf span:nth-child(3) { transform: translateY(-6.5px) rotate(-45deg); }
  .menue-offen nav.main {
    display: flex; flex-direction: column; gap: 0;
    position: absolute; left: 0; right: 0; top: 100%;
    background: var(--bg); border-bottom: 1px solid var(--rule);
    padding: 0.25rem var(--pad) 1rem; margin: 0; font-size: 1.05rem;
    box-shadow: 0 18px 30px -20px rgba(20,32,58,0.25);
  }
  .menue-offen nav.main a { padding: 0.85rem 0; border-bottom: 1px solid var(--rule); }
  .menue-offen nav.main a.hier { color: var(--accent); }
  .menue-offen nav.main a.sprache { margin: 0.6rem 0 0; border: 0; padding: 0.85rem 0 0; font-size: 0.95rem; letter-spacing: 0; color: var(--ink2); }
  .menue-offen nav.main a.sprache .kurz { display: none; }
  .menue-offen nav.main a.sprache .lang { display: inline; }
}

/* Buchband: Dunkelblau statt Brombeer, damit das Magenta des Covers nicht beisst */
.band-book { background: var(--ink); color: #F1F2F6; }
.band-book .btn { background: #fff; color: var(--ink); border-color: #fff; }
.band-book .btn:hover { background: transparent; color: #fff; }
.band-book .eyebrow { color: #B9C1D6; opacity: 1; }
.band-book .grid { align-items: center; }

/* Cover als Buch: leichte Drehung, Buchruecken, Seitenblock, kein Schlagschatten */
.band-book .cover.buch {
  position: relative; margin: 0;
  transform: perspective(1100px) rotateY(16deg);
  transform-origin: right center; transform-style: preserve-3d;
  padding-right: 6%;
}
.band-book .cover.buch img { position: relative; z-index: 2; width: 100%; box-shadow: none; border-radius: 1px 5px 5px 1px; }
.band-book .cover.buch::before {
  content: ""; position: absolute; top: 0.6%; bottom: 0.6%; left: 0; width: 24px;
  background: linear-gradient(90deg, #5F1A86 0%, #8A1C8C 55%, #B61F8E 100%);
  transform: rotateY(-90deg); transform-origin: left center; border-radius: 1px;
}
.band-book .cover.buch::after {
  content: ""; position: absolute; top: 0.6%; bottom: 0.6%; left: 2px; right: 0;
  background: repeating-linear-gradient(90deg, #F4F1EC 0 2px, #DED9D2 2px 3px);
  transform: translateZ(-23px); border-radius: 0 4px 4px 0;
}
@media (max-width: 42rem) {
  .band-book .cover.buch { max-width: 12rem; }
  /* Gestapelt: Cover, dann Text, dann Autorenfoto */
  .band-book .cover    { order: 1; }
  .band-book .booktext { order: 2; }
  .band-book .authors  { order: 3; margin-top: 0.5rem; }
}
@media (prefers-reduced-motion: reduce) {
  .band-book .cover.buch { transform: none; padding-right: 0; }
  .band-book .cover.buch::before, .band-book .cover.buch::after { display: none; }
}

/* Zitatband: Gesicht rechts, Zitat links. Darunter klappt es auseinander. */
.quote-band img { object-position: 60% 42%; }
.quote-band blockquote { max-width: 30rem; }
.quote-band .veil {
  background: linear-gradient(90deg, rgba(20,32,58,0.78) 0%, rgba(20,32,58,0.66) 34%, rgba(20,32,58,0.28) 52%, rgba(20,32,58,0.14) 100%);
}
@media (max-width: 64rem) {
  .quote-band { display: block; min-height: 0; }
  .quote-band img { position: static; width: 100%; height: auto; aspect-ratio: 3 / 2; object-position: 50% 30%; }
  .quote-band .veil { display: none; }
  .quote-band .shell { padding-block: 2.25rem 2.75rem; }
  .quote-band blockquote { max-width: none; font-size: clamp(1.35rem, 4.6vw, 2rem); }
}

/* Vortraege: zwei Formate nebeneinander, Hinweis darunter */
.format-grid.zwei { grid-template-columns: 1fr 1fr; max-width: 60rem; }
.formathinweis { margin: 1.5rem 0 0; font-size: 0.9rem; color: var(--ink3); max-width: 44rem; }
@media (max-width: 42rem) { .format-grid.zwei { grid-template-columns: 1fr; } }