/* Musterseite „Clara Weidenfeld“ – Hörbuchsprecherin (frei erfunden, Beispiel von Autorenauftritt.de)
   Stil „Samt und Messing“: dunkler Aubergine-Samt wie in einer Sprecherkabine, warmes Leinen für Text,
   Messing als Akzent. Erwachsen, warm, hochwertig. */
@font-face{font-family:"Cormorant Garamond";src:url("fonts/cormorant-garamond-latin-600-normal.woff2") format("woff2");font-weight:600;font-display:swap}
@font-face{font-family:"Cormorant Garamond";src:url("fonts/cormorant-garamond-latin-500-italic.woff2") format("woff2");font-weight:500;font-style:italic;font-display:swap}
@font-face{font-family:"Great Vibes";src:url("fonts/great-vibes-latin-400-normal.woff2") format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Hanken Grotesk";src:url("fonts/hanken-grotesk-latin-400-normal.woff2") format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Hanken Grotesk";src:url("fonts/hanken-grotesk-latin-500-normal.woff2") format("woff2");font-weight:500;font-display:swap}
@font-face{font-family:"Hanken Grotesk";src:url("fonts/hanken-grotesk-latin-600-normal.woff2") format("woff2");font-weight:600;font-display:swap}

:root{
  --samt:#2A1A22;       /* dunkle Flächen, Text */
  --samt-2:#3A2630;     /* Karten auf dunkel */
  --samt-3:#4B3540;     /* Linien auf dunkel */
  --leinen:#F3ECE4;     /* Grundfläche hell */
  --leinen-2:#E9DFD4;   /* abgesetzte helle Flächen */
  --rose:#E6CFC6;       /* Text auf dunkel, zart */
  --grau:#6E5D63;       /* Nebentext auf hell */
  --grau-d:#B9A7AD;     /* Nebentext auf dunkel */
  --messing:#B8873A;    /* Akzent */
  --messing-hell:#D9AE63;
  --messing-dunkel:#8C6224; /* Akzenttext auf hell (Kontrast) */
  --display:"Cormorant Garamond",Garamond,Georgia,serif;
  --schrift:"Great Vibes","Cormorant Garamond",cursive;
  --body:"Hanken Grotesk","Segoe UI",system-ui,sans-serif;
  --wrap:1180px;
}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:88px}
body{margin:0;overflow-x:clip;background:var(--leinen);color:var(--samt);font-family:var(--body);font-size:1.0625rem;line-height:1.65}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
h1,h2,h3{font-family:var(--display);font-weight:600;line-height:1.05;margin:0;text-wrap:balance}
p{margin:0}
:focus-visible{outline:2px solid var(--messing);outline-offset:3px}
.wrap{width:min(var(--wrap),100% - 2.5rem);margin-inline:auto}
.skip{position:absolute;left:-9999px}
.skip:focus{left:1rem;top:1rem;background:var(--samt);color:#fff;padding:.5rem 1rem;z-index:100}
.zeile{display:block;font-weight:600;font-size:.95rem;color:var(--messing-dunkel)}
.dunkel .zeile,.hero .zeile{color:var(--messing-hell)}

/* Buttons */
.btn{display:inline-flex;align-items:center;gap:.55rem;font-weight:600;font-size:1rem;text-decoration:none;padding:.85rem 1.5rem;border-radius:999px;border:1.5px solid currentColor;transition:background .2s,color .2s,border-color .2s;cursor:pointer}
.btn-messing{background:var(--messing);border-color:var(--messing);color:var(--samt)}
.btn-messing:hover{background:var(--messing-hell);border-color:var(--messing-hell)}
.btn-samt{background:var(--samt);border-color:var(--samt);color:var(--leinen)}
.btn-samt:hover{background:var(--messing);border-color:var(--messing);color:var(--samt)}
.btn-rand{color:var(--samt)}
.btn-rand:hover{background:var(--samt);color:var(--leinen)}
.btn-hell{color:var(--leinen);border-color:rgba(243,236,228,.4)}
.btn-hell:hover{background:var(--leinen);color:var(--samt)}

/* Kopf */
.site-header{position:sticky;top:0;z-index:50;background:rgba(42,26,34,.96);backdrop-filter:blur(8px);color:var(--leinen);border-bottom:1px solid var(--samt-3)}
.site-header .wrap{display:flex;align-items:center;justify-content:space-between;height:74px;gap:1rem}
.logo{font-family:var(--schrift);font-weight:400;font-size:2.35rem;line-height:1.25;padding:.1em .15em 0 0;text-decoration:none;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0;color:var(--leinen)}
.logo:hover{color:var(--messing-hell)}
.logo .aa-logo{height:46px;width:auto;display:block}
.nav{display:flex;align-items:center;gap:1.35rem;font-weight:500;font-size:.97rem}
.nav a{text-decoration:none;color:var(--rose)}
.nav a:hover,.nav a[aria-current="page"]{color:var(--messing-hell)}
.nav .btn{color:var(--samt);padding:.55rem 1.1rem;font-size:.95rem}
.nav .btn:hover{color:var(--samt)}
.nav-toggle{display:none;background:none;border:0;padding:.5rem;cursor:pointer;color:var(--leinen)}

/* Startbereich mit Hörproben */
.hero{background:radial-gradient(90% 70% at 85% 10%,#4A2C38 0%,transparent 60%),var(--samt);color:var(--leinen);overflow:hidden}
.hero .wrap{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:4rem;align-items:start;padding:4.5rem 0 5.5rem}
.hero h1{font-size:clamp(3rem,6.6vw,5.6rem);margin-top:1rem;letter-spacing:-.005em}
.hero .lead{font-size:1.18rem;color:var(--rose);max-width:31rem;margin-top:1.6rem}
.hero .actions{display:flex;flex-wrap:wrap;gap:.9rem;margin-top:2.2rem}
.hero .fakten{display:flex;flex-wrap:wrap;gap:.5rem 1.4rem;margin-top:2.6rem;padding-top:1.4rem;border-top:1px solid var(--samt-3);color:var(--grau-d);font-size:.95rem}

.kabine{background:var(--samt-2);border:1px solid var(--samt-3);border-radius:22px;padding:1.6rem;box-shadow:0 30px 60px rgba(0,0,0,.35)}
.kabine-kopf{display:flex;align-items:center;justify-content:space-between;gap:1rem}
.kabine-kopf h2{font-size:2rem}
.vu{width:118px;height:64px;flex:none}
.pegel-platz{display:flex;align-items:center;min-height:64px}
.vu .nadel{transition:none}
.genres{display:flex;flex-wrap:wrap;gap:.45rem;margin:1.2rem 0 1rem}
.genres button{font:inherit;font-size:.9rem;font-weight:500;color:var(--rose);background:transparent;border:1px solid var(--samt-3);border-radius:999px;padding:.35rem .9rem;cursor:pointer}
.genres button:hover{border-color:var(--messing)}
.genres button[aria-pressed="true"]{background:var(--messing);border-color:var(--messing);color:var(--samt)}
.proben{list-style:none;margin:0;padding:0;display:flex;flex-direction:column}
.probe{display:grid;grid-template-columns:auto minmax(0,1fr);gap:.2rem 1rem;align-items:center;padding:1rem 0;border-top:1px solid var(--samt-3)}
.probe[hidden]{display:none}
.probe .info{min-width:0}
.probe .kat{font-size:.78rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--messing-hell)}
.probe h3{font-family:var(--body);font-weight:600;font-size:1.05rem;line-height:1.3;color:var(--leinen)}
.probe p{font-size:.92rem;color:var(--grau-d)}
.probe audio{grid-column:1/-1;width:100%;margin-top:.5rem}
.probe .play{width:48px;height:48px;border-radius:50%;border:1.5px solid var(--messing);background:transparent;color:var(--messing-hell);display:grid;place-items:center;cursor:pointer;grid-row:span 2}
.probe .play:hover,.probe.laeuft .play{background:var(--messing);color:var(--samt)}
.probe .spur{grid-column:2;display:flex;align-items:center;gap:.8rem}
.probe .leiste{flex:1;height:4px;background:var(--samt-3);border-radius:2px;cursor:pointer;position:relative}
.probe .leiste i{position:absolute;inset:0 auto 0 0;width:0;background:var(--messing);border-radius:2px}
.probe .zeit{font-size:.85rem;color:var(--grau-d);font-variant-numeric:tabular-nums;min-width:4.4rem;text-align:right}
.proben [data-leer]{padding:1.2rem 0;color:var(--grau-d);border-top:1px solid var(--samt-3)}
.proben [data-leer] a{color:var(--messing-hell)}

/* Abschnitte */
.section{padding:6rem 0}
.kopf{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:1.4rem 4rem;align-items:end;margin-bottom:3.4rem}
.kopf h2{font-size:clamp(2.5rem,4.8vw,3.8rem);margin-top:.6rem}
.kopf p{color:var(--grau);font-size:1.1rem;max-width:34rem}
.dunkel{background:var(--samt);color:var(--leinen)}
.dunkel .kopf p{color:var(--rose)}
.getoent{background:var(--leinen-2)}

/* Hörbücher */
.hoerbuecher{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,200px),1fr));gap:2.6rem 1.8rem}
.hb{display:flex;flex-direction:column;gap:.45rem}
.hb .cover{position:relative;margin-bottom:.5rem}
.hb .cover img{width:100%;aspect-ratio:1/1;object-fit:cover;border-radius:10px;box-shadow:0 14px 28px rgba(42,26,34,.2)}
.neu{position:absolute;top:.6rem;left:.6rem;background:var(--messing);color:var(--samt);font-weight:600;font-size:.78rem;padding:.15rem .6rem;border-radius:999px}
.hb h3{font-family:var(--body);font-weight:600;font-size:1.04rem;line-height:1.3}
.hb .autor{color:var(--grau);font-size:.94rem}
.hb .shops{display:flex;flex-wrap:wrap;gap:.4rem;margin-top:.3rem}
.hb .shops a{font-weight:600;font-size:.84rem;text-decoration:none;color:var(--samt);border:1px solid #CDBFB3;border-radius:999px;padding:.15rem .7rem}
.hb .shops a:hover{background:var(--samt);color:var(--leinen);border-color:var(--samt)}
.leer{color:var(--grau);border:1px dashed #CDBFB3;border-radius:12px;padding:1.4rem}

/* So entsteht dein Hörbuch */
.ablauf{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:0;border-top:1px solid var(--samt-3);counter-reset:s}
.ablauf li{counter-increment:s;padding:1.8rem 1.4rem 0 0;display:flex;flex-direction:column;gap:.6rem}
.ablauf li::before{content:counter(s,decimal-leading-zero);font-family:var(--display);font-size:2.6rem;line-height:1;color:var(--messing-hell)}
.ablauf h3{font-family:var(--body);font-weight:600;font-size:1.08rem}
.ablauf p{color:var(--grau-d);font-size:.97rem}
.mitbringen{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:3rem;margin-top:4rem}
.mitbringen h3{font-size:1.9rem;margin-bottom:1rem}
.liste{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.6rem}
.liste li{padding-left:1.5rem;position:relative;color:var(--rose)}
.liste li::before{content:"";position:absolute;left:0;top:.62em;width:.6rem;height:.6rem;border-radius:50%;border:1.5px solid var(--messing-hell)}
.fragen details{border-top:1px solid var(--samt-3);padding:1rem 0}
.fragen details:last-child{border-bottom:1px solid var(--samt-3)}
.fragen summary{cursor:pointer;font-weight:600;list-style:none;display:flex;justify-content:space-between;gap:1rem}
.fragen summary::-webkit-details-marker{display:none}
.fragen summary::after{content:"+";color:var(--messing-hell);font-size:1.3rem;line-height:1}
.fragen details[open] summary::after{content:"–"}
.fragen details p{margin-top:.7rem;color:var(--grau-d)}

/* Sprechanfrage */
.anfrage-grid{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:4rem;align-items:start}
.anfrage-grid h2{font-size:clamp(2.5rem,4.8vw,3.8rem);margin-top:.6rem}
.anfrage-grid .intro{color:var(--grau);margin-top:1.3rem;font-size:1.1rem}
.anfrage-grid .liste{margin-top:1.8rem}
.anfrage-grid .liste li{color:var(--samt)}
.anfrage-grid .liste li::before{border-color:var(--messing-dunkel)}
.formular-box{background:#FBF7F2;border:1px solid #DED1C4;border-radius:20px;padding:2.2rem}
.formular-ersatz{color:var(--grau)}
.formular-ersatz a{color:var(--messing-dunkel);font-weight:600}
.aa-kontakt input,.aa-kontakt textarea,.aa-kontakt select,
.aa-sprech-anfrage input,.aa-sprech-anfrage textarea,.aa-sprech-anfrage select,
.formular input,.formular textarea,.formular select{width:100%;font:inherit;font-size:1rem;color:var(--samt);background:#fff;border:1px solid #D7C9BC;border-radius:10px;padding:.7rem .85rem}
.aa-kontakt input:focus,.aa-kontakt textarea:focus,.aa-sprech-anfrage input:focus,.aa-sprech-anfrage textarea:focus,.aa-sprech-anfrage select:focus,.formular input:focus,.formular textarea:focus{border-color:var(--messing);outline:none}
.aa-kontakt label,.aa-sprech-anfrage label,.formular label{display:block;font-weight:600;font-size:.95rem;margin:0 0 .35rem}
.aa-kontakt button,.aa-kontakt [type=submit],.aa-sprech-anfrage button,.aa-sprech-anfrage [type=submit],.formular button{font:inherit;font-weight:600;background:var(--samt);color:var(--leinen);border:0;border-radius:999px;padding:.85rem 1.6rem;cursor:pointer}
.aa-kontakt button:hover,.aa-sprech-anfrage button:hover,.formular button:hover{background:var(--messing);color:var(--samt)}

/* Wegweiser zu Unterseiten */
.wege{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.6rem}
.weg{display:flex;flex-direction:column;gap:.8rem;background:#FBF7F2;border:1px solid #DED1C4;border-radius:20px;padding:2rem;text-decoration:none;transition:border-color .2s,transform .2s}
.weg:hover{border-color:var(--messing);transform:translateY(-3px)}
.weg .zeile{font-size:.88rem}
.weg h3{font-size:2rem}
.weg p{color:var(--grau)}
.weg .pfeil{margin-top:auto;font-weight:600;color:var(--messing-dunkel)}

/* Kontakt */
.kontakt .wrap{display:grid;grid-template-columns:minmax(0,25rem) minmax(0,1fr);gap:4rem;align-items:start}
.kontakt h2{font-size:clamp(2.5rem,4.8vw,3.8rem);margin-top:.6rem}
.kontakt .intro{color:var(--rose);margin-top:1.2rem}
.kontaktwege{display:flex;flex-direction:column;align-items:flex-start;gap:.9rem;margin-top:2rem}
.kontaktwege .mail{color:var(--messing-hell);font-weight:600}
.social{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:1.6rem}
.social a,.aa-social a{display:inline-block;color:var(--leinen);text-decoration:none;font-weight:500;font-size:.94rem;border:1px solid var(--samt-3);border-radius:999px;padding:.35rem .95rem;margin:0 .35rem .35rem 0}
.social a:hover,.aa-social a:hover{border-color:var(--messing)}
.community{margin-top:1.6rem;padding:1.2rem 1.3rem;border:1px solid var(--samt-3);border-radius:16px;color:var(--rose);font-size:.96rem}
.community a{color:var(--messing-hell);font-weight:600}
.dunkel .formular-box{background:var(--samt-2);border-color:var(--samt-3);color:var(--leinen)}
.dunkel .aa-kontakt input,.dunkel .aa-kontakt textarea,.dunkel .formular input,.dunkel .formular textarea{background:var(--samt);border-color:var(--samt-3);color:var(--leinen)}
.dunkel .aa-kontakt button,.dunkel .formular button{background:var(--messing);color:var(--samt)}

/* Unterseiten */
.seitenkopf{background:var(--samt);color:var(--leinen);padding:4.5rem 0 4rem}
.seitenkopf h1{font-size:clamp(2.8rem,6vw,4.8rem);margin-top:.8rem;max-width:16ch}
.seitenkopf .lead{color:var(--rose);font-size:1.18rem;max-width:38rem;margin-top:1.4rem}
.seitenkopf .actions{display:flex;flex-wrap:wrap;gap:.9rem;margin-top:2rem}
.angebote{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.6rem}
.angebot{background:#FBF7F2;border:1px solid #DED1C4;border-radius:20px;padding:2rem;display:flex;flex-direction:column;gap:.8rem}
.angebot .dauer{font-family:var(--display);font-size:2.6rem;line-height:1;color:var(--messing-dunkel)}
.angebot .dauer small{font-family:var(--body);font-size:.95rem;color:var(--grau);margin-left:.3rem}
.angebot h3{font-size:1.9rem}
.angebot p{color:var(--grau)}
.angebot .preis{margin-top:auto;padding-top:1rem;border-top:1px solid #DED1C4;font-weight:600}
.angebot.hervor,.angebote .angebot:nth-child(2){background:var(--samt);border-color:var(--samt);color:var(--leinen)}
.angebot.hervor p,.angebote .angebot:nth-child(2) p{color:var(--rose)}
.angebot.hervor .dauer,.angebote .angebot:nth-child(2) .dauer{color:var(--messing-hell)}
.angebot.hervor .dauer small,.angebote .angebot:nth-child(2) .dauer small{color:var(--grau-d)}
.angebot.hervor .preis,.angebote .angebot:nth-child(2) .preis{border-color:var(--samt-3)}
.stimmen{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:2rem}
.stimme{margin:0;display:flex;flex-direction:column;gap:1rem}
.stimme blockquote{margin:0;font-family:var(--display);font-style:italic;font-weight:500;font-size:1.45rem;line-height:1.35}
.stimme figcaption{font-weight:600;color:var(--grau)}
.zwei{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:4rem;align-items:center}
.zwei img{width:100%;border-radius:20px}
.zwei h2{font-size:clamp(2.2rem,4.2vw,3.2rem);margin:.6rem 0 1.2rem}
.fliesstext p + p{margin-top:1rem}
.fliesstext{color:var(--grau)}
.vita-grid{display:grid;grid-template-columns:minmax(0,380px) minmax(0,1fr);gap:4.5rem;align-items:start}
.vita-grid img{width:100%;aspect-ratio:4/5;object-fit:cover;border-radius:200px 200px 20px 20px;position:sticky;top:110px}
.brille + .brille{margin-top:3.2rem;padding-top:3.2rem;border-top:1px solid #DED1C4}
.brille h2{font-size:clamp(2rem,3.8vw,2.8rem);margin:.5rem 0 1.1rem}
.brille .liste li{color:var(--samt)}
.brille .liste li::before{border-color:var(--messing-dunkel)}
.brille .liste{margin-top:1.4rem}
.eigene{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,260px),1fr));gap:1.6rem;margin-top:1.4rem}
.eigenes{display:grid;grid-template-columns:90px 1fr;gap:1rem;align-items:start}
.eigenes img{border-radius:4px}
.eigenes h3{font-size:1.4rem}
.eigenes p{color:var(--grau);font-size:.94rem}
.eigenes .shops a{font-weight:600;font-size:.92rem;color:var(--messing-dunkel);margin-right:.7rem}
.podcast-karte{background:var(--samt-2);border:1px solid var(--samt-3);border-radius:22px;padding:2.2rem;display:flex;flex-direction:column;gap:1rem}
.podcast-karte h2{font-size:2.6rem}
.podcast-karte p{color:var(--rose)}
.unterseite{padding:4rem 0 6rem}
.unterseite .schmal{max-width:780px}
.unterseite h1{font-size:clamp(2.6rem,5vw,3.8rem);margin-bottom:2rem}
.aa-rechtstext h3{font-family:var(--display);font-size:1.6rem;margin:2rem 0 .6rem}
.aa-rechtstext p,.aa-rechtstext li{color:var(--grau);margin-bottom:.8rem}
.aa-rechtstext a{color:var(--messing-dunkel)}

/* Fußzeile */
.site-footer{background:#1E1218;color:var(--rose);padding:3.6rem 0 2.2rem}
.footer-grid{display:flex;justify-content:space-between;gap:2.5rem;flex-wrap:wrap}
.footer-brand{max-width:22rem;display:flex;flex-direction:column;gap:.8rem}
.footer-brand .name{font-family:var(--schrift);font-weight:400;font-size:2.4rem;line-height:1.2;color:var(--leinen)}
.footer-col{display:flex;flex-direction:column;gap:.55rem}
.footer-col h3{font-family:var(--body);font-weight:600;font-size:.9rem;color:var(--messing-hell)}
.footer-col a{text-decoration:none}
.footer-col a:hover{text-decoration:underline;color:var(--leinen)}
.footer-bottom{border-top:1px solid var(--samt-3);margin-top:2.6rem;padding-top:1.4rem;font-size:.9rem;color:var(--grau-d);display:flex;justify-content:space-between;align-items:baseline;gap:.6rem 1.5rem;flex-wrap:wrap}
.footer-bottom .credit{color:var(--grau-d);text-decoration:none;font-size:.82rem;opacity:.8;transition:color .2s,opacity .2s}
.footer-bottom .credit:hover{color:var(--messing-hell);opacity:1;text-decoration:underline}

/* ---------- Hörbücher: Bühne, Coverband, Regal, große Ansicht ---------- */
.hb-start{overflow:hidden;padding-bottom:4.5rem}
.meta-zeile{display:flex;flex-wrap:wrap;gap:.2rem 0;color:var(--grau);font-weight:500}
.meta-zeile span+span::before{content:"·";margin:0 .55rem;color:var(--messing)}

/* Bühne: neueste Produktion */
.buehne-karte{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:3.5rem;align-items:center;background:var(--samt);color:var(--leinen);border-radius:28px;padding:3rem;position:relative;overflow:hidden;isolation:isolate}
.buehne-karte::before{content:"";position:absolute;inset:-40% -10% auto auto;width:70%;aspect-ratio:1;background:radial-gradient(circle,rgba(184,135,58,.28),transparent 65%);z-index:-1}
.buehne-cover{position:relative;perspective:900px}
.buehne-cover img{width:100%;aspect-ratio:1/1;object-fit:cover;border-radius:14px;box-shadow:0 30px 60px rgba(0,0,0,.45),0 0 0 1px rgba(255,255,255,.06);transform:rotateY(-8deg) rotateX(3deg);transition:transform .6s cubic-bezier(.2,.7,.2,1)}
.buehne-karte:hover .buehne-cover img{transform:rotateY(0) rotateX(0) scale(1.02)}
.buehne-glanz{position:absolute;inset:0;border-radius:14px;background:linear-gradient(115deg,transparent 35%,rgba(255,255,255,.16) 50%,transparent 65%);background-size:250% 100%;background-position:120% 0;pointer-events:none;animation:glanz 7s ease-in-out infinite}
@keyframes glanz{0%,60%{background-position:120% 0}85%,100%{background-position:-60% 0}}
.buehne-text .zeile{color:var(--messing-hell)}
.buehne-text h3{font-size:clamp(2.4rem,4.6vw,3.8rem);margin-top:.5rem}
.buehne-unter{font-family:var(--display);font-style:italic;font-weight:500;font-size:1.4rem;color:var(--rose);margin-top:.3rem}
.buehne-text .meta-zeile{color:var(--grau-d);margin-top:.9rem}
.buehne-beschreibung{color:var(--rose);margin-top:1.2rem;display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden}
.buehne-beschreibung p+p{margin-top:.6rem}
.buehne-text .shops{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:1.6rem}
.buehne-text .shops a,.detail-text .shops a{font-weight:600;font-size:.92rem;text-decoration:none;border-radius:999px;padding:.45rem 1rem;border:1px solid rgba(243,236,228,.35);color:var(--leinen)}
.buehne-text .shops a:hover{background:var(--leinen);color:var(--samt)}

/* Hörprobe mit Wellenform */
.hp{display:flex;align-items:center;gap:1rem;margin-top:1.6rem;max-width:30rem}
.hp-knopf{flex:none;width:58px;height:58px;border-radius:50%;border:0;background:var(--messing);color:var(--samt);display:grid;place-items:center;cursor:pointer;box-shadow:0 0 0 0 rgba(184,135,58,.5);transition:background .2s}
.hp-knopf:hover{background:var(--messing-hell)}
.hp .i-pause,.hp.laeuft .i-play{display:none}
.hp.laeuft .i-pause{display:block}
.hp.laeuft .hp-knopf{animation:puls 1.8s ease-out infinite}
@keyframes puls{0%{box-shadow:0 0 0 0 rgba(184,135,58,.55)}100%{box-shadow:0 0 0 16px rgba(184,135,58,0)}}
.hp-spur{flex:1;min-width:0;display:flex;flex-direction:column;gap:.4rem}
.hp-label{font-size:.88rem;font-weight:600;color:var(--messing-hell)}
.hp-dauer{font-weight:500;color:var(--grau-d);font-variant-numeric:tabular-nums}
.hp-dauer:empty{display:none}
.hp-dauer::before{content:"· "}
.hp-welle{display:flex;align-items:center;gap:3px;height:38px;cursor:pointer}
.hp-welle i{flex:1;height:var(--h,50%);min-width:2px;border-radius:2px;background:var(--samt-3);transition:background .2s}
.hp-welle i.an{background:var(--messing-hell)}
.hp.laeuft .hp-welle i{animation:welle .9s ease-in-out infinite alternate;animation-delay:var(--v,0s)}
@keyframes welle{from{transform:scaleY(.55)}to{transform:scaleY(1)}}

/* Coverband */
.band{margin-top:3.5rem}
.band-reihe{overflow:hidden;padding:.8rem 0 2rem;margin-bottom:-1.2rem;-webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
.band-spur{display:flex;gap:22px;width:max-content;animation:band var(--dauer,60s) linear infinite}
.band-rueckwaerts .band-spur{animation-direction:reverse}
.band:hover .band-spur{animation-play-state:paused}
@keyframes band{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.band-cover{flex:none;display:block;width:178px;border-radius:10px;overflow:hidden;box-shadow:0 12px 26px rgba(42,26,34,.22);transition:transform .35s cubic-bezier(.2,.7,.2,1),box-shadow .35s}
.band-cover img{width:100%;aspect-ratio:1/1;object-fit:cover}
.band-cover span{display:grid;place-items:center;aspect-ratio:1/1;padding:1rem;background:var(--samt);color:var(--leinen);font-family:var(--display);font-size:1.3rem;text-align:center;text-decoration:none}
.band-cover:hover,.band-cover:focus-visible{transform:translateY(-6px) scale(1.04);box-shadow:0 22px 40px rgba(42,26,34,.3)}
.band-still .band-quelle{width:min(var(--wrap),100% - 2.5rem);margin-inline:auto;display:flex;gap:22px;overflow-x:auto;scroll-snap-type:x mandatory;padding:.6rem 0 1rem}
.band-still .band-cover{scroll-snap-align:start}
.band-fuss{display:flex;justify-content:center;margin-top:2.6rem}

/* Hörbücher-Seite */
.hb-zaehler{margin-top:2rem;color:var(--grau-d);font-size:1.05rem}
.hb-zaehler strong{font-family:var(--display);font-size:3.2rem;line-height:1;color:var(--messing-hell);margin-right:.4rem;vertical-align:-.15em}
.hb-regal-bereich{padding-top:3.5rem}
.hb-filter .aa-filter{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:1rem 2rem;margin:0 0 2.8rem;padding-bottom:1.6rem;border-bottom:1px solid #DED1C4}
.hb-filter .aa-filter-knoepfe{gap:.5rem}
.hb-filter .aa-filter-knopf{font:inherit;font-size:.95rem;font-weight:500;opacity:1;color:var(--samt);background:#FBF7F2;border:1px solid #DED1C4;border-radius:999px;padding:.45rem 1rem;cursor:pointer;transition:border-color .2s,background .2s}
.hb-filter .aa-filter-knopf:hover{border-color:var(--messing)}
.hb-filter .aa-filter-knopf[aria-pressed="true"]{background:var(--samt);border-color:var(--samt);color:var(--leinen)}
.hb-filter .aa-filter-anzahl{margin-left:.45rem;font-size:.8rem;opacity:.6}
.hb-filter .aa-filter-suche{font:inherit;font-size:1rem;width:min(100%,320px);background:#fff;border:1px solid #D7C9BC;border-radius:999px;padding:.7rem 1.1rem}
.hb-filter .aa-filter-suche:focus{border-color:var(--messing);outline:none}
.hb-filter .aa-filter-leer{flex-basis:100%;order:3;margin:0;color:var(--grau);border:1px dashed #CDBFB3;border-radius:12px;padding:1.2rem 1.4rem}
.regal .hb .cover{display:block;width:100%;padding:0;border:0;background:none;cursor:pointer;text-align:left;border-radius:10px;transition:transform .35s cubic-bezier(.2,.7,.2,1)}
.regal .hb .cover:hover,.regal .hb .cover:focus-visible{transform:translateY(-6px)}
.regal .hb .cover img{transition:box-shadow .35s}
.regal .hb .cover:hover img{box-shadow:0 24px 40px rgba(42,26,34,.3)}
.cover-leer{display:grid;place-items:center;aspect-ratio:1/1;padding:1rem;border-radius:10px;background:var(--samt);color:var(--leinen);font-family:var(--display);font-size:1.4rem;text-align:center}
.hat-probe{position:absolute;right:.6rem;bottom:.6rem;width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:rgba(42,26,34,.82);color:var(--messing-hell);backdrop-filter:blur(4px)}
.hb .genre{font-size:.8rem;font-weight:600;letter-spacing:.05em;text-transform:uppercase;color:var(--messing-dunkel)}
.hb-cta{overflow:hidden}
.hb-cta .wrap{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:center;gap:3rem}
.hb-cta .btn{margin-top:1.8rem}
.cta-stapel{position:relative;display:flex;justify-content:center;align-items:center;gap:0;text-decoration:none;color:inherit;min-height:280px}
.cta-echt{display:flex}
.cta-cover:nth-child(-n+3){display:none}
.cta-cover{display:block;width:180px;aspect-ratio:1/1;border-radius:6px;overflow:hidden;position:relative;box-shadow:0 2px 4px rgba(0,0,0,.3),0 20px 40px rgba(0,0,0,.5);filter:saturate(.75) brightness(.6);transition:transform .6s cubic-bezier(.2,.7,.2,1),filter .4s}
.cta-cover img{width:100%;height:100%;object-fit:cover}
.cta-cover:nth-child(4){transform:rotate(-10deg) translateY(16px)}
.cta-cover:nth-child(5){transform:rotate(-3deg);margin-left:-110px;z-index:1}
.dein-cover{margin-left:-70px}
.dein-cover{position:relative;z-index:2;width:210px;aspect-ratio:1/1;border-radius:6px;border:2px dashed var(--messing);background:radial-gradient(circle at 50% 40%,rgba(184,135,58,.22),transparent 70%),var(--samt-2);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.5rem;text-align:center;padding:1rem;transform:rotate(4deg);box-shadow:0 24px 50px rgba(0,0,0,.5);transition:transform .6s cubic-bezier(.2,.7,.2,1),border-color .3s}
.dein-plus{width:54px;height:54px;border-radius:50%;display:grid;place-items:center;background:var(--messing);color:var(--samt);margin-bottom:.4rem;animation:puls 2.4s ease-out infinite}
.dein-cover strong{font-family:var(--display);font-size:1.9rem;font-weight:600;line-height:1;color:var(--leinen)}
.dein-cover small{color:var(--grau-d);font-size:.85rem}
.cta-stapel:hover .dein-cover{transform:rotate(0) scale(1.04);border-style:solid}
.cta-stapel:hover .cta-cover{filter:saturate(.9) brightness(.8)}
.cta-stapel:hover .cta-cover:nth-child(4){transform:rotate(-14deg) translateX(-14px) translateY(20px)}
.hb-cta h2{font-size:clamp(2.2rem,4.2vw,3.2rem);margin:.6rem 0 1rem;max-width:20ch}
.hb-cta p{color:var(--rose);max-width:36rem}

/* Große Ansicht */
.hb-dialog{width:min(980px,calc(100% - 2rem));max-height:calc(100% - 2rem);padding:0;border:0;border-radius:24px;background:var(--samt);color:var(--leinen);box-shadow:0 40px 90px rgba(0,0,0,.5)}
.hb-dialog::backdrop{background:rgba(20,10,15,.72);backdrop-filter:blur(4px)}
.hb-dialog[open]{animation:auf .35s cubic-bezier(.2,.7,.2,1)}
@keyframes auf{from{opacity:0;transform:translateY(18px) scale(.98)}to{opacity:1;transform:none}}
html.dialog-offen{overflow:hidden}
.hb-zu{position:absolute;top:1rem;right:1rem;width:44px;height:44px;border-radius:50%;border:1px solid var(--samt-3);background:var(--samt-2);color:var(--leinen);display:grid;place-items:center;cursor:pointer;z-index:2}
.hb-zu:hover{border-color:var(--messing)}
.hb-dialog-inhalt{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:2.6rem;padding:2.6rem}
.detail-cover img{width:100%;aspect-ratio:1/1;object-fit:cover;border-radius:14px;box-shadow:0 26px 50px rgba(0,0,0,.45);position:sticky;top:0}
.detail-text .zeile{color:var(--messing-hell);padding-right:3rem}
.detail-text h2{font-size:clamp(2.2rem,4vw,3.2rem);margin-top:.5rem;padding-right:2.5rem}
.detail-unter{font-family:var(--display);font-style:italic;font-weight:500;font-size:1.35rem;color:var(--rose);margin-top:.3rem}
.detail-text .meta-zeile{color:var(--grau-d);margin-top:.8rem}
.detail-beschreibung{color:var(--rose);margin-top:1.6rem}
.detail-beschreibung p+p{margin-top:.8rem}
.detail-text .shops{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:1.8rem}
.detail-text .shops a:hover{background:var(--leinen);color:var(--samt)}

@media (max-width:1000px){
  .buehne-karte{grid-template-columns:1fr;gap:2rem;padding:2rem}
  .buehne-cover{max-width:340px}
  .hb-dialog-inhalt{grid-template-columns:1fr;gap:1.6rem;padding:1.6rem}
  .detail-cover{max-width:280px}
  .detail-cover img{position:static}
}
@media (max-width:640px){
  .buehne-karte{padding:1.4rem;border-radius:20px}
  .buehne-cover{max-width:none}
  .band-cover{width:128px}
  .band-spur,.band-still .band-quelle{gap:14px}
  .hb-filter .aa-filter{margin-bottom:2rem}
  .hb-filter .aa-filter-knoepfe{flex-wrap:nowrap;overflow-x:auto;margin:0 -1.25rem;padding:0 1.25rem .3rem;scrollbar-width:none}
  .hb-filter .aa-filter-knopf{flex:none}
  .hb-filter .aa-filter-suche{width:100%}
  .hb-zaehler strong{font-size:2.6rem}
  .hb-dialog{width:100%;max-width:none;max-height:none;height:100%;margin:0;border-radius:0}
  .hb-zu{position:fixed}
}
@media (prefers-reduced-motion:reduce){
  .buehne-glanz,.hp.laeuft .hp-welle i,.hp.laeuft .hp-knopf,.hb-dialog[open]{animation:none}
  .buehne-cover img{transform:none}
}

/* Plattenspieler in „Hör rein“ */
.platte{display:grid;grid-template-columns:auto minmax(0,1fr);gap:1.8rem;align-items:center;margin:1.4rem 0 .4rem;padding-bottom:1.4rem;border-bottom:1px solid var(--samt-3)}
.platte-buehne{position:relative;width:310px;height:200px;flex:none}
.platte-cover{position:absolute;left:0;top:0;width:200px;height:200px;object-fit:cover;border-radius:8px;box-shadow:0 22px 44px rgba(0,0,0,.55),0 0 0 1px rgba(255,255,255,.06);z-index:2;transition:opacity .22s,transform .5s cubic-bezier(.2,.7,.2,1)}
.vinyl{position:absolute;left:8px;top:6px;width:188px;height:188px;border-radius:50%;z-index:1;
  background:radial-gradient(circle,transparent 0 23%,#111 23.5% 24.5%,transparent 25%),repeating-radial-gradient(circle,#181014 0 2px,#22181d 2px 3px),#181014;
  box-shadow:0 14px 30px rgba(0,0,0,.5),inset 0 0 0 1px rgba(255,255,255,.05);
  transition:transform .8s cubic-bezier(.2,.7,.2,1)}
.vinyl::after{content:"";position:absolute;inset:0;border-radius:50%;background:conic-gradient(from 30deg,transparent 0 10%,rgba(255,255,255,.12) 14%,transparent 20% 60%,rgba(255,255,255,.08) 64%,transparent 70%)}
.vinyl-label{position:absolute;inset:32%;border-radius:50%;background:var(--messing) center/cover;box-shadow:0 0 0 2px #0d080a}
.vinyl-label::after{content:"";position:absolute;left:50%;top:50%;width:7px;height:7px;margin:-3.5px;border-radius:50%;background:var(--samt)}
.platte .vinyl{transform:translateX(18px)}
.platte.dreht .vinyl{transform:translateX(94px)}
.platte.dreht .vinyl-label,.platte.dreht .vinyl::before{animation:dreh 3.2s linear infinite}
.vinyl::before{content:"";position:absolute;inset:0;border-radius:50%;background:repeating-conic-gradient(rgba(255,255,255,.035) 0 2deg,transparent 2deg 9deg)}
@keyframes dreh{to{transform:rotate(360deg)}}
.platte.dreht .platte-cover{transform:rotate(-3deg) translateY(-2px)}
.platte.wechsel .platte-cover,.platte.wechsel .platte-text{opacity:0}
.platte-text{transition:opacity .22s;min-width:0}
.platte-text .kat{font-size:.78rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--messing-hell)}
.platte-titel{font-size:clamp(1.7rem,2.6vw,2.2rem);margin-top:.35rem;color:var(--leinen)}
.platte-autor{color:var(--grau-d);margin-top:.35rem}
.platte-autor:empty{display:none}
.platte-aktion{display:flex;flex-wrap:wrap;align-items:center;gap:.6rem 1.1rem;margin-top:1.2rem}
.platte-play{padding:.65rem 1.2rem;font-size:.95rem}
.platte-link{color:var(--messing-hell);font-weight:600;font-size:.95rem}
.platte.ohne-cover .platte-cover{opacity:0}
.platte.ohne-cover .platte-buehne{width:200px}
.platte.ohne-cover .vinyl{transform:none;left:0;top:0;width:200px;height:200px}
.platte.ohne-cover.dreht .vinyl{transform:none}
.platte.ohne-cover.dreht .vinyl-label{animation:none} /* Porträt nicht mitdrehen */
.platte.ohne-cover .vinyl-label{inset:30%;background-position:50% 30%}
.platte.ohne-cover .vinyl-label::after{display:none}
@media (max-width:640px){
  .platte{grid-template-columns:1fr;gap:1.2rem}
  .platte.ohne-cover .platte-buehne{width:170px}
  .platte.ohne-cover .vinyl{width:170px;height:170px}
  .platte-buehne{width:260px;height:170px}
  .platte-cover{width:170px;height:170px}
  .vinyl{width:160px;height:160px;left:6px;top:5px}
  .platte .vinyl{transform:translateX(14px)}
  .platte.dreht .vinyl{transform:translateX(80px)}
}
@media (prefers-reduced-motion:reduce){.platte.dreht .vinyl-label,.platte.dreht .vinyl::before{animation:none}}

/* Persönliche Fotos */
.vorstellung{display:flex;align-items:center;gap:.9rem}
.avatar{width:58px;height:58px;border-radius:50%;object-fit:cover;object-position:50% 30%;box-shadow:0 0 0 2px var(--samt),0 0 0 4px var(--messing)}
.persoenlich{display:flex;align-items:center;gap:1.1rem;margin-top:2.2rem;padding-top:1.6rem;border-top:1px solid #DED1C4}
.persoenlich img{width:84px;height:84px;flex:none;border-radius:50%;object-fit:cover;object-position:50% 30%;box-shadow:0 0 0 3px var(--leinen),0 0 0 5px var(--messing)}
.persoenlich p{display:flex;flex-direction:column;gap:.15rem;color:var(--grau)}
.persoenlich strong{font-family:var(--display);font-size:1.5rem;font-weight:600;color:var(--samt);line-height:1.1}

/* Hörbücher-Seite: Kopf mit Cover-Fächer */
.hb-kopf-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:3rem;align-items:center}
.faecher{position:relative;height:400px;display:flex;justify-content:center;align-items:center}
.faecher-cover{position:absolute;width:290px;aspect-ratio:1/1;border-radius:6px;overflow:hidden;box-shadow:0 2px 4px rgba(0,0,0,.3),0 24px 50px rgba(0,0,0,.55);transform-origin:50% 120%;transition:transform .7s cubic-bezier(.2,.7,.2,1)}
.faecher-cover img{width:100%;height:100%;object-fit:cover}
.faecher-cover::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.28) 0,rgba(255,255,255,.14) 1.6%,transparent 4.5%),linear-gradient(155deg,rgba(255,255,255,.2),transparent 38%)}
.faecher-cover:nth-child(1){z-index:3;transform:translateY(-8px)}
.faecher-cover:nth-child(2){z-index:2;transform:rotate(-14deg) translateX(-70px)}
.faecher-cover:nth-child(3){z-index:1;transform:rotate(14deg) translateX(70px)}
/* Auffächern: am Computer bei Mausberührung, auf dem Handy per Antippen (Klasse .offen). Der Kopf schneidet Überstehendes ab. */
.faecher{cursor:pointer;-webkit-tap-highlight-color:transparent}
@media (hover:hover) and (min-width:1001px){
.faecher:hover .faecher-cover:nth-child(1){transform:translateY(-18px) scale(1.03)}
.faecher:hover .faecher-cover:nth-child(2){transform:rotate(-19deg) translateX(-105px)}
.faecher:hover .faecher-cover:nth-child(3){transform:rotate(19deg) translateX(105px)}
}
.faecher.offen .faecher-cover:nth-child(1){transform:translateY(-18px) scale(1.04)}
.faecher.offen .faecher-cover:nth-child(2){transform:rotate(-19deg) translateX(-105px)}
.faecher.offen .faecher-cover:nth-child(3){transform:rotate(19deg) translateX(105px)}
@media (max-width:1000px){
.faecher.offen .faecher-cover:nth-child(2){transform:rotate(-20deg) translateX(-110px) translateY(10px)}
.faecher.offen .faecher-cover:nth-child(3){transform:rotate(20deg) translateX(110px) translateY(10px)}
}
@media (max-width:640px){
.faecher.offen .faecher-cover:nth-child(2){transform:rotate(-20deg) translateX(-95px) translateY(8px)}
.faecher.offen .faecher-cover:nth-child(3){transform:rotate(20deg) translateX(95px) translateY(8px)}
}
.hb-seitenkopf{overflow:hidden;overflow:clip}
.faecher::before{content:"";position:absolute;inset:10% 5%;background:radial-gradient(circle,rgba(184,135,58,.3),transparent 62%);filter:blur(10px)}

/* Cover professioneller: feine Kante, Glanz, gestaffelter Schatten */
.regal .hb .cover,.band-cover{position:relative}
.regal .hb .cover img,.band-cover img,.buehne-cover img{border-radius:6px}
.regal .hb .cover img{box-shadow:0 1px 2px rgba(42,26,34,.25),0 8px 16px rgba(42,26,34,.16),0 22px 36px rgba(42,26,34,.14)}
.regal .hb .cover::after,.band-cover::after{content:"";position:absolute;inset:0;aspect-ratio:1/1;border-radius:6px;pointer-events:none;
  background:linear-gradient(90deg,rgba(0,0,0,.22) 0,rgba(255,255,255,.12) 1.5%,transparent 4%),linear-gradient(155deg,rgba(255,255,255,.16),transparent 36%);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.08)}
.band-cover{border-radius:6px}
.regal .hb .cover:hover img{box-shadow:0 2px 4px rgba(42,26,34,.25),0 16px 28px rgba(42,26,34,.2),0 34px 54px rgba(42,26,34,.18)}
.regal .hb .cover .neu,.regal .hb .cover .hat-probe{z-index:2}
.regal .hb .cover::before{content:"Mehr erfahren";position:absolute;left:50%;bottom:1rem;z-index:2;transform:translate(-50%,8px);opacity:0;white-space:nowrap;background:rgba(42,26,34,.88);color:var(--leinen);font-size:.85rem;font-weight:600;padding:.4rem .9rem;border-radius:999px;transition:opacity .25s,transform .25s;backdrop-filter:blur(4px)}
.regal .hb .cover:hover::before,.regal .hb .cover:focus-visible::before{opacity:1;transform:translate(-50%,0)}
.hoerbuecher.regal{gap:3rem 2rem}

@media (max-width:1000px){
  .hb-kopf-grid{grid-template-columns:1fr;gap:1rem}
  .hb-cta .wrap{grid-template-columns:1fr;gap:2.5rem}
  .faecher{height:300px}
  .faecher-cover{width:210px}
  .faecher-cover:nth-child(2){transform:rotate(-14deg) translateX(-55px)}
  .faecher-cover:nth-child(3){transform:rotate(14deg) translateX(55px)}
}
@media (max-width:640px){
  .faecher{height:240px;margin-top:.5rem}
  .faecher-cover{width:165px}
  .faecher-cover:nth-child(2){transform:rotate(-13deg) translateX(-48px)}
  .faecher-cover:nth-child(3){transform:rotate(13deg) translateX(48px)}
  .regal .hb .cover::before{display:none}
  .cta-stapel{min-height:220px}
  .cta-cover{width:120px}
  .cta-cover:nth-child(5){margin-left:-80px}
  .dein-cover{width:160px;margin-left:-50px}
  .dein-cover strong{font-size:1.5rem}
}
@media (prefers-reduced-motion:reduce){.faecher-cover{transition:none}.dein-plus{animation:none}}

/* Podcast-Seite */
.pod-kopf{overflow:hidden;position:relative}
.pod-kopf::before{content:"";position:absolute;right:-10%;top:-30%;width:60%;aspect-ratio:1;background:radial-gradient(circle,rgba(184,135,58,.18),transparent 62%);pointer-events:none}
.pod-kopf-grid{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:3rem;align-items:center;position:relative}
.pod-kopf .btn svg{flex:none}
.pod-hosts-kurz{margin-top:1.8rem;color:var(--grau-d);font-size:.95rem}
.pod-buehne{position:relative;display:flex;justify-content:center;align-items:center;min-height:380px;padding-bottom:36px}
.pod-cover{position:relative;z-index:2;width:min(340px,100%);aspect-ratio:1/1;object-fit:cover;border-radius:22px;box-shadow:0 30px 60px rgba(0,0,0,.5),0 0 0 1px rgba(255,255,255,.06);transform:rotate(-3deg);transition:transform .6s cubic-bezier(.2,.7,.2,1)}
.pod-buehne:hover .pod-cover{transform:rotate(0) scale(1.02)}
.pod-wellen{position:absolute;inset:0 -20%;display:flex;align-items:center;justify-content:center;gap:9px;z-index:1;-webkit-mask-image:linear-gradient(90deg,transparent,#000 25%,#000 75%,transparent);mask-image:linear-gradient(90deg,transparent,#000 25%,#000 75%,transparent)}
.pod-wellen i{width:6px;flex:none;border-radius:3px;background:linear-gradient(var(--messing-hell),var(--messing));opacity:.55;animation:podwelle 1.6s ease-in-out infinite alternate}
.pod-wellen i:nth-child(odd){animation-duration:1.15s}
.pod-wellen i:nth-child(3n){animation-duration:1.9s}
@keyframes podwelle{from{height:14%}to{height:78%}}
.pod-live{position:absolute;z-index:3;left:50%;bottom:0;transform:translateX(-50%);white-space:nowrap;display:inline-flex;align-items:center;gap:.5rem;background:var(--samt);border:1px solid var(--samt-3);color:var(--leinen);font-size:.85rem;font-weight:600;padding:.45rem .9rem;border-radius:999px;box-shadow:0 10px 24px rgba(0,0,0,.4)}
.pod-live b{width:8px;height:8px;border-radius:50%;background:#E06A4F;box-shadow:0 0 0 0 rgba(224,106,79,.6);animation:podpunkt 1.8s ease-out infinite}
@keyframes podpunkt{to{box-shadow:0 0 0 10px rgba(224,106,79,0)}}
.pod-worum{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:4.5rem;align-items:start}
.pod-worum h2{font-size:clamp(2.2rem,4.2vw,3.2rem);margin:.6rem 0 1.2rem}
.pod-themen{list-style:none;margin:2rem 0 0;padding:0;display:flex;flex-wrap:wrap;gap:.6rem}
.pod-themen li{border:1px solid #DED1C4;background:#FBF7F2;border-radius:999px;padding:.45rem 1rem;font-weight:500;font-size:.95rem}
.pod-hosts{display:flex;flex-direction:column;gap:1rem;background:#FBF7F2;border:1px solid #DED1C4;border-radius:22px;padding:1.8rem}
.host{display:flex;align-items:center;gap:1.1rem}
.host img{width:84px;height:84px;flex:none;border-radius:50%;object-fit:cover;object-position:50% 30%;box-shadow:0 0 0 3px #FBF7F2,0 0 0 5px var(--messing)}
.host h3{font-size:1.6rem}
.host p{color:var(--grau);margin-top:.15rem}
.host+.host{padding-top:1rem;border-top:1px solid #DED1C4}
.plattformen{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.4rem}
.plattform{display:flex;align-items:center;gap:1.2rem;padding:1.6rem 1.8rem;border-radius:20px;text-decoration:none;color:var(--leinen);background:var(--samt);border:1px solid var(--samt);transition:transform .25s,box-shadow .25s}
.plattform:hover{transform:translateY(-4px);box-shadow:0 18px 36px rgba(42,26,34,.25)}
.plattform strong{display:block;font-family:var(--display);font-size:1.9rem;line-height:1.1}
.plattform small{color:var(--grau-d);font-size:.95rem}
.p-symbol{width:62px;height:62px;flex:none;border-radius:16px;display:grid;place-items:center}
.spotify .p-symbol{background:#1DB954;color:#0B2A17}
.youtube .p-symbol{background:#E5322D;color:#fff}
.p-pfeil{margin-left:auto;font-size:1.4rem;color:var(--messing-hell)}
.pod-gast-grid{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:4rem;align-items:center}
.pod-gast h2{font-size:clamp(2.4rem,4.6vw,3.6rem);margin:.6rem 0 1.2rem}
.pod-mikro{display:flex;flex-direction:column;align-items:center;gap:1.2rem;text-align:center}
.pod-mikro svg{max-width:100%;height:auto;filter:drop-shadow(0 20px 40px rgba(0,0,0,.45))}
.pod-karte-text{display:flex;flex-direction:column;gap:.2rem}
.pod-karte-text strong{font-family:var(--display);font-size:1.8rem;font-weight:600;color:var(--leinen)}
.pod-karte-text span{color:var(--grau-d)}
@media (max-width:1000px){
  .pod-kopf-grid,.pod-worum,.pod-gast-grid{grid-template-columns:1fr;gap:2.4rem}
  .pod-buehne{min-height:300px}
}
@media (max-width:640px){
  .plattformen{grid-template-columns:1fr}
  .pod-cover{width:min(260px,100%)}
  .pod-buehne{min-height:280px}
  .pod-hosts{padding:1.3rem}
  .pod-mikro svg{width:150px}
}
@media (prefers-reduced-motion:reduce){.pod-wellen i,.pod-live b{animation:none}.pod-wellen i{height:40%}}

/* ---------- Hörproben-Studio ---------- */
.kabine-mehr{display:inline-flex;gap:.4rem;margin-top:1rem;color:var(--messing-hell);font-weight:600;text-decoration:none}
.kabine-mehr:hover{text-decoration:underline}
.studio-kopf{background:radial-gradient(70% 60% at 80% 0%,#4A2C38 0%,transparent 60%),radial-gradient(50% 50% at 10% 100%,rgba(184,135,58,.12),transparent 70%),var(--samt);color:var(--leinen);padding:4rem 0 4.5rem;overflow:hidden;overflow:clip}
.studio-titel{max-width:44rem}
.studio-titel h1{font-size:clamp(2.8rem,6vw,4.6rem);margin-top:.8rem}
.studio-titel .lead{color:var(--rose);font-size:1.15rem;margin-top:1.2rem}
.pult{margin-top:2.8rem;display:grid;grid-template-columns:auto minmax(0,1fr);gap:3rem;align-items:center;background:linear-gradient(180deg,var(--samt-2),#2F1F27);border:1px solid var(--samt-3);border-radius:26px;padding:2.4rem;box-shadow:0 30px 60px rgba(0,0,0,.35),inset 0 1px 0 rgba(255,255,255,.04)}
.pult-cover{position:relative;width:372px;height:240px;flex:none}
.pult-bild{position:absolute;left:0;top:0;width:240px;height:240px;object-fit:cover;border-radius:10px;z-index:2;box-shadow:0 24px 48px rgba(0,0,0,.55),0 0 0 1px rgba(255,255,255,.06);transition:opacity .18s,transform .5s cubic-bezier(.2,.7,.2,1)}
.pult .vinyl{transition:transform .9s cubic-bezier(.2,.7,.2,1);left:8px;top:7px;width:226px;height:226px;transform:translateX(22px)}
.pult.dreht .vinyl{transform:translateX(113px)}
.pult.dreht .vinyl-label,.pult.dreht .vinyl::before{animation:dreh 3.2s linear infinite}
.pult.dreht .pult-bild{transform:rotate(-3deg) translateY(-3px)}
.pult-ohne{display:none}
.pult.ohne-cover .pult-bild{opacity:0}
.pult.ohne-cover .pult-ohne{display:grid;place-items:center;position:absolute;left:0;top:0;width:240px;height:240px;z-index:2;border-radius:10px;padding:1.4rem;text-align:center;background:linear-gradient(135deg,#3A2630,#22161C);border:1px solid var(--samt-3);font-family:var(--display);font-size:1.6rem;line-height:1.15;color:var(--leinen);box-shadow:0 24px 48px rgba(0,0,0,.55)}
.pult.wechsel .pult-bild,.pult.wechsel .pult-text{opacity:.15}
.pult-text{min-width:0;transition:opacity .18s}
.pult-kat{font-size:.78rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--messing-hell)}
.pult-name{font-size:clamp(2rem,3.4vw,2.8rem);margin-top:.4rem;color:var(--leinen)}
.pult-autor{color:var(--grau-d);margin-top:.3rem}
.pult-autor:empty,.pult-beschreibung:empty,.pult-kat:empty{display:none}
.pult-beschreibung{color:var(--rose);margin-top:.8rem;max-width:40rem;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.pult-steuerung{display:flex;align-items:center;gap:.8rem;margin-top:1.6rem;flex-wrap:wrap}
.pult-steuerung button{display:grid;place-items:center;border-radius:50%;cursor:pointer;border:1px solid var(--samt-3);background:transparent;color:var(--rose);width:44px;height:44px}
.pult-steuerung button:hover{border-color:var(--messing);color:var(--messing-hell)}
.pult-steuerung .pult-play{width:68px;height:68px;border:0;background:var(--messing);color:var(--samt);box-shadow:0 10px 26px rgba(184,135,58,.35)}
.pult-steuerung .pult-play:hover{background:var(--messing-hell);color:var(--samt)}
.pult-play:disabled{opacity:.4;cursor:default}
.pult .i-pause,.pult.dreht .i-play{display:none}
.pult.dreht .i-pause{display:block}
.pult.dreht .pult-play{animation:puls 1.8s ease-out infinite}
.pult-pegel{margin-left:auto}
.pult-spur{display:flex;align-items:center;gap:.8rem;margin-top:1.3rem;max-width:40rem}
.pult-zeit,.pult-dauer{font-size:.85rem;color:var(--grau-d);font-variant-numeric:tabular-nums;min-width:2.6rem}
.pult-leiste{flex:1;height:6px;border-radius:3px;background:var(--samt-3);cursor:pointer;position:relative}
.pult-leiste i{position:absolute;inset:0 auto 0 0;width:0;border-radius:3px;background:linear-gradient(90deg,var(--messing),var(--messing-hell))}
.pult-link{display:inline-block;margin-top:1.2rem;color:var(--messing-hell);font-weight:600}
.pult-leer .pult-steuerung,.pult-leer .pult-spur{display:none}

/* Regal */
.regal-raum{background:radial-gradient(60% 40% at 50% 0%,rgba(217,174,99,.10),transparent 70%),linear-gradient(#24171D,#1E1218);color:var(--leinen);padding-top:4.5rem}
.regal-kopf{display:flex;justify-content:space-between;align-items:end;gap:1.5rem 3rem;flex-wrap:wrap;margin-bottom:3.4rem}
.regal-kopf h2{font-size:clamp(2.2rem,4vw,3.2rem);margin-top:.5rem}
.regal-kopf .zeile{color:var(--messing-hell)}
.regal-filter{display:flex;flex-wrap:wrap;gap:.5rem}
.regal-filter button{font:inherit;font-size:.92rem;font-weight:500;color:var(--rose);background:transparent;border:1px solid var(--samt-3);border-radius:999px;padding:.4rem 1rem;cursor:pointer}
.regal-filter button:hover{border-color:var(--messing)}
.regal-filter button[aria-pressed="true"]{background:var(--messing);border-color:var(--messing);color:var(--samt)}
.regal-schrank{position:relative;padding:14px;border-radius:14px;background:linear-gradient(90deg,#5A3826,#8A5C3E 6%,#6E4630 50%,#8A5C3E 94%,#5A3826);box-shadow:0 40px 80px rgba(0,0,0,.55),inset 0 1px 0 rgba(255,220,180,.25)}
.regal-schrank::before{content:"";position:absolute;left:0;right:0;top:0;height:14px;border-radius:14px 14px 0 0;background:linear-gradient(#A8754F,#7A4F36)}
.studio-regal{position:relative;display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:74px 30px;padding:46px 34px 64px;border-radius:6px;
  background:radial-gradient(40% 55% at 15% 0%,rgba(255,214,150,.20),transparent 70%),radial-gradient(40% 55% at 50% 0%,rgba(255,214,150,.16),transparent 70%),radial-gradient(40% 55% at 85% 0%,rgba(255,214,150,.20),transparent 70%),
    repeating-linear-gradient(90deg,rgba(0,0,0,.18) 0 2px,transparent 2px 118px),linear-gradient(#3A2419,#24160F);
  box-shadow:inset 0 18px 30px rgba(0,0,0,.55),inset 14px 0 24px rgba(0,0,0,.45),inset -14px 0 24px rgba(0,0,0,.45)}
/* Regalbretter: werden per Skript unter jede Reihe gelegt (durchgehend über die ganze Breite) */
.regal-brett{position:absolute;left:0;right:0;height:20px;z-index:1;pointer-events:none;background:linear-gradient(#C4906A 0,#A87550 4px,#8A5C3E 5px,#6B4530 70%,#4F3222);box-shadow:0 16px 22px -6px rgba(0,0,0,.65)}
.regal-brett::before{content:"";position:absolute;left:0;right:0;top:-14px;height:14px;background:linear-gradient(transparent,rgba(0,0,0,.35))}
.regal-platz{position:relative;display:block;aspect-ratio:1/1;padding:0;border:0;background:none;cursor:pointer;color:inherit;font:inherit;perspective:600px}
.regal-platz img,.regal-band{position:relative;z-index:2;display:block;width:100%;height:100%;object-fit:cover;border-radius:5px;box-shadow:0 14px 22px rgba(0,0,0,.55),0 0 0 1px rgba(255,255,255,.05);transform-origin:50% 100%;transition:transform .35s cubic-bezier(.2,.7,.2,1),box-shadow .35s}
/* Regalbrett unter jedem Platz – die Stücke schließen über den Abstand aneinander an */
.regal-platz{z-index:2}
.regal-platz[hidden]{display:none}
.regal-platz::after{content:"";position:absolute;z-index:1;left:6%;right:6%;bottom:-6px;height:10px;border-radius:50%;background:rgba(0,0,0,.55);filter:blur(5px)}
.regal-platz:hover img,.regal-platz:hover .regal-band,.regal-platz:focus-visible img,.regal-platz:focus-visible .regal-band{transform:translateY(-10px) rotateX(6deg);box-shadow:0 26px 34px rgba(0,0,0,.6)}
.regal-platz.ist-aktiv img,.regal-platz.ist-aktiv .regal-band{transform:translateY(-14px);box-shadow:0 0 0 3px var(--messing-hell),0 0 34px rgba(217,174,99,.45),0 26px 34px rgba(0,0,0,.6)}
.regal-band{display:flex;flex-direction:column;justify-content:flex-end;gap:.3rem;padding:.9rem;text-align:left;background:linear-gradient(160deg,#3A2630,#1E1218);border-left:6px solid var(--messing)}
.regal-band small{font-size:.68rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--messing-hell)}
.regal-band strong{font-family:var(--display);font-size:1.15rem;line-height:1.15;color:var(--leinen)}
.regal-laeuft{position:absolute;z-index:3;right:10px;bottom:10px;display:none;align-items:flex-end;justify-content:center;gap:3px;width:34px;height:34px;padding:0 0 9px;border-radius:50%;background:linear-gradient(145deg,var(--messing-hell),var(--messing));box-shadow:0 6px 16px rgba(0,0,0,.45),0 0 0 3px rgba(42,26,34,.55);animation:laeuftring 1.8s ease-out infinite}
.regal-laeuft i{width:4px;height:15px;border-radius:2px;background:var(--samt);transform-origin:50% 100%;animation:laeuftbalken .9s ease-in-out infinite alternate}
.regal-laeuft i:nth-child(1){animation-duration:.7s}
.regal-laeuft i:nth-child(2){animation-delay:.25s;animation-duration:1s}
.regal-laeuft i:nth-child(3){animation-delay:.5s;animation-duration:.8s}
@keyframes laeuftbalken{from{transform:scaleY(.3)}to{transform:scaleY(1)}}
@keyframes laeuftring{0%{box-shadow:0 6px 16px rgba(0,0,0,.45),0 0 0 3px rgba(42,26,34,.55),0 0 0 3px rgba(217,174,99,.55)}100%{box-shadow:0 6px 16px rgba(0,0,0,.45),0 0 0 3px rgba(42,26,34,.55),0 0 0 14px rgba(217,174,99,0)}}
.regal-platz.laeuft .regal-laeuft{display:flex;transform:translateY(-14px)}
.regal-raum .leer{color:var(--grau-d);border-color:var(--samt-3)}
.regal-raum .leer a{color:var(--messing-hell)}
@media (max-width:1000px){
  .pult{grid-template-columns:1fr;gap:2rem;padding:1.6rem}
  .pult-pegel{margin-left:0}
}
@media (max-width:640px){
  .pult-cover{width:276px;height:180px}
  .pult-bild,.pult.ohne-cover .pult-ohne{width:180px;height:180px}
  .pult .vinyl{width:168px;height:168px;transform:translateX(16px)}
  .pult.dreht .vinyl{transform:translateX(84px)}
  .studio-regal{grid-template-columns:repeat(auto-fill,minmax(92px,1fr));gap:56px 16px;padding:34px 16px 48px}
  .regal-schrank{padding:9px}
  .regal-brett{height:16px}
  .regal-band strong{font-size:.95rem}
}
@media (prefers-reduced-motion:reduce){.pult.dreht .vinyl-label,.pult.dreht .vinyl::before,.regal-laeuft,.regal-laeuft i,.pult.dreht .pult-play{animation:none}}

/* Kleinere Bildschirme */
@media (max-width:1060px){
  .nav{gap:1rem;font-size:.92rem}
}
@media (max-width:1000px){
  .hero .wrap{grid-template-columns:1fr;gap:3rem;padding:3.5rem 0 4.5rem}
  .kopf,.mitbringen,.anfrage-grid,.kontakt .wrap,.zwei,.vita-grid{grid-template-columns:1fr;gap:2.4rem}
  .ablauf{grid-template-columns:1fr 1fr;gap:0 1.4rem}
  .wege,.angebote,.stimmen{grid-template-columns:1fr}
  .vita-grid img{position:static;max-width:340px}
}
@media (max-width:900px){
  .nav-toggle{display:block}
  .nav{display:none;position:absolute;top:66px;left:0;right:0;background:var(--samt);flex-direction:column;align-items:flex-start;gap:1.1rem;padding:1.5rem 1.25rem 2rem;border-bottom:1px solid var(--samt-3);font-size:1.05rem}
  .nav.open{display:flex}
  .site-header .wrap{height:66px}
  .logo{font-size:2rem}
  html{scroll-padding-top:76px}
}
@media (max-width:640px){
  .section{padding:4.5rem 0}
  .kabine{padding:1.2rem;border-radius:18px}
  .kabine-kopf h2{font-size:1.7rem}
  .vu{width:92px;height:50px}
  .ablauf{grid-template-columns:1fr}
  .hoerbuecher{grid-template-columns:repeat(2,minmax(0,1fr));gap:2rem 1rem}
  .formular-box,.weg,.angebot,.podcast-karte{padding:1.5rem}
}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}.btn,.weg,.vu .nadel{transition:none}.weg:hover{transform:none}}

/* ---------- Coaching: Kopf mit Sprecherskript ---------- */
.coach-kopf{position:relative;overflow:hidden;overflow:clip;padding:3.6rem 0 3.8rem}
.coach-kopf::before{content:"";position:absolute;right:-8%;top:-40%;width:58%;aspect-ratio:1;background:radial-gradient(circle,rgba(184,135,58,.16),transparent 62%);pointer-events:none}
.coach-kopf-grid{position:relative;display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:3rem;align-items:center}
.coach-kopf h1{font-size:clamp(2.6rem,4.6vw,4.1rem);max-width:15ch}
.skript{position:relative;padding:1.2rem 1.2rem 2.4rem 2.4rem}
.skript-blatt{position:relative;background:#FBF6EE;color:#3A2A30;border-radius:4px;padding:2rem 2.2rem 4.2rem;transform:rotate(1.6deg);
  box-shadow:0 30px 60px rgba(0,0,0,.45),0 2px 0 rgba(0,0,0,.08);
  background-image:linear-gradient(90deg,transparent 2.6rem,rgba(184,90,90,.28) 2.6rem,rgba(184,90,90,.28) calc(2.6rem + 1px),transparent calc(2.6rem + 1px)),repeating-linear-gradient(transparent 0 1.95rem,rgba(110,93,99,.13) 1.95rem calc(1.95rem + 1px))}
.skript-blatt::before{content:"";position:absolute;inset:8px -8px -8px 8px;z-index:-1;background:#EFE6DA;border-radius:4px;transform:rotate(-3deg);box-shadow:0 18px 40px rgba(0,0,0,.35)}
.skript-kopf{display:flex;justify-content:space-between;align-items:baseline;font-size:.72rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--grau);margin:0 0 1rem 1.2rem}
.skript-kopf b{color:var(--messing-dunkel)}
.skript-blatt p{font-family:var(--display);font-size:1.28rem;line-height:1.95rem;margin:0 6.6rem 0 1.2rem}
.skript-blatt p+p{margin-top:.2rem}
.skript-blatt .skript-grau{color:rgba(58,42,48,.42)}
.skript-blatt mark{background:linear-gradient(transparent 18%,rgba(217,174,99,.55) 18% 88%,transparent 88%);color:inherit;padding:0 .15em;border-radius:3px}
.skript-blatt u{text-decoration:none;background:linear-gradient(transparent 82%,#B4553F 82% 92%,transparent 92%)}
.m-pause{display:inline-block;width:2px;height:1.2em;margin:0 .35em -.2em;background:#B4553F;transform:rotate(14deg);border-radius:1px;box-shadow:5px 0 0 #B4553F}
.notiz{position:absolute;font-family:var(--schrift);font-style:normal;color:#B4553F;font-size:1.65rem;line-height:1;white-space:nowrap;pointer-events:none}
.skript-blatt::after{content:"";position:absolute;top:4rem;bottom:4rem;right:6.9rem;width:1px;background:rgba(184,90,90,.18)}
.notiz{right:.9rem;max-width:5.6rem;white-space:normal;text-align:center}
.notiz.n1{top:4.1rem;transform:rotate(-6deg)}
.notiz.n2{top:6.2rem;transform:rotate(5deg)}
.notiz.n3{top:9.6rem;transform:rotate(-4deg);font-size:1.4rem}
.skript-welle{position:absolute;left:3.8rem;right:2.2rem;bottom:1.4rem;height:28px;display:flex;align-items:center;gap:3px}
.skript-welle i{flex:1;border-radius:2px;background:rgba(140,98,36,.5);height:30%;animation:skriptwelle 1.4s ease-in-out infinite alternate}
.skript-welle i:nth-child(3n){height:70%;animation-delay:-.4s}.skript-welle i:nth-child(4n+1){height:45%;animation-delay:-.8s}.skript-welle i:nth-child(5n+2){height:95%;animation-delay:-.2s}.skript-welle i:nth-child(7n){height:55%;animation-delay:-1s}
.skript-welle i:nth-child(-n+12){background:var(--messing)}
@keyframes skriptwelle{to{transform:scaleY(.45)}}
.skript-foto{position:absolute;left:0;bottom:0;width:104px;height:104px;border-radius:50%;object-fit:cover;border:4px solid var(--samt);box-shadow:0 0 0 2px var(--messing),0 14px 30px rgba(0,0,0,.5)}

/* ---------- Coaching: Formate mit Minutenuhr ---------- */
.coach-formate .angebot{position:relative;padding-top:2.2rem;transition:transform .3s,box-shadow .3s}
.coach-formate .angebot:hover{transform:translateY(-4px);box-shadow:0 22px 44px rgba(42,26,34,.14)}
.coach-formate .angebot .dauer{--anteil:.25;position:relative;display:grid;place-items:center;align-content:center;width:92px;height:92px;border-radius:50%;margin-bottom:.4rem;font-size:2.3rem;
  background:radial-gradient(closest-side,#FBF7F2 calc(100% - 7px),transparent calc(100% - 6px)),conic-gradient(var(--messing) calc(var(--anteil) * 360deg),#E4D7CA 0)}
.coach-formate .angebot .dauer small{display:block;margin:.15rem 0 0;font-size:.66rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;line-height:1}
.coach-formate .angebot:nth-child(2) .dauer{background:radial-gradient(closest-side,var(--samt) calc(100% - 7px),transparent calc(100% - 6px)),conic-gradient(var(--messing-hell) calc(var(--anteil) * 360deg),var(--samt-3) 0)}
.coach-formate .angebot:nth-child(2){box-shadow:0 26px 50px rgba(42,26,34,.28)}
.coach-formate .angebot:nth-child(2)::before{content:"Beliebt";position:absolute;top:1.4rem;right:1.4rem;font-size:.72rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--samt);background:var(--messing-hell);padding:.3rem .7rem;border-radius:999px}

/* ---------- Coaching: Kundenstimmen als Zettel an der Akustikwand ---------- */
.stimmen-wand{position:relative;color:var(--leinen);
  background:radial-gradient(80% 70% at 50% 40%,transparent 40%,rgba(0,0,0,.45)),
    conic-gradient(from 45deg,#3B2A31 0 25%,#2C1E24 0 50%,#241820 0 75%,#33242B 0) 0 0/44px 44px,#2A1C22}
.stimmen-wand .kopf h2{color:var(--leinen)}
.stimmen-wand .zeile{color:var(--messing-hell)}
.stimmen-wand .stimmen{grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr));gap:3rem 2.4rem;align-items:start;padding-top:.6rem}
.stimmen-wand .stimme{position:relative;margin:0;padding:2.8rem 1.9rem 1.8rem;gap:1rem;color:#3A2A30;border-radius:3px;
  background-color:#FBF6EE;
  background-image:repeating-linear-gradient(transparent 0 1.9rem,rgba(110,93,99,.12) 1.9rem calc(1.9rem + 1px));background-position:0 2.2rem;
  box-shadow:0 2px 0 rgba(0,0,0,.06),0 26px 40px -12px rgba(0,0,0,.7);transform:rotate(-1.6deg);transition:transform .35s cubic-bezier(.2,.7,.2,1)}
.stimmen-wand .stimme:nth-child(3n+2){transform:rotate(1.3deg);margin-top:1.6rem;background-color:#F6EEDF}
.stimmen-wand .stimme:nth-child(3n){transform:rotate(-.6deg);margin-top:.5rem;background-color:#FAF3EA}
.stimmen-wand .stimme:hover{transform:rotate(0) translateY(-6px);z-index:2}
/* Eselsohr unten rechts */
.stimmen-wand .stimme::after{content:"";position:absolute;right:0;bottom:0;width:26px;height:26px;background:linear-gradient(135deg,#E4D6C3 50%,#2A1C22 50%);box-shadow:-2px -2px 4px rgba(0,0,0,.12);border-radius:0 0 3px 0}
/* Großes Anführungszeichen */
.stimmen-wand .stimme::before{content:"“";position:absolute;left:1.3rem;top:2.2rem;font-family:var(--display);font-size:4.4rem;line-height:1;color:rgba(184,135,58,.55)}
.stimmen-wand .stimme figcaption{padding-left:2.1rem}
/* Gaffa-Band mit dem Namen */
.stimme-band{position:absolute;top:-16px;left:50%;transform:translateX(-50%) rotate(-2deg);min-width:46%;max-width:86%;padding:.35rem 1.4rem .45rem;text-align:center;
  background:linear-gradient(rgba(255,255,255,.07),rgba(0,0,0,.08)),#3A3436;color:#F3ECE4;box-shadow:0 4px 8px rgba(0,0,0,.4);
  clip-path:polygon(0 6%,4% 0,8% 8%,12% 1%,17% 7%,22% 0,100% 0,96% 8%,100% 15%,97% 30%,100% 48%,96% 66%,100% 82%,97% 100%,0 100%,3% 86%,0 70%,4% 52%,0 34%,3% 18%)}
.stimme-band span{font-family:var(--schrift);font-size:1.9rem;line-height:1.1;white-space:nowrap}
.stimmen-wand .stimme blockquote{position:relative;margin:0;padding-left:2.1rem;font-family:var(--display);font-style:italic;font-weight:500;font-size:1.36rem;line-height:1.9rem;color:#3A2A30}
.stimmen-wand .stimme figcaption{font-size:.82rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--messing-dunkel)}
.stimmen-wand .stimme figcaption:empty{display:none}

@media (max-width:1000px){
  .coach-kopf-grid{grid-template-columns:1fr;gap:2.6rem}
  .skript{max-width:520px}
}
@media (max-width:640px){
  .coach-kopf{padding:2.6rem 0 3rem}
  .skript{padding:.6rem .6rem 2rem 1.4rem}
  .skript-blatt{padding:1.5rem 1.3rem 3.6rem}
  .skript-blatt p{font-size:1.1rem;line-height:1.7rem;margin:0 5.2rem 0 .9rem}
  .skript-blatt::after{right:5.4rem;top:3.4rem;bottom:3.4rem}
  .notiz{right:.5rem;max-width:4.6rem}
  .notiz.n1{top:3.3rem}.notiz.n2{top:5.2rem}.notiz.n3{top:8.4rem;font-size:1.15rem}
  .skript-blatt{background-image:linear-gradient(90deg,transparent 1.9rem,rgba(184,90,90,.28) 1.9rem,rgba(184,90,90,.28) calc(1.9rem + 1px),transparent calc(1.9rem + 1px)),repeating-linear-gradient(transparent 0 1.7rem,rgba(110,93,99,.13) 1.7rem calc(1.7rem + 1px))}
  .notiz{font-size:1.25rem}
  .skript-welle{left:2.8rem;right:1.3rem}
  .skript-foto{width:78px;height:78px}
  .stimmen-wand .stimmen{gap:2.6rem}
  .stimmen-wand .stimme,.stimmen-wand .stimme:nth-child(n){margin-top:0}
  .stimmen-wand .stimme:nth-child(3n+2){transform:rotate(1deg)}
}
@media (prefers-reduced-motion:reduce){.skript-welle i{animation:none}.stimmen-wand .stimme,.coach-formate .angebot{transition:none}}
/* Pinnwand: Zettel in Leserichtung, kurze Stimmen hinterlassen keine Lücken (Höhen setzt ein kleines Skript auf der Seite) */
.stimmen-wand .stimmen{column-gap:2.4rem;row-gap:0;padding-top:.6rem}
.stimmen-wand .stimmen.pinnwand{grid-auto-rows:8px}
.stimmen-wand .stimme,.stimmen-wand .stimme:nth-child(n){display:block;align-self:start;margin:1.2rem 0 2rem}
.stimmen-wand .stimme:nth-child(4n+2){transform:rotate(1.3deg);background-color:#F6EEDF}
.stimmen-wand .stimme:nth-child(4n+3){transform:rotate(-.6deg);background-color:#FAF3EA}
.stimmen-wand .stimme:nth-child(4n){transform:rotate(.8deg);background-color:#F8F1E6}
.stimmen-wand .stimme:nth-child(n):hover{transform:rotate(0) translateY(-6px)}
.stimmen-wand .stimme figcaption{display:block;margin-top:1rem}
@media (max-width:640px){.stimmen-wand .stimme,.stimmen-wand .stimme:nth-child(n){margin:1.2rem 0 1.6rem}}
/* Lange Wörter und Links (z. B. Instagram-Adresse) brechen innerhalb des Zettels um */
.stimmen-wand .stimme blockquote,.stimmen-wand .stimme figcaption,.angebot p,.angebot h3{overflow-wrap:anywhere}
.stimmen-wand .stimme{min-width:0}
/* Lange Stimmen: eingerollt mit sanftem Auslauf, „Weiterlesen“ rollt den Zettel aus */
.stimmen-wand .stimme{--papier:#FBF6EE;background-color:var(--papier)}
.stimmen-wand .stimme:nth-child(4n+2){--papier:#F6EEDF;background-color:var(--papier)}
.stimmen-wand .stimme:nth-child(4n+3){--papier:#FAF3EA;background-color:var(--papier)}
.stimmen-wand .stimme:nth-child(4n){--papier:#F8F1E6;background-color:var(--papier)}
.stimmen-wand .stimme.lang blockquote{overflow:hidden;transition:max-height .6s cubic-bezier(.2,.7,.2,1)}
.stimmen-wand .stimme.lang blockquote::after{content:"";position:absolute;left:0;right:0;bottom:0;height:4.2rem;background:linear-gradient(transparent,var(--papier));pointer-events:none;transition:opacity .4s}
.stimmen-wand .stimme.offen blockquote::after{opacity:0}
.stimme-mehr{display:inline-flex;align-items:center;gap:.45rem;margin:.7rem 0 0 2.1rem;padding:.35rem .9rem;border:1px dashed rgba(140,98,36,.55);border-radius:999px;background:transparent;color:var(--messing-dunkel);font:600 .78rem/1 var(--body);letter-spacing:.08em;text-transform:uppercase;cursor:pointer}
.stimme-mehr::after{content:"";width:.45rem;height:.45rem;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:translateY(-2px) rotate(45deg);transition:transform .3s}
.stimme.offen .stimme-mehr::after{transform:translateY(2px) rotate(-135deg)}
.stimme-mehr:hover,.stimme-mehr:focus-visible{background:rgba(217,174,99,.18);border-style:solid}
@media (prefers-reduced-motion:reduce){.stimmen-wand .stimme.lang blockquote{transition:none}}

/* Hörbücher-Regal: „Neu“ als leuchtendes Studio-Schild (wie die Aufnahmelampe über der Kabinentür) */
.regal .hb .cover .neu{top:.55rem;left:.55rem;display:inline-flex;align-items:center;gap:.4rem;padding:.32rem .6rem .32rem .5rem;
  background:linear-gradient(180deg,#34202A,#1B1015);color:#FF6A5C;border:1px solid rgba(255,96,84,.6);border-radius:6px;
  font:700 .66rem/1 var(--body);letter-spacing:.18em;text-transform:uppercase;
  text-shadow:0 0 6px rgba(255,86,72,.85);
  box-shadow:0 0 0 2px rgba(27,16,21,.55),0 6px 14px rgba(0,0,0,.35),0 0 16px rgba(255,70,58,.35),inset 0 0 10px rgba(255,70,58,.18)}
.regal .hb .cover .neu i{width:.46rem;height:.46rem;border-radius:50%;background:#FF4A3D;
  box-shadow:0 0 0 2px rgba(255,74,61,.22),0 0 8px #FF4A3D;animation:neu-aufnahme 1.8s ease-in-out infinite}
@keyframes neu-aufnahme{0%,100%{opacity:1}50%{opacity:.35}}
@media (prefers-reduced-motion:reduce){.regal .hb .cover .neu i{animation:none}}

/* Hörbücher-Regal: das neueste Hörbuch als große Karte im Studio-Look (steht durch die Sortierung immer vorn) */
.regal .hb.hb-neu{grid-column:span 2;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);grid-template-rows:auto;align-content:start;gap:.5rem 1.8rem;
  position:relative;padding:1.4rem;border-radius:18px;color:var(--leinen);
  background:radial-gradient(120% 90% at 0% 0%,rgba(217,174,99,.16),transparent 55%),linear-gradient(160deg,#3A2630,#22151B);
  box-shadow:0 26px 50px -18px rgba(42,26,34,.55),inset 0 0 0 1px rgba(217,174,99,.22)}
.regal .hb.hb-neu > *{grid-column:2}
.regal .hb.hb-neu > .cover{grid-column:1;grid-row:1 / span 8;margin:0;align-self:start}
.regal .hb.hb-neu > .cover .neu{display:none}
.regal .hb.hb-neu .cover img{box-shadow:0 2px 4px rgba(0,0,0,.4),0 18px 36px rgba(0,0,0,.45)}
.hb-neu-schild{justify-self:start;display:inline-flex;align-items:center;gap:.55rem;margin-top:.2rem;padding:.42rem .8rem .42rem .65rem;
  background:linear-gradient(180deg,#34202A,#1B1015);color:#FF6A5C;border:1px solid rgba(255,96,84,.6);border-radius:7px;
  font:700 .72rem/1 var(--body);letter-spacing:.2em;text-transform:uppercase;text-shadow:0 0 7px rgba(255,86,72,.85);
  box-shadow:0 0 18px rgba(255,70,58,.3),inset 0 0 10px rgba(255,70,58,.18)}
.hb-neu-schild i{width:.55rem;height:.55rem;border-radius:50%;background:#FF4A3D;box-shadow:0 0 0 3px rgba(255,74,61,.2),0 0 10px #FF4A3D;animation:neu-aufnahme 1.8s ease-in-out infinite}
.regal .hb.hb-neu h3{font-family:var(--display);font-weight:600;font-size:clamp(1.5rem,2.2vw,2rem);line-height:1.1;color:#fff;margin-top:.4rem}
.regal .hb.hb-neu .autor{color:var(--rose)}
.regal .hb.hb-neu .genre{color:var(--messing-hell)}
.hb-neu-text{margin:.4rem 0 .2rem;color:var(--rose);font-size:.95rem;line-height:1.6;display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden}
.hb-neu-knopf{justify-self:start;margin-top:.6rem;font:600 .92rem/1 var(--body);color:var(--samt);background:var(--messing-hell);border:0;border-radius:999px;padding:.75rem 1.3rem;cursor:pointer;
  box-shadow:0 8px 18px -6px rgba(217,174,99,.6);transition:transform .2s,background .2s}
.hb-neu-knopf:hover,.hb-neu-knopf:focus-visible{background:#E8C079;transform:translateY(-2px)}
@media (max-width:640px){
  .regal .hb.hb-neu{grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:.35rem 1rem;padding:1rem;border-radius:14px}
  .regal .hb.hb-neu h3{font-size:1.25rem}
  .hb-neu-schild{font-size:.6rem;letter-spacing:.14em;padding:.35rem .55rem}
  .hb-neu-text{display:none}
  .hb-neu-knopf{font-size:.82rem;padding:.6rem 1rem}
}
@media (prefers-reduced-motion:reduce){.hb-neu-schild i{animation:none}.hb-neu-knopf{transition:none}}

/* Startseite „Hör rein“: Überschrift mit Kopfhörer-Symbol, leisen Klangwellen und feiner Trennlinie */
.kabine-kopf{padding-bottom:1.1rem;margin-bottom:1.3rem;border-bottom:1px solid var(--samt-3);position:relative}
.kabine-kopf::after{content:"";position:absolute;left:0;bottom:-1px;width:4.5rem;height:2px;border-radius:2px;background:linear-gradient(90deg,var(--messing-hell),transparent)}
.kabine-titel{display:flex;align-items:center;gap:.85rem;min-width:0}
.kabine-icon{flex:none;display:grid;place-items:center;width:2.9rem;height:2.9rem;border-radius:50%;color:var(--messing-hell);
  background:radial-gradient(circle at 35% 30%,rgba(217,174,99,.22),rgba(217,174,99,.06) 70%);border:1px solid rgba(217,174,99,.45);
  box-shadow:0 0 0 5px rgba(217,174,99,.06),0 8px 18px rgba(0,0,0,.3)}
.kabine-titel h2{font-size:2.1rem;line-height:1;color:var(--leinen);letter-spacing:.01em}
.hoer-wellen{display:inline-flex;align-items:center;gap:3px;height:1.4rem;margin-left:.2rem}
.hoer-wellen i{display:block;width:3px;height:100%;border-radius:2px;background:var(--messing-hell);opacity:.75;transform-origin:50% 50%;animation:hoer-welle 1.6s ease-in-out infinite}
.hoer-wellen i:nth-child(1){animation-delay:-.2s;transform:scaleY(.35)}
.hoer-wellen i:nth-child(2){animation-delay:-.9s;transform:scaleY(.7)}
.hoer-wellen i:nth-child(3){animation-delay:-.5s}
.hoer-wellen i:nth-child(4){animation-delay:-1.2s;transform:scaleY(.6)}
.hoer-wellen i:nth-child(5){animation-delay:-.7s;transform:scaleY(.3)}
@keyframes hoer-welle{0%,100%{transform:scaleY(.3)}50%{transform:scaleY(1)}}
@media (max-width:640px){
  .kabine-icon{width:2.4rem;height:2.4rem}
  .kabine-icon svg{width:18px;height:18px}
  .kabine-titel h2{font-size:1.7rem}
  .kabine-kopf{gap:.6rem}
  .kabine-titel{gap:.6rem}
  .hoer-wellen{display:none}
  .kabine-kopf .pegel-platz{zoom:.7;min-height:0;flex:none}
}
.kabine-titel h2{white-space:nowrap}
@media (prefers-reduced-motion:reduce){.hoer-wellen i{animation:none}}

/* Hörproben-Seite: Kopf im Studio-Look (Schaumstoffwand, Licht, Mikrofon, On-Air-Lampe) */
.studio-kopf{position:relative;isolation:isolate}
.studio-kopf::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:
    conic-gradient(from 45deg,rgba(255,255,255,.05) 0 25%,rgba(0,0,0,.22) 0 50%,rgba(255,255,255,.015) 0 75%,rgba(0,0,0,.12) 0) 0 0/38px 38px;
  -webkit-mask:radial-gradient(75% 95% at 78% 0%,#000 0%,rgba(0,0,0,.45) 45%,transparent 80%);
  mask:radial-gradient(75% 95% at 78% 0%,#000 0%,rgba(0,0,0,.45) 45%,transparent 80%)}
.studio-kopf .wrap{position:relative}
.studio-titel,.studio-kopf .pult{position:relative;z-index:1}
.studio-szene{position:absolute;top:-4rem;right:3%;width:340px;height:380px;pointer-events:none}
.studio-szene svg{display:block;width:100%;height:100%;overflow:visible}
.sz-mikro{transform-origin:200px 0;animation:sz-pendel 7s ease-in-out infinite}
@keyframes sz-pendel{0%,100%{transform:rotate(-1.1deg)}50%{transform:rotate(1.1deg)}}
.sz-kegel{animation:sz-licht 6s ease-in-out infinite}
@keyframes sz-licht{0%,100%{opacity:.85}50%{opacity:1}}

.rec-lampe{display:inline-flex;align-items:center;gap:.55rem;margin-bottom:1.1rem;padding:.42rem .9rem .42rem .75rem;border:1px solid #5A3A44;border-radius:6px;
  background:linear-gradient(180deg,#34202A,#24161D);box-shadow:inset 0 1px 0 rgba(255,255,255,.05),0 6px 16px rgba(0,0,0,.3);
  font:600 .74rem/1 var(--body);letter-spacing:.24em;text-transform:uppercase;color:#9C7F87;transition:color .4s,box-shadow .4s,border-color .4s}
.rec-lampe i{width:9px;height:9px;border-radius:50%;background:#6B2A2E;box-shadow:inset 0 -1px 2px rgba(0,0,0,.4);transition:background .4s,box-shadow .4s}
.studio-kopf:has(.pult.dreht) .rec-lampe{color:#FFD9CF;border-color:#B0453F;box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 0 22px rgba(224,72,60,.35),0 6px 16px rgba(0,0,0,.3);text-shadow:0 0 10px rgba(255,120,100,.7)}
.studio-kopf:has(.pult.dreht) .rec-lampe i{background:#FF5A4A;box-shadow:0 0 10px #FF5A4A,0 0 3px #fff inset;animation:rec-blink 1.6s ease-in-out infinite}
@keyframes rec-blink{50%{opacity:.45}}

@media (max-width:1000px){
  .studio-szene{width:250px;height:280px;right:-40px;top:-4rem;opacity:.55}
}
@media (max-width:640px){
  .studio-szene{width:190px;height:212px;right:-58px;top:-3.2rem;opacity:.4}
}
@media (prefers-reduced-motion:reduce){.sz-mikro,.sz-kegel,.studio-kopf:has(.pult.dreht) .rec-lampe i{animation:none}}

/* Vita: Kapitel mit „Brillen“ */
.brillen-icon{flex:none;color:currentColor}
.brillen-zeile{display:inline-flex;align-items:center;gap:.6rem}
.brillen-zeile .brillen-icon{color:var(--messing)}
.brillen-nav{display:flex;flex-wrap:wrap;gap:.6rem;margin-top:2.2rem}
.brillen-nav a{display:inline-flex;align-items:center;gap:.55rem;padding:.5rem 1rem .5rem .8rem;border:1px solid var(--samt-3);border-radius:999px;color:var(--rose);text-decoration:none;font-weight:500;font-size:.95rem;transition:border-color .2s,color .2s,background .2s}
.brillen-nav a .brillen-icon{width:26px;height:12px;color:var(--messing-hell)}
.brillen-nav a:hover{border-color:var(--messing);color:var(--leinen);background:rgba(184,135,58,.1)}
.vita-kopf{background:radial-gradient(60% 80% at 85% 0%,#4A2C38 0%,transparent 65%),var(--samt)}

.vita-grid .vita-portraet{width:100%;aspect-ratio:4/5;object-fit:cover;border-radius:200px 200px 20px 20px;position:sticky;top:110px}
.agenturen-titel{font-size:1.5rem;margin:2.4rem 0 1rem}
.agenturen{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,210px),1fr));gap:.9rem}
.agentur{position:relative;display:flex;flex-direction:column;gap:.2rem;padding:1.1rem 1.2rem 1rem;background:#fff;border:1px solid #E3D6C9;border-radius:16px;transition:transform .2s,box-shadow .2s,border-color .2s}
.agentur strong{font-family:var(--display);font-size:1.35rem;line-height:1.15}
.agentur-art{font-size:.88rem;color:var(--grau)}
.agentur-link{margin-top:auto;padding-top:.8rem;font-weight:600;font-size:.92rem;color:var(--messing-dunkel);text-decoration:none}
.agentur-link::after{content:"";position:absolute;inset:0;border-radius:inherit}
.agentur-link::before{content:"→";float:right;margin-left:.4rem;transition:transform .2s}
.agentur:has(.agentur-link):hover{transform:translateY(-3px);border-color:var(--messing);box-shadow:0 14px 30px rgba(42,26,34,.1)}
.agentur:has(.agentur-link):hover .agentur-link::before{transform:translateX(3px)}
.vita-social .social a{color:var(--samt);border-color:#D9C8BA}
.vita-social .social a:hover{border-color:var(--messing)}
.vita-social .community{color:var(--grau);border-color:#E3D6C9;background:#fff}
.vita-social .community a{color:var(--messing-dunkel)}

.vita-zitat{background:var(--samt);color:var(--leinen);padding:7rem 0 5.5rem;text-align:center;position:relative;overflow:hidden;overflow:clip}
.vita-zitat::before{content:"“";position:absolute;left:50%;top:-1.6rem;transform:translateX(-50%);font-family:var(--display);font-size:16rem;line-height:1;color:var(--messing);opacity:.14;pointer-events:none}
.vita-zitat blockquote{margin:0 auto;max-width:52rem;position:relative}
.vita-zitat p{font-family:var(--display);font-weight:600;font-size:clamp(2rem,4.4vw,3.4rem);line-height:1.15;text-wrap:balance}
.vita-zitat footer{font-family:var(--schrift);font-size:2.4rem;color:var(--messing-hell);margin-top:1.2rem}

.vita-kapitel + .vita-kapitel{border-top:1px solid #E3D6C9}
.kapitel-grid{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:4rem;align-items:center}
.kapitel-zitat{position:relative;padding:2.2rem 2rem 2.2rem 2.4rem;border-left:3px solid var(--messing);background:linear-gradient(90deg,rgba(184,135,58,.09),transparent)}
.kapitel-zitat p{font-family:var(--display);font-style:italic;font-size:clamp(1.6rem,2.8vw,2.2rem);line-height:1.25;color:var(--samt)}
.vita-kapitel .eigene{margin-top:3rem}
.kapitel-aktion{margin-top:1.8rem}

.vita-kapitel-dunkel{background:var(--samt);color:var(--leinen);border-top:0!important}
.vita-kapitel-dunkel + .vita-kapitel{border-top:0}
.vita-kapitel-dunkel .zeile{color:var(--messing-hell)}
.vita-kapitel-dunkel .brillen-zeile .brillen-icon{color:var(--messing-hell)}
.vita-kapitel-dunkel .fliesstext{color:var(--rose)}
.ehrenamt-karte{background:linear-gradient(180deg,var(--samt-2),#2F1F27);border:1px solid var(--samt-3);border-radius:22px;padding:2.2rem;box-shadow:0 24px 50px rgba(0,0,0,.25)}
.ehrenamt-icon{display:grid;place-items:center;width:3.2rem;height:3.2rem;border-radius:50%;color:#FF9A7A;background:radial-gradient(circle,rgba(224,72,60,.28),rgba(224,72,60,.08));box-shadow:0 0 0 1px rgba(224,72,60,.35)}
.ehrenamt-karte h3{font-size:1.7rem;margin:1.1rem 0 .7rem;color:var(--leinen)}
.ehrenamt-karte p{color:var(--rose)}
.ehrenamt-karte .btn{margin-top:1.5rem}

.drachen{display:grid;place-items:center}
.drachen svg{width:min(220px,60%);height:auto;overflow:visible}
.drachen-flug{transform-origin:110px 90px;animation:drachen 6s ease-in-out infinite}
@keyframes drachen{0%,100%{transform:rotate(-5deg) translateY(0)}50%{transform:rotate(4deg) translateY(-10px)}}

.vita-fotos:not(:has(img)){display:none}
.vita-fotos-reihe{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,240px),1fr));gap:1.2rem;margin-top:3rem}
.vita-fotos figure{margin:0}
.vita-fotos figure:not(:has(img)){display:none}
.vita-fotos img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:16px;box-shadow:0 14px 30px rgba(42,26,34,.14)}
.vita-fotos figcaption{font-size:.9rem;color:var(--grau);margin-top:.55rem}
.vita-kapitel-dunkel .vita-fotos figcaption{color:var(--grau-d)}

.vita-schluss{background:var(--leinen-2);text-align:center}
.vita-schluss h2{font-size:clamp(2.2rem,4.4vw,3.2rem)}
.vita-schluss p{color:var(--grau);margin-top:.9rem}
.vita-schluss .actions{display:flex;flex-wrap:wrap;justify-content:center;gap:.9rem;margin-top:1.8rem}

@media (max-width:1000px){
  .kapitel-grid{grid-template-columns:1fr;gap:2.4rem}
  .vita-grid .vita-portraet{position:static;max-width:340px}
  .drachen{display:none}
}
@media (max-width:640px){
  .vita-zitat{padding:5.5rem 0 4rem}
  .vita-zitat::before{font-size:11rem;top:-1.2rem}
  .ehrenamt-karte{padding:1.6rem}
  .kapitel-zitat{padding:1.6rem 1.3rem 1.6rem 1.5rem}
}
@media (prefers-reduced-motion:reduce){.drachen-flug{animation:none}}

/* Vita: Porträt mit Rahmen */
.vita-bild{margin:0;position:sticky;top:110px;padding:0 0 18px 18px}
.vita-bild::before{content:"";position:absolute;left:0;bottom:0;width:calc(100% - 18px);height:calc(100% - 18px);border:1.5px solid var(--messing);border-radius:200px 200px 20px 20px;opacity:.7}
.vita-bild::after{content:"";position:absolute;right:-14px;top:22%;width:64px;height:64px;border-radius:50%;background:radial-gradient(circle,var(--messing-hell),var(--messing));opacity:.18}
.vita-grid .vita-bild .vita-portraet{position:relative;z-index:1;width:100%;aspect-ratio:4/5;object-fit:cover;object-position:50% 20%;border-radius:200px 200px 20px 20px;box-shadow:0 26px 50px rgba(42,26,34,.18);top:auto}
@media (max-width:1000px){
  .vita-bild{position:relative;top:auto;max-width:340px}
  .vita-grid .vita-bild .vita-portraet{max-width:none}
}

/* Vita-Kopf: vier „Brillengläser“ als Kapitel-Sprünge */
.vita-kopf-grid{display:grid;grid-template-columns:minmax(0,1fr) 420px;gap:3rem;align-items:center}
.linsen{position:relative;width:420px;height:440px;animation:linse-schweben 7s ease-in-out infinite}
.linsen-buegel{position:absolute;inset:0;width:100%;height:100%;fill:none;stroke:var(--messing);stroke-width:4;stroke-linecap:round;pointer-events:none}
.linse{position:absolute;width:150px;display:flex;flex-direction:column;align-items:center;gap:.7rem;text-decoration:none;color:var(--rose)}
.linse.l1{left:35px;top:45px}
.linse.l2{left:235px;top:45px}
.linse.l3{left:35px;top:245px}
.linse.l4{left:235px;top:245px}
.linse-glas{display:grid;place-items:center;width:150px;height:150px;border-radius:50%;color:var(--messing-hell);
  background:radial-gradient(circle at 32% 28%,rgba(255,255,255,.16),transparent 38%),radial-gradient(circle at 50% 60%,#4A2C38,#24151C 75%);
  box-shadow:0 0 0 4px var(--messing),0 0 0 9px rgba(184,135,58,.14),0 22px 44px rgba(0,0,0,.4),inset 0 -12px 24px rgba(0,0,0,.35);
  transition:transform .3s,box-shadow .3s,color .3s}
.linse-glas svg{width:46px;height:46px}
.linse-name{font-weight:600;font-size:.95rem;letter-spacing:.02em}
.linse:hover .linse-glas{transform:scale(1.05);color:var(--leinen);box-shadow:0 0 0 4px var(--messing-hell),0 0 0 12px rgba(217,174,99,.2),0 26px 50px rgba(0,0,0,.45),inset 0 -12px 24px rgba(0,0,0,.3)}
.linse:hover .linse-name{color:var(--messing-hell)}
.linse:focus-visible{outline:none}
.linse:focus-visible .linse-glas{outline:2px solid var(--messing-hell);outline-offset:8px}
@keyframes linse-schweben{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}
@media (min-width:1001px){.vita-kopf .brillen-nav{display:none}}
@media (max-width:1000px){
  .vita-kopf-grid{grid-template-columns:1fr}
  .linsen{display:none}
}
@media (prefers-reduced-motion:reduce){.linsen{animation:none}}

/* Name oben links: leichter goldener Schimmer darunter */
.logo{position:relative;padding-bottom:.2em;text-shadow:0 0 22px rgba(217,174,99,.22)}
.logo::before{content:"";position:absolute;left:6%;right:14%;bottom:.12em;height:.6em;border-radius:50%;pointer-events:none;
  background:radial-gradient(50% 50% at 50% 50%,rgba(217,174,99,.32),rgba(217,174,99,0) 70%);filter:blur(4px)}
.logo::after{content:"";position:absolute;left:6%;right:12%;bottom:.36em;height:1px;border-radius:2px;pointer-events:none;
  background:linear-gradient(90deg,rgba(217,174,99,0),rgba(217,174,99,.55) 25%,rgba(255,236,196,.95) 50%,rgba(217,174,99,.55) 75%,rgba(217,174,99,0)) 0 0/220% 100%;
  animation:logo-schimmer 6s ease-in-out infinite}
@keyframes logo-schimmer{0%,100%{background-position:100% 0;opacity:.75}50%{background-position:0 0;opacity:1}}
.logo:has(.aa-logo)::before,.logo:has(.aa-logo)::after{display:none}
@media (prefers-reduced-motion:reduce){.logo::after{animation:none}}

/* ===== Musterseite ===== */
/* Hinweisleiste: Name und Inhalte sind frei erfunden */
.muster-hinweis{background:var(--messing-hell);color:var(--samt);font-size:.88rem;line-height:1.45;padding:.55rem 0}
.muster-hinweis .wrap{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:.3rem .7rem;text-align:center}
.muster-hinweis strong{text-transform:uppercase;letter-spacing:.08em;font-size:.76rem;background:var(--samt);color:var(--messing-hell);border-radius:99px;padding:.15rem .6rem}
.muster-hinweis a{font-weight:600;color:var(--samt)}

/* Kabine auf der Startseite: zuletzt eingesprochene Hörbücher statt Hörproben */
.kabine-cover{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.9rem}
.kc{position:relative;display:block;border-radius:10px;overflow:hidden;box-shadow:0 12px 24px rgba(0,0,0,.35);transition:transform .25s ease,box-shadow .25s ease}
.kc img{width:100%;aspect-ratio:1;object-fit:cover}
.kc-genre{position:absolute;left:.45rem;bottom:.45rem;background:rgba(42,26,34,.82);color:var(--rose);font-size:.72rem;font-weight:600;border-radius:99px;padding:.1rem .55rem;opacity:0;transform:translateY(4px);transition:opacity .25s,transform .25s}
.kc:hover,.kc:focus-visible{transform:translateY(-4px) rotate(-1deg);box-shadow:0 18px 32px rgba(0,0,0,.45)}
.kc:hover .kc-genre,.kc:focus-visible .kc-genre{opacity:1;transform:none}
.kabine-muster .kabine-mehr{margin-top:1.3rem}
@media (max-width:520px){.kabine-cover{gap:.6rem}.kc-genre{display:none}}
@media (prefers-reduced-motion:reduce){.kc,.kc-genre{transition:none}}

/* Formulare auf der Musterseite: sichtbar, aber abgeschaltet */
.muster-aus{border:0;padding:0;margin:0;min-width:0}
.muster-aus:disabled{opacity:.75}
.muster-formular{font-size:.88rem;line-height:1.45;background:rgba(217,174,99,.16);border:1px solid rgba(184,135,58,.45);color:inherit;border-radius:10px;padding:.6rem .8rem;margin:0 0 1rem}
/* Längere Überschrift in der Kabine: auf dem Handy nicht über den Rand schieben */
.hero .wrap>*{min-width:0}
.kabine-muster .kabine-titel{min-width:0}
@media (max-width:560px){
  .kabine-muster .kabine-titel h2{font-size:1.45rem}
  .kabine-muster .hoer-wellen{display:none}
}
@media (max-width:420px){.kabine-muster .aa-pegel-onair{padding:7px 10px;font-size:11px;letter-spacing:.12em}.kabine-muster .kabine-titel h2{font-size:1.3rem}}
/* On-Air-Schild: leuchtet auf der Musterseite dauerhaft, mit sanftem Glühen */
.kabine-muster .aa-pegel-onair{background:#C8442E;border-color:#E06A4F;color:#fff;box-shadow:0 0 0 4px rgba(200,68,46,.18),0 0 24px rgba(224,106,79,.5);animation:onair-gluehen 3.2s ease-in-out infinite}
.kabine-muster .aa-pegel-onair b{background:#fff;box-shadow:0 0 8px #fff;animation:onair-punkt 1.6s ease-in-out infinite}
@keyframes onair-gluehen{0%,100%{box-shadow:0 0 0 4px rgba(200,68,46,.16),0 0 18px rgba(224,106,79,.4)}50%{box-shadow:0 0 0 5px rgba(200,68,46,.24),0 0 34px rgba(224,106,79,.75)}}
@keyframes onair-punkt{0%,100%{opacity:1}50%{opacity:.45}}
@media (prefers-reduced-motion:reduce){.kabine-muster .aa-pegel-onair,.kabine-muster .aa-pegel-onair b{animation:none}}
/* Schmale Handys: Überschrift darf umbrechen, Schild bleibt rechts daneben */
@media (max-width:480px){
  .kabine-muster .kabine-titel h2{white-space:normal;line-height:1.05}
  .kabine-muster .pegel-platz{flex:none}
}