/*
 * UNBOND unified layer – letzte Schicht.
 * Ein fixierter Video-Hintergrund, EINE einheitliche dunkle Schicht, keine Sektions-Overlays,
 * einheitliche Außenbreite, statische Zitatkarten. Farben, Schriften, Formen bleiben unverändert.
 */
:root { --page: 1160px; --unified-veil: rgba(7, 10, 17, .66); }

/* Nur das Video: sein erster Frame bleibt bis zum ersten Herunterscrollen stehen. */
.page-background {
  filter: none !important;
  background-color: #0b0f17 !important;
  background-image: none !important;
}

/* Gleiche Abdunklung wie bisher, jetzt über dem fixierten Video. */
html body .page-background--video {
  background-image: none !important;
  overflow: hidden;
}
.page-background-video {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 62% 30%;
}
.page-background--video::after {
  content: "";
  position: absolute;
  inset: 0;
  background: var(--unified-veil);
  pointer-events: none;
}
@media (max-width: 767px) {
  .page-background-video { object-position: 50% 18%; }
}
body::before, body::after { content: none !important; }
canvas#webgl-bg, #webgl-bg, .smoke, [class*="smoke"] { display: none !important; }

/* Keine Sektions-Hintergründe, Schleier oder Blur auf Wrappern */
main#main-content > section,
.section, .pain-section, .program-section, .method-section, .pricing-section,
.testimonials-section, .author-section, .faq-section, .final-section,
.hero-program-section, .lookinside-section, .perspectives-section, .hybrid-transformation {
  background: transparent !important;
  background-image: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  filter: none !important;
  box-shadow: none !important;
}
main#main-content > section::before,
main#main-content > section::after { content: none !important; display: none !important; }
/* Keine seitenbreiten Trennlinien im Video; Kartenränder bleiben erhalten. */
html body main#main-content > section {
  border: 0 !important;
}

/* Einheitliche äußere Inhaltsbreite */
.container, .hero-inner, .header-inner, .method-section .container,
.hero-program-section .container, .perspectives-section .container {
  width: min(calc(100% - 40px), var(--page)) !important;
  max-width: var(--page) !important;
  margin-inline: auto !important;
  box-sizing: border-box;
}
.hero { padding-inline: 0 !important; }
.price-single, .author-grid, .faq-layout, .final-inner, .t-track, .program-shell {
  max-width: var(--page) !important;
}
@media (max-width: 760px) {
  .container, .hero-inner, .header-inner, .method-section .container,
  .hero-program-section .container, .perspectives-section .container {
    width: min(calc(100% - 30px), var(--page)) !important;
  }
}

/* Zitatkarten: statisch, alle sechs sichtbar, kein Marquee */
.hero-quote-marquee { display: grid; gap: 12px; overflow: visible !important; }
.hero-quote-row { overflow: visible !important; width: 100%; }
.hero-quote-lane {
  display: block !important; width: 100% !important;
  animation: none !important; transform: none !important;
}
.hero-quote-set {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 12px; padding: 0 !important; margin: 0;
}
.hero-quote-set[aria-hidden="true"] { display: none !important; }
.hero-quote-card, .hero-quote-card:hover, .hero-quote-card:focus-visible {
  transform: none !important; animation: none !important; width: 100%;
}
.hero-quote-card::before { opacity: 1 !important; }
.hero-quote-card::after { background: rgba(7, 12, 18, .8) !important; }
.hero-quote-motion-control { display: none !important; }
@media (max-width: 900px) {
  .hero-quote-set { grid-template-columns: 1fr !important; gap: 10px; }
}

/* Technischer Fokus für Buttons */
.button:focus-visible, .core-cta:focus-visible, .hero-quote-card:focus-visible,
.hero-scroll-link:focus-visible, .phase-toggle:focus-visible, .hero-program-collapse:focus-visible {
  outline: 2px solid #159a82; outline-offset: 3px;
}

/* Auch die großen Inhaltsflächen dürfen keinen zweiten Schleier erzeugen.
   Ränder, Innenabstände, Typografie und kleinere Komponenten bleiben erhalten. */
html body .hero-inner,
html body .lookinside-inner,
html body .final-inner,
html body .site-footer {
  background: transparent !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

/* Hero bewusst schmal: gemeinsame Außenkante, aber freies Porträt rechts. */
html body .hero-inner {
  width: min(560px, calc(100% - 40px)) !important;
  max-width: 560px !important;
  margin-inline: max(20px, calc((100vw - var(--page)) / 2)) auto !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}
html body[data-page="sales"] #main-content .hero .hero-inner {
  background: none !important;
  background-image: none !important;
  border: 0 !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}
html body .hero-inner .hero-cta,
html body .final-inner .core-cta {
  display: inline-flex !important;
  width: auto !important;
  inline-size: auto !important;
  max-width: 100% !important;
  padding-inline: 24px !important;
}
html body .author-body {
  background: rgba(10, 17, 26, .82) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

/* Originale Kennzahlengrafik als Inhaltsübersicht, dann Leistung und Kauf. */
html body #angebot .price-card {
  display: grid !important;
  grid-template-columns: minmax(0, 1.15fr) minmax(290px, .85fr);
  gap: 26px 40px !important;
  padding: clamp(22px, 4vw, 44px) !important;
  background: rgba(10, 17, 26, .86) !important;
}
#angebot .price-copy, #angebot .price-inclusions { grid-column: 1 / -1; }
#angebot .price-copy h2 { margin-bottom: 0; }
#angebot .price-inclusions img { display: block; width: 100%; height: auto; }
#angebot .price-inclusions-mobile { display: none; }
html body #angebot .price-card > * { order: 0 !important; }
#angebot .price-feature-in-graphic { display: none !important; }
#angebot .price-details { align-self: start; padding-top: 16px; }
#angebot .price-features { display: grid; grid-template-columns: 1fr; gap: 18px; margin: 0; }
html body #angebot .price-action {
  display: flex; flex-direction: column; align-items: center;
  padding: 24px !important;
  border: 1px solid rgba(21, 154, 130, .28);
  border-radius: 16px;
  background: rgba(7, 12, 18, .48) !important;
}
#angebot .price-action .price { margin-block: 14px 20px; }
html body #angebot .price-cta { width: auto !important; max-width: 100%; padding-inline: 24px !important; }
@media (max-width: 760px) {
  html body .hero-inner {
    width: calc(100% - 30px) !important;
    margin-inline: 15px !important;
  }
  html body #angebot .price-card { grid-template-columns: minmax(0, 1fr); gap: 22px !important; }
  #angebot .price-inclusions .price-inclusions-desktop { display: none; }
  #angebot .price-inclusions-mobile { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  #angebot .price-details { padding-top: 0; }
}
html body .hero-inner::before,
html body .hero-inner::after {
  content: none !important;
}

/* Die alte ID-Regel der Leseprobe war stärker als die gemeinsame Container-Regel. */
html body #blick-ins-buch .lookinside-inner,
html body .header-beacon-inner {
  inline-size: min(calc(100% - 40px), var(--page)) !important;
  width: min(calc(100% - 40px), var(--page)) !important;
  max-inline-size: var(--page) !important;
  max-width: var(--page) !important;
  margin-inline: auto !important;
}
@media (max-width: 760px) {
  html body #blick-ins-buch .lookinside-inner,
  html body .header-beacon-inner {
    inline-size: min(calc(100% - 30px), var(--page)) !important;
    width: min(calc(100% - 30px), var(--page)) !important;
  }
}