/* IbetMax Wissenskarten: warmer Pixelstil mit schwarzer Textfläche. */
.hero[data-knowledge-hero] { isolation: isolate; position: relative; overflow: hidden; min-height: 660px; display: flex; align-items: center; padding: 76px 0; background: #000; }
.hero[data-knowledge-hero]::before, .hero[data-knowledge-hero]::after, .hero[data-knowledge-hero] > .hero__grid, .hero[data-knowledge-hero] > .hero__glow { display: none; }
.hero[data-knowledge-hero] > .ib-hero-copy { position: relative; z-index: 2; width: 49%; max-width: 780px; margin: 0 auto 0 0; padding: 0 0 0 clamp(24px, 5vw, 88px); text-align: left; }
.hero[data-knowledge-hero] h1 { color: #f5f7f9; max-width: 100%; font-size: clamp(32px, 3.4vw, 54px); letter-spacing: .035em; line-height: 1.12; overflow-wrap: anywhere; }
.hero[data-knowledge-hero="long"] h1 { font-size: clamp(28px, 2.65vw, 42px); }
.hero[data-knowledge-hero] .hero__sub, .hero[data-knowledge-hero] .hero__intro, .hero[data-knowledge-hero] .hero__claim { margin-left: 0; max-width: 100%; }
.hero[data-knowledge-hero] .hero__sub { color: rgba(255,255,255,.86); }
.hero[data-knowledge-hero] .hero__intro { color: rgba(255,255,255,.72); }
.hero[data-knowledge-hero] .hero__kicker { max-width: 100%; white-space: normal; flex-wrap: wrap; text-align: left; }
.hero[data-knowledge-hero] .hero__cta, .hero[data-knowledge-hero] .hero__stats { justify-content: flex-start; }
.hero[data-knowledge-hero] .hero__visual { position: absolute; inset: 0; z-index: 0; margin: 0; pointer-events: none; }
.hero[data-knowledge-hero] .hero__visual img { display: block; width: 100%; height: 100%; max-width: none; object-fit: contain; object-position: right center; }
.hero[data-knowledge-hero] .hero__visual figcaption { position: absolute; right: 16px; bottom: 14px; padding: 4px 10px; border: 1px solid rgba(255,255,255,.2); border-radius: 100px; background: rgba(7,8,11,.88); color: white; font: 11px/1.5 system-ui,sans-serif; }
@media (max-width: 700px) {
 .hero[data-knowledge-hero] { min-height: 760px; align-items: flex-start; padding: 56px 0 calc(85.7vw + 36px); }
 .hero[data-knowledge-hero] > .ib-hero-copy { width: 100%; max-width: none; padding: 0 24px; }
 .hero[data-knowledge-hero] h1 { font-size: clamp(30px, 7.4vw, 42px); }
 .hero[data-knowledge-hero="long"] h1 { font-size: clamp(26px, 6.5vw, 36px); }
 .hero[data-knowledge-hero] .hero__visual img { position: absolute; bottom: 0; right: 0; width: 200%; height: auto; }
 .hero[data-knowledge-hero] .hero__visual figcaption { right: 10px; bottom: 10px; font-size: 10px; }
}

.hero[data-knowledge-hero] .btn--ghost { color: rgba(255,255,255,.82); border-color: rgba(255,255,255,.22); background: rgba(255,255,255,.04); }
.hero[data-knowledge-hero] .breadcrumb { color: rgba(255,255,255,.65); }

/* Helle Randdetails des Motivs reichen nicht unter den Desktop-Text. */
.hero[data-knowledge-hero]::before { display: block; content: ""; position: absolute; inset: 0; width: auto; height: auto; z-index: 1; pointer-events: none; background: linear-gradient(90deg, #000 0%, #000 49%, rgba(0,0,0,.8) 51%, transparent 57%); }
@media (max-width: 700px) { .hero[data-knowledge-hero]::before { display: none; } }

/* HERO-RHYTHMUS (09.10.2026): gleiche Abstände unter Überschrift, Untertitel und Zertifikatsbox auf allen Wissenskarten. */
.hero[data-knowledge-hero] h1 { margin-bottom: 18px; }
.hero[data-knowledge-hero] .hero__sub, .hero[data-knowledge-hero] .hero__cert { margin-bottom: 18px; }
