/* v28 „Maison“ für Unterseiten: lädt NACH style.css. Kopfzeile, Menü und Fußzeile wie die Startseite (Regeln aus maison.css übernommen), dazu Farben/Schrift angeglichen. */
/* Kopfzeile */
.mh { position: fixed; inset: 0 0 auto; z-index: 50; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; height: 64px; padding: 0 var(--pad); color: #fff; transition: background .4s, color .4s, box-shadow .4s; }
.mh.solid { background: rgba(255,255,255,.96); color: var(--ink); box-shadow: 0 1px 0 var(--line); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); }
.mh-menu { justify-self: start; background: none; border: 0; color: inherit; cursor: pointer; display: flex; align-items: center; gap: 10px; padding: 8px 0; font: 600 11px/1 var(--sans); letter-spacing: .2em; text-transform: uppercase; }
.mh-menu i { position: relative; width: 18px; height: 1px; background: currentColor; }
.mh-menu i::after { content: ''; position: absolute; left: 0; top: 6px; width: 12px; height: 1px; background: currentColor; }
.mh-mark { font: 600 italic 26px/1 var(--serif); text-decoration: none; letter-spacing: -.01em; }
.mh-mark i { color: var(--champ); }
.mh-right { justify-self: end; display: flex; gap: 22px; align-items: center; }
.mh-right a { font: 600 11px/1 var(--sans); letter-spacing: .2em; text-transform: uppercase; text-decoration: none; }
.mh-lang { opacity: .7; }
@media (max-width: 640px) { .mh-cta { display: none; } .mh-menu span { display: none; } .mh-mark { font-size: 23px; } }
/* Menü */
.mm { position: fixed; inset: 0; z-index: 60; background: var(--white); display: flex; flex-direction: column; padding: 20px var(--pad) 40px; transform: translateY(-100%); transition: transform .7s var(--ease); visibility: hidden; }
.mm.open { transform: none; visibility: visible; }
.mm-close { align-self: flex-start; background: none; border: 0; cursor: pointer; font: 600 11px/1 var(--sans); letter-spacing: .2em; text-transform: uppercase; padding: 14px 0; color: var(--ink); }
.mm ul { list-style: none; margin: auto 0; padding: 0; }
.mm li a { display: block; font: 400 clamp(34px, 6vw, 64px)/1.25 var(--serif); text-decoration: none; transition: opacity .3s, padding .4s var(--ease); }
.mm li a:hover { opacity: .55; padding-left: 10px; }
.mm-foot { display: flex; gap: 24px; flex-wrap: wrap; color: var(--grey); }
.mm-foot a { text-decoration: none; }
.mf { background: var(--ink); color: rgba(255,255,255,.75); padding: clamp(56px, 8vw, 96px) var(--pad) 32px; text-align: center; }
.mf-mark { font: 600 italic clamp(44px, 9vw, 120px)/1 var(--serif); color: #fff; text-decoration: none; letter-spacing: -.02em; }
.mf-mark i { color: var(--champ); }
.mf nav { display: flex; flex-wrap: wrap; justify-content: center; gap: 14px 30px; margin: 40px 0 34px; }
.mf nav a { text-decoration: none; color: #fff; }
.mf p { font-size: 12px; margin: 6px 0; }

/* Tokens: Smaragd weicht Tinte, Hintergrund weiß wie die Startseite */
:root { --emerald: #141414; --emerald-2: #2A2A2A; --emerald-3: #3A3A3A; --charcoal: #141414; --charcoal-2: #4A4A4A; --offwhite: #FFFFFF; --ivory: #FAF8F4;
  --line: #E4E0D8; --grey: #6B6B6B; --white: #FFF; --champ: #E2C799; --pad: clamp(20px, 4vw, 56px); --nav-h: 64px; }
body { background: #fff; color: var(--ink, #141414); font-size: 16px; }
.lbl { font: 600 11px/1.4 var(--sans); letter-spacing: .2em; text-transform: uppercase; }
.skip { position: absolute; left: -999px; } .skip:focus { left: 12px; top: 12px; z-index: 99; background: #fff; padding: 8px 12px; }

/* Überschriften ruhig und aufrecht wie auf der Startseite */
h1, h2, h3 { font-weight: 400; font-style: normal; letter-spacing: -.01em; }
h1 em, h2 em, h3 em { font-style: italic; }
.eyebrow { font-size: 11px; letter-spacing: .2em; color: var(--grey); }
.bg-dark .eyebrow, .page-head .eyebrow { color: var(--champ); }

/* Knöpfe: eckig, Versalien, schwarz */
.btn { border-radius: 0; min-height: 50px; padding: 16px 28px; font: 600 11px/1 var(--sans); letter-spacing: .2em; text-transform: uppercase; background: #141414; color: #fff; border-color: #141414; box-shadow: none; }
.btn:hover { background: var(--bordeaux, #5C1A24); border-color: var(--bordeaux, #5C1A24); transform: none; box-shadow: none; }
.btn.gold { background: #141414; color: #fff; border-color: #141414; }
.btn.gold:hover { background: var(--bordeaux, #5C1A24); }
.btn.ghost { background: transparent; color: #141414; border: 0; border-bottom: 1px solid currentColor; padding: 0 0 6px; min-height: 0; }
.btn.sm { min-height: 42px; padding: 12px 20px; font-size: 11px; }
.bg-dark .btn, .bg-dark .btn.gold, .final .btn { background: #fff; color: #141414; border-color: #fff; }
.bg-dark .btn:hover, .final .btn:hover { background: var(--champ); border-color: var(--champ); }
.bg-dark .btn.ghost { background: transparent; color: #fff; }

/* Seitenkopf: Himmel + Zeppelin bleiben, Text mittig und hell wie im Startseiten-Hero */
.page-head.sky { align-items: flex-end; justify-content: center; text-align: center; min-height: min(82svh, 760px); padding-bottom: clamp(56px, 9vh, 96px); }
.page-head.sky::before { background: linear-gradient(180deg, rgba(0,0,0,.30) 0%, rgba(0,0,0,0) 24%, rgba(0,0,0,0) 42%, rgba(0,0,0,.58) 100%); }
.page-head.sky .container, .page-head.sky .container:not(.center) > * { max-width: 760px; margin-inline: auto; }
.page-head.sky .zep { right: auto; left: calc(50% - min(21vw, 23vh)); top: calc(var(--nav-h) + 3vh); width: min(42vw, 46vh); }
.page-head.sky h1 { color: #fff; font-size: clamp(36px, 5.4vw, 76px); line-height: 1.08; }
.page-head.sky .lede, .page-head.sky .pkg-intro, .page-head.sky p { color: rgba(255,255,255,.92); margin-inline: auto; }
.page-head.sky .ph-cue { color: #fff; }
.page-head:not(.sky) { background: #141414; }
@media (max-width: 760px) {
  .page-head.sky { min-height: 0; padding-top: calc(var(--nav-h) + 62vw); }
  .page-head.sky .zep { width: 74vw; left: 13vw; top: calc(var(--nav-h) + 4vw); }
}

/* Dunkle Blöcke: Schwarz statt Smaragd */
.bg-dark, .final { background-color: #141414; }

/* Kopfzeile auf Seiten ohne Himmel sofort deckend; Handy-Leiste im Maison-Stil */
.mh.solid .mh-mark i { color: var(--bordeaux, #5C1A24); }
.m-cta { border-radius: 0; background: #141414; color: #fff; font: 600 11px/1 var(--sans); letter-spacing: .18em; text-transform: uppercase; }
.mf .mf-small { opacity: .75; }
.mf .mf-small a { color: #fff; }

/* Akzente: Orange und Altrosa weichen Bordeaux und Champagner */
:root { --amber: #5C1A24; --amber-soft: #F3E9E6; --rose: #C9A96E; --rose-soft: #F6F0E4; }
.page-head .pkg-intro::first-letter { float: none; font: inherit; color: inherit; padding: 0; }
.page-head .pkg-intro { font-size: 14px; opacity: .85; }
@media (min-width: 761px) { .page-head.sky .zep { width: min(34vw, 36vh); left: calc(50% - min(17vw, 18vh)); top: calc(var(--nav-h) + 2vh); } }
.band.dark .btn, .band.dark .btn.gold, .shell.dark .btn { background: #fff; color: #141414; border-color: #fff; }
.band.dark .btn:hover, .shell.dark .btn:hover { background: var(--champ); border-color: var(--champ); }
.band.dark { --amber: #E2C799; }
.pkg-label { background: rgba(20,20,20,.78) !important; border-color: rgba(226,199,153,.5) !important; border-radius: 0 !important; }

/* ===== v28.1 RUHE: weniger Reize, ein Blick, ein Weg. Keine Muster, keine Schrägen, keine Zierbuchstaben. ===== */
/* Zierbuchstaben und Muster weg */
.pkg-intro::first-letter { float: none !important; font: inherit !important; color: inherit !important; padding: 0 !important; }
.band.mag-page::before, .band.mag-page::after, .mag-page::before, section::before { background-image: none !important; }
.band.mag-page::after { display: none !important; }
#kostenlos::before, #atmen::before, .free-card::before, .free-card::after { display: none !important; }
/* Magazin-Deko an den Paketen weg: Folio, große Zahl, Preis-Etikett auf dem Foto (Preis steht daneben) */
.mag-folio, .mag-num, .pkg-label, .ph-cue, .page-head .pkg-intro { display: none !important; }
/* Pakete: flach, ruhig, Hairline statt Kasten */
.band.mag-page { background: #fff !important; border: 0 !important; border-top: 1px solid var(--line) !important; border-radius: 0 !important; box-shadow: none !important; padding-left: 0 !important; padding-right: 0 !important; padding-top: clamp(36px, 5vw, 64px) !important; }
.band.mag-page.dark { background: #141414 !important; padding-left: clamp(20px, 4vw, 56px) !important; padding-right: clamp(20px, 4vw, 56px) !important; }
.band.mag-page.reveal { transform: none !important; }
.mag-fig { rotate: 0deg !important; padding: 0 !important; border: 0 !important; box-shadow: none !important; background: none !important; }
.mag-fig .band-img, .band-img { border-radius: 0 !important; }
.mag-copy h2, .band h2 { font-style: normal !important; color: inherit; }
.band.dark h2, .band.dark .pkg-price { color: #fff !important; }
.band .teaser, .mag-copy .teaser { font-style: normal; font-family: var(--sans); font-size: 16px; color: var(--grey); }
.band.dark .teaser { color: rgba(255,255,255,.75) !important; }
.eyebrow, .band-h4 { color: var(--grey) !important; }
.band.dark .eyebrow, .band.dark .band-h4, .bg-dark .eyebrow, .page-head .eyebrow { color: var(--champ) !important; }
/* „Mehr erfahren“: schlichter Textlink statt Leopardenpille */
.more > summary { background: none !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important; padding: 12px 0 !important; font: 600 11px/1 var(--sans) !important; letter-spacing: .2em; text-transform: uppercase; color: inherit !important; }
.more > summary .pm { width: 18px; height: 18px; border-color: currentColor !important; background: none !important; }
/* Kästen überall: keine Füllung, kein Schatten, keine Rundung, nur eine feine Linie */
.shell, .namebox, .creds .shell, .principle { background: none !important; border: 0 !important; border-top: 1px solid var(--line) !important; border-radius: 0 !important; box-shadow: none !important; padding-left: 0 !important; padding-right: 0 !important; }
.namebox .mark { display: none; }
.bg-dark .shell, .shell.dark { border-top-color: rgba(255,255,255,.15) !important; }
.portrait { border-radius: 0 !important; outline: 0 !important; box-shadow: none !important; }
.portrait::before, .portrait::after { display: none !important; }
.link { color: var(--ink, #141414) !important; }
.bg-dark .link { color: #fff !important; }
/* Bewegung leiser: Inhalte blenden nur sanft ein */
.reveal { transition-duration: .7s !important; }

/* ===== Handy: luftig, große klare Schrift, Bilder randlos ===== */
@media (max-width: 760px) {
  body { font-size: 16px; line-height: 1.65; }
  .container { padding-left: 22px; padding-right: 22px; }
  .page-head.sky { padding-top: calc(var(--nav-h) + 54vw); padding-bottom: 44px; }
  .page-head.sky h1 { font-size: clamp(32px, 9vw, 40px); }
  .page-head.sky .lede { font-size: 16px; }
  .page-head.sky .zep { width: 64vw; left: 18vw; }
  .band.mag-page { padding-top: 40px !important; row-gap: 18px; }
  .band.mag-page .mag-fig { margin-left: -22px; margin-right: -22px; }
  .band.mag-page.dark .mag-fig { margin-left: -20px; margin-right: -20px; }
  h2 { font-size: clamp(28px, 8vw, 34px); }
  .btn { width: 100%; }
  .btn.ghost, .btn.sm { width: auto; }
  .section, section { scroll-margin-top: 70px; }
}
.entry-card, .monthly { background: none !important; border: 0 !important; border-top: 1px solid var(--line) !important; border-bottom: 1px solid var(--line) !important; border-radius: 0 !important; box-shadow: none !important; padding-left: 0 !important; padding-right: 0 !important; }
.entry-card::before, .entry-card::after, .monthly::before { display: none !important; }
.band.dark .more > summary .pm { border-color: rgba(255,255,255,.7) !important; color: #fff; }
/* Kontakt + Shop & Tools: Karten flach, Hintergründe ruhig */
.dl-card, .tl-card, .steps3 > *, .mag, .qz, .box, .contact-lines { border-radius: 0 !important; box-shadow: none !important; }
.dl-card, .tl-card, .steps3 > * { background: none !important; border: 0 !important; border-top: 1px solid var(--line) !important; padding-left: 0 !important; padding-right: 0 !important; }
.mag, .qz { background: #fff !important; border: 1px solid var(--line) !important; }
.mag::before, .mag::after, .qz::before { background-image: none !important; }
.opt, .qz-opt, .chip { border-radius: 0 !important; box-shadow: none !important; }
.termin-bg, .mail-bg, .tl-sec, .quiz-sec, .dl-sec { background: #fff !important; }
.termin-bg::before, .termin-bg::after, .mail-bg::before { display: none !important; }
.tag, .badge { border-radius: 0 !important; }
.mag-top .mag-no, .q-n { font-style: normal !important; color: var(--grey) !important; }
.steps3 li { padding-left: 50px !important; }
.steps3 .s-n { left: 0; width: 30px; height: 30px; background: none !important; border: 1px solid var(--ink, #141414); color: var(--ink, #141414) !important; font-style: normal !important; }

/* ===== v29 PAKETE: Kacheln + Fenster mit Zeppelin-Banner (nur mit JS aktiv, Klasse body.pk-on) ===== */
.pk-on .band.mag-page { display: none !important; }
.pk-wrap { margin: 0 0 clamp(48px, 7vw, 88px); }
.pk-lead { text-align: center; color: var(--grey); margin: 0 0 clamp(22px, 3vw, 36px); }
.pk-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(14px, 2vw, 28px); }
.pk-tile { all: unset; box-sizing: border-box; cursor: pointer; display: flex; flex-direction: column; text-align: left; color: var(--ink, #141414); opacity: 0; transform: translateY(24px); animation: pk-in .9s cubic-bezier(.2,.8,.2,1) forwards; animation-delay: calc(.15s + var(--i) * .12s); -webkit-tap-highlight-color: transparent; }
@keyframes pk-in { to { opacity: 1; transform: none; } }
.pk-img { position: relative; display: block; aspect-ratio: 4 / 5; overflow: hidden; background: #eee; margin-bottom: 18px; }
.pk-img img { width: 100%; height: 100%; object-fit: cover; transition: transform 1.2s cubic-bezier(.2,.8,.2,1), filter .6s; }
.pk-img::after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 60%, rgba(0,0,0,.25)); opacity: 0; transition: opacity .5s; }
.pk-tile:hover .pk-img img, .pk-tile:focus-visible .pk-img img { transform: scale(1.05); }
.pk-tile:hover .pk-img::after { opacity: 1; }
.pk-tile:active .pk-img img { transform: scale(.98); transition-duration: .2s; }
.pk-tile:focus-visible { outline: 2px solid var(--ink, #141414); outline-offset: 6px; }
.pk-rec { position: absolute; top: 14px; left: 14px; background: #fff; color: #141414; font: 600 10px/1 var(--sans); letter-spacing: .2em; text-transform: uppercase; padding: 8px 10px; }
.pk-ey { color: var(--grey); }
.pk-h { font: 400 clamp(21px, 1.9vw, 26px)/1.2 var(--serif); margin: 8px 0 4px; }
.pk-sub { color: var(--grey); font-size: 14px; }
.pk-pr { margin-top: 12px; font-size: 13px; color: var(--grey); }
.pk-pr b { font: 400 20px/1 var(--serif); color: var(--ink, #141414); margin-right: 6px; }
.pk-more { margin-top: 16px; display: inline-flex; align-items: center; gap: 10px; align-self: flex-start; padding-bottom: 6px; border-bottom: 1px solid currentColor; }
.pk-more i { font-style: normal; font-size: 16px; line-height: 0; transition: transform .5s cubic-bezier(.2,.8,.2,1); }
.pk-tile:hover .pk-more i { transform: rotate(90deg); }
.pk-swipe { display: none; }
@media (max-width: 760px) {
  .pk-grid { grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: 78%; overflow-x: auto; scroll-snap-type: x mandatory; margin: 0 -22px; padding: 0 22px 6px; scroll-padding: 0 22px; scrollbar-width: none; }
  .pk-grid::-webkit-scrollbar { display: none; }
  .pk-tile { scroll-snap-align: start; }
  .pk-swipe { display: block; text-align: right; color: var(--grey); margin: 14px 0 0; }
}

/* Fenster */
.pk-lock, .pk-lock body { overflow: hidden; }
.pk-sheet { position: fixed; inset: 0; z-index: 90; }
.pk-sheet[hidden] { display: none; }
.pk-back { position: absolute; inset: 0; background: rgba(12,10,9,.55); backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px); opacity: 0; transition: opacity .5s; }
.pk-sheet.open .pk-back { opacity: 1; }
.pk-panel { position: absolute; top: 0; right: 0; bottom: 0; width: min(580px, 100%); background: #fff; color: #141414; display: flex; flex-direction: column; transform: translateX(100%); transition: transform .75s cubic-bezier(.2,.9,.2,1); box-shadow: -30px 0 80px -30px rgba(0,0,0,.4); }
.pk-sheet.open .pk-panel { transform: none; }
.pk-sky { position: relative; flex: none; height: 190px; background: #9FB4C4 center 60% / cover no-repeat; overflow: hidden; }
.pk-sky::after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(0,0,0,.25), transparent 40%, rgba(255,255,255,0) 70%, rgba(255,255,255,.9)); pointer-events: none; }
.pk-cl { position: absolute; left: -10%; bottom: -30px; width: 120%; max-width: none; mix-blend-mode: screen; opacity: .8; animation: pk-drift 40s linear infinite alternate; }
@keyframes pk-drift { to { transform: translateX(-8%); } }
.pk-x { position: absolute; z-index: 3; top: 16px; right: 18px; background: none; border: 0; color: #fff; cursor: pointer; padding: 8px 0; display: flex; align-items: center; gap: 8px; }
.pk-x i { font-style: normal; font-size: 20px; line-height: 0; }
.pk-fly { position: absolute; z-index: 2; left: 5%; right: 5%; top: 58px; height: 90px; display: flex; align-items: center; transform: translateX(-115%); }
.pk-sheet.open .pk-fly { animation: pk-arrive 1.7s .25s cubic-bezier(.2,.75,.25,1) forwards, pk-hover 7s 2s ease-in-out infinite; }
@keyframes pk-arrive { 0% { transform: translateX(-115%) rotate(2deg); } 70% { transform: translateX(2%) rotate(-1deg); } 100% { transform: translateX(0) rotate(0); } }
@keyframes pk-hover { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-6px) rotate(-.6deg); } }
.pk-zep { width: 46%; flex: none; height: auto; filter: drop-shadow(0 12px 16px rgba(0,0,0,.25)); }
.pk-rope { flex: none; width: 7%; height: 1px; background: rgba(255,255,255,.85); margin-top: 18px; }
.pk-ban { position: relative; flex: 1; min-width: 0; height: 40px; margin-top: 18px; display: grid; place-items: center; background: linear-gradient(180deg, #F1DFBC, #E2C799 55%, #CDAE78); color: #141414; clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%, 12px 50%); box-shadow: 0 8px 14px -8px rgba(0,0,0,.4); transform-origin: right center; }
.pk-ban span { font: 600 10.5px/1.2 var(--sans); letter-spacing: .18em; text-transform: uppercase; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; padding: 0 10px 0 22px; opacity: 0; }
.pk-sheet.open .pk-ban { animation: pk-unfurl 1s 1.4s cubic-bezier(.3,.8,.3,1) both, pk-wave 3.2s 2.4s ease-in-out infinite; }
.pk-sheet.open .pk-ban span { animation: pk-fade .6s 2s forwards; }
@keyframes pk-unfurl { from { clip-path: polygon(100% 0, 100% 0, 100% 100%, 100% 100%, 100% 50%); } to { clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%, 12px 50%); } }
@keyframes pk-wave { 0%, 100% { transform: skewY(0); } 50% { transform: skewY(-1.4deg); } }
@keyframes pk-fade { to { opacity: 1; } }
.pk-body { flex: 1; overflow-y: auto; -webkit-overflow-scrolling: touch; overscroll-behavior: contain; padding: 6px clamp(22px, 5vw, 44px) 28px; }
.pk-body .mag-copy > * { opacity: 0; transform: translateY(14px); }
.pk-sheet.open .pk-body .mag-copy > * { animation: pk-in .7s var(--d, .3s) cubic-bezier(.2,.8,.2,1) forwards; }
.pk-body h2 { font: 400 clamp(28px, 4vw, 36px)/1.12 var(--serif) !important; color: #141414 !important; margin: 8px 0 4px; }
.pk-body .eyebrow { color: var(--grey) !important; margin-bottom: 4px; }
.pk-body .sub { color: var(--grey); margin: 0 0 14px; }
.pk-body .rec-badge { display: inline-block; margin-bottom: 12px; border-radius: 0; }
.pk-body .pkg-price { display: flex; align-items: baseline; gap: 10px; padding: 14px 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); margin: 0 0 16px; }
.pk-body .pkg-price b { font: 400 28px/1 var(--serif); color: #141414 !important; }
.pk-body .pkg-price span { color: var(--grey); font-size: 13px; }
.pk-body .teaser { font-size: 16px; color: #141414 !important; margin: 0 0 22px; }
.pk-body .band-h4 { margin: 22px 0 10px; }
.pk-body .flow li, .pk-body .dots li { font-size: 15px; }
.pk-body .flow li { display: block !important; }
.pk-body .flow li b { display: block; font-size: 14px; color: #141414 !important; }
.pk-body .flow li span { color: #4a4a4a !important; }
.pk-body .dots li, .pk-body .checks li, .pk-body .more-body p { color: #2a2a2a !important; }
.pk-body .more > summary .pm { border-color: #141414 !important; }
.pk-foot { flex: none; padding: 14px clamp(22px, 5vw, 44px) calc(16px + env(safe-area-inset-bottom)); border-top: 1px solid var(--line); background: #fff; transform: translateY(100%); transition: transform .6s .45s cubic-bezier(.2,.9,.2,1); }
.pk-sheet.open .pk-foot { transform: none; }
.pk-foot .btn { width: 100%; background: #141414 !important; color: #fff !important; border-color: #141414 !important; }
.pk-foot .btn:hover { background: var(--bordeaux, #5C1A24) !important; }
.pk-safe { margin: 10px 0 0; text-align: center; font-size: 12px; color: var(--grey); }
@media (max-width: 760px) {
  .pk-panel { top: auto; left: 0; width: 100%; height: 92svh; transform: translateY(100%); box-shadow: 0 -20px 60px -20px rgba(0,0,0,.5); }
  .pk-panel::before { content: ''; position: absolute; z-index: 4; top: 8px; left: 50%; width: 40px; height: 4px; margin-left: -20px; background: rgba(255,255,255,.75); }
  .pk-sky { height: 160px; }
  .pk-fly { top: 48px; left: 4%; right: 4%; }
  .pk-zep { width: 50%; }
  .pk-ban { height: 34px; }
  .pk-ban span { font-size: 9.5px; letter-spacing: .14em; }
}
.pk-lock .m-cta { display: none !important; }
.pk-ban em { font-style: normal; }
@media (max-width: 760px) { .pk-ban em { display: none; } .pk-ban span { font-size: 11px; letter-spacing: .2em; } }
.pk-pr { margin-top: auto; padding-top: 12px; }
.pk-sub { margin-bottom: 4px; }

/* v29.1 Flüssiges Scrollen: kein Live-Weichzeichner in der Kopfzeile, Wolken/Zeppelin auf eigener Ebene, auf dem Handy stehen die Wolken still */
.mh.solid { backdrop-filter: none !important; -webkit-backdrop-filter: none !important; background: #fff !important; }
.page-head.sky .zep, .page-head.sky .hero-stage, .pk-img img { will-change: transform; }
.page-head.sky::after { animation: none !important; }
@media (max-width: 760px) {
  .page-head.sky .hero-stage, .page-head.sky .hero-sky { animation: none !important; }
  .reveal { transform: none !important; }
}

/* ===== v31 KONTAKT EINFACH: drei Wege oben ===== */
.kw-sec { padding-bottom: 8px; }
.kw { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0; border-top: 1px solid var(--ink, #141414); border-bottom: 1px solid rgba(20,20,20,.15); max-width: 1040px; margin: 0 auto; }
.kw-card { position: relative; display: flex; flex-direction: column; gap: 10px; padding: 30px 26px 28px; text-decoration: none; color: var(--ink, #141414); border-left: 1px solid rgba(20,20,20,.12); transition: background .25s; }
.kw-card:first-child { border-left: 0; }
.kw-card:hover, .kw-card:focus-visible { background: rgba(92,26,36,.045); }
.kw-card h3 { margin: 6px 0 0; font-size: 24px; }
.kw-card p { margin: 0; color: #55524C; font-size: 15px; line-height: 1.55; flex: 1; }
.kw-ic svg { width: 28px; height: 28px; fill: none; stroke: var(--bordeaux, #5C1A24); stroke-width: 1.4; stroke-linejoin: round; stroke-linecap: round; }
.kw-go { font-size: 11px; font-weight: 600; letter-spacing: .18em; text-transform: uppercase; border-bottom: 1px solid currentColor; align-self: flex-start; padding-bottom: 3px; margin-top: 6px; }
.kw-card.is-rec { background: var(--ink, #141414); color: #F7F2EA; }
.kw-card.is-rec p { color: rgba(247,242,234,.78); }
.kw-card.is-rec h3 { color: #fff; }
.kw-card.is-rec .kw-ic svg { stroke: var(--champagne, #E2C799); }
.kw-card.is-rec:hover { background: #26221E; }
.kw-badge { position: absolute; top: 18px; right: 18px; font-size: 10px; font-weight: 600; letter-spacing: .18em; text-transform: uppercase; color: var(--ink, #141414); background: var(--champagne, #E2C799); padding: 5px 9px; }
@media (max-width: 760px) {
  .kw { grid-template-columns: 1fr; border-bottom: 0; }
  .kw-card { border-left: 0; border-bottom: 1px solid rgba(20,20,20,.12); padding: 24px 4px 22px; }
  .kw-card.is-rec { padding: 26px 20px 24px; }
}
.kw-form { max-width: 760px; margin: 0 auto; }

/* v32.2 WOLKEN-EDIT (ueber-mich): weicher Wolkenschleier liegt beim Öffnen über dem Text und zieht auseinander (nur CSS) */
.ph-veil { position: absolute; inset: 0; z-index: 2; pointer-events: none; overflow: hidden; }
.ph-veil i { position: absolute; border-radius: 50%; background: radial-gradient(ellipse at center, rgba(255,249,240,.97) 0%, rgba(250,240,226,.85) 35%, rgba(250,240,226,0) 70%); filter: blur(14px); will-change: transform, opacity; }
.ph-veil .pv1 { width: 85%; height: 75%; left: -12%; top: 25%; animation: pv-left 4s cubic-bezier(.6,0,.2,1) .5s both; }
.ph-veil .pv2 { width: 85%; height: 70%; right: -12%; top: 30%; animation: pv-right 4s cubic-bezier(.6,0,.2,1) .7s both; }
.ph-veil .pv3 { width: 70%; height: 60%; left: 15%; top: 35%; animation: pv-mist 3.4s ease-out .6s both; }
@keyframes pv-left { 0% { transform: translateX(0) scale(1.1); opacity: 1; } 100% { transform: translateX(-75%) scale(1.25); opacity: 0; } }
@keyframes pv-right { 0% { transform: translateX(0) scale(1.1); opacity: 1; } 100% { transform: translateX(75%) scale(1.25); opacity: 0; } }
@keyframes pv-mist { 0% { transform: scale(1); opacity: 1; } 100% { transform: scale(1.6); opacity: 0; } }
.page-head.sky:has(.ph-veil) .container { position: relative; z-index: 3; }
.page-head.sky:has(.ph-veil) .container > * { animation: pv-text 2.4s ease-out 1.3s both; }
@keyframes pv-text { 0% { opacity: 0; filter: blur(6px); } 100% { opacity: 1; filter: blur(0); } }

/* v32.3 NEUTRALER SPIEGEL (ueber-mich #spiegel) */
.nm-sec { padding: clamp(72px, 9vw, 128px) 0; background: var(--ivory); }
.nm-split { display: grid; grid-template-columns: minmax(220px, 380px) 1fr; gap: clamp(36px, 7vw, 110px); align-items: center; max-width: 1080px; }
.nm-mirror { padding: 14px; border: 1px solid var(--champ); border-radius: 999px 999px 6px 6px; }
.nm-glass { position: relative; aspect-ratio: 3 / 4.4; border-radius: 999px 999px 2px 2px; overflow: hidden; display: flex; align-items: center; justify-content: center; background: linear-gradient(160deg, #F4F1EC 0%, #DCD8D1 45%, #EDEAE4 70%, #CFCAC2 100%); box-shadow: inset 0 0 40px rgba(20,20,20,.08); }
.nm-glass::after { content: ""; position: absolute; inset: -20% -60%; background: linear-gradient(105deg, transparent 40%, rgba(255,255,255,.75) 50%, transparent 60%); animation: nm-shine 7s ease-in-out infinite; }
@keyframes nm-shine { 0%, 30% { transform: translateX(-60%); } 70%, 100% { transform: translateX(60%); } }
.nm-glass span { font-family: var(--serif); font-style: italic; font-size: clamp(34px, 4vw, 52px); color: rgba(20,20,20,.0); animation: nm-me 7s ease-in-out infinite; }
@keyframes nm-me { 0%, 35% { color: rgba(92,26,36,0); } 55%, 85% { color: rgba(92,26,36,.75); } 100% { color: rgba(92,26,36,0); } }
.nm-text h2 { margin: .3em 0 .5em; }
.nm-lede { font-size: 18px; line-height: 1.7; color: var(--charcoal-2); max-width: 52ch; }
.nm-list { list-style: none; padding: 0; margin: 32px 0 0; display: grid; gap: 22px; }
.nm-list li { border-top: 1px solid var(--line); padding-top: 18px; }
.nm-list h3 { font-size: clamp(20px, 1.8vw, 24px); margin: 0 0 6px; }
.nm-list p { margin: 0; color: var(--charcoal-2); line-height: 1.65; }
@media (max-width: 760px) {
  .nm-split { grid-template-columns: 1fr; }
  .nm-mirror { width: min(62vw, 240px); margin: 0 auto; }
}

/* v34 KOSTENLOS-SIEGEL: Bordeaux-Siegel mit Champagner-Ring auf den Gratis-Titelbildern */
.dl-cover, .mx-duo .fr-covers { position: relative; }
.dl-cover::after, .mx-duo .fr-covers::after {
  content: "Kostenlos"; position: absolute; z-index: 2; display: grid; place-items: center;
  width: 96px; height: 96px; border-radius: 50%; padding: 0 6px; box-sizing: border-box; text-align: center;
  background: radial-gradient(circle at 35% 30%, #7a2533, #5C1A24 62%, #46121b);
  box-shadow: inset 0 0 0 4px #5C1A24, inset 0 0 0 5px rgba(226,199,153,.9), 0 14px 26px -12px rgba(0,0,0,.55);
  color: #E2C799; font: italic 600 17px/1 'Playfair Display', Georgia, serif; letter-spacing: .01em;
  transform: rotate(-9deg); pointer-events: none;
}
.dl-cover::after { right: 7%; bottom: 7%; }
.mx-duo .fr-covers::after { left: -4%; top: -6%; }
:lang(en) .dl-cover::after, :lang(en) .mx-duo .fr-covers::after { content: "Free"; font-size: 21px; }
:lang(tr) .dl-cover::after, :lang(tr) .mx-duo .fr-covers::after { content: "Ücretsiz"; }
@media (max-width: 700px) {
  .dl-cover::after, .mx-duo .fr-covers::after { width: 76px; height: 76px; font-size: 14px; }
  :lang(en) .dl-cover::after, :lang(en) .mx-duo .fr-covers::after { font-size: 17px; }
}

/* ===== v37 UNGEFILTERT (ueber-mich #ungefiltert) ===== */
.bt-sec { padding: clamp(72px, 9vw, 128px) 0; background: var(--bordeaux, #5C1A24); color: #F7EFE4; position: relative; overflow: hidden; }
.bt-sec::before { content: ""; position: absolute; inset: -20%; background: radial-gradient(40% 35% at 15% 20%, rgba(226,199,153,.18), transparent 70%), radial-gradient(35% 30% at 85% 80%, rgba(226,199,153,.12), transparent 70%); pointer-events: none; }
.bt-sec .container { position: relative; }
.bt-sec .section-head .eyebrow, .bt-sec .eyebrow.reveal { color: var(--champ) !important; }
.bt-sec h2 { color: #fff; }
.bt-list { list-style: none; margin: clamp(32px, 5vw, 56px) 0 0; padding: 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; background: rgba(226,199,153,.28); border: 1px solid rgba(226,199,153,.28); }
.bt-list li { background: var(--bordeaux, #5C1A24); padding: clamp(26px, 3vw, 40px); position: relative; transition: background .4s ease; }
.bt-list li:hover { background: #6A2230; }
.bt-n { display: block; font-family: "Playfair Display", Georgia, serif; font-style: italic; font-size: 15px; color: var(--champ); letter-spacing: .08em; margin-bottom: 14px; }
.bt-list h3 { font-family: "Playfair Display", Georgia, serif; font-style: italic; font-weight: 500; font-size: clamp(22px, 2.2vw, 27px); line-height: 1.2; color: #fff; margin: 0 0 10px; }
.bt-list p { margin: 0; font-size: 15.5px; line-height: 1.6; color: rgba(247,239,228,.84); max-width: 34ch; }
.bt-list li:nth-child(5)::after { content: ""; position: absolute; right: 18px; top: 18px; width: 92px; aspect-ratio: 1400/542; background: url(/img/zeppelin-unikat.webp?v=20261109) center/contain no-repeat; animation: bt-fly 7s ease-in-out infinite; opacity: .95; }
@keyframes bt-fly { 0%,100% { transform: translate(0,0) rotate(-3deg); } 50% { transform: translate(-8px,-7px) rotate(-6deg); } }
@media (max-width: 900px) { .bt-list { grid-template-columns: 1fr 1fr; } }
@media (max-width: 600px) { .bt-list { grid-template-columns: 1fr; } .bt-list li:nth-child(5)::after { width: 78px; } }

/* ===== v41 SIEGEL KLEIN (2026-10-15): Kostenlos-Siegel kleiner, Kupfer-Orange, als Sticker an der Ecke ===== */
.dl-cover::after, .mx-duo .fr-covers::after {
  width: 66px; height: 66px; padding: 0 4px; font-size: 11px !important; letter-spacing: .14em; text-transform: uppercase; font-weight: 700; font-style: normal; font-family: Inter, system-ui, sans-serif;
  background: radial-gradient(circle at 32% 28%, #F08A3C, #D9601E 58%, #B84A12); color: #FFF8EE;
  border: 0; box-shadow: 0 0 0 2px #FFF8EE, 0 0 0 3px rgba(184,74,18,.55), 0 6px 16px rgba(120,45,10,.32);
  transform: rotate(-10deg);
}
.dl-cover::after { right: -14px; bottom: auto; top: -14px; }
.mx-duo .fr-covers::after { left: -18px; top: -18px; }
:lang(tr) .dl-cover::after, :lang(tr) .mx-duo .fr-covers::after { font-size: 9.5px !important; letter-spacing: .08em; }
@media (max-width: 700px) {
  .dl-cover::after, .mx-duo .fr-covers::after { width: 56px; height: 56px; font-size: 9.5px !important; }
  :lang(tr) .dl-cover::after, :lang(tr) .mx-duo .fr-covers::after { font-size: 8.5px !important; }
  .dl-cover::after { right: -10px; top: -10px; }
  .mx-duo .fr-covers::after { left: -10px; top: -12px; }
}
.dl-cover { overflow: visible; } .dl-cover img { border-radius: 10px; }
/* v41.1: Schrift passt in den Kreis, Siegel unten rechts (Zeppelin frei) */
.dl-cover::after, .mx-duo .fr-covers::after { padding: 0 !important; letter-spacing: .04em !important; font-size: 9.5px !important; white-space: nowrap; }
:lang(en) .dl-cover::after, :lang(en) .mx-duo .fr-covers::after { font-size: 12px !important; letter-spacing: .12em !important; }
:lang(tr) .dl-cover::after, :lang(tr) .mx-duo .fr-covers::after { font-size: 8.5px !important; letter-spacing: .02em !important; }
.dl-cover::after { top: auto !important; bottom: -14px !important; right: -14px !important; }
@media (max-width: 700px) {
  .dl-cover::after, .mx-duo .fr-covers::after { font-size: 8.5px !important; }
  :lang(en) .dl-cover::after, :lang(en) .mx-duo .fr-covers::after { font-size: 11px !important; }
  :lang(tr) .dl-cover::after, :lang(tr) .mx-duo .fr-covers::after { font-size: 7.5px !important; }
  .dl-cover::after { bottom: -10px !important; right: -10px !important; }
}
/* v41.2 (15.10.): Siegel jetzt Etikett „Gratis für dich“, dunkles Orange auf Creme, leicht schwingend */
.dl-cover::after, .mx-duo .fr-covers::after {
  content: "Gratis für dich" !important; width: auto !important; height: auto !important; display: block !important;
  padding: 9px 16px 10px !important; border-radius: 3px !important; white-space: nowrap;
  font-family: "Playfair Display", Georgia, serif !important; font-style: italic !important; font-weight: 600 !important;
  font-size: 17px !important; letter-spacing: .01em !important; text-transform: none !important; line-height: 1 !important;
  color: #B8460E !important; background: #FFF8EE !important;
  box-shadow: inset 0 0 0 1.5px #B8460E, inset 0 0 0 4px #FFF8EE, inset 0 0 0 5px rgba(184,70,14,.35), 0 10px 22px -8px rgba(120,45,10,.45) !important;
  transform-origin: 50% 0; animation: tag-sway 5s ease-in-out infinite;
}
:lang(en) .dl-cover::after, :lang(en) .mx-duo .fr-covers::after { content: "Free for you" !important; font-size: 17px !important; letter-spacing: .01em !important; }
:lang(tr) .dl-cover::after, :lang(tr) .mx-duo .fr-covers::after { content: "Senin için ücretsiz" !important; font-size: 15px !important; letter-spacing: 0 !important; }
.dl-cover::after { top: auto !important; bottom: 18px !important; right: -22px !important; }
.mx-duo .fr-covers::after { left: -14px !important; top: -16px !important; }
@keyframes tag-sway { 0%, 100% { transform: rotate(-7deg); } 50% { transform: rotate(-3deg); } }
@media (max-width: 700px) {
  .dl-cover::after, .mx-duo .fr-covers::after { font-size: 14px !important; padding: 7px 12px 8px !important; }
  :lang(en) .dl-cover::after, :lang(en) .mx-duo .fr-covers::after { font-size: 14px !important; }
  :lang(tr) .dl-cover::after, :lang(tr) .mx-duo .fr-covers::after { font-size: 12.5px !important; }
  .dl-cover::after { bottom: 14px !important; right: -16px !important; }
  .mx-duo .fr-covers::after { left: -8px !important; top: -12px !important; }
}

/* ===== v48 LOTUS + ZEPPELIN AUF DER WOLKE (Über mich) ===== */
.page-head.sky.zep-cloud .zep { left: auto; right: 13vw; top: calc(var(--nav-h) + 17vh); width: min(17vw, 23vh); animation: zp-in 2.4s .2s cubic-bezier(.16,1,.3,1) both, zp-bob 9s 2.6s ease-in-out infinite; filter: drop-shadow(0 14px 10px rgba(40,30,20,.28)) brightness(.97) saturate(.92); }
@keyframes zp-in { from { opacity: 0; translate: 6vw 0; } to { opacity: 1; translate: 0 0; } }
@keyframes zp-bob { 0%, 100% { transform: translateY(0) rotate(-1deg); } 50% { transform: translateY(-5px) rotate(.5deg); } }
@media (max-width: 760px) {
  .page-head.sky.zep-cloud { padding-top: calc(var(--nav-h) + 44vw); }
  .page-head.sky.zep-cloud .zep { left: auto; right: 9vw; top: calc(var(--nav-h) + 20vw); width: 40vw; }
}
.roots svg.lotus { width: min(300px, 72vw); }
.roots .story strong { color: var(--champagne); font-weight: 500; }
.lt-assure { text-align: center; font-size: 13px; letter-spacing: .12em; color: rgba(255,255,255,.6); margin-top: 14px; }
.lotus .lw { animation: lw 6s ease-in-out infinite; }
.lotus .lw2 { animation-delay: -3s; }
@keyframes lw { 0%, 100% { transform: translateX(0); } 50% { transform: translateX(6px); } }
.lotus .ly { transform-origin: 150px 150px; animation: ly 9s cubic-bezier(.4,0,.2,1) infinite; }
.lotus .ly2 { animation-delay: .6s; } .lotus .ly3 { animation-delay: 1.2s; }
@keyframes ly { 0% { opacity: 0; transform: scale(.55,.4); } 18%, 82% { opacity: 1; transform: scale(1); } 100% { opacity: 0; transform: scale(.55,.4); } }
.lotus .glow { animation: gl 9s ease-in-out infinite; }
@keyframes gl { 0%, 100% { opacity: 0; } 40%, 80% { opacity: 1; } }

/* ===== v57 Lotus waechst durch Schichten (ueber-mich #wurzeln, 17.10.) ===== */
.roots svg.lotus.lt2 { width: min(440px, 92vw); display: block; margin: 0 auto; }
.lt2 text { fill: currentColor; stroke: none; font: 500 10px/1 Inter, sans-serif; letter-spacing: .16em; text-transform: uppercase; }
.lt2 .lt-l { animation: lt-layer 10s ease-in-out infinite; animation-delay: var(--d); }
.lt2 .lt-stem { stroke-width: 1.6; stroke-dasharray: 100; stroke-dashoffset: 100; animation: lt-stem 10s ease-in-out infinite; }
.lt2 .ly { transform-origin: 200px 150px; animation-duration: 10s; }
.lt2 .glow { animation-duration: 10s; }
@keyframes lt-stem { 0% { stroke-dashoffset: 100; } 40%, 92% { stroke-dashoffset: 0; } 100% { stroke-dashoffset: 0; opacity: 0; } }
@keyframes lt-layer { 0%, 6% { opacity: 1; } 30%, 88% { opacity: .28; } 100% { opacity: 1; } }
.lt-cap { text-align: center; max-width: 34ch; margin: 18px auto 34px; font-size: 14px; letter-spacing: .04em; color: var(--champagne, #E2C799); opacity: .85; }
@media (max-width: 600px) { .lt2 text { font-size: 12px; letter-spacing: .1em; } }
.roots svg.lotus.lt2 { width: 100%; max-width: 440px; }

/* ===== v65 RABATTE (17.10.): Preis pro Stunde + Vorteile-Block auf leistungen ===== */
.pkg-price { flex-wrap: wrap; }
.pkg-price .per-h { display: block; flex-basis: 100%; font: italic 400 15px/1.4 var(--serif, Georgia, serif); color: var(--bordeaux, #5C1A24); margin-top: 6px; }
.band.dark .pkg-price .per-h { color: var(--champagne, #E2C799); }
.deals { margin: 56px auto 8px; max-width: 900px; padding: 34px 0; border-top: 1px solid var(--line, #e5e1da); border-bottom: 1px solid var(--line, #e5e1da); }
.deals .kicker { display: block; font: 600 11px/1 var(--sans, Inter, sans-serif); letter-spacing: .18em; text-transform: uppercase; color: var(--bordeaux, #5C1A24); margin-bottom: 12px; }
.deals h3 { font: 400 clamp(26px, 3.2vw, 36px)/1.15 var(--serif, Georgia, serif); margin: 0 0 22px; color: #141414; }
.deals ul { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 22px 36px; }
.deals li { padding-left: 18px; border-left: 2px solid var(--champagne, #E2C799); }
.deals li b { display: block; font-weight: 600; color: #141414; margin-bottom: 4px; }
.deals li span { color: #444845; font-size: 15px; line-height: 1.55; }
.deals .fine { margin: 22px 0 0; font-size: 13.5px; color: #6b6b6b; }
@media (max-width: 760px) { .deals ul { grid-template-columns: 1fr; } .deals { margin-top: 40px; } }

/* v78 AUDIT 05.11.: Seitenkopf-Text lesbar auch über hellen Wolken (Schatten + weicher dunkler Schleier hinter dem Text) */
.page-head.sky h1, .page-head.sky .lbl, .page-head.sky p { text-shadow: 0 1px 2px rgba(0,0,0,.35), 0 4px 28px rgba(0,0,0,.55); }
.page-head.sky::after { content: ""; position: absolute; inset: 0; background: radial-gradient(ellipse 60% 45% at 50% 58%, rgba(10,14,12,.38), transparent 70%); pointer-events: none; z-index: 1; }
.page-head.sky > *:not(.hero-bg) { position: relative; z-index: 2; }

/* v79 AUDIT 2 (05.11.): Über mich Kacheln luftiger, zwei Spalten, größere Schrift */
.creds.four { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 28px 48px !important; max-width: 980px; margin-inline: auto; }
.creds.four .shell { padding: 30px 0 0 !important; border-top: 1px solid rgba(20,20,20,.12); }
.creds.four h4 { font-size: 21px !important; margin-bottom: 10px; }
.creds.four p { font-size: 16px !important; line-height: 1.65 !important; }
@media (max-width: 700px) { .creds.four { grid-template-columns: 1fr !important; gap: 8px !important; } }

/* ===== v81 FLUSS (Handy: Paket-Kacheln fangen das Runterwischen nicht mehr ab) ===== */
@media (max-width: 900px) { .pk-grid { overflow-y: hidden; overscroll-behavior: auto; } }

/* v83 KONTAKT KURZ: Termin-Einstieg statt Fragenkatalog */
.kt { max-width: 620px; margin: 0 auto; background: #fff; border: 1px solid #e6e0d6; padding: clamp(22px, 4vw, 36px); }
.kt[hidden], .kt-cal[hidden] { display: none; }
.kt-q { font: 400 21px/1.35 'Playfair Display', serif; margin: 0 0 16px; text-align: center; }
.kt-q small { display: block; margin-top: 6px; font: 600 10px/1 Inter, sans-serif; letter-spacing: .18em; text-transform: uppercase; color: #999; }
.kt-chips { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; margin: 0 0 14px; }
.kt-c { position: relative; }
.kt-c input { position: absolute; opacity: 0; pointer-events: none; }
.kt-c span { display: inline-block; padding: 10px 15px; border: 1px solid #d6cfc3; font-size: 14px; cursor: pointer; transition: background .2s, color .2s, border-color .2s; user-select: none; }
.kt-c input:checked + span { background: #141414; color: #fff; border-color: #141414; }
.kt-c input:focus-visible + span { outline: 2px solid #5C1A24; outline-offset: 2px; }
.kt-t { border-radius: 0; width: 100%; box-sizing: border-box; padding: 13px 14px; border: 1px solid #d6cfc3; font: 400 15px/1.4 Inter, sans-serif; background: #fdfbf7; }
.kt-ok { display: flex; gap: 10px; align-items: flex-start; margin: 18px 0 0; font-size: 12.5px; line-height: 1.5; color: #555; text-align: left; }
.kt-ok input { margin-top: 3px; flex: 0 0 auto; width: 18px; height: 18px; accent-color: #141414; }
.kt-err { min-height: 1em; margin: 10px 0 0; font-size: 13px; color: #8a1c1c; text-align: center; }
.kt-go { display: block; width: 100%; margin-top: 8px; }
.kt-cal { max-width: 1000px; margin: 0 auto; }
.kt-safe { margin-top: 18px; color: #888; }

/* v84 WORKBOOK ECHT: Buchfoto statt animierter 3D-Grafik */
.wb-real { margin: 0 auto; display: flex; justify-content: center; padding: 10px 0 30px; }
.wb-book { position: relative; display: block; width: min(300px, 70vw); }
.wb-book img { display: block; width: 100%; height: auto; border-radius: 2px 4px 4px 2px; box-shadow: 0 1px 1px rgba(0,0,0,.08), 0 18px 30px -12px rgba(0,0,0,.35), 0 40px 60px -30px rgba(0,0,0,.3); }
.wb-book::before { content: ''; position: absolute; inset: 0 auto 0 0; width: 7%; background: linear-gradient(90deg, rgba(0,0,0,.22), rgba(255,255,255,.12) 45%, rgba(0,0,0,.08) 70%, transparent); border-radius: 2px 0 0 2px; pointer-events: none; }
.wb-book::after { content: ''; position: absolute; left: 6%; right: 6%; bottom: -26px; height: 20px; background: radial-gradient(ellipse at center, rgba(0,0,0,.22), transparent 70%); filter: blur(4px); z-index: -1; }


/* v84 MENÜ: Seitenleiste, eine Schrift */
.mm { right: auto; width: min(440px, 100%); padding: 0; transform: translateX(-100%); transition: transform .55s var(--ease), visibility 0s .55s; box-shadow: 0 0 60px rgba(0,0,0,.12); overflow-y: auto; }
.mm.open { transform: none; transition: transform .55s var(--ease); }
.mm-bg { position: fixed; inset: 0; z-index: 59; background: rgba(20,20,20,.38); opacity: 0; pointer-events: none; transition: opacity .45s; }
.mm.open + .mm-bg { opacity: 1; pointer-events: auto; }
.mm-top { display: flex; align-items: center; justify-content: space-between; height: 64px; padding: 0 28px; border-bottom: 1px solid #ece8e1; }
.mm-close { position: relative; width: 22px; height: 22px; padding: 0; align-self: center; }
.mm-close i, .mm-close::before { content: ''; position: absolute; left: 1px; top: 10px; width: 20px; height: 1px; background: var(--ink); transform: rotate(45deg); }
.mm-close::before { transform: rotate(-45deg); }
.mm-mark { font: 400 20px/1 var(--serif); font-style: italic; color: var(--ink); text-decoration: none; }
.mm-mark i { color: #5C1A24; }
.mm .mm-list { margin: 8px 0 0; padding: 0 28px; }
.mm .mm-list li a { display: flex; align-items: center; justify-content: space-between; padding: 19px 0; border-bottom: 1px solid #ece8e1; font: 500 13.5px/1 var(--sans); letter-spacing: .16em; text-transform: uppercase; color: var(--ink); }
.mm .mm-list li a svg { color: #b9b1a4; transition: transform .3s var(--ease), color .3s; }
.mm .mm-list li a:hover { opacity: 1; padding-left: 0; }
.mm .mm-list li a:hover svg { transform: translateX(4px); color: var(--ink); }
.mm-feat { display: grid; grid-template-columns: 92px 1fr; gap: 18px; align-items: center; margin: 32px 28px 0; padding: 14px; background: #f6f3ee; text-decoration: none; color: var(--ink); }
.mm-feat img { width: 92px; height: 110px; object-fit: cover; object-position: 50% 20%; display: block; }
.mm-feat span { display: grid; gap: 7px; }
.mm-feat small { font: 600 10px/1 var(--sans); letter-spacing: .18em; text-transform: uppercase; color: #8a7f70; }
.mm-feat b { font: 500 15px/1.3 var(--sans); }
.mm-feat em { font: 400 13px/1.3 var(--sans); font-style: normal; color: #6b6b6b; }
.mm-feat:hover b { text-decoration: underline; text-underline-offset: 3px; }
.mm .mm-foot { margin-top: auto; padding: 28px; display: grid; gap: 14px; font: 500 11px/1 var(--sans); letter-spacing: .14em; text-transform: uppercase; color: #8a8a8a; }
.mm-foot span { display: flex; gap: 20px; flex-wrap: wrap; }
.mm-foot a[aria-current] { color: var(--ink); text-decoration: underline; text-underline-offset: 4px; }
@media (max-width: 480px) { .mm { box-shadow: none; } .mm-top, .mm .mm-list, .mm .mm-foot { padding-left: 22px; padding-right: 22px; } .mm-feat { margin: 26px 22px 0; } }

body:has(.mm.open) [class^="zc"], body:has(.mm.open) [id^="zc"] { display: none !important; }