/* =====================================================
   SELBST GEHOSTETE FONTS (DSGVO)
   ===================================================== */
@font-face{ font-family:'Bebas Neue'; font-style:normal; font-weight:400; font-display:swap;
  src:url('../fonts/bebas-neue-400.woff2') format('woff2'), url('../fonts/bebas-neue-400.woff') format('woff'); }

@font-face{ font-family:'Inter'; font-style:normal; font-weight:300; font-display:swap; src:url('../fonts/inter-300.woff2') format('woff2'); }
@font-face{ font-family:'Inter'; font-style:normal; font-weight:400; font-display:swap; src:url('../fonts/inter-400.woff2') format('woff2'); }
@font-face{ font-family:'Inter'; font-style:normal; font-weight:500; font-display:swap; src:url('../fonts/inter-500.woff2') format('woff2'); }
@font-face{ font-family:'Inter'; font-style:normal; font-weight:600; font-display:swap; src:url('../fonts/inter-600.woff2') format('woff2'); }
@font-face{ font-family:'Inter'; font-style:normal; font-weight:700; font-display:swap; src:url('../fonts/inter-700.woff2') format('woff2'); }

@font-face{ font-family:'Caveat'; font-style:normal; font-weight:600; font-display:swap; src:url('../fonts/caveat-600.woff2') format('woff2'); }
@font-face{ font-family:'Caveat'; font-style:normal; font-weight:700; font-display:swap; src:url('../fonts/caveat-700.woff2') format('woff2'); }

:root{
  --white: #FFFFFF;
  --off-white: #F7F5F2;
  --paper: #EFEBE4;
  --ink: #16191F;        /* sehr dunkles Anthrazit (vorher reines Schwarz) */
  --ink-2: #2A2D34;
  --ink-3: #6A6E78;
  --line: #E0DCD3;
  --red: #81222F;        /* gedämpftes, edles Bordeaux-Rot */
  --red-2: #6E1C28;
  --red-dark: #531520;
}
*{ box-sizing: border-box; margin: 0; padding: 0; }
html{ scroll-behavior: smooth; }
body{
  background: var(--off-white); color: var(--ink);
  font-family: 'Inter', system-ui, sans-serif;
  font-weight: 400; line-height: 1.55;
  -webkit-font-smoothing: antialiased; overflow-x: hidden;
}
h1,h2,h3,h4{
  font-family: 'Bebas Neue', 'Inter', sans-serif;
  font-weight: 400; line-height: .95; letter-spacing: .005em;
  text-transform: uppercase;
}
h1{ font-size: clamp(3.8rem, 9.5vw, 9rem); }
h2{ font-size: clamp(2.8rem, 6vw, 5.5rem); }
h3{ font-size: clamp(2rem, 3.5vw, 3rem); }
h4{ font-size: 1.5rem; }

/* Gutenberg-Content-Headings (reguläre Seiten: Impressum, AGB, Über mich etc.)
   bekommen lesbare Größen — die globalen Riesen-Headlines gelten nur für
   Design-Sektionen (Hero, Bücher etc.), die KEINE .wp-block-heading-Klasse haben. */
h2.wp-block-heading{ font-size: clamp(1.6rem, 3vw, 2.3rem); line-height: 1.2; margin: 1.4em 0 .4em; }
h3.wp-block-heading{ font-size: clamp(1.3rem, 2.4vw, 1.7rem); line-height: 1.25; margin: 1.2em 0 .3em; }
h4.wp-block-heading{ font-size: 1.2rem; margin: 1em 0 .3em; }
a{ color: inherit; text-decoration: none; }
img{ max-width: 100%; display: block; }
.wrap{ max-width: 1320px; margin: 0 auto; padding: 0 36px; }
.wrap-tight{ max-width: 980px; margin: 0 auto; padding: 0 36px; }
.wrap-narrow{ max-width: 760px; margin: 0 auto; padding: 0 36px; }

.eyebrow{
  font-family: 'Inter', sans-serif; font-size: .78rem; letter-spacing: .32em;
  text-transform: uppercase; font-weight: 700;
  display: inline-flex; align-items: center; gap: 12px;
}
.eyebrow-red{ color: var(--red); }
.eyebrow-red::before{ content:""; width: 24px; height: 2px; background: var(--red); }
.eyebrow-white{ color: var(--white); }
.eyebrow-white::before{ content:""; width: 24px; height: 2px; background: var(--white); }

.btn{
  display: inline-flex; align-items: center; gap: 10px;
  padding: 18px 32px; font-family: 'Inter', sans-serif;
  font-weight: 700; font-size: .82rem;
  letter-spacing: .15em; text-transform: uppercase;
  transition: all .25s cubic-bezier(.4,0,.2,1); cursor: pointer; border: none;
  position: relative; overflow: hidden;
}
.btn-red{ background: var(--red); color: var(--white); }
.btn-red:hover{ background: var(--ink); transform: translateY(-2px); box-shadow: 0 12px 30px -8px rgba(220,20,20,.45); }
.btn-ink{ background: var(--ink); color: var(--white); }
.btn-ink:hover{ background: var(--red); transform: translateY(-2px); }
.btn-outline{ background: transparent; color: var(--ink); border: 2px solid var(--ink); padding: 16px 30px; }
.btn-outline:hover{ background: var(--ink); color: var(--white); }
.btn-outline-white{ background: transparent; color: var(--white); border: 2px solid var(--white); padding: 16px 30px; }
.btn-outline-white:hover{ background: var(--white); color: var(--ink); }
.btn::after{ content: "→"; transition: transform .25s; }
.btn:hover::after{ transform: translateX(4px); }
.btn-no-arrow::after{ display:none; }

/* ===== ANNOUNCEMENT BAR ===== */
.announce{ background: var(--red); color: var(--white); padding: 10px 0; text-align: center; font-size: .8rem; font-weight: 600; letter-spacing: .15em; text-transform: uppercase; overflow: hidden; position: relative; }
.announce-track{ display: flex; gap: 60px; white-space: nowrap; animation: scroll 30s linear infinite; }
.announce-track span::after{ content: "✦"; margin-left: 60px; opacity: .6; }
@keyframes scroll{ from{ transform: translateX(0); } to{ transform: translateX(-50%); } }

/* ===== NAV ===== */
nav{ position: sticky; top: 0; z-index: 60; background: rgba(247,245,242,.95); backdrop-filter: blur(20px); border-bottom: 1px solid var(--line); }
nav .wrap{ display: flex; align-items: center; justify-content: space-between; padding-top: 18px; padding-bottom: 18px; }
.logo{ display: flex; align-items: center; gap: 14px; }
.logo img{ width: 60px; height: 60px; }
.logo-text{ font-family: 'Bebas Neue', sans-serif; font-size: 1.6rem; letter-spacing: .04em; line-height: 1; }
.logo-text span{ display: block; font-family: 'Inter', sans-serif; font-size: .6rem; letter-spacing: .35em; color: var(--red); text-transform: uppercase; font-weight: 700; margin-top: 4px; }
.nav-links{ display: flex; gap: 36px; font-size: .82rem; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; }
.nav-links a{ position: relative; padding: 6px 0; transition: color .2s; }
.nav-links a::after{ content: ""; position: absolute; bottom: 0; left: 0; width: 0; height: 2px; background: var(--red); transition: width .25s; }
.nav-links a:hover{ color: var(--red); }
.nav-links a:hover::after{ width: 100%; }
.nav-links a.active{ color: var(--red); }
.nav-links a.active::after{ width: 100%; }

/* Burger-Button (versteckt auf Desktop) */
.burger{
  display: none; background: transparent; border: none; cursor: pointer;
  width: 48px; height: 48px; padding: 0; position: relative; z-index: 70;
}
.burger span{
  display: block; width: 28px; height: 2px; background: var(--ink);
  margin: 6px auto; transition: transform .35s cubic-bezier(.4,0,.2,1), opacity .25s, background-color .25s;
}
.burger[aria-expanded="true"] span{ background: var(--white); }
.burger[aria-expanded="true"] span:nth-child(1){ transform: translateY(8px) rotate(45deg); }
.burger[aria-expanded="true"] span:nth-child(2){ opacity: 0; }
.burger[aria-expanded="true"] span:nth-child(3){ transform: translateY(-8px) rotate(-45deg); }

/* Mobile-Menu Fullscreen-Overlay */
.mobile-menu{
  position: fixed; inset: 0; z-index: 65;
  background: var(--ink); color: var(--white);
  display: flex; flex-direction: column;
  padding: 100px 36px 40px;
  transform: translateX(100%); transition: transform .4s cubic-bezier(.4,0,.2,1);
  overflow-y: auto;
}
.mobile-menu[aria-hidden="false"]{ transform: translateX(0); }
.mobile-menu-bg{
  position: absolute; right: -10%; bottom: -10%;
  font-family: 'Bebas Neue', sans-serif; font-size: 22rem;
  color: var(--red); opacity: .12; line-height: 1; pointer-events: none;
  letter-spacing: -.04em;
}
.mobile-menu-links{
  list-style: none; padding: 0; margin: 0; position: relative; z-index: 1;
  display: flex; flex-direction: column; gap: 8px;
}
.mobile-menu-links a{
  display: block; padding: 14px 0;
  font-family: 'Bebas Neue', sans-serif; font-size: 2.2rem;
  letter-spacing: .04em; color: var(--white); transition: color .2s, padding-left .25s;
  border-bottom: 1px solid rgba(255,255,255,.08);
}
.mobile-menu-links a:hover{ color: var(--red); padding-left: 8px; }
.mobile-menu-cta{
  margin-top: 36px; padding-top: 0;
  position: relative; z-index: 1;
}
.mobile-menu-cta .btn{ width: 100%; justify-content: center; }
.mobile-menu-meta{
  margin-top: 36px; padding-top: 24px; font-size: .8rem;
  color: rgba(255,255,255,.5); letter-spacing: .1em; text-transform: uppercase;
  position: relative; z-index: 1;
}

@media (max-width: 900px){
  .nav-links{ display: none; }
  .burger{ display: block; }
  nav .btn{ display: none; } /* Newsletter-CTA aus Header raus, ist im Mobile-Menu */
  body.menu-open{ overflow: hidden; }
}

/* ===== HERO (Startseite) ===== */
.hero{ position: relative; padding: 70px 0 90px; background: var(--off-white); overflow: hidden; }
.hero-bg-num{ position: absolute; left: -3%; bottom: -3%; font-family: 'Bebas Neue', sans-serif; font-size: clamp(20rem, 38vw, 42rem); color: var(--red); opacity: .055; line-height: .8; z-index: 0; user-select: none; pointer-events: none; letter-spacing: 0; white-space: nowrap; }
.hero .wrap{ position: relative; z-index: 2; display: grid; grid-template-columns: 1.1fr 1fr; gap: 60px; align-items: center; min-height: 78vh; }
@media (max-width: 1000px){ .hero .wrap{ grid-template-columns: 1fr; } .hero-cover{ max-width: 380px; margin: 0 auto; } }
/* hero-tag ist jetzt eine H1 (für SEO). Styling wie eine Pill — kompakt, schwarz, oben. */
h1.hero-tag, .hero-tag{
  display: inline-block; background: var(--ink); color: var(--white);
  padding: 9px 20px; font-size: .82rem; letter-spacing: .2em;
  text-transform: uppercase; font-weight: 700; line-height: 1.2;
  margin: 0 0 28px;
  font-family: 'Inter', sans-serif;
}
/* Format-Zeile mit Puls-Punkt: stand früher in hero-tag, jetzt eigene Komponente */
.hero-format-line{
  display: inline-flex; align-items: center; gap: 10px;
  font-size: .78rem; letter-spacing: .18em; text-transform: uppercase;
  font-weight: 700; color: var(--ink-2);
  margin: 0 0 22px;
}
.hero-format-line .pulse{
  display: inline-block; width: 8px; height: 8px; background: var(--red);
  border-radius: 50%; animation: pulse 1.8s infinite; flex-shrink: 0;
}
@keyframes pulse{ 0%,100%{ opacity: 1; transform: scale(1); } 50%{ opacity: .4; transform: scale(1.4); } }
.hero-headline{ font-size: clamp(2rem, 4.2vw, 3.6rem); margin-bottom: 32px; line-height: 1.15; }
.hero-headline .red{ color: var(--red); display: inline-block; transform: skewX(-4deg); }
.hero-headline .stamp{ display: inline-block; padding: .04em .25em; line-height: 1; background: var(--red); color: var(--white); transform: rotate(-1.5deg) skewX(-4deg); margin: 0 .05em; }
.hero-pitch{ font-size: 1.05rem; line-height: 1.6; color: var(--ink-2); max-width: 540px; margin-bottom: 40px; font-weight: 400; }
.hero-pitch strong{ background: linear-gradient(transparent 60%, rgba(220,20,20,.18) 60%); font-weight: 500; }
.hero-ctas{ display: flex; gap: 18px; flex-wrap: wrap; align-items: center; }
.hero-stats{ display: flex; gap: 50px; margin-top: 60px; padding-top: 36px; border-top: 1px solid var(--line); }
.hero-stats .num{ font-family: 'Bebas Neue', sans-serif; font-size: 3rem; color: var(--red); line-height: 1; }
.hero-stats .lbl{ font-size: .72rem; letter-spacing: .2em; text-transform: uppercase; color: var(--ink-3); font-weight: 600; margin-top: 6px; }

.hero-cover{ position: relative; perspective: 1500px; }
.hero-cover-img{ position: relative; box-shadow: 0 50px 100px -20px rgba(0,0,0,.4), 0 25px 50px -25px rgba(220,20,20,.35); transform: rotateY(-12deg) rotateX(4deg) rotateZ(-2deg); transition: transform .6s cubic-bezier(.2,.8,.2,1); }
.hero-cover:hover .hero-cover-img{ transform: rotateY(-6deg) rotateX(2deg) rotateZ(0deg) translateY(-10px); }
.hero-sticker{ position: absolute; top: -20px; right: -30px; z-index: 3; width: 130px; height: 130px; background: var(--red); color: var(--white); border-radius: 50%; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; transform: rotate(15deg); font-family: 'Bebas Neue', sans-serif; line-height: 1; box-shadow: 0 14px 30px -10px rgba(220,20,20,.6); animation: wobble 4s ease-in-out infinite; }
.hero-sticker .top{ font-size: 1rem; letter-spacing: .15em; }
.hero-sticker .big{ font-size: 2.6rem; margin: 4px 0; }
.hero-sticker .bot{ font-size: .8rem; letter-spacing: .2em; }
@keyframes wobble{ 0%,100%{ transform: rotate(15deg) scale(1); } 50%{ transform: rotate(12deg) scale(1.04); } }
.hero-splat{ position: absolute; bottom: -10%; left: -10%; width: 60%; height: 60%; background: radial-gradient(ellipse, rgba(220,20,20,.15), transparent 70%); z-index: 0; filter: blur(40px); }

/* ===== AKTUELLER ROMAN – Schwarz ===== */
.feature{ background: var(--ink); color: var(--white); padding: 140px 0; position: relative; overflow: hidden; }
.feature-bg-text{ position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); font-family: 'Bebas Neue', sans-serif; font-size: clamp(14rem, 28vw, 30rem); color: var(--white); opacity: .025; line-height: 1; white-space: nowrap; pointer-events: none; letter-spacing: -.02em; }
.feature .wrap{ position: relative; z-index: 2; display: grid; grid-template-columns: .9fr 1.1fr; gap: 100px; align-items: center; }
@media (max-width: 1000px){ .feature .wrap{ grid-template-columns: 1fr; gap: 60px; } .feature-cover{ max-width: 360px; margin: 0 auto; } }
.feature-cover{ position: relative; }
.feature-cover img{ box-shadow: 0 50px 100px -10px rgba(0,0,0,.7), 0 30px 60px -10px rgba(220,20,20,.4); transform: rotate(-3deg); }
.feature-cover::before{ content:""; position: absolute; top: 30px; right: -30px; bottom: -30px; left: 30px; background: var(--red); z-index: -1; transform: rotate(3deg); }
.feature h2{ color: var(--white); margin: 24px 0 36px; }
.feature h2 .red{ color: var(--red); }
.feature-lead{ font-family: 'Bebas Neue', sans-serif; font-size: 1.6rem; letter-spacing: .04em; color: var(--white); margin-bottom: 30px; line-height: 1.2; }
.feature-text p{ color: rgba(255,255,255,.75); margin-bottom: 18px; font-size: 1.05rem; }
.feature-meta{ display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; margin: 40px 0; padding: 24px 0; border-top: 1px solid rgba(255,255,255,.15); border-bottom: 1px solid rgba(255,255,255,.15); }
.feature-meta div{ font-size: .72rem; letter-spacing: .2em; text-transform: uppercase; color: rgba(255,255,255,.5); font-weight: 600; }
.feature-meta strong{ display: block; font-family: 'Bebas Neue', sans-serif; font-size: 2rem; color: var(--white); font-weight: 400; letter-spacing: .02em; margin-top: 6px; }

/* ===== PRESSESTIMMEN STRIP ===== */
.quotes-strip{ background: var(--red); color: var(--white); padding: 80px 0; position: relative; overflow: hidden; }
.quotes-strip .wrap{ display: grid; grid-template-columns: repeat(3, 1fr); gap: 50px; }
@media (max-width: 900px){ .quotes-strip .wrap{ grid-template-columns: 1fr; gap: 40px; } }
.quote-card{ padding-left: 30px; border-left: 3px solid var(--white); }
.quote-stars{ font-size: 1rem; letter-spacing: .15em; margin-bottom: 14px; }
.quote-text{ font-family: 'Bebas Neue', sans-serif; font-size: 1.6rem; line-height: 1.15; margin-bottom: 16px; letter-spacing: .01em; }
.quote-author{ font-size: 1rem; margin-bottom: 8px; opacity: .9; }
.quote-author em{ font-style: italic; }
.quote-cite{ font-size: .8rem; letter-spacing: .15em; text-transform: uppercase; opacity: .8; font-weight: 600; }
.quote-cite a{ color: inherit; text-decoration: underline; text-underline-offset: 3px; transition: opacity .2s; }
.quote-cite a:hover{ opacity: 1; }

/* ===== BÜCHER ===== */
.books{ padding: 140px 0; background: var(--off-white); }
.books-head{ text-align: center; margin-bottom: 90px; }
.books-head h2{ margin: 18px 0 24px; }
.books-head p{ color: var(--ink-3); max-width: 600px; margin: 0 auto; font-size: 1.1rem; }
.books-grid{ display: grid; grid-template-columns: repeat(4, 1fr); gap: 60px 40px; }
/* Mittlerer Bereich: 3 Spalten (vermeidet zu breite Karten zwischen 800-1100) */
@media (max-width: 1100px){ .books-grid{ grid-template-columns: repeat(3, 1fr); gap: 60px 36px; } }
/* Tablet: 2 Spalten */
@media (max-width: 800px){ .books-grid{ grid-template-columns: repeat(2, 1fr); gap: 70px 30px; } }
/* Mobile: 1 Spalte */
@media (max-width: 520px){ .books-grid{ grid-template-columns: 1fr; max-width: 360px; margin: 0 auto; gap: 80px; } }

/* Bücher schweben jetzt — keine Cards mehr */
.book-card{
  position: relative; background: transparent;
  padding: 36px 0 0; border: none;
  cursor: pointer; display: block;
  transition: transform .4s cubic-bezier(.2,.8,.2,1);
}
/* Overlay-Link: macht die ganze Karte klickbar, OHNE dass das <a> ein
   Block-Element-Kind wäre (vermeidet WordPress' wpautop/Parser-Konflikte) */
.book-card-link{
  position: absolute; inset: 0; z-index: 10;
  text-indent: -9999px; overflow: hidden;
}
.book-card-link:focus-visible{
  outline: 3px solid var(--red); outline-offset: 4px; text-indent: 0;
}
.book-card .ribbon{ /* früher div, jetzt span — bleibt Block-Look durch CSS */
  display: block;
}
.book-card:hover{ transform: translateY(-12px); box-shadow: none; }
.book-card .num{
  position: absolute; top: -28px; right: 0; z-index: 0;
  font-family: 'Bebas Neue', sans-serif; font-size: 6rem;
  color: var(--red); opacity: .14; letter-spacing: .04em; line-height: 1;
  pointer-events: none;
  display: block;
}
.book-card-cover{
  /* aspect-ratio entfernt: Container nimmt die echte Bild-Höhe.
     Damit liegt der box-shadow exakt am Cover-Rand, kein Container-Leerraum unten. */
  margin-bottom: 32px; position: relative;
  overflow: visible; background: transparent; z-index: 1;
}
.book-card-cover img{
  width: 100%; height: auto; display: block;
  /* box-shadow folgt jetzt der img-Box, und die ist 1:1 die Cover-Größe */
  box-shadow:
    0 24px 35px -8px rgba(0,0,0,.45),
    0 12px 20px -6px rgba(129,34,47,.28);
  transition: transform .5s cubic-bezier(.2,.8,.2,1), box-shadow .5s;
  transform: rotate(-2deg);
}
.book-card:hover .book-card-cover img{
  box-shadow:
    0 35px 50px -8px rgba(0,0,0,.5),
    0 18px 30px -6px rgba(129,34,47,.35);
}
.book-card:nth-child(2) .book-card-cover img{ transform: rotate(1.8deg); }
.book-card:nth-child(3) .book-card-cover img{ transform: rotate(-1.2deg); }
.book-card:nth-child(4) .book-card-cover img{ transform: rotate(2.4deg); }
.book-card:nth-child(5) .book-card-cover img{ transform: rotate(-1.8deg); }
.book-card:hover .book-card-cover img{ transform: rotate(0deg) translateY(-6px) scale(1.04); }
.book-card .genre{ font-size: .7rem; letter-spacing: .25em; text-transform: uppercase; color: var(--red); font-weight: 700; margin-bottom: 10px; }
.book-card h3{ font-size: 1.7rem; margin-bottom: 6px; line-height: 1; }
.book-card .sub{ font-size: .95rem; color: var(--ink-3); margin-bottom: 18px; min-height: 2.6em; }
.book-card .read-more{ display: inline-flex; align-items: center; gap: 8px; font-size: .78rem; letter-spacing: .18em; text-transform: uppercase; font-weight: 700; color: var(--ink); transition: gap .25s, color .25s; padding-bottom: 4px; border-bottom: 2px solid var(--red); }
.book-card:hover .read-more{ gap: 14px; color: var(--red); }
.book-card .ribbon{
  position: absolute; top: 24px; left: -10px; z-index: 3;
  background: var(--red); color: var(--white);
  padding: 8px 16px; font-size: .68rem; letter-spacing: .2em;
  font-weight: 700; text-transform: uppercase;
  box-shadow: 4px 4px 0 var(--ink);
  transform: rotate(-4deg);
}

/* Mystery-Karte (Buch 5 / Coming Soon im Grid) */
.book-card.mystery .book-card-cover{
  aspect-ratio: 2/3;
  background: linear-gradient(135deg, #1A1D24 0%, #2A2D34 50%, #16191F 100%);
  border: 1px solid rgba(129,34,47,.4);
  display: flex; align-items: center; justify-content: center;
  filter: drop-shadow(0 24px 35px rgba(0,0,0,.5)) drop-shadow(0 12px 20px rgba(129,34,47,.3));
  transform: rotate(-1.8deg);
  transition: transform .5s cubic-bezier(.2,.8,.2,1);
  overflow: hidden;
}
.book-card.mystery:hover .book-card-cover{ transform: rotate(0deg) translateY(-6px) scale(1.04); }
.book-card.mystery .book-card-cover::after{
  content: "?"; font-family: 'Bebas Neue', sans-serif;
  font-size: 12rem; color: var(--red); line-height: 1;
  text-shadow: 0 0 40px rgba(129,34,47,.6);
  animation: glow 3s ease-in-out infinite;
}
.book-card.mystery .book-card-cover::before{
  content: "Arbeitstitel"; position: absolute; top: 20px; left: 0; right: 0;
  text-align: center; font-family: 'Bebas Neue', sans-serif; font-size: .9rem;
  color: rgba(255,255,255,.5); letter-spacing: .25em;
}

/* ===== COMING SOON / TEASER ===== */
.coming{
  background: var(--ink); color: var(--white);
  padding: 140px 0; position: relative; overflow: hidden;
}
.coming-bg{
  position: absolute; top: -30%; left: -10%; right: -10%; bottom: -30%;
  background:
    radial-gradient(ellipse at 30% 30%, rgba(220,20,20,.25), transparent 50%),
    radial-gradient(ellipse at 70% 70%, rgba(220,20,20,.15), transparent 50%);
  filter: blur(60px);
  z-index: 0;
}
.coming::before{
  content: "COMING SOON · COMING SOON · COMING SOON · COMING SOON";
  position: absolute; top: 30px; left: 0; right: 0; white-space: nowrap;
  font-family: 'Bebas Neue', sans-serif; font-size: 6rem;
  color: var(--white); opacity: .05; pointer-events: none; letter-spacing: .04em;
  animation: scroll-text 40s linear infinite;
}
@keyframes scroll-text{ from{ transform: translateX(0); } to{ transform: translateX(-25%); } }
.coming .wrap{ position: relative; z-index: 2; display: grid; grid-template-columns: 1fr 1.2fr; gap: 80px; align-items: center; }
@media (max-width: 1000px){ .coming .wrap{ grid-template-columns: 1fr; gap: 50px; } }
.coming-cover-mystery{
  position: relative; aspect-ratio: 2/3; max-width: 360px; margin: 0 auto;
  background: linear-gradient(135deg, #1A1A1F 0%, #2A2A30 50%, #1A1A1F 100%);
  display: flex; align-items: center; justify-content: center;
  box-shadow: 0 50px 100px -20px rgba(0,0,0,.8), 0 30px 60px -10px rgba(220,20,20,.35);
  overflow: hidden;
}
.coming-cover-mystery::before{
  content:""; position: absolute; inset: 14px; border: 1px solid rgba(255,255,255,.1);
}
.coming-cover-mystery::after{
  content: "?"; font-family: 'Bebas Neue', sans-serif; font-size: 18rem;
  color: var(--red); opacity: .9; line-height: 1;
  text-shadow: 0 0 40px rgba(220,20,20,.6);
  animation: glow 3s ease-in-out infinite;
}
@keyframes glow{ 0%,100%{ opacity: .85; } 50%{ opacity: 1; text-shadow: 0 0 60px rgba(220,20,20,.9); } }
.coming-cover-mystery .working-title{
  position: absolute; top: 30px; left: 0; right: 0; text-align: center;
  font-family: 'Bebas Neue', sans-serif; font-size: 1.2rem;
  color: rgba(255,255,255,.6); letter-spacing: .25em; z-index: 2;
}
.coming-cover-mystery .stamp-soon{
  position: absolute; bottom: 30px; left: 0; right: 0; text-align: center;
  font-family: 'Inter', sans-serif; font-size: .7rem; font-weight: 700;
  color: rgba(255,255,255,.7); letter-spacing: .3em; z-index: 2;
}
.coming h2{ color: var(--white); margin: 20px 0 28px; }
.coming h2 .red{ color: var(--red); }
.coming-lead{
  font-family: 'Bebas Neue', sans-serif; font-size: 1.6rem;
  color: var(--white); margin-bottom: 24px; line-height: 1.2; letter-spacing: .02em;
}
.coming p{ color: rgba(255,255,255,.7); margin-bottom: 18px; font-size: 1.05rem; }
.coming-progress{
  margin: 36px 0; padding: 24px 0;
  border-top: 1px solid rgba(255,255,255,.15);
  border-bottom: 1px solid rgba(255,255,255,.15);
}
.coming-progress-label{
  display: flex; justify-content: space-between; align-items: baseline;
  margin-bottom: 12px;
}
.coming-progress-label small{ font-size: .72rem; letter-spacing: .2em; text-transform: uppercase; color: rgba(255,255,255,.5); font-weight: 700; }
.coming-progress-label strong{ font-family: 'Bebas Neue', sans-serif; font-size: 1.6rem; color: var(--red); letter-spacing: .04em; }
.coming-bar{ width: 100%; height: 8px; background: rgba(255,255,255,.1); position: relative; overflow: hidden; }
.coming-bar-fill{ height: 100%; background: var(--red); width: 65%; position: relative; }
.coming-bar-fill::after{ content:""; position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: linear-gradient(90deg, transparent, rgba(255,255,255,.4), transparent); animation: shimmer 2s linear infinite; }
@keyframes shimmer{ from{ transform: translateX(-100%); } to{ transform: translateX(100%); } }
.coming-eta{ margin-top: 12px; font-size: .85rem; color: rgba(255,255,255,.6); }
.coming-eta strong{ color: var(--white); font-weight: 600; }
.coming-form{ display: flex; gap: 0; max-width: 480px; background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.2); }
.coming-form input{ flex: 1; background: transparent; border: none; color: var(--white); padding: 18px 20px; font-family: inherit; font-size: .95rem; }
.coming-form input::placeholder{ color: rgba(255,255,255,.4); }
.coming-form input:focus{ outline: none; background: rgba(255,255,255,.08); }
.coming-form button{ background: var(--red); color: var(--white); padding: 18px 28px; font-weight: 700; font-size: .8rem; letter-spacing: .12em; text-transform: uppercase; border: none; cursor: pointer; transition: background .2s; }
.coming-form button:hover{ background: var(--white); color: var(--ink); }
.coming-note-hint{
  font-family: 'Caveat', cursive; font-size: 1.4rem; color: var(--red);
  margin-bottom: 12px; transform: rotate(-1deg); display: inline-block;
}

/* ===== ÜBER MICH (Startseite-Teaser) ===== */
.about{ padding: 140px 0; background: var(--white); position: relative; overflow: hidden; }
.about-bg{ position: absolute; right: -8%; top: 50%; transform: translateY(-50%); font-family: 'Bebas Neue', sans-serif; font-size: 22rem; color: var(--red); opacity: .04; line-height: 1; letter-spacing: -.04em; }
.about .wrap{ position: relative; display: grid; grid-template-columns: 1fr 1.3fr; gap: 80px; align-items: center; }
@media (max-width: 1000px){ .about .wrap{ grid-template-columns: 1fr; } }
.about-portrait{ aspect-ratio: 4/5; background: var(--paper); display: flex; align-items: center; justify-content: center; color: var(--ink-3); font-size: .8rem; letter-spacing: .2em; text-transform: uppercase; position: relative; box-shadow: 24px 24px 0 var(--red); }
.about h2{ margin: 20px 0 30px; }
.about h2 .red{ color: var(--red); }
.about-lead{ font-family: 'Bebas Neue', sans-serif; font-size: 1.7rem; color: var(--ink); margin-bottom: 28px; line-height: 1.2; letter-spacing: .01em; }
.about p{ color: var(--ink-2); margin-bottom: 18px; font-size: 1.05rem; }
.about-actions{ margin-top: 36px; display: flex; gap: 14px; flex-wrap: wrap; }

/* ===== SIGNIERT TEASER (Startseite) ===== */
.signed{ background: var(--ink); color: var(--white); padding: 140px 0; position: relative; overflow: hidden; }
.signed-bg{ position: absolute; top: -10%; right: -5%; font-family: 'Bebas Neue', sans-serif; font-size: 24rem; color: var(--red); opacity: .08; line-height: 1; pointer-events: none; transform: rotate(-8deg); }
.signed .wrap{ position: relative; display: grid; grid-template-columns: 1fr 1fr; gap: 80px; align-items: center; }
@media (max-width: 1000px){ .signed .wrap{ grid-template-columns: 1fr; gap: 50px; } }
.signed h2{ color: var(--white); margin: 20px 0 30px; }
.signed h2 .red{ color: var(--red); }
.signed p{ color: rgba(255,255,255,.75); margin-bottom: 24px; font-size: 1.05rem; }
.signed-list{ list-style: none; margin: 30px 0; }
.signed-list li{ display: flex; gap: 14px; align-items: center; padding: 16px 0; border-bottom: 1px solid rgba(255,255,255,.12); font-size: 1rem; position: relative; }
.signed-list li::before{ content: "✓"; width: 24px; height: 24px; background: var(--red); flex-shrink: 0; display: flex; align-items: center; justify-content: center; color: var(--white); font-weight: 700; font-size: .8rem; line-height: 24px; text-align: center; }
.signed-form{ background: var(--white); color: var(--ink); padding: 50px 44px; position: relative; box-shadow: 20px 20px 0 var(--red); }
.signed-form .stamp{ position: absolute; top: -22px; right: 30px; background: var(--red); color: var(--white); padding: 10px 20px; font-family: 'Bebas Neue', sans-serif; font-size: 1.1rem; letter-spacing: .15em; transform: rotate(3deg); box-shadow: 4px 4px 0 var(--ink); }
.signed-form h3{ font-size: 2rem; margin-bottom: 8px; }
.signed-form .price-row{ display: flex; align-items: baseline; gap: 12px; margin: 24px 0 8px; }
.signed-form .price{ font-family: 'Bebas Neue', sans-serif; font-size: 4rem; color: var(--red); line-height: 1; }
.signed-form .price-from{ font-size: .8rem; letter-spacing: .2em; text-transform: uppercase; color: var(--ink-3); font-weight: 700; }
.signed-form .price-note{ font-size: .85rem; color: var(--ink-3); margin-bottom: 30px; }
.signed-form .features{ list-style: none; margin-bottom: 30px; }
.signed-form .features li{ font-size: .92rem; padding: 8px 0; border-bottom: 1px dashed var(--line); color: var(--ink-2); }
.signed-form .features li:last-child{ border: none; }

/* ===== EVENTS ===== */
.events{ padding: 140px 0; background: var(--off-white); }
.events-head{ display: grid; grid-template-columns: 1fr 1fr; gap: 40px; align-items: end; margin-bottom: 70px; }
@media (max-width: 800px){ .events-head{ grid-template-columns: 1fr; } }
.events-head h2{ margin: 16px 0 0; }
.events-head p{ color: var(--ink-3); font-size: 1.05rem; }
.event-row{ display: grid; grid-template-columns: 130px 1fr 1fr auto; gap: 30px; padding: 28px 0; border-top: 1px solid var(--line); align-items: center; transition: padding .25s; }
.event-row:last-child{ border-bottom: 1px solid var(--line); }
.event-row:hover{ padding-left: 14px; }
@media (max-width: 800px){ .event-row{ grid-template-columns: 1fr; gap: 8px; } }
.event-date{ font-family: 'Bebas Neue', sans-serif; font-size: 2.4rem; color: var(--red); line-height: 1; }
.event-date small{ display: block; font-size: .75rem; letter-spacing: .2em; color: var(--ink-3); font-weight: 600; }
.event-title{ font-family: 'Bebas Neue', sans-serif; font-size: 1.6rem; letter-spacing: .02em; }
.event-loc{ font-size: .92rem; color: var(--ink-3); }
.event-cta a{ font-size: .78rem; letter-spacing: .18em; text-transform: uppercase; font-weight: 700; color: var(--ink); border-bottom: 2px solid var(--red); padding-bottom: 2px; }
.event-cta a:hover{ color: var(--red); }

/* ===== NEWSLETTER ===== */
.newsletter{ background: var(--red); color: var(--white); padding: 140px 0; text-align: center; position: relative; overflow: hidden; }
.newsletter::before{ content: "NEWSLETTER NEWSLETTER NEWSLETTER NEWSLETTER"; position: absolute; top: 40px; left: 0; right: 0; white-space: nowrap; font-family: 'Bebas Neue', sans-serif; font-size: 8rem; color: var(--white); opacity: .08; pointer-events: none; letter-spacing: .04em; }
.newsletter::after{ content: "NEWSLETTER NEWSLETTER NEWSLETTER NEWSLETTER"; position: absolute; bottom: 40px; left: 0; right: 0; white-space: nowrap; font-family: 'Bebas Neue', sans-serif; font-size: 8rem; color: var(--white); opacity: .08; pointer-events: none; letter-spacing: .04em; }
.newsletter .wrap{ position: relative; max-width: 760px; z-index: 2; }
.newsletter h2{ color: var(--white); margin: 20px 0 24px; }
.newsletter h2 .black{ background: var(--ink); padding: 0 .15em; }
.newsletter p{ color: rgba(255,255,255,.9); font-size: 1.15rem; margin-bottom: 32px; max-width: 580px; margin-left: auto; margin-right: auto; }

/* Newsletter (Fluent Form 2): einspaltig, Vorname zuerst, E-Mail volle Breite,
   Button schwarz (sichtbar auf rotem Hintergrund), Hover rot. */
.fluent_form_2 fieldset{ display: flex; flex-direction: column; max-width: 540px; margin: 0 auto; }
.fluent_form_2 .ff-el-group:has(input[name="input_text"]){ order: 1; }
.fluent_form_2 .ff-t-container{ order: 2; display: block !important; }
.fluent_form_2 .ff-t-container .ff-t-cell{ width: 100% !important; max-width: 100% !important; padding: 0 !important; }
.fluent_form_2 .ff-t-container .ff-t-cell + .ff-t-cell{ margin-top: 14px; }
.fluent_form_2 .ff-el-group:has(input[name="gdpr-agreement"]){ order: 3; margin-top: 6px; }
.newsletter .fluent_form_2 .ff-btn-submit{ background: var(--ink) !important; border-color: var(--ink) !important; color: #fff !important; width: 100%; }
.newsletter .fluent_form_2 .ff-btn-submit:hover{ background: var(--red) !important; border-color: var(--red) !important; color: #fff !important; }
/* DSGVO-Einwilligungstext im roten Newsletter-Block: Link lesbar (hell + unterstrichen) */
.newsletter .fluentform a{ color: #fff; text-decoration: underline; text-underline-offset: 2px; }
.newsletter .fluentform a:hover{ color: var(--paper); }
/* Ab Desktop die Eingabefelder/Button/Consent auf ~halbe Breite, zentriert.
   (fieldset ignoriert max-width, daher per Feldgruppen + align-items: center.)
   Mobil bleiben sie volle Breite. Die Hinweis-Notiz darunter ist NICHT betroffen. */
@media (min-width: 701px){
  .newsletter .fluent_form_2 fieldset{ align-items: center; }
  .newsletter .fluent_form_2 .ff-el-group,
  .newsletter .fluent_form_2 .ff-t-container{ width: 100%; max-width: 360px; margin-left: auto; margin-right: auto; }
}
.nl-bonus{ display: inline-block; margin-bottom: 30px; font-family: 'Caveat', cursive; font-size: 1.8rem; color: var(--white); transform: rotate(-2deg); }
.nl-form{ display: flex; gap: 0; max-width: 540px; margin: 0 auto; background: var(--white); }
.nl-form input{ flex: 1; background: transparent; border: none; color: var(--ink); padding: 22px 24px; font-family: inherit; font-size: 1rem; font-weight: 500; }
.nl-form input::placeholder{ color: var(--ink-3); }
.nl-form input:focus{ outline: none; }
.nl-form button{ background: var(--ink); color: var(--white); padding: 22px 36px; font-weight: 700; font-size: .85rem; letter-spacing: .15em; text-transform: uppercase; border: none; cursor: pointer; transition: background .2s; }
.nl-form button:hover{ background: var(--red-dark); }
.nl-note{ font-size: .78rem; color: rgba(255,255,255,.7); margin-top: 18px; }

/* ===== FOOTER ===== */
footer{ background: var(--ink); color: var(--white); padding: 80px 0 30px; }
.footer-grid{ display: grid; grid-template-columns: 2.2fr 1fr 1fr 1fr; gap: 50px; margin-bottom: 60px; }
@media (max-width: 900px){ .footer-grid{ grid-template-columns: 1fr 1fr; gap: 40px; } }
@media (max-width: 500px){ .footer-grid{ grid-template-columns: 1fr; gap: 36px; } }
footer h4{ font-family: 'Inter', sans-serif; font-size: .72rem; letter-spacing: .25em; text-transform: uppercase; color: var(--red); margin-bottom: 20px; font-weight: 700; }
footer ul{ list-style: none; }
footer ul li{ margin-bottom: 12px; }
footer ul a{ color: rgba(255,255,255,.65); font-size: .95rem; transition: color .2s; }
footer ul a:hover{ color: var(--red); }
.footer-bottom{ border-top: 1px solid rgba(255,255,255,.12); padding-top: 30px; display: flex; justify-content: space-between; flex-wrap: wrap; gap: 16px; font-size: .82rem; color: rgba(255,255,255,.5); }

/* ===== CCM19 ===== */
.ccm{ position: fixed; bottom: 20px; left: 20px; right: 20px; max-width: 460px; background: var(--white); padding: 22px 24px; font-size: .85rem; color: var(--ink-2); z-index: 100; box-shadow: 10px 10px 0 var(--red), 0 30px 60px -15px rgba(0,0,0,.25); border-left: 4px solid var(--red); }
.ccm strong{ color: var(--ink); font-family: 'Bebas Neue', sans-serif; font-size: 1.3rem; display: block; margin-bottom: 8px; letter-spacing: .04em; }
.ccm-buttons{ margin-top: 14px; display: flex; gap: 8px; }
.ccm-buttons button{ flex: 1; padding: 11px; font-size: .72rem; letter-spacing: .12em; text-transform: uppercase; border: 1px solid var(--ink); cursor: pointer; font-family: inherit; font-weight: 700; transition: all .2s; }
.ccm-buttons .accept{ background: var(--red); color: var(--white); border-color: var(--red); }
.ccm-buttons .accept:hover{ background: var(--red-dark); border-color: var(--red-dark); }
.ccm-buttons .essential:hover{ background: var(--ink); color: var(--white); }
.ccm-tag{ position: absolute; top: -10px; right: 16px; background: var(--ink); color: var(--white); padding: 3px 10px; font-size: .62rem; letter-spacing: .2em; text-transform: uppercase; font-weight: 700; }

/* ===== SCROLL REVEAL ===== */
.reveal{ opacity: 0; transform: translateY(40px); transition: opacity .8s ease, transform .8s cubic-bezier(.2,.8,.2,1); }
.reveal.in{ opacity: 1; transform: translateY(0); }

/* =====================================================
   ============= UNTERSEITEN-STYLES =====================
   ===================================================== */

/* ===== BREADCRUMB ===== */
.breadcrumb{ padding: 26px 0; font-size: .75rem; letter-spacing: .2em; text-transform: uppercase; color: var(--ink-3); font-weight: 600; border-bottom: 1px solid var(--line); }
.breadcrumb a{ color: var(--ink-3); transition: color .2s; }
.breadcrumb a:hover{ color: var(--red); }
.breadcrumb .sep{ margin: 0 12px; color: var(--red); }
.breadcrumb .current{ color: var(--ink); }

/* ===== PAGE HERO (kleinerer Hero auf Unterseiten) ===== */
.page-hero{ padding: 80px 0 60px; background: var(--off-white); position: relative; overflow: hidden; text-align: center; }
.page-hero::before{ content:""; position: absolute; left: 0; right: 0; top: 0; height: 1px; background: linear-gradient(90deg, transparent, var(--red), transparent); }
.page-hero h1{ font-size: clamp(2.8rem, 6vw, 5rem); margin: 20px 0 20px; }
.page-hero p{ color: var(--ink-3); max-width: 600px; margin: 0 auto; font-size: 1.1rem; }

/* ===== BUCH-DETAILSEITE ===== */
.book-hero{
  padding: 60px 0 100px; background: var(--off-white);
  position: relative; overflow: hidden;
}
.book-hero-bg{
  /* right statt left → Text läuft vom rechten Rand nach links;
     bei kurzen Titeln (z.B. "DIE 20") bleibt das Cover (links) frei,
     bei langen Titeln läuft der Text dezent hinter das Cover */
  position: absolute; right: -3%; left: auto; top: 30%;
  font-family: 'Bebas Neue', sans-serif;
  font-size: clamp(16rem, 30vw, 36rem);
  color: var(--red); opacity: .06; line-height: .8; z-index: 0;
  pointer-events: none; user-select: none; letter-spacing: -.05em;
  white-space: nowrap;
}
.book-hero .wrap{ position: relative; z-index: 2; display: grid; grid-template-columns: 1fr 1.1fr; gap: 80px; align-items: center; }
@media (max-width: 1000px){ .book-hero .wrap{ grid-template-columns: 1fr; gap: 60px; } .book-hero-cover{ max-width: 360px; margin: 0 auto; } }
.book-hero-cover{ position: relative; perspective: 1500px; }
.book-hero-cover img{
  box-shadow: 0 50px 100px -20px rgba(0,0,0,.4), 0 25px 50px -25px rgba(220,20,20,.35);
  transform: rotateY(-8deg) rotateZ(-2deg);
  transition: transform .6s cubic-bezier(.2,.8,.2,1);
}
.book-hero-cover:hover img{ transform: rotateY(0deg) rotateZ(0deg) translateY(-10px); }
.book-hero-meta{ display: flex; gap: 12px; flex-wrap: wrap; margin-bottom: 24px; }
.book-hero-meta .tag{
  background: var(--ink); color: var(--white);
  padding: 6px 14px; font-size: .68rem;
  letter-spacing: .25em; text-transform: uppercase; font-weight: 700;
}
.book-hero-meta .tag.red{ background: var(--red); }
.book-hero h1{ font-size: clamp(3rem, 7vw, 6.5rem); margin-bottom: 18px; }
.book-hero h1 .red{ color: var(--red); }
.book-hero .subtitle{
  font-family: 'Bebas Neue', sans-serif; font-size: 1.6rem;
  color: var(--ink-2); margin-bottom: 32px; letter-spacing: .02em;
}
.book-hero-rating{
  display: flex; align-items: center; gap: 14px; margin-bottom: 28px;
  padding: 14px 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line);
}
.book-hero-rating .stars{ color: var(--red); font-size: 1.1rem; letter-spacing: .15em; }
.book-hero-rating .num{ font-family: 'Bebas Neue', sans-serif; font-size: 1.6rem; color: var(--ink); letter-spacing: .04em; }
.book-hero-rating small{ font-size: .8rem; color: var(--ink-3); letter-spacing: .1em; text-transform: uppercase; font-weight: 600; }
.book-hero-pitch{ font-size: 1.05rem; line-height: 1.6; color: var(--ink-2); margin-bottom: 36px; }
.book-hero-pitch strong{ background: linear-gradient(transparent 60%, rgba(220,20,20,.18) 60%); font-weight: 500; }
.book-hero-ctas{ display: flex; gap: 16px; flex-wrap: wrap; align-items: center; }

/* =====================================================
   COMING-SOON-BUCH-DETAIL (eigener Render-Pfad)
   Hell, mit Lauftext-BG, großes Mystery-Cover.
   ===================================================== */
.coming-hero{
  position: relative; overflow: hidden;
  padding: 80px 0 100px; background: var(--off-white);
}
.coming-hero-bg{
  position: absolute; top: 50%; left: 0; right: 0;
  transform: translateY(-50%);
  font-family: 'Bebas Neue', sans-serif;
  font-size: clamp(8rem, 16vw, 18rem);
  color: var(--red); opacity: .055;
  line-height: .85; letter-spacing: -.02em;
  white-space: nowrap;
  pointer-events: none; user-select: none;
  animation: coming-marquee 40s linear infinite;
  z-index: 0;
}
@keyframes coming-marquee {
  0%   { transform: translate(0, -50%); }
  100% { transform: translate(-50%, -50%); }
}
.coming-hero .wrap{
  position: relative; z-index: 2;
  display: grid; grid-template-columns: 1fr 1.2fr; gap: 80px; align-items: center;
}
@media (max-width: 1000px){
  .coming-hero .wrap{ grid-template-columns: 1fr; gap: 50px; }
  .coming-hero-cover-wrap{ max-width: 360px; margin: 0 auto; }
}

.coming-hero-cover-wrap{ position: relative; perspective: 1500px; }
.coming-hero-cover{
  position: relative;
  transform: rotateY(-8deg) rotateZ(-3deg);
  transition: transform .6s cubic-bezier(.2,.8,.2,1);
}
.coming-hero-cover:hover{ transform: rotateY(0) rotateZ(0) translateY(-8px); }
.coming-hero-cover img{
  width: 100%; height: auto; display: block;
  box-shadow:
    0 50px 100px -20px rgba(0,0,0,.45),
    0 25px 50px -25px rgba(129,34,47,.4);
}
.coming-hero-cover-placeholder{
  aspect-ratio: 2/3;
  background:
    radial-gradient(circle at 30% 20%, rgba(129,34,47,.35) 0%, transparent 50%),
    linear-gradient(135deg, #1A1D24 0%, #2A2D34 50%, #16191F 100%);
  border: 1px solid rgba(129,34,47,.4);
  display: flex; flex-direction: column;
  align-items: center; justify-content: center;
  text-align: center; color: #fff;
  position: relative; overflow: hidden;
  box-shadow:
    0 50px 100px -20px rgba(0,0,0,.55),
    0 25px 50px -25px rgba(129,34,47,.5);
}
.coming-hero-cover-placeholder::before{
  content: '?';
  position: absolute; top: 38%; left: 50%;
  transform: translate(-50%, -50%);
  font-family: 'Bebas Neue', sans-serif;
  font-size: 14rem; line-height: 1;
  color: rgba(129,34,47,.4);
  pointer-events: none;
}
.coming-hero-cover-placeholder .working-title{
  position: relative; z-index: 2;
  font-family: 'Caveat', cursive; font-size: 2.2rem;
  color: rgba(255,255,255,.6); margin-bottom: 8px;
  margin-top: 60%;
}
.coming-hero-cover-placeholder .stamp-soon{
  position: relative; z-index: 2;
  display: inline-block;
  background: var(--red); color: #fff;
  font-family: 'Caveat', cursive; font-size: 1.2rem;
  padding: 6px 18px; transform: rotate(-3deg);
  margin: 14px auto;
}

.coming-hero-content h1{
  font-size: clamp(2.6rem, 6vw, 5rem); margin: 18px 0;
  line-height: 1;
}
.coming-hero-lead{
  font-family: 'Bebas Neue', sans-serif;
  font-size: 1.6rem; color: var(--ink-2);
  letter-spacing: .02em; margin-bottom: 24px;
}
.coming-hero-content > p{
  font-size: 1.05rem; line-height: 1.6; color: var(--ink-2);
  margin-bottom: 24px;
}
.coming-hero-eta{
  display: inline-flex; align-items: baseline; gap: 14px;
  padding: 14px 22px; margin: 8px 0 32px;
  background: var(--ink); color: #fff;
  border-left: 4px solid var(--red);
}
.coming-hero-eta small{
  font-size: .72rem; letter-spacing: .25em;
  text-transform: uppercase; font-weight: 700; opacity: .7;
}
.coming-hero-eta strong{
  font-family: 'Bebas Neue', sans-serif;
  font-size: 1.6rem; letter-spacing: .04em; color: var(--red);
}
.coming-hero-ctas{ display: flex; gap: 16px; flex-wrap: wrap; }

/* Intro-Block (zwischen Hero und Meta) */
.coming-intro{
  padding: 80px 0; background: var(--white);
}
.coming-intro .wrap-tight > *{
  font-size: 1.15rem; line-height: 1.7; color: var(--ink-2);
  margin-bottom: 1.4em;
}
.coming-intro h2{ font-size: 2.2rem; margin: 1.4em 0 .4em; color: var(--ink); }
.coming-intro a{ color: var(--red); text-decoration: underline; text-underline-offset: 3px; }

/* Buchdaten + Trigger als 2-Spalten */
.coming-meta{
  padding: 80px 0; background: var(--off-white);
  border-top: 1px solid var(--line);
}
.coming-meta .wrap{
  display: grid; grid-template-columns: 1fr 1fr; gap: 60px; align-items: start;
}
@media (max-width: 800px){ .coming-meta .wrap{ grid-template-columns: 1fr; gap: 40px; } }
.coming-meta h3{ font-size: 2rem; margin: 12px 0 24px; }
.coming-meta h3 .red{ color: var(--red); }

/* ===== COMING SOON BADGE auf Buch-Detailseite (legacy, falls noch verwendet) ===== */
.book-hero-release-badge{
  position: absolute; top: -18px; right: -18px; z-index: 10;
  background: var(--red); color: var(--white);
  width: 150px; height: 150px; border-radius: 50%;
  display: flex; flex-direction: column;
  align-items: center; justify-content: center; text-align: center;
  transform: rotate(8deg);
  box-shadow: 0 14px 30px -10px rgba(220,20,20,.55);
  font-family: 'Bebas Neue', sans-serif;
  animation: wobble 4s ease-in-out infinite;
}
.book-hero-release-badge small{
  font-size: .72rem; letter-spacing: .25em; text-transform: uppercase;
  opacity: .85; margin-bottom: 4px; font-family: 'Inter', sans-serif; font-weight: 700;
}
.book-hero-release-badge strong{
  font-size: 1.4rem; line-height: 1.05; letter-spacing: .03em;
  display: block; padding: 0 14px;
}
@media (max-width: 700px){
  .book-hero-release-badge{ width: 120px; height: 120px; top: -10px; right: -10px; }
  .book-hero-release-badge strong{ font-size: 1.15rem; }
}

/* ===== FREIER INHALT auf Buch-Detailseite ===== */
.book-free-content{
  padding: 60px 0 100px; background: var(--off-white);
}
.book-free-content .wrap-tight > *{
  margin-bottom: 1.4em; font-size: 1.1rem; line-height: 1.7; color: var(--ink-2);
}
.book-free-content h2{ font-size: 2.4rem; margin: 1.5em 0 .5em; color: var(--ink); line-height: 1.1; }
.book-free-content h3{ font-size: 1.8rem; margin: 1.4em 0 .4em; color: var(--ink); line-height: 1.15; }
.book-free-content blockquote{
  font-family: 'Bebas Neue', sans-serif; font-size: 1.8rem; line-height: 1.2;
  color: var(--ink); text-align: center;
  border-top: 2px solid var(--red); border-bottom: 2px solid var(--red);
  padding: 32px 0; margin: 40px 0;
}
.book-free-content img{ max-width: 100%; height: auto; box-shadow: 0 30px 60px -15px rgba(0,0,0,.3); margin: 24px 0; }
.book-free-content iframe{ max-width: 100%; }
.book-free-content a{ color: var(--red); text-decoration: underline; text-underline-offset: 3px; }

/* ===== KAUFLINKS BOX ===== */
.buy-box{
  background: var(--ink); color: var(--white); padding: 80px 0;
  position: relative;
}
.buy-box .wrap{ display: grid; grid-template-columns: 1fr 2fr; gap: 60px; align-items: center; }
@media (max-width: 800px){ .buy-box .wrap{ grid-template-columns: 1fr; gap: 30px; } }
.buy-box h3{ color: var(--white); margin-bottom: 8px; }
.buy-box h3 .red{ color: var(--red); }
.buy-box p{ color: rgba(255,255,255,.7); font-size: .95rem; }
.buy-links{ display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: 12px; }
.buy-link{
  background: rgba(255,255,255,.05); border: 1px solid rgba(255,255,255,.15);
  padding: 18px 16px; text-align: center;
  font-size: .82rem; letter-spacing: .12em; text-transform: uppercase; font-weight: 700;
  transition: all .25s; cursor: pointer;
  display: flex; flex-direction: column; gap: 4px;
}
.buy-link:hover{ background: var(--red); border-color: var(--red); transform: translateY(-3px); }
.buy-link small{ font-size: .68rem; opacity: .6; letter-spacing: .2em; font-weight: 600; }

/* ===== LESEPROBE ===== */
.excerpt{ padding: 140px 0; background: var(--white); position: relative; overflow: hidden; }
.excerpt-bg{ position: absolute; top: 10%; right: -5%; font-family: 'Bebas Neue', sans-serif; font-size: 16rem; color: var(--red); opacity: .04; line-height: 1; pointer-events: none; letter-spacing: -.04em; }
.excerpt .wrap-tight{ position: relative; z-index: 2; }
.excerpt-head{ text-align: center; margin-bottom: 60px; }
.excerpt-head h2{ margin: 18px 0 20px; }
.excerpt-head h2 .red{ color: var(--red); }
.excerpt-text{
  font-size: 1.15rem; line-height: 1.7; color: var(--ink-2);
  font-family: 'Inter', sans-serif;
}
.excerpt-text p{ margin-bottom: 22px; }
.excerpt-text p:first-child::first-letter{
  font-family: 'Bebas Neue', sans-serif;
  font-size: 5rem; color: var(--red);
  float: left; line-height: .85; padding: 8px 14px 0 0;
}
.excerpt-fade{
  position: relative; max-height: 480px; overflow: hidden;
}
.excerpt-fade::after{
  content:""; position: absolute; bottom: 0; left: 0; right: 0; height: 200px;
  background: linear-gradient(transparent, var(--white));
  pointer-events: none;
}
.excerpt-cta{ text-align: center; margin-top: -40px; position: relative; z-index: 3; }

/* ===== TRIGGERWARNUNGEN ===== */
.triggers{ padding: 80px 0; background: var(--off-white); }
.triggers .wrap-tight{ text-align: center; }
.triggers h3{ font-size: 2rem; margin: 14px 0 16px; }
.triggers p{ color: var(--ink-3); margin-bottom: 30px; font-size: .98rem; }
.triggers-list{ display: flex; flex-wrap: wrap; gap: 10px; justify-content: center; }
.triggers-list span{
  background: var(--white); border: 1px solid var(--line);
  padding: 10px 18px; font-size: .78rem; letter-spacing: .15em;
  text-transform: uppercase; font-weight: 600; color: var(--ink-2);
}

/* ===== BUCH-DATEN ===== */
.book-data{ padding: 100px 0; background: var(--white); }
.book-data .wrap{ display: grid; grid-template-columns: 1fr 1fr; gap: 80px; }
@media (max-width: 800px){ .book-data .wrap{ grid-template-columns: 1fr; gap: 50px; } }
.book-data h3{ margin-bottom: 30px; }
.book-data h3 .red{ color: var(--red); }
.book-data-list{ list-style: none; }
.book-data-list li{
  display: grid; grid-template-columns: 160px 1fr; gap: 20px;
  padding: 18px 0; border-bottom: 1px solid var(--line);
  font-size: .98rem;
}
.book-data-list li small{ font-size: .72rem; letter-spacing: .22em; text-transform: uppercase; color: var(--ink-3); font-weight: 700; padding-top: 2px; }
.book-data-list li strong{ color: var(--ink); font-weight: 500; font-family: 'Inter', sans-serif; }

/* ===== ÜBER-MICH-SEITE ===== */
.about-page-hero{
  padding: 80px 0 100px; background: var(--off-white);
  position: relative; overflow: hidden;
}
.about-page-hero .wrap{ display: grid; grid-template-columns: 1fr 1.4fr; gap: 80px; align-items: center; }
@media (max-width: 1000px){ .about-page-hero .wrap{ grid-template-columns: 1fr; gap: 50px; } }
.about-page-portrait{
  aspect-ratio: 4/5; background: var(--paper);
  display: flex; align-items: center; justify-content: center;
  color: var(--ink-3); font-size: .8rem; letter-spacing: .2em; text-transform: uppercase;
  position: relative;
  box-shadow: 30px 30px 0 var(--red);
}
.about-page-hero h1{ font-size: clamp(3rem, 7vw, 6rem); margin: 16px 0 24px; }
.about-page-hero h1 .red{ color: var(--red); }
.about-page-quote{
  font-family: 'Bebas Neue', sans-serif; font-size: 1.8rem;
  color: var(--ink); line-height: 1.2; letter-spacing: .01em;
  border-left: 4px solid var(--red); padding-left: 24px; margin-bottom: 32px;
}
.about-page-meta{ display: flex; gap: 36px; margin-top: 36px; padding-top: 24px; border-top: 1px solid var(--line); flex-wrap: wrap; }
.about-page-meta .num{ font-family: 'Bebas Neue', sans-serif; font-size: 2.4rem; color: var(--red); line-height: 1; }
.about-page-meta .lbl{ font-size: .72rem; letter-spacing: .2em; text-transform: uppercase; color: var(--ink-3); font-weight: 600; margin-top: 4px; }

.about-body{ padding: 100px 0; background: var(--white); }
.about-body .wrap-tight p{ font-size: 1.1rem; line-height: 1.7; color: var(--ink-2); margin-bottom: 22px; }
.about-body .wrap-tight p:first-of-type::first-letter{ font-family: 'Bebas Neue', sans-serif; font-size: 5rem; color: var(--red); float: left; line-height: .85; padding: 8px 14px 0 0; }
.about-body h2{ font-size: 2.6rem; margin: 50px 0 24px; }

/* Über-mich-Fließtext (Gruppe .about-page-body): EXAKT wie die Rechtstext-Seiten.
   760px Textspalte + 24px Seitenrand (max-width 808 = 760 + 2×24), Absätze erben
   die globale p-Schrift, damit Einrückung UND Schrift identisch sind. */
.about-page-body{ max-width: 832px; margin: 0 auto; padding: 70px 36px 90px; }

/* EINHEITLICHER Fließtext-Standard: exakt wie der Buch-Body (1,15rem / 1,7 / ink-2).
   Gilt für Über-mich, alle Rechtstext-Seiten und Blog-Beiträge, damit normale
   Texte überall gleich aussehen. Design-Sektionen mit eigener Größe bleiben unberührt. */
.about-page-body p,
.lg-rechtstext p,
.blog-single .wp-block-post-content p{
  font-size: 1.15rem; line-height: 1.7; color: var(--ink-2);
}
.about-body h2 .red{ color: var(--red); }
.about-body .pull{
  font-family: 'Bebas Neue', sans-serif; font-size: 2.2rem;
  color: var(--ink); line-height: 1.2; letter-spacing: .01em;
  text-align: center; padding: 40px 0;
  border-top: 2px solid var(--red); border-bottom: 2px solid var(--red);
  margin: 50px 0;
}

.press-kit{ padding: 100px 0; background: var(--ink); color: var(--white); }
.press-kit .wrap{ text-align: center; }
.press-kit h2{ color: var(--white); margin: 16px 0 18px; }
.press-kit h2 .red{ color: var(--red); }
.press-kit > .wrap > p{ color: rgba(255,255,255,.7); max-width: 580px; margin: 0 auto 40px; }
.press-kit-grid{ display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; margin-top: 40px; }
@media (max-width: 800px){ .press-kit-grid{ grid-template-columns: 1fr; } }
.press-kit-card{
  background: rgba(255,255,255,.05); border: 1px solid rgba(255,255,255,.15);
  padding: 36px 28px; text-align: left; transition: all .25s;
}
.press-kit-card:hover{ border-color: var(--red); transform: translateY(-4px); }
.press-kit-card h4{ color: var(--white); margin-bottom: 8px; font-size: 1.4rem; }
.press-kit-card p{ color: rgba(255,255,255,.6); font-size: .9rem; margin-bottom: 18px; }
.press-kit-card a{
  display: inline-flex; align-items: center; gap: 8px;
  color: var(--red); font-size: .78rem; letter-spacing: .15em;
  text-transform: uppercase; font-weight: 700;
}

/* ===== BESTELLFORMULAR – Mockup-Layout ===== */
/* Top-Sektion: Bücher links, Live-Übersicht rechts */
.order-top{ padding: 30px 0 60px; background: var(--off-white); }
.order-top .wrap{
  display: grid; grid-template-columns: 1.3fr 1fr; gap: 60px; align-items: start;
}
@media (max-width: 1000px){ .order-top .wrap{ grid-template-columns: 1fr; gap: 40px; } }

.order-picker h2{ font-size: clamp(2.2rem, 4vw, 3.2rem); line-height: 1.05; }

.book-picks{
  display: grid; grid-template-columns: repeat(2, 1fr); gap: 18px;
}
@media (max-width: 700px){ .book-picks{ grid-template-columns: 1fr; } }

.book-pick{
  position: relative; cursor: pointer; user-select: none;
  background: var(--white); border: 2px solid var(--line);
  padding: 20px; display: grid; grid-template-columns: 90px 1fr; gap: 18px;
  align-items: center; transition: all .25s;
}
.book-pick:hover{ border-color: var(--red); transform: translateY(-2px); box-shadow: 8px 8px 0 rgba(129,34,47,.12); }
.book-pick.is-selected{ border-color: var(--red); background: #fff; box-shadow: 8px 8px 0 var(--red); }
.book-pick img{ width: 90px; height: 130px; object-fit: cover; box-shadow: 0 10px 20px -8px rgba(0,0,0,.25); }
.book-pick-info h4{ font-family: 'Bebas Neue', sans-serif; font-size: 1.4rem; letter-spacing: .04em; margin: 0 0 4px; }
.book-pick-info small{ display: block; font-size: .82rem; color: var(--ink-3); margin-bottom: 8px; }
.book-pick-price{ font-weight: 700; color: var(--red); font-size: 1rem; }
.book-pick-tick{
  position: absolute; top: 12px; right: 12px;
  width: 26px; height: 26px; border-radius: 50%;
  background: var(--red); color: var(--white);
  display: flex; align-items: center; justify-content: center;
  font-size: .85rem; font-weight: 700;
  opacity: 0; transform: scale(.6); transition: all .2s;
}
.book-pick.is-selected .book-pick-tick{ opacity: 1; transform: scale(1); }

/* Live-Übersicht (Sticky-Karte rechts) */
.order-summary-card{
  background: var(--ink); color: var(--white);
  padding: 36px 32px; position: sticky; top: 100px;
  box-shadow: 12px 12px 0 var(--red);
}
.order-summary-card .stamp{
  position: absolute; top: -14px; right: 20px;
  background: var(--red); color: var(--white);
  font-family: 'Caveat', cursive; font-size: 1.15rem;
  padding: 4px 14px; transform: rotate(-3deg);
}
.order-summary-card h3{ color: var(--white); font-size: 1.8rem; letter-spacing: .03em; }
.order-summary-card .eyebrow{ color: rgba(255,255,255,.7); }

.summary-list{
  border-top: 1px solid rgba(255,255,255,.15);
  border-bottom: 1px solid rgba(255,255,255,.15);
  margin: 0 0 18px; padding: 16px 0;
  min-height: 60px;
}
.summary-empty{ color: rgba(255,255,255,.5); font-style: italic; font-size: .92rem; margin: 0; }
.summary-item{
  display: flex; justify-content: space-between; gap: 16px;
  padding: 8px 0; font-size: .95rem;
}
.summary-item .title{ color: var(--white); }
.summary-item .price{ color: rgba(255,255,255,.85); white-space: nowrap; }

.summary-row{
  display: flex; justify-content: space-between; gap: 16px;
  padding: 10px 0; font-size: .92rem; color: rgba(255,255,255,.85);
}
.summary-row.total{
  font-family: 'Bebas Neue', sans-serif; font-size: 1.9rem;
  padding-top: 18px; margin-top: 8px;
  border-top: 2px solid var(--red);
  color: var(--red); letter-spacing: .04em;
}
.summary-row.total .label{ color: var(--white); }

.summary-features{
  list-style: none; margin: 24px 0 0; padding: 18px 0 0;
  border-top: 1px solid rgba(255,255,255,.12);
  font-size: .82rem; color: rgba(255,255,255,.7);
}
.summary-features li{ padding: 4px 0; }

/* Fluent Form: Felder mit Klasse .ff-hide-on-public verstecken
   (Buchauswahl + Gesamtbetrag — werden vom JS oben dynamisch gefüllt) */
.fluentform .ff-hide-on-public,
.fluentform .ff-el-group.ff-hide-on-public{
  position: absolute !important; left: -9999px !important;
  top: -9999px !important;
  width: 1px !important; height: 1px !important;
  overflow: hidden !important; opacity: 0 !important;
  pointer-events: none !important;
}

/* ===== BESTELLFORMULAR – Form unten ===== */
.order-page{ padding: 40px 0 120px; background: var(--off-white); }
.order-page .wrap-tight{ max-width: 900px; }
.order-form{
  background: var(--white); padding: 50px 50px;
  box-shadow: 16px 16px 0 var(--red);
}
.order-form h2{ font-size: 2.6rem; margin-bottom: 8px; }
.order-form > p{ color: var(--ink-3); margin-bottom: 36px; font-size: 1rem; }
.fieldset{ margin-bottom: 36px; }
.fieldset-legend{
  font-family: 'Bebas Neue', sans-serif; font-size: 1.3rem;
  letter-spacing: .08em; padding-bottom: 14px; margin-bottom: 24px;
  border-bottom: 2px solid var(--red); display: flex; align-items: center; gap: 12px;
}
.fieldset-legend .step-num{
  background: var(--red); color: var(--white); width: 32px; height: 32px;
  display: flex; align-items: center; justify-content: center;
  font-size: 1rem; letter-spacing: 0;
}
.book-select{ display: grid; grid-template-columns: repeat(2, 1fr); gap: 14px; }
@media (max-width: 600px){ .book-select{ grid-template-columns: 1fr; } }
.book-option{
  position: relative; border: 2px solid var(--line); padding: 18px;
  cursor: pointer; transition: all .2s;
  display: grid; grid-template-columns: 60px 1fr; gap: 16px; align-items: center;
}
.book-option:hover{ border-color: var(--red); }
.book-option input{ position: absolute; opacity: 0; }
.book-option input:checked + .book-option-inner{ }
.book-option:has(input:checked){ border-color: var(--red); background: rgba(220,20,20,.04); }
.book-option img{ width: 60px; height: 90px; object-fit: contain; }
.book-option-info strong{ display: block; font-family: 'Bebas Neue', sans-serif; font-size: 1.2rem; letter-spacing: .04em; }
.book-option-info small{ font-size: .8rem; color: var(--ink-3); display: block; margin-top: 2px; }
.book-option-info .price{ display: inline-block; margin-top: 6px; font-weight: 700; color: var(--red); font-size: .9rem; }

.field{ margin-bottom: 18px; }
.field label{ display: block; font-size: .72rem; letter-spacing: .2em; text-transform: uppercase; font-weight: 700; color: var(--ink-2); margin-bottom: 8px; }
.field input, .field select, .field textarea{
  width: 100%; padding: 14px 16px;
  background: var(--off-white); border: 2px solid var(--line);
  font-family: 'Inter', sans-serif; font-size: 1rem; color: var(--ink);
  transition: all .2s;
}
.field input:focus, .field select:focus, .field textarea:focus{
  outline: none; border-color: var(--red); background: var(--white);
}
.field textarea{ resize: vertical; min-height: 100px; }
.field-row{ display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
@media (max-width: 600px){ .field-row{ grid-template-columns: 1fr; } }
.field-row.third{ grid-template-columns: 1fr 2fr; }
@media (max-width: 600px){ .field-row.third{ grid-template-columns: 1fr; } }
.radio-group{ display: flex; gap: 12px; flex-wrap: wrap; }
.radio-option{
  flex: 1; min-width: 140px; border: 2px solid var(--line); padding: 14px;
  cursor: pointer; transition: all .2s; text-align: center;
  position: relative;
}
.radio-option:hover{ border-color: var(--red); }
.radio-option input{ position: absolute; opacity: 0; }
.radio-option:has(input:checked){ border-color: var(--red); background: rgba(220,20,20,.04); }
.radio-option strong{ display: block; font-family: 'Bebas Neue', sans-serif; font-size: 1.1rem; letter-spacing: .04em; }
.radio-option small{ font-size: .8rem; color: var(--ink-3); display: block; margin-top: 4px; }

.checkbox-row{ display: flex; align-items: flex-start; gap: 12px; margin-bottom: 14px; font-size: .9rem; color: var(--ink-2); line-height: 1.5; }
.checkbox-row input{ margin-top: 4px; flex-shrink: 0; accent-color: var(--red); width: 16px; height: 16px; }
.checkbox-row a{ color: var(--red); text-decoration: underline; }

/* Order Summary Sidebar */
.order-summary{ background: var(--ink); color: var(--white); padding: 40px 36px; position: sticky; top: 100px; }
.order-summary h3{ color: var(--white); font-size: 1.6rem; margin-bottom: 20px; padding-bottom: 16px; border-bottom: 2px solid var(--red); }
.order-summary-row{ display: flex; justify-content: space-between; padding: 14px 0; border-bottom: 1px solid rgba(255,255,255,.15); font-size: .95rem; }
.order-summary-row.total{ font-family: 'Bebas Neue', sans-serif; font-size: 2rem; padding-top: 24px; border-bottom: none; color: var(--red); letter-spacing: .04em; }
.order-summary-row.total .label{ color: var(--white); }
.order-summary-note{ font-size: .8rem; color: rgba(255,255,255,.5); margin-top: 20px; line-height: 1.5; }

/* ===== KONTAKT ===== */
.contact-page{ padding: 80px 0 120px; background: var(--off-white); }
.contact-page .wrap{ display: grid; grid-template-columns: 1fr 1.3fr; gap: 80px; align-items: start; }
@media (max-width: 1000px){ .contact-page .wrap{ grid-template-columns: 1fr; gap: 50px; } }
.contact-info h2{ font-size: 3rem; margin: 16px 0 26px; }
.contact-info h2 .red{ color: var(--red); }
.contact-info p{ color: var(--ink-2); font-size: 1.05rem; margin-bottom: 18px; }
.contact-info-list{ list-style: none; margin-top: 36px; }
.contact-info-list li{
  display: grid; grid-template-columns: 50px 1fr; gap: 20px;
  padding: 22px 0; border-bottom: 1px solid var(--line); align-items: center;
}
.contact-info-list .icon{
  background: var(--red); color: var(--white); width: 50px; height: 50px;
  display: flex; align-items: center; justify-content: center;
  font-size: 1.4rem; font-weight: 700;
}
.contact-info-list strong{ display: block; font-family: 'Bebas Neue', sans-serif; font-size: 1.2rem; letter-spacing: .04em; }
.contact-info-list small{ font-size: .9rem; color: var(--ink-3); }
.contact-form{
  background: var(--white); padding: 50px;
  box-shadow: 16px 16px 0 var(--red);
}
.contact-form h3{ margin-bottom: 8px; }
.contact-form > p{ color: var(--ink-3); margin-bottom: 32px; font-size: .98rem; }

/* ===== HELPER ===== */
.text-center{ text-align: center; }
.mt-0{ margin-top: 0 !important; }
.mb-0{ margin-bottom: 0 !important; }

/* =====================================================
   WordPress-spezifische Ergänzungen
   ===================================================== */

/* Reset für WP Group/Section */
.wp-block-group{ box-sizing: border-box; }
.front-page{ padding: 0 !important; }

/* Blog Single */
.blog-single .wp-block-post-title{
  font-family: 'Bebas Neue', sans-serif;
  font-size: clamp(2.4rem, 5vw, 4.5rem);
  line-height: 1.05;
  letter-spacing: 0.01em;
  text-transform: uppercase;
  color: var(--ink);
}
.blog-single{ padding-left: 36px; padding-right: 36px; }
.blog-single .wp-block-post-content > *{
  margin-bottom: 1.4em;
  font-size: 1.1rem;
  line-height: 1.7;
  color: var(--ink-2);
}
.blog-single .wp-block-post-content > p:first-of-type::first-letter{
  font-family: 'Bebas Neue', sans-serif;
  font-size: 5rem;
  color: var(--red);
  float: left;
  line-height: 0.85;
  padding: 8px 14px 0 0;
}
.blog-single .wp-block-post-content h2{
  font-size: 2.4rem; margin: 1.5em 0 .5em;
}
.blog-single .wp-block-post-content h3{
  font-size: 1.8rem; margin: 1.5em 0 .5em;
}
.blog-single .wp-block-post-content blockquote{
  font-family: 'Bebas Neue', sans-serif;
  font-size: 2rem;
  line-height: 1.2;
  letter-spacing: 0.01em;
  color: var(--ink);
  text-align: center;
  border-top: 2px solid var(--red);
  border-bottom: 2px solid var(--red);
  padding: 40px 0;
  margin: 50px 0;
}
.blog-single .wp-block-post-featured-image img{
  width: 100%; height: auto;
  box-shadow: 0 30px 60px -15px rgba(0,0,0,.3);
}
.blog-single .wp-block-post-terms a{
  color: var(--red); font-weight: 700;
  text-transform: uppercase; letter-spacing: 0.25em;
  font-size: 0.78rem;
}

/* Autorenbox */
/* Related Posts Sektion (unter Blog-Single) */
.related-posts{
  background: var(--off-white);
  padding: 80px 0 60px;
  border-top: 1px solid var(--line);
}
.related-head{ text-align: center; margin-bottom: 50px; }
.related-head h2{ font-size: clamp(2rem, 4vw, 3rem); margin-top: 12px; }
.related-grid{
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 30px;
}
@media (max-width: 900px){ .related-grid{ grid-template-columns: 1fr; max-width: 480px; margin: 0 auto; } }
.related-card{
  display: block; text-decoration: none;
  background: var(--white); color: var(--ink);
  transition: transform .3s, box-shadow .3s;
  box-shadow: 0 4px 12px -4px rgba(0,0,0,.1);
}
.related-card:hover{
  transform: translateY(-6px);
  box-shadow: 0 18px 36px -10px rgba(0,0,0,.2), 8px 8px 0 var(--red);
}
.related-card-img{
  aspect-ratio: 16/10; overflow: hidden;
  background: var(--off-white);
}
.related-card-img img{
  width: 100%; height: 100%; object-fit: cover;
  transition: transform .5s;
}
.related-card:hover .related-card-img img{ transform: scale(1.05); }
.related-card-body{ padding: 24px; }
.related-card-cat{
  display: inline-block; color: var(--red);
  font-size: .68rem; letter-spacing: .25em;
  text-transform: uppercase; font-weight: 700; margin-bottom: 8px;
}
.related-card h3{
  font-size: 1.4rem; line-height: 1.15;
  margin: 0 0 12px; color: var(--ink);
}
.related-card small{
  font-size: .8rem; color: var(--ink-3);
  letter-spacing: .12em; text-transform: uppercase;
}

/* Autorenbox auf Single-Post: gleiche max-width wie Content */
.blog-single + .author-box,
.blog-single .author-box{
  margin: 40px 0 0;
}

.author-box{
  background: var(--ink); color: var(--white);
  padding: 50px 40px; margin: 60px 0 40px;
  position: relative; overflow: hidden;
  box-shadow: 12px 12px 0 var(--red);
}
.author-box-inner{
  display: grid; grid-template-columns: 160px 1fr; gap: 36px;
  align-items: center;
}
@media (max-width: 700px){ .author-box-inner{ grid-template-columns: 1fr; text-align: center; } }
.author-box-photo{
  width: 160px; height: 160px;
  background: var(--ink-2);
  display: flex; align-items: center; justify-content: center;
  border: 2px solid var(--red);
}
@media (max-width: 700px){ .author-box-photo{ margin: 0 auto; } }
.author-box-photo img{ width: 100%; height: 100%; object-fit: cover; }
.author-box-content h3{ color: var(--white); font-size: 2rem; margin: 12px 0 14px; }
.author-box-content p{ color: rgba(255,255,255,.75); margin-bottom: 24px; font-size: 1rem; line-height: 1.6; }
.author-box-links{ display: flex; gap: 12px; flex-wrap: wrap; }
@media (max-width: 700px){ .author-box-links{ justify-content: center; } }
.author-box .btn-outline{ border-color: var(--white); color: var(--white); }
.author-box .btn-outline:hover{ background: var(--white); color: var(--ink); }

/* WP-eigene Buttons sollten unsere Klassen erben können */
.wp-block-button .wp-block-button__link.btn-red{ background: var(--red); color: var(--white); }
.wp-block-button .wp-block-button__link.btn-ink{ background: var(--ink); color: var(--white); }

/* Blog-Übersicht */
.wp-block-query .wp-block-post-title a{
  font-family: 'Bebas Neue', sans-serif;
  font-size: 2rem;
  line-height: 1.05;
  color: var(--ink);
  text-transform: uppercase;
  transition: color .2s;
}
.wp-block-query .wp-block-post-title a:hover{ color: var(--red); }
.wp-block-query .wp-block-post-date{
  font-size: 0.78rem; letter-spacing: 0.2em;
  text-transform: uppercase; color: var(--ink-3);
  font-weight: 600; margin: 8px 0 14px;
}
.wp-block-query .wp-block-post-excerpt p{
  color: var(--ink-2); font-size: 1rem;
}
.wp-block-query-pagination{ margin-top: 60px; gap: 14px; }
.wp-block-query-pagination a, .wp-block-query-pagination span{
  padding: 10px 18px; border: 1px solid var(--line);
  font-weight: 700; font-size: .9rem;
  letter-spacing: .1em; text-transform: uppercase;
  transition: all .2s;
}
.wp-block-query-pagination a:hover, .wp-block-query-pagination .current{
  background: var(--red); color: var(--white); border-color: var(--red);
}

/* Search */
.wp-block-search__inside-wrapper{
  border: 2px solid var(--line);
  max-width: 480px; margin: 30px auto 0;
}
.wp-block-search__input{
  border: none; padding: 14px 18px;
  font-family: 'Inter', sans-serif; font-size: 1rem;
  background: var(--white);
}
.wp-block-search__button{
  background: var(--red); color: var(--white);
  border: none; padding: 14px 24px;
  font-weight: 700; letter-spacing: .1em; text-transform: uppercase;
  font-size: 0.85rem; cursor: pointer;
}
.wp-block-search__button:hover{ background: var(--ink); }

/* =====================================================
   FIXES v0.2.4
   ===================================================== */

/* Buch-Cards: gleiche Höhe für "Mehr erfahren" via Flexbox */
.book-card{ display: flex; flex-direction: column; }
.book-card-cover{ flex-shrink: 0; }
.book-card .genre{ flex-shrink: 0; }
.book-card h3{ flex-shrink: 0; }
.book-card .sub{ flex: 1 1 auto; min-height: 0; }  /* nimmt restliche Höhe ein */
.book-card .read-more{ flex-shrink: 0; align-self: flex-start; }

/* Hero-Hintergrund-Zahl: nicht clippen, breitere Sichtbarkeit */
.hero{ overflow: visible; }
.hero-bg-num{
  left: -1%;
  bottom: -8%;
  font-size: clamp(24rem, 45vw, 50rem);
  letter-spacing: -.05em;
  white-space: nowrap;
  opacity: .055;
}

/* AlignFull-Groups: kein Block-Gap zwischen Sektionen (weißer Streifen) */
.front-page > .wp-block-group.alignfull,
main > .wp-block-group.alignfull,
.wp-site-blocks > main > .wp-block-group{
  margin-block-start: 0 !important;
  margin-block-end: 0 !important;
}
.front-page .wp-block-group,
.front-page > .wp-block-group.alignfull{
  padding: 0 !important;
}
/* Patterns enthalten ihren eigenen <section> mit Hintergrundfarbe — keine outer wrappers */
.front-page section,
main section{
  margin: 0 !important;
}

/* Page-Layout: bereits über main.section gepflegt, sicherstellen dass body keine weißen Lücken erzwingt */
.wp-site-blocks{ background: var(--off-white); }
body.has-default-spacing > * + *{ margin-block-start: 0 !important; }

/* Mobile Nav: nochmal Sicherheit auf < 1100px (lange Nav-Items) */
@media (max-width: 1100px){
  .nav-links{ gap: 22px; font-size: .78rem; }
}

/* =====================================================
   BLOG ARCHIVE (Übersichtsseite)
   ===================================================== */
.blog-archive .wrap-blog{ max-width: 1200px; margin: 0 auto; padding: 0 36px; }

.blog-archive-hero{
  padding: 80px 0 60px; background: var(--off-white);
  position: relative; overflow: hidden;
  border-bottom: 1px solid var(--line);
}
.blog-archive-hero::before{
  content:""; position: absolute; left:0; right:0; top:0; height:1px;
  background: linear-gradient(90deg, transparent, var(--red), transparent);
}
.blog-archive-hero h1{ font-size: clamp(3rem, 7vw, 5.5rem); margin: 18px 0 20px; }
.blog-archive-hero p{ color: var(--ink-3); max-width: 580px; font-size: 1.1rem; }

.blog-archive-body{ background: var(--off-white); padding: 80px 0 120px !important; }
.blog-archive-body > .wp-block-query{ max-width: 1200px; margin: 0 auto; padding: 0 36px; }

/* Grid: 3 Spalten Desktop, 2 Tablet, 1 Mobile */
.blog-archive-body .wp-block-post-template{
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 50px 36px;
  list-style: none;
  margin: 0; padding: 0;
}
@media (max-width: 1000px){ .blog-archive-body .wp-block-post-template{ grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 640px){ .blog-archive-body .wp-block-post-template{ grid-template-columns: 1fr; max-width: 420px; margin: 0 auto; } }

.blog-card{
  background: var(--white); border: 1px solid var(--line);
  padding: 0; overflow: hidden;
  transition: transform .3s cubic-bezier(.2,.8,.2,1), box-shadow .3s, border-color .3s;
  display: flex !important; flex-direction: column;
}
.blog-card:hover{
  transform: translateY(-6px);
  box-shadow: 0 24px 50px -18px rgba(0,0,0,.25);
  border-color: var(--red);
}
.blog-card .wp-block-post-featured-image{
  margin: 0 0 0 0 !important;
  aspect-ratio: 3/2; overflow: hidden;
}
.blog-card .wp-block-post-featured-image img{
  width: 100%; height: 100%; object-fit: cover;
  transition: transform .5s ease;
}
.blog-card:hover .wp-block-post-featured-image img{ transform: scale(1.05); }
.blog-card .wp-block-post-terms{
  display: block; margin: 24px 28px 8px !important;
  font-size: .7rem; letter-spacing: .25em; text-transform: uppercase;
  color: var(--red); font-weight: 700;
}
.blog-card .wp-block-post-terms a{ color: var(--red); }
.blog-card .wp-block-post-title{
  margin: 0 28px 8px !important;
  font-family: 'Bebas Neue', sans-serif;
  font-size: 1.7rem; line-height: 1.05;
  letter-spacing: .01em;
}
.blog-card .wp-block-post-title a{ color: var(--ink); transition: color .2s; }
.blog-card:hover .wp-block-post-title a{ color: var(--red); }
.blog-card .wp-block-post-date{
  margin: 0 28px 14px !important;
  font-size: .75rem; letter-spacing: .18em; text-transform: uppercase;
  color: var(--ink-3); font-weight: 600;
}
.blog-card .wp-block-post-excerpt{
  margin: 0 28px 28px !important; flex: 1 1 auto;
  display: flex; flex-direction: column;
}
.blog-card .wp-block-post-excerpt__excerpt{
  font-size: 0.95rem; color: var(--ink-2); line-height: 1.6;
  margin-bottom: 16px !important; flex: 1 1 auto;
}
.blog-card .wp-block-post-excerpt__more-link{
  font-size: .78rem; letter-spacing: .18em; text-transform: uppercase;
  font-weight: 700; color: var(--ink);
  border-bottom: 2px solid var(--red); padding-bottom: 4px;
  align-self: flex-start;
  transition: color .2s;
}
.blog-card:hover .wp-block-post-excerpt__more-link{ color: var(--red); }

/* =====================================================
   FLUENT FORMS — Look an Theme angleichen
   ===================================================== */
.fluentform .ff-el-input--label label,
.fluentform .ff-el-group label{
  font-family: 'Inter', sans-serif !important;
  font-size: .78rem !important;
  letter-spacing: .15em;
  text-transform: uppercase;
  font-weight: 700;
  color: var(--ink-2) !important;
  margin-bottom: 8px !important;
}
.fluentform input[type="text"],
.fluentform input[type="email"],
.fluentform input[type="tel"],
.fluentform input[type="number"],
.fluentform select,
.fluentform textarea{
  background: var(--off-white) !important;
  border: 2px solid var(--line) !important;
  padding: 14px 16px !important;
  font-family: 'Inter', sans-serif !important;
  font-size: 1rem !important;
  color: var(--ink) !important;
  border-radius: 0 !important;
  transition: border-color .2s, background .2s !important;
  box-shadow: none !important;
}
.fluentform input:focus,
.fluentform select:focus,
.fluentform textarea:focus{
  border-color: var(--red) !important;
  background: var(--white) !important;
  outline: none !important;
}
.fluentform .ff-btn-submit{
  background: var(--red) !important;
  color: var(--white) !important;
  font-family: 'Inter', sans-serif !important;
  font-weight: 700 !important;
  font-size: .85rem !important;
  letter-spacing: .15em !important;
  text-transform: uppercase !important;
  padding: 18px 32px !important;
  border: none !important;
  border-radius: 0 !important;
  transition: all .25s !important;
  cursor: pointer;
}
.fluentform .ff-btn-submit:hover{
  background: var(--ink) !important;
  transform: translateY(-2px);
  box-shadow: 0 12px 30px -8px rgba(129,34,47,.45);
}
.fluentform .ff-el-group{ margin-bottom: 20px !important; }
.fluentform .ff_gdpr_label{ font-size: .9rem; color: var(--ink-2); line-height: 1.5; }
.fluentform .ff-el-input--label .ff-el-form-required{ color: var(--red) !important; }
.ff-message-success{
  background: rgba(31,93,95,.1) !important;
  border-left: 4px solid var(--red) !important;
  color: var(--ink) !important;
  padding: 20px !important;
  font-size: 1rem !important;
}

/* =====================================================
   SIGNIERT-BESTELLUNG OVERRIDE — Form-Sektion eigenständig
   ===================================================== */
.order-page{ padding: 100px 0 140px; background: var(--off-white); }
.order-page .wrap-tight{ display: block; }
.order-page .order-form{
  background: var(--white);
  padding: 60px 50px;
  box-shadow: 20px 20px 0 var(--red);
  border: 1px solid var(--line);
}
@media (max-width: 700px){
  .order-page{ padding: 70px 0 90px; }
  .order-page .order-form{ padding: 40px 28px; box-shadow: 12px 12px 0 var(--red); }
}
.order-page .order-form h2{ font-size: clamp(2.4rem, 5vw, 4rem); }
.order-page .order-form > p{ color: var(--ink-2); font-size: 1.05rem; }

/* Fluent Form Spacing innerhalb Bestellformular */
.order-form .fluentform{ }
.order-form .fluentform .ff-el-group{ margin-bottom: 26px !important; }

/* Buchauswahl & Versand-Auswahl optisch hervorheben */
.order-form .fluentform .ff-el-form-check{
  display: flex; align-items: center; gap: 12px;
  padding: 12px 16px !important; margin-bottom: 8px !important;
  border: 1px solid var(--line); background: var(--off-white);
  transition: all .2s;
  cursor: pointer;
}
.order-form .fluentform .ff-el-form-check:hover{ border-color: var(--red); }
.order-form .fluentform .ff-el-form-check label{
  font-family: 'Inter', sans-serif !important;
  font-size: 1rem !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
  font-weight: 500 !important;
  color: var(--ink) !important;
  margin: 0 !important;
}
.order-form .fluentform .ff-el-form-check input[type="checkbox"],
.order-form .fluentform .ff-el-form-check input[type="radio"]{
  accent-color: var(--red);
  width: 18px; height: 18px;
}

/* Gesamtbetrag-Feld: groß und prominent */
.order-form .fluentform input[name="numeric_field"]{
  font-family: 'Bebas Neue', sans-serif !important;
  font-size: 2.4rem !important;
  color: var(--red) !important;
  text-align: center;
  background: var(--off-white) !important;
  border: 2px solid var(--red) !important;
  font-weight: 400 !important;
  letter-spacing: .04em !important;
  padding: 20px !important;
}

/* Submit-Button auf voller Breite + groß */
.order-form .fluentform .ff-btn-submit{
  width: 100% !important;
  padding: 22px !important;
  font-size: 1rem !important;
  margin-top: 20px !important;
}

/* =====================================================
   MOBILE-OPTIMIERUNGEN (v0.6.1)
   ===================================================== */

/* Reduced Motion: alle dauerhaften Animationen pausieren */
@media (prefers-reduced-motion: reduce){
  .announce-track,
  .coming-hero-bg,
  .hero-sticker,
  .book-hero-release-badge,
  .reveal{ animation: none !important; transition: none !important; }
  .reveal{ opacity: 1 !important; transform: none !important; }
}

/* Announce-Bar auf Mobile schmaler */
@media (max-width: 700px){
  .announce{ font-size: .6rem; letter-spacing: .05em; padding: 8px 0; }
  .announce-track{ gap: 36px; }
  .announce-track span::after{ margin-left: 36px; }
}

/* Hero auf Mobile entzerren */
@media (max-width: 700px){
  .hero{ padding: 40px 0 60px; }
  .hero .wrap{ gap: 40px; min-height: auto; }
  .hero-headline{ font-size: clamp(2.4rem, 10vw, 4rem); }
  .hero-pitch{ font-size: 1rem; margin-bottom: 28px; }
  .hero-stats{ gap: 24px; margin-top: 40px; padding-top: 24px; flex-wrap: wrap; }
  .hero-stats .num{ font-size: 2rem; }
  /* H1-Pill auf Mobile: volle Breite, Text in EINER Zeile (vw-skaliert, kein Umbruch) */
  h1.hero-tag, .hero-tag{
    display: block; width: 100%; box-sizing: border-box;
    text-align: center;
    font-size: clamp(.5rem, 3vw, .72rem); letter-spacing: .04em;
    padding: 12px 10px;
    line-height: 1.2; margin-bottom: 22px;
    white-space: nowrap; overflow: hidden;
  }
  .hero-format-line{
    font-size: .68rem; letter-spacing: .12em; gap: 8px; margin-bottom: 18px;
  }
  .hero-sticker{ width: 90px; height: 90px; top: -10px; right: -10px; }
  .hero-sticker .big{ font-size: 1.4rem; }
  .hero-sticker .top, .hero-sticker .bot{ font-size: .6rem; }
}

/* Page-Hero (z.B. Signiert, Termine, Kontakt) auf Mobile */
@media (max-width: 700px){
  .page-hero{ padding: 50px 0 30px; }
  .page-hero h1{ font-size: clamp(2.9rem, 11vw, 4rem); margin: 14px 0; }
  .page-hero p{ font-size: .95rem; }
}

/* Mobil: Design-Sektions-H2 kleiner halten als die Hero-H1, damit die H1 auf
   Unterseiten erkennbar die größte Überschrift bleibt. Greift NICHT auf
   .hero-headline (eigene Größe) und nicht auf h2.wp-block-heading (Gutenberg). */
@media (max-width: 700px){
  h2{ font-size: clamp(1.9rem, 6vw, 2.5rem); }
  .contact-info h2{ font-size: clamp(1.9rem, 6vw, 2.5rem); }

  /* /buecher/: die H2 ist hier der eigentliche Seiten-Titel (kein Sektions-Header)
     und soll wie eine Hero-H1 erkennbar groß sein, nicht von der globalen
     Mobil-h2-Reduktion oben mitverkleinert werden. */
  .page-id-73 .books-head h2{ font-size: clamp(2.9rem, 11vw, 4rem); }
  .page-id-73 .books-head{ margin-bottom: 48px; }

  /* Über-mich: zu große Abstände zwischen Hero und Body reduzieren,
     Quote als lesbaren Untertitel statt Riesen-Überschrift. */
  .about-page-hero{ padding: 40px 0 24px; }
  .about-page-body{ padding: 24px 36px 50px; }
  .about-page-quote{ font-size: 1.3rem; padding-left: 16px; margin-bottom: 24px; }
}

/* Buch-Detail-Hero auf Mobile */
@media (max-width: 700px){
  .book-hero{ padding: 30px 0 50px; }
  .book-hero h1{ font-size: clamp(2.9rem, 11vw, 4.2rem); margin-bottom: 12px; }
  .book-hero .subtitle{ font-size: 1.2rem; margin-bottom: 20px; }
  .book-hero-pitch{ font-size: 1rem; margin-bottom: 24px; }
  .book-hero-meta{ gap: 8px; margin-bottom: 16px; }
  .book-hero-meta .tag{ padding: 4px 10px; font-size: .62rem; }
  .book-hero-ctas .btn{ width: 100%; justify-content: center; }
}

/* Coming-Hero auf Mobile */
@media (max-width: 700px){
  .coming-hero{ padding: 40px 0 60px; }
  .coming-hero h1{ font-size: clamp(2.9rem, 11vw, 4rem); }
  .coming-hero-lead{ font-size: 1.2rem; }
  .coming-hero-bg{ font-size: clamp(4rem, 14vw, 8rem); }
  .coming-hero-eta{ width: 100%; justify-content: space-between; }
  .coming-hero-ctas .btn{ width: 100%; justify-content: center; }
}

/* CTA-Buttons auf Mobile: volle Breite für bessere Touch-Targets */
@media (max-width: 600px){
  .hero-ctas{ flex-direction: column; align-items: stretch; gap: 14px; }
  .hero-ctas .btn{ width: 100%; justify-content: center; }
  .book-hero-ctas, .coming-hero-ctas{ flex-direction: column; gap: 14px; }
  .btn{ padding: 14px 22px; font-size: .78rem; }
}

/* Section-Padding auf Mobile reduzieren — generelle Faustregel */
@media (max-width: 700px){
  .books, .signed, .newsletter, .events, .quotes-strip, .feature, .coming{ padding-top: 60px; padding-bottom: 60px; }
  .feature h2, .signed h2, .newsletter h2, .books h2, .coming h2{ font-size: clamp(2rem, 8vw, 3.2rem); }
  /* Feature-Cover auf Mobile deutlich kleiner, sonst klatscht es an den Rand und überlappt */
  .feature-cover{ max-width: 220px !important; }
  .feature-cover::before{ top: 20px; right: -16px; bottom: -16px; left: 20px; }
  .feature .wrap{ gap: 36px !important; padding: 0 24px; }
  /* Feature-BG-Text auf Mobile schmaler/dezenter */
  .feature-bg-text{ font-size: clamp(8rem, 30vw, 16rem); }
}

/* Coming-Soon-Sektion auf Startseite: Mystery-Cover schmaler */
@media (max-width: 700px){
  .coming-cover-mystery{ max-width: 280px; margin: 0 auto; }
  .coming-form{ flex-direction: column; gap: 8px; }
  .coming-form input, .coming-form button{ width: 100%; }
}

/* Newsletter-CTA auf Mobile: Formular gestackt */
@media (max-width: 600px){
  .nl-form{ flex-direction: column; gap: 10px; }
  .nl-form input, .nl-form button{ width: 100%; }
}

/* Bestellseite: Order-Summary darf Sticky raus auf Mobile (sonst überlappt) */
@media (max-width: 1000px){
  .order-summary-card{ position: static !important; }
}

/* Bestellseite: Book-Picks Padding & Cover-Größe optimieren */
@media (max-width: 700px){
  .book-pick{ grid-template-columns: 70px 1fr; gap: 14px; padding: 14px; }
  .book-pick img{ width: 70px; height: 100px; }
}

/* Buch-Hero-Release-Badge auf Mobile etwas kleiner */
@media (max-width: 700px){
  .book-hero-release-badge{ width: 100px; height: 100px; top: -8px; right: 5px; }
  .book-hero-release-badge small{ font-size: .6rem; }
  .book-hero-release-badge strong{ font-size: .95rem; }
}

/* Body horizontal-overflow safety net (verhindert horizontale Scrollbars) */
html, body{ overflow-x: hidden; max-width: 100%; }

/* Sticky-Nav darf nicht zu hoch werden auf Mobile (Platz für Burger) */
@media (max-width: 900px){
  nav .wrap{ padding-top: 12px; padding-bottom: 12px; }
  .logo img{ width: 48px; height: 48px; }
  .logo-text{ font-size: 1.3rem; }
}

/* Tabbar-große Touch-Targets im Mobile-Menu */
.mobile-menu-links a{ min-height: 48px; display: flex; align-items: center; }

/* =====================================================
   v0.6.2 Mobile-Refinements
   ===================================================== */

/* Mobile-Menu: kein horizontaler Scroll, Body komplett gesperrt wenn offen */
.mobile-menu{ overflow-x: hidden; }
body.menu-open{
  overflow: hidden !important;
  position: fixed !important;
  width: 100% !important;
  height: 100%;
}

/* Hero-Headline (H2 „20 Menschen…") auf Mobile: kleiner, damit "20 Tage" nicht umbricht.
   WICHTIG: .hero-headline (nicht .hero h1) — sonst trifft es die SEO-H1-Pill. */
@media (max-width: 700px){
  /* Headline ~10% kleiner als zuvor */
  .hero-headline{
    font-size: clamp(3rem, 15vw, 5rem);
    line-height: 1.02;
    word-break: keep-all;
  }
  .hero-headline .stamp{
    padding: 4px 10px;
    font-size: .92em;
  }
}

/* Hero-Stats: 3 Karten passen auf eine Zeile */
@media (max-width: 700px){
  .hero-stats{ gap: 14px; flex-wrap: nowrap; }
  .hero-stats .stat{ flex: 1 1 0; min-width: 0; }
  .hero-stats .num{ font-size: 1.5rem; }
  .hero-stats .lbl{ font-size: .58rem; letter-spacing: .12em; }
}

/* Hero-BG-Number auf Mobile: groß genug für visuellen Impact, auf Höhe der Headline */
@media (max-width: 1000px){
  .hero-bg-num{
    bottom: auto;
    top: 12%;
    left: -2%;
    font-size: clamp(16rem, 56vw, 30rem);
    opacity: .07;
    line-height: .85;
    letter-spacing: -.04em;
  }
}
@media (max-width: 700px){
  .hero-bg-num{
    top: 14%;
    font-size: clamp(15rem, 60vw, 24rem);
    letter-spacing: -.04em;
  }
}

/* Blog-Single: Abstände zwischen h2 und Text enger (vorher zu viel Luft) */
.blog-single .wp-block-post-content h2{
  margin: 1.4em 0 .35em;
  line-height: 1.1;
}
.blog-single .wp-block-post-content h3{
  margin: 1.2em 0 .3em;
  line-height: 1.15;
}
.blog-single .wp-block-post-content > *{
  margin-bottom: 1.1em;
}
.blog-single .wp-block-post-content h2 + p,
.blog-single .wp-block-post-content h3 + p{
  margin-top: 0;
}

/* Blog-Single auf Mobile: noch kompaktere Abstände + kleinere h2/h3 */
@media (max-width: 700px){
  .blog-single{ padding-top: 30px !important; }
  .blog-single .wp-block-post-content h2{
    font-size: 1.7rem; margin: 1.1em 0 .25em;
  }
  .blog-single .wp-block-post-content h3{
    font-size: 1.35rem; margin: 1em 0 .25em;
  }
  .blog-single .wp-block-post-content > *{
    font-size: 1rem; line-height: 1.65; margin-bottom: .9em;
  }
}