/* Bommel-Skin: legt den neuen Look über die bestehenden Seiten-Vorlagen (Vorschau unter /neu/) */
@font-face{font-family:'Fredoka';font-style:normal;font-weight:300 700;font-display:swap;src:url('/assets/fonts/bommel/fredoka-var.woff2') format('woff2')}
@font-face{font-family:'Nunito';font-style:normal;font-weight:200 1000;font-display:swap;src:url('/assets/fonts/bommel/nunito-var.woff2') format('woff2')}
:root{
  --bg:#edf6f4; --bg2:#e2f0ec; --bg3:#ffffff; --ink:#10303a; --ink-2:#2b4a53; --muted:#4d6b73; --line:#cfe3df;
  --indigo:#14505a; --indigo-deep:#0f3d46; --indigo-light:#fff1cc; --green:#1f9e6e; --green-light:#dff5ec;
  --amber:#9a6400; --amber-light:#fff1cc; --white:#ffffff;
  --primary:#14505a; --primary2:#1c6470; --dark:#edf6f4; --dark2:#e2f0ec; --text:#10303a; --text2:#4d6b73; --text3:#4d6b73;
  --grad:linear-gradient(135deg,#14505a 0%,#1c6470 100%); --grad2:linear-gradient(135deg,#2fbf86 0%,#1c6470 100%);
  --border:#cfe3df; --glass:#ffffff;
  --bm-stage:#14505a; --bm-stage2:#1c6470; --bm-yellow:#f7b733; --bm-on-yellow:#13414d; --bm-coral:#ff6b5e;
  --font-heading:"Fredoka","Nunito",system-ui,sans-serif;
}
html body.bm{background:var(--bg)!important;color:var(--ink)}
body.bm, body.bm *:not(svg):not(svg *){font-family:"Nunito",system-ui,sans-serif!important}
body.bm :is(h1,h2,h3,h4,.sec-h,.price-num,.stat-num,.why-h,.fcta h2,.trust-sec h2,.compare-quote,.chap-item h3,.kurs-card h3,.pricing-price){font-family:"Fredoka","Nunito",system-ui,sans-serif!important;letter-spacing:0!important}
body.bm{padding-top:0!important}

/* Kopfzeile */
.bm-preview{background:var(--bm-coral);color:#fff;text-align:center;font-weight:800;font-size:13px;padding:7px 12px}
.bm-preview a{color:#fff}
.bm-akt{display:flex;align-items:center;justify-content:center;gap:10px 18px;flex-wrap:wrap;background:var(--bm-stage);color:#fff!important;text-decoration:none;padding:10px 16px;font-weight:700;font-size:15px}
.bm-akt b{color:var(--bm-yellow);font-family:"Fredoka",sans-serif!important;font-size:19px}
.bm-akt s{opacity:.8;text-decoration-color:var(--bm-coral);text-decoration-thickness:2px}
.bm-akt .go{background:var(--bm-yellow);color:var(--bm-on-yellow);border-radius:999px;padding:5px 14px;font-weight:800}
.bm-head{position:sticky;top:0;z-index:300;background:rgba(237,246,244,.94);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}
.bm-head__in{max-width:1140px;margin:0 auto;padding:14px max(18px,env(safe-area-inset-right,0px)) 14px max(18px,env(safe-area-inset-left,0px));display:flex;align-items:center;justify-content:space-between;gap:16px}
.bm-logo{font-family:"Fredoka",sans-serif!important;font-weight:700;font-size:23px;text-decoration:none;color:var(--ink)!important;white-space:nowrap}
.bm-logo b{color:var(--bm-coral)}
.bm-nav{display:flex;align-items:center;gap:4px 20px;font-weight:700;font-size:15.5px}
.bm-nav a{text-decoration:none;color:var(--muted)!important;white-space:nowrap}
.bm-nav a:hover,.bm-nav a.on{color:var(--ink)!important}
.bm-nav a.on{box-shadow:inset 0 -3px 0 var(--bm-yellow)}
.bm-cta{display:inline-flex;align-items:center;font-family:"Fredoka",sans-serif!important;font-weight:600;font-size:16px;text-decoration:none;padding:10px 20px;border-radius:999px;background:var(--bm-stage);color:#fff!important;white-space:nowrap}
.bm-burger{display:none;background:none;border:0;padding:8px;cursor:pointer;color:var(--ink)}
.bm-sheet{display:none;border-top:1px solid var(--line);background:#fff}
.bm-sheet.open{display:block}
.bm-sheet a{display:block;padding:14px 22px;border-bottom:1px solid var(--line);text-decoration:none;font-weight:700;color:var(--ink)!important}
@media (max-width:1060px){.bm-nav,.bm-cta{display:none}.bm-burger{display:block}}

/* Hero als Bühne mit Bommel */
body.bm .hero{position:relative;display:grid!important;grid-template-columns:1.1fr .9fr;align-items:stretch;width:min(1140px,calc(100% - 36px));margin:26px auto 0!important;padding:0!important;min-height:0!important;height:auto!important;border-radius:34px;overflow:hidden;background:linear-gradient(115deg,var(--bm-stage) 0%,var(--bm-stage) 45%,var(--bm-stage2) 100%)!important;color:#fff;text-align:left!important;box-shadow:0 14px 40px rgba(16,48,58,.16)}
body.bm .hero.bm-noimg{grid-template-columns:1fr}
body.bm .hero::before,body.bm .hero::after{display:none!important}
.bm-hero-text{padding:clamp(28px,5vw,58px);position:relative;z-index:2;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:16px;min-width:0}
body.bm .hero :is(.wrap,.wrap-narrow,.hero-inner){padding:0!important;margin:0!important;max-width:none!important;width:auto!important;text-align:left!important;display:flex;flex-direction:column;align-items:flex-start;gap:16px}
body.bm .hero h1{color:#fff!important;font-size:clamp(34px,5vw,58px)!important;line-height:1.08!important;margin:0!important;text-align:left!important}
body.bm .hero :is(.hi,.grad-text){color:var(--bm-yellow)!important;-webkit-text-fill-color:var(--bm-yellow)!important;background:none!important}
body.bm .hero :is(.hero-sub,p){color:rgba(255,255,255,.88)!important;text-align:left!important;margin-left:0!important;margin-right:0!important;max-width:42ch}
body.bm .hero :is(.breadcrumb,.breadcrumb a,.art-updated,.hero-price-note,.hero-trust,.hero-trust span,.trust-item){color:rgba(255,255,255,.82)!important}
body.bm .hero :is(.eyebrow,.hero-badge,.hero-abbr){display:inline-flex!important;align-items:center;gap:8px;background:var(--bm-yellow)!important;color:var(--bm-on-yellow)!important;border:0!important;border-radius:999px!important;padding:7px 15px!important;font-size:13px!important;font-weight:800!important;letter-spacing:.06em!important;text-transform:uppercase;margin:0!important;box-shadow:none!important;backdrop-filter:none!important}
body.bm .hero .eyebrow::before,body.bm .hero .badge-dot{display:none!important}
body.bm .hero :is(.hero-actions,.hero-ctas,.hero-trust){justify-content:flex-start!important;margin-left:0!important}
body.bm .hero .btn-ghost{border:2px solid rgba(255,255,255,.55)!important;color:#fff!important;background:transparent!important}
body.bm .hero :is(.hero-video,.hero-video-fade,.hero-bg,.hero-bg-glow){display:none!important}
.bm-hero-img{position:relative;min-height:380px}
.bm-hero-img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:60% 40%}
.bm-hero-img::before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(90deg,var(--bm-stage) 0%,rgba(20,80,90,0) 30%)}
@media (max-width:900px){
  body.bm .hero{grid-template-columns:1fr}
  .bm-hero-img{order:-1;min-height:0;height:260px}
  .bm-hero-img::before{background:linear-gradient(0deg,var(--bm-stage) 0%,rgba(20,80,90,0) 40%)}
}

/* Buttons */
body.bm :is(.btn-primary,.price-cta,.mob-cta,.nav-cta,.product-cta a,.tool-card-cta){background:var(--bm-yellow)!important;color:var(--bm-on-yellow)!important;box-shadow:0 8px 22px rgba(247,183,51,.35)!important;border:0!important;font-weight:800!important}
body.bm .btn-ghost{color:var(--ink)!important;border:2px solid var(--line)!important;background:#fff!important}
body.bm .hi{color:var(--bm-stage)!important;-webkit-text-fill-color:var(--bm-stage)!important;background:linear-gradient(transparent 62%,rgba(247,183,51,.5) 62%)!important;-webkit-background-clip:border-box!important;background-clip:border-box!important}
body.bm .grad-text{color:var(--bm-stage)!important;-webkit-text-fill-color:var(--bm-stage)!important;background:none!important}

/* Karten und Flächen hell */
body.bm :is(.why-card,.step-item,.price-wrap,.faq,.faq-item,.test-card,.chap-item,.shot-card,.get-card,.check-item,.rat-card,.kurs-card,.honest-box,.callout,.compare-col .compare-quote,.feature-card,.pricing-card,.moment-item,.vid-hint){background:#fff!important;border:1px solid var(--line)!important;color:var(--ink)}
body.bm :is(.kurs-card p strong,.feature-card h3,.pricing-card h3,.faq-question,.moment-text){color:var(--ink)!important}
body.bm :is(.rat-suggest,.rat-search,.rat-search input){background:#fff!important;color:var(--ink)!important;border-color:var(--line)!important}
body.bm .vid-hint{color:var(--ink)!important}

/* dunkle Bühnen werden Teal */
body.bm :is(.stats,.fcta,.trust-sec,.tools-sec,.product-cta,.pin,.brain-pin,.identify,.identify-stage,.pin-stage,.brain-stage,.tour-card,.final-cta){background:linear-gradient(120deg,var(--bm-stage),var(--bm-stage2))!important;color:#fff}
body.bm :is(.fcta,.final-cta){width:min(1140px,calc(100% - 36px));margin:clamp(48px,7vw,84px) auto 0!important;border-radius:34px;padding:clamp(40px,6vw,80px) 24px!important}
body.bm .final-cta :is(h2,p,.final-note){color:#fff!important}
body.bm .moment-section{background:var(--bg2)!important}

/* Fußzeile */
body.bm :is(footer,.footer){background:transparent!important;color:var(--muted)!important;border-top:1px solid var(--line)!important}
body.bm :is(footer,.footer) a{color:var(--muted)!important}

/* Schutz gegen alte globale nav-Regeln (z. B. KindO) */
body.bm nav.bm-nav,body.bm nav.bm-sheet{position:static!important;inset:auto!important;width:auto!important;height:auto!important;background:transparent!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important;border:0!important;box-shadow:none!important;z-index:auto!important;transform:none!important}
body.bm nav.bm-nav{padding:0!important;justify-content:flex-start!important}
body.bm nav.bm-sheet{padding:0!important;display:none!important;border-top:1px solid var(--line)!important;background:#fff!important}
body.bm nav.bm-sheet.open{display:block!important}
@media (max-width:1060px){body.bm nav.bm-nav{display:none!important}}

/* Gratis-Tools hell statt Teal */
body.bm .tools-sec{background:transparent!important;color:var(--ink)!important}
body.bm .tools-sec::before{display:none!important}
body.bm .tools-sec :is(.eyebrow,.sec-sub,.sec-h){color:var(--ink)!important}
body.bm .tools-sec .eyebrow::before{background:var(--bm-yellow)!important}
body.bm .tool-card{background:#fff!important;border:1px solid var(--line)!important;color:var(--ink)!important;backdrop-filter:none!important;box-shadow:0 6px 22px rgba(16,48,58,.07)}
body.bm .tool-card:hover{background:#fff!important;box-shadow:0 14px 40px rgba(16,48,58,.14)}
body.bm .tool-card :is(h3,p){color:var(--ink)!important}
body.bm .tool-card p{color:var(--muted)!important}
body.bm .tool-card-badge{background:#ffd9c7!important;color:#13414d!important}

/* KindO-Untermenü */
.bm-dd{position:relative}
.bm-dd-btn{display:inline-flex;align-items:center;gap:5px;background:none;border:0;padding:0;font:inherit;font-weight:700;font-size:15.5px;color:var(--muted);cursor:pointer;white-space:nowrap}
.bm-dd-btn:hover,.bm-dd-btn.on,.bm-dd.open .bm-dd-btn{color:var(--ink)}
.bm-dd-btn.on{box-shadow:inset 0 -3px 0 var(--bm-yellow)}
.bm-dd-menu{position:absolute;top:calc(100% + 14px);left:50%;transform:translateX(-50%);min-width:250px;background:#fff;border:1px solid var(--line);border-radius:16px;box-shadow:0 18px 40px rgba(16,48,58,.16);padding:8px;display:none;z-index:400}
.bm-dd.open .bm-dd-menu,.bm-dd:hover .bm-dd-menu,.bm-dd:focus-within .bm-dd-menu{display:block}
.bm-dd::after{content:"";position:absolute;left:0;right:0;top:100%;height:16px}
.bm-dd-menu a{display:block;padding:10px 12px;border-radius:10px;text-decoration:none;color:var(--ink)!important;font-weight:800;font-size:15px;white-space:nowrap}
.bm-dd-menu a span{display:block;font-weight:600;font-size:12.5px;color:var(--muted)}
.bm-dd-menu a:hover{background:var(--bg)}
.bm-sheet a.sub,body.bm nav.bm-sheet a.sub{padding-left:42px!important;font-weight:700;color:var(--muted)!important;background:var(--bg)}

/* Kostenlose Tools (eigene Farbsysteme) */
body.bm[data-bmtool]{--blau:#14505a;--lila:#1c6470;--pink:#e2574b;--orange:#f7b733;--text:#10303a;--grau:#4d6b73;--linie:#cfe3df;--box:#e2f0ec;--weiss:#edf6f4;--card:#ffffff;
  --surface:#ffffff;--surface2:#e2f0ec;--ink-soft:#2b4a53;--accent:#f7b733;--accent-deep:#14505a;--accent-tint:rgba(247,183,51,.2);--mint:#1f9e6e;
  display:block!important;min-height:0!important;background:var(--bg)!important;color:var(--ink)!important}
body.bm[data-bmtool] :is(#app,.app,.wrap){margin-top:36px!important;margin-bottom:60px!important}
body.bm[data-bmtool] :is(.grad,.grad-text){color:var(--bm-stage)!important;-webkit-text-fill-color:var(--bm-stage)!important;background:none!important}
body.bm[data-bmtool] :is(h1,h2,h3){color:var(--ink)!important}
body.bm[data-bmtool] .lead-banner{display:none!important}

/* Tool-Buttons in Markenfarbe */
body.bm[data-bmtool] .btn-orange,body.bm[data-bmtool] .app .btn:not(.btn-ghost){background:var(--bm-yellow)!important;color:var(--bm-on-yellow)!important;border:0!important;box-shadow:0 8px 22px rgba(247,183,51,.35)!important}

/* Lesbarkeit: Akzenttexte auf hellem Grund */
body.bm :is(.eyebrow,.section-label,.update-item-label,.image-caption,.stats-eyebrow){color:var(--bm-stage)!important}
body.bm .hero :is(.eyebrow,.section-label){color:var(--bm-on-yellow)!important}
body.bm :is(.stats,.fcta,.trust-sec,.final-cta) :is(.eyebrow,.section-label,.stats-eyebrow){color:var(--bm-yellow)!important}
body.bm .price-num{color:var(--bm-stage)!important}
body.bm .price-num-c{color:var(--muted)!important}
body.bm :is(.test-stars,.testimonial-stars,.stars){color:#b37800!important}
body.bm .compare-col-label{color:#157a55!important}
body.bm :is(.after-label,.update-badge){color:#157a55!important}
body.bm .update-badge{background:#dff5ec!important}
body.bm .trust-sec p,body.bm .trust-badge p{color:rgba(255,255,255,.86)!important}
body.bm .emotion-line{color:var(--ink)!important;-webkit-text-fill-color:var(--ink)!important}
body.bm .emotion-line.is-final{color:var(--bm-stage)!important;-webkit-text-fill-color:var(--bm-stage)!important;background:none!important}
body.bm .chat-bubble{background:#fff!important;color:var(--ink)!important;border:1px solid var(--line)!important}
body.bm .chat-msg.user .chat-bubble,body.bm .chat-bubble.user{background:#fff1cc!important}
body.bm .bm-preview{background:#b83a30!important}
body.bm .product-image-wrap img{height:auto!important;max-height:none!important;aspect-ratio:auto!important;object-fit:cover}
body.bm .footer-logo{color:#fff!important}
body.bm .vid-hint strong{color:var(--bm-stage)!important}
body.bm .vid-hint svg{color:var(--bm-stage)!important}
body.bm .fcta-note,body.bm .fcta p{color:rgba(255,255,255,.88)!important}

/* Tool-Ergebnisse: weiße Texte auf hellem Grund korrigieren */
body.bm[data-bmtool] :is(.karte p,.weglassen p,.wand p,.pitch p,.block p,.kipp p,.brief,.fragen span,.weglassen li,.nebenzeile,.footer){color:var(--ink-2)!important}
body.bm[data-bmtool] .footer a{color:var(--muted)!important}
body.bm[data-bmtool] :is(.typBadge,.pitch-label){color:var(--bm-stage)!important}
body.bm[data-bmtool] .kicker{color:#b83a30!important}
body.bm[data-bmtool] .pitch{border-color:var(--line)!important}
body.bm .product-image-wrap{max-width:560px!important;margin-left:auto!important;margin-right:auto!important}
body.bm .image-caption{background:#fff!important;color:var(--ink)!important;border:1px solid var(--line)!important}

/* FAQ einheitlich: Karten, symmetrische Innenabstände, runder Plus-Knopf */
body.bm :is(.faq-wrap,.faq-list){max-width:780px!important;width:100%;margin-left:auto!important;margin-right:auto!important;display:flex!important;flex-direction:column;gap:12px!important;padding:0!important}
body.bm .faq{background:#fff!important;border:1px solid var(--line)!important;border-radius:18px!important;overflow:hidden;box-shadow:0 4px 14px rgba(16,48,58,.05);margin:0!important}
body.bm .faq summary{padding:18px 20px!important;display:flex!important;align-items:center!important;justify-content:space-between!important;gap:16px!important;font-size:17px!important;font-weight:800!important;line-height:1.35!important;color:var(--ink)!important;text-align:left}
body.bm .faq summary:hover{color:var(--bm-stage)!important}
body.bm .faq summary::after{content:""!important;flex:0 0 32px;width:32px;height:32px;border-radius:50%;background:var(--bg) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 14'%3E%3Cpath d='M7 2v10M2 7h10' stroke='%2314505a' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E") center/13px no-repeat!important;transition:transform .25s,background-color .2s!important;font-size:0!important;color:transparent!important}
body.bm .faq[open] summary::after{transform:rotate(45deg)!important;background-color:var(--bm-yellow)!important}
body.bm .faq-a{padding:0 20px 20px!important;font-size:16px!important;line-height:1.65!important;color:var(--ink-2)!important}
body.bm .faq-item{background:#fff!important;border:1px solid var(--line)!important;border-radius:18px!important;margin:0!important;box-shadow:0 4px 14px rgba(16,48,58,.05)}
body.bm .faq-question{background:#fff!important;color:var(--ink)!important;padding:18px 20px!important;display:flex!important;align-items:center!important;justify-content:space-between!important;gap:16px!important;font-size:17px!important;font-weight:800!important;line-height:1.35!important}
body.bm .faq-arrow{flex:0 0 32px!important;width:32px!important;height:32px!important;background:var(--bg)!important;color:var(--bm-stage)!important}
body.bm .faq-item.open .faq-arrow{background:var(--bm-yellow)!important}
body.bm .faq-answer{padding:0 20px!important;font-size:16px!important;color:var(--ink-2)!important}
body.bm .faq-item.open .faq-answer{max-height:800px!important;padding:0 20px 20px!important}
@media (max-width:640px){
  body.bm :is(.faq summary,.faq-question){padding:16px!important;font-size:16px!important}
  body.bm .faq-a{padding:0 16px 16px!important;font-size:15.5px!important}
  body.bm .faq-answer{padding:0 16px!important}
  body.bm .faq-item.open .faq-answer{padding:0 16px 16px!important}
}

/* Social-Icons in der Kopfzeile (mobil und Tablet) */
.bm-social{display:none;align-items:center;gap:6px;margin-left:auto}
.bm-social a{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:50%;background:#fff;border:1px solid var(--line);color:var(--bm-stage)!important;text-decoration:none;transition:background .15s,color .15s}
.bm-social a:hover{background:var(--bm-stage);color:#fff!important}
@media (max-width:1060px){.bm-social{display:inline-flex}}
@media (max-width:380px){.bm-social{gap:4px}.bm-social a{width:32px;height:32px}.bm-logo{font-size:20px!important}}

/* Platz unter der Fußleiste, damit der feste Kauf-Button am Handy nichts verdeckt */
@media (max-width:900px){
  body.bm:has(.mob-cta){padding-bottom:calc(96px + env(safe-area-inset-bottom,0px))!important}
  body.bm :is(footer,.footer){padding-bottom:max(28px,env(safe-area-inset-bottom,0px))!important}
}
@media (max-width:640px){body.bm :is(.fcta,.final-cta,.hero) .btn-primary{white-space:nowrap;font-size:16px!important;padding:16px 22px!important;max-width:100%}}

.head .btn,.bm-cta{white-space:nowrap}
@media (max-width:1239px){.head .btn,.bm-cta{display:none}}

/* Gratis-Tools: Inhalt wieder mittig */
body.bm[data-bmtool] > :not(header):not(nav):not(script):not(style):not(.bm-akt):not(.bm-preview){margin-left:auto!important;margin-right:auto!important}

/* Lesbarkeit & Tipp-Flaechen (Handy) */
body.bm .rat-tag,body.bm .tool-card-badge,body.bm .compare-col-label,body.bm .after-label{font-size:13px!important}
.bm-logo{display:inline-block;padding:8px 0}
@media (max-width:760px){
  footer a{display:inline-block;padding:10px 6px;min-height:40px;line-height:20px}
  .breadcrumb a{display:inline-block;padding:10px 4px}
  body.bm[data-bmtool] .footer a,body.bm[data-bmtool] a[href*="alfima.com/marko"]{display:inline-block;padding:10px 6px}
}

/* Oberer Bereich sofort sichtbar (keine Einblend-Verzoegerung) */
body.bm .hero .rv{opacity:1!important;transform:none!important;transition:none!important}

/* Fliesstext in Karten gut lesbar */
body.bm :is(.why-p,.feature-card p,.tool-card p,.explain-note,.step-item p,.rat-card p,.product-cta p,.honest-box p,.rv-rules__grid p){font-size:16px!important;line-height:1.6!important}
body.bm .tool-card p{max-width:68ch}

body.bm .hero *{animation-delay:0s!important;animation-duration:.25s!important}