/* ============================================================
   PROFILING INSTITUT — HUB /intelligenztest/  ·  Prefix: pi-iq-
   Palette: Primary #00543D · Dark #003A2A · Mid #0a6e50
            Fresh #12A06A · Lime #D3FA00 · Lime-Hover #BFE600
            Orange #FF7A18 · Orange-Dark #E85D04 · BG-alt #f4fbe1
   ============================================================ */

html body .pi-iq-wrap { font-family: 'DM Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif !important; color: #1a2b24 !important; line-height: 1.7 !important; font-size: 17px !important; overflow-x: hidden !important; }
html body .pi-iq-wrap * { box-sizing: border-box !important; }
html body .pi-iq-wrap p { margin: 0 0 18px 0 !important; color: #34453d !important; }
html body .pi-iq-wrap a { color: #00543D !important; text-decoration: underline !important; text-decoration-color: rgba(0,84,61,.32) !important; text-underline-offset: 3px !important; transition: color .18s ease, text-decoration-color .18s ease !important; }
html body .pi-iq-wrap a:hover { color: #E85D04 !important; text-decoration-color: #FF7A18 !important; }
html body .pi-iq-wrap a:focus-visible { outline: 3px solid #FF7A18 !important; outline-offset: 2px !important; border-radius: 3px !important; }
html body .pi-iq-wrap ul, html body .pi-iq-wrap ol { margin: 0 0 18px 0 !important; padding-left: 22px !important; }
html body .pi-iq-wrap li { margin-bottom: 9px !important; color: #34453d !important; }
html body .pi-iq-wrap strong { color: #00543D !important; font-weight: 700 !important; }
html body .pi-iq-wrap img { max-width: 100% !important; height: auto !important; display: block !important; }

/* ---------- Reading Progress ---------- */
html body .pi-iq-progress { position: fixed !important; top: 0 !important; left: 0 !important; width: 100% !important; height: 4px !important; background: rgba(0,58,42,.10) !important; z-index: 99999 !important; }
html body .pi-iq-progress-bar { height: 100% !important; width: 0% !important; background: linear-gradient(90deg, #00543D 0%, #12A06A 45%, #D3FA00 78%, #FF7A18 100%) !important; transition: width .1s linear !important; }

/* ---------- Section shell ---------- */
html body .pi-iq-wrap .pi-iq-sec { padding: 68px 20px !important; }
html body .pi-iq-wrap .pi-iq-sec-alt { background: #f4fbe1 !important; }
html body .pi-iq-wrap .pi-iq-sec-deep { background: linear-gradient(155deg, #003A2A 0%, #00543D 55%, #0a6e50 100%) !important; }
html body .pi-iq-wrap .pi-iq-inner { max-width: 1120px !important; margin: 0 auto !important; }
html body .pi-iq-wrap .pi-iq-narrow { max-width: 860px !important; margin: 0 auto !important; }

html body .pi-iq-wrap .pi-iq-eyebrow { display: inline-flex !important; align-items: center !important; gap: 9px !important; font-size: 12px !important; font-weight: 700 !important; letter-spacing: .16em !important; text-transform: uppercase !important; color: #0a6e50 !important; margin-bottom: 14px !important; }
html body .pi-iq-wrap .pi-iq-eyebrow::before { content: '' !important; display: block !important; width: 26px !important; height: 3px !important; background: #D3FA00 !important; border-radius: 2px !important; }
html body .pi-iq-wrap .pi-iq-eyebrow-o { color: #E85D04 !important; }
html body .pi-iq-wrap .pi-iq-eyebrow-o::before { background: #FF7A18 !important; }
html body .pi-iq-wrap .pi-iq-eyebrow-w { color: #D3FA00 !important; }
html body .pi-iq-wrap .pi-iq-eyebrow-w::before { background: #FF7A18 !important; }

html body .pi-iq-wrap .pi-iq-h2 { font-family: 'DM Serif Display', Georgia, serif !important; font-size: 39px !important; line-height: 1.18 !important; color: #00543D !important; margin: 0 0 18px 0 !important; font-weight: 400 !important; letter-spacing: -.01em !important; }
html body .pi-iq-wrap .pi-iq-h2-w { color: #ffffff !important; }
html body .pi-iq-wrap .pi-iq-h3 { font-family: 'DM Sans', sans-serif !important; font-size: 21px !important; line-height: 1.3 !important; color: #00543D !important; margin: 0 0 12px 0 !important; font-weight: 700 !important; }
html body .pi-iq-wrap .pi-iq-h4 { font-size: 17px !important; font-weight: 700 !important; color: #00543D !important; margin: 0 0 8px 0 !important; }
html body .pi-iq-wrap .pi-iq-lead { font-size: 19px !important; line-height: 1.65 !important; color: #40544b !important; margin: 0 0 30px 0 !important; }
html body .pi-iq-wrap .pi-iq-lead-w { color: rgba(255,255,255,.85) !important; }

/* ---------- Buttons ---------- */
html body .pi-iq-wrap a.pi-iq-btn, html body .pi-iq-wrap .pi-iq-btn { display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 9px !important; padding: 15px 28px !important; border-radius: 999px !important; font-weight: 700 !important; font-size: 15.5px !important; text-decoration: none !important; transition: transform .18s ease, box-shadow .18s ease, background .18s ease !important; line-height: 1.2 !important; text-align: center !important; }
html body .pi-iq-wrap .pi-iq-btn:hover { transform: translateY(-2px) !important; text-decoration: none !important; }
html body .pi-iq-wrap .pi-iq-btn-lime { background: #D3FA00 !important; color: #00543D !important; box-shadow: 0 6px 20px rgba(211,250,0,.30) !important; }
html body .pi-iq-wrap .pi-iq-btn-lime:hover { background: #BFE600 !important; color: #00543D !important; box-shadow: 0 10px 28px rgba(211,250,0,.42) !important; }
html body .pi-iq-wrap .pi-iq-btn-orange { background: #FF7A18 !important; color: #ffffff !important; box-shadow: 0 6px 20px rgba(255,122,24,.32) !important; }
html body .pi-iq-wrap .pi-iq-btn-orange:hover { background: #E85D04 !important; color: #ffffff !important; box-shadow: 0 10px 28px rgba(232,93,4,.42) !important; }
html body .pi-iq-wrap .pi-iq-btn-green { background: #00543D !important; color: #ffffff !important; box-shadow: 0 6px 20px rgba(0,84,61,.24) !important; }
html body .pi-iq-wrap .pi-iq-btn-green:hover { background: #003A2A !important; color: #ffffff !important; }
html body .pi-iq-wrap .pi-iq-btn-ghost { background: transparent !important; color: #ffffff !important; border: 2px solid rgba(255,255,255,.45) !important; }
html body .pi-iq-wrap .pi-iq-btn-ghost:hover { background: rgba(255,255,255,.12) !important; border-color: #D3FA00 !important; color: #ffffff !important; }
html body .pi-iq-wrap .pi-iq-btn-outline { background: #ffffff !important; color: #00543D !important; border: 2px solid #00543D !important; }
html body .pi-iq-wrap .pi-iq-btn-outline:hover { background: #00543D !important; color: #ffffff !important; }
html body .pi-iq-wrap .pi-iq-btnrow { display: flex !important; flex-wrap: wrap !important; gap: 14px !important; }

/* ---------- HERO ---------- */
html body .pi-iq-wrap .pi-iq-hero { position: relative !important; background: linear-gradient(150deg, #003A2A 0%, #00543D 48%, #0a6e50 100%) !important; padding: 34px 20px 74px 20px !important; overflow: hidden !important; }
html body .pi-iq-wrap .pi-iq-hero::after { content: '' !important; position: absolute !important; right: -180px !important; top: -140px !important; width: 620px !important; height: 620px !important; border-radius: 50% !important; background: radial-gradient(circle, rgba(211,250,0,.16) 0%, rgba(255,122,24,.07) 45%, transparent 68%) !important; pointer-events: none !important; }
html body .pi-iq-wrap .pi-iq-hero-inner { max-width: 1120px !important; margin: 0 auto !important; position: relative !important; z-index: 2 !important; }
html body .pi-iq-wrap .pi-iq-crumb { font-size: 13px !important; color: rgba(255,255,255,.62) !important; margin-bottom: 30px !important; }
html body .pi-iq-wrap .pi-iq-crumb a { color: rgba(255,255,255,.82) !important; text-decoration: none !important; }
html body .pi-iq-wrap .pi-iq-crumb a:hover { color: #D3FA00 !important; }
html body .pi-iq-wrap .pi-iq-crumb span { margin: 0 7px !important; opacity: .5 !important; }

html body .pi-iq-wrap .pi-iq-hero-flex { display: flex !important; flex-wrap: wrap !important; gap: 46px !important; align-items: center !important; }
html body .pi-iq-wrap .pi-iq-hero-col { flex: 1 1 460px !important; min-width: 300px !important; }
html body .pi-iq-wrap .pi-iq-hero-badge { display: inline-flex !important; align-items: center !important; gap: 8px !important; background: rgba(211,250,0,.14) !important; border: 1px solid rgba(211,250,0,.42) !important; color: #D3FA00 !important; font-size: 12px !important; font-weight: 700 !important; letter-spacing: .13em !important; text-transform: uppercase !important; padding: 8px 16px !important; border-radius: 999px !important; margin-bottom: 20px !important; }
html body .pi-iq-wrap .pi-iq-h1 { font-family: 'DM Serif Display', Georgia, serif !important; font-size: 47px !important; line-height: 1.11 !important; color: #ffffff !important; margin: 0 0 20px 0 !important; font-weight: 400 !important; letter-spacing: -.015em !important; }
html body .pi-iq-wrap .pi-iq-h1 em { font-style: normal !important; color: #D3FA00 !important; }
html body .pi-iq-wrap .pi-iq-hero-sub { font-size: 18.5px !important; line-height: 1.62 !important; color: rgba(255,255,255,.84) !important; margin: 0 0 28px 0 !important; }
html body .pi-iq-wrap .pi-iq-hero-sub strong { color: #ffffff !important; }
html body .pi-iq-wrap .pi-iq-hero-meta { margin-top: 26px !important; font-size: 13.5px !important; color: rgba(255,255,255,.58) !important; display: flex !important; flex-wrap: wrap !important; gap: 8px 20px !important; }
html body .pi-iq-wrap .pi-iq-hero-meta a { color: rgba(255,255,255,.78) !important; }
html body .pi-iq-wrap .pi-iq-hero-meta a:hover { color: #D3FA00 !important; }

/* Hero-Karte: Signature IQ-Explorer */
html body .pi-iq-wrap .pi-iq-explorer { background: rgba(255,255,255,.055) !important; border: 1px solid rgba(255,255,255,.17) !important; border-radius: 22px !important; padding: 26px !important; backdrop-filter: blur(6px) !important; }
html body .pi-iq-wrap .pi-iq-explorer-top { display: flex !important; justify-content: space-between !important; align-items: flex-end !important; gap: 14px !important; margin-bottom: 14px !important; }
html body .pi-iq-wrap .pi-iq-explorer-lbl { font-size: 11.5px !important; letter-spacing: .14em !important; text-transform: uppercase !important; color: rgba(255,255,255,.55) !important; font-weight: 700 !important; margin-bottom: 4px !important; }
html body .pi-iq-wrap .pi-iq-explorer-val { font-family: 'DM Serif Display', Georgia, serif !important; font-size: 52px !important; line-height: .92 !important; color: #D3FA00 !important; }
html body .pi-iq-wrap .pi-iq-explorer-class { text-align: right !important; }
html body .pi-iq-wrap .pi-iq-explorer-classname { font-size: 16px !important; font-weight: 700 !important; color: #ffffff !important; line-height: 1.25 !important; }
html body .pi-iq-wrap .pi-iq-explorer-pr { font-size: 13px !important; color: #FF9A4D !important; font-weight: 700 !important; margin-top: 3px !important; }
html body .pi-iq-wrap .pi-iq-curve { width: 100% !important; height: auto !important; display: block !important; margin: 4px 0 6px 0 !important; }
html body .pi-iq-wrap .pi-iq-slider { -webkit-appearance: none !important; appearance: none !important; width: 100% !important; height: 6px !important; border-radius: 999px !important; background: linear-gradient(90deg, #FF7A18 0%, #12A06A 42%, #D3FA00 100%) !important; outline: none !important; margin: 6px 0 14px 0 !important; }
html body .pi-iq-wrap .pi-iq-slider::-webkit-slider-thumb { -webkit-appearance: none !important; appearance: none !important; width: 26px !important; height: 26px !important; border-radius: 50% !important; background: #ffffff !important; border: 4px solid #00543D !important; cursor: pointer !important; box-shadow: 0 3px 10px rgba(0,0,0,.32) !important; }
html body .pi-iq-wrap .pi-iq-slider::-moz-range-thumb { width: 26px !important; height: 26px !important; border-radius: 50% !important; background: #ffffff !important; border: 4px solid #00543D !important; cursor: pointer !important; }
html body .pi-iq-wrap .pi-iq-explorer-facts { display: flex !important; gap: 10px !important; flex-wrap: wrap !important; }
html body .pi-iq-wrap .pi-iq-explorer-fact { flex: 1 1 100px !important; background: rgba(0,0,0,.20) !important; border-radius: 12px !important; padding: 12px 14px !important; }
html body .pi-iq-wrap .pi-iq-explorer-fact-k { font-size: 10.5px !important; letter-spacing: .1em !important; text-transform: uppercase !important; color: rgba(255,255,255,.5) !important; font-weight: 700 !important; }
html body .pi-iq-wrap .pi-iq-explorer-fact-v { font-size: 18px !important; font-weight: 700 !important; color: #ffffff !important; margin-top: 3px !important; }
html body .pi-iq-wrap .pi-iq-explorer-note { font-size: 12.5px !important; color: rgba(255,255,255,.5) !important; margin: 14px 0 0 0 !important; line-height: 1.5 !important; }
html body .pi-iq-wrap .pi-iq-explorer-note a { color: #D3FA00 !important; }

/* ---------- Trust-Strip ---------- */
html body .pi-iq-wrap .pi-iq-trust { background: #00543D !important; border-top: 1px solid rgba(255,255,255,.10) !important; padding: 18px 20px !important; }
html body .pi-iq-wrap .pi-iq-trust-inner { max-width: 1120px !important; margin: 0 auto !important; display: flex !important; flex-wrap: wrap !important; justify-content: center !important; gap: 12px 34px !important; }
html body .pi-iq-wrap .pi-iq-trust-item { display: flex !important; align-items: center !important; gap: 9px !important; color: rgba(255,255,255,.88) !important; font-size: 14px !important; font-weight: 600 !important; }
html body .pi-iq-wrap .pi-iq-trust-item svg { flex-shrink: 0 !important; }


/* ---------- TL;DR ---------- */
html body .pi-iq-wrap .pi-iq-tldr { background: #ffffff !important; border: 2px solid #D3FA00 !important; border-radius: 20px !important; padding: 30px 32px !important; box-shadow: 0 10px 34px rgba(0,84,61,.07) !important; }
html body .pi-iq-wrap .pi-iq-tldr-head { display: flex !important; align-items: center !important; gap: 11px !important; margin-bottom: 16px !important; }
html body .pi-iq-wrap .pi-iq-tldr-chip { background: #D3FA00 !important; color: #00543D !important; font-size: 11.5px !important; font-weight: 700 !important; letter-spacing: .13em !important; text-transform: uppercase !important; padding: 6px 14px !important; border-radius: 999px !important; }
html body .pi-iq-wrap .pi-iq-tldr ul { list-style: none !important; padding: 0 !important; margin: 0 !important; }
html body .pi-iq-wrap .pi-iq-tldr li { position: relative !important; padding-left: 30px !important; margin-bottom: 13px !important; font-size: 16.5px !important; }
html body .pi-iq-wrap .pi-iq-tldr li::before { content: '' !important; position: absolute !important; left: 0 !important; top: 9px !important; width: 15px !important; height: 3px !important; border-radius: 2px !important; background: #FF7A18 !important; }
html body .pi-iq-wrap .pi-iq-tldr li:last-child { margin-bottom: 0 !important; }

/* ---------- TOC ---------- */
html body .pi-iq-wrap .pi-iq-toc { background: #ffffff !important; border: 1px solid #dfe8e2 !important; border-radius: 20px !important; padding: 28px 30px !important; }
html body .pi-iq-wrap .pi-iq-toc-grid { display: flex !important; flex-wrap: wrap !important; gap: 9px !important; }
html body .pi-iq-wrap .pi-iq-toc-grid a { display: inline-flex !important; align-items: center !important; gap: 8px !important; background: #f4fbe1 !important; border: 1px solid #e2eecb !important; color: #00543D !important; font-size: 14.5px !important; font-weight: 600 !important; padding: 9px 16px !important; border-radius: 999px !important; text-decoration: none !important; transition: all .18s ease !important; }
html body .pi-iq-wrap .pi-iq-toc-grid a:hover { background: #00543D !important; color: #ffffff !important; border-color: #00543D !important; transform: translateY(-1px) !important; }
html body .pi-iq-wrap .pi-iq-toc-num { font-size: 11px !important; font-weight: 700 !important; color: #FF7A18 !important; }
html body .pi-iq-wrap .pi-iq-toc-grid a:hover .pi-iq-toc-num { color: #D3FA00 !important; }

/* ---------- Cards ---------- */
html body .pi-iq-wrap .pi-iq-cards { display: flex !important; flex-wrap: wrap !important; gap: 22px !important; }
html body .pi-iq-wrap .pi-iq-card { flex: 1 1 300px !important; min-width: 260px !important; background: #ffffff !important; border: 1px solid #dfe8e2 !important; border-radius: 18px !important; padding: 28px 26px !important; transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease !important; }
html body .pi-iq-wrap .pi-iq-card:hover { transform: translateY(-4px) !important; box-shadow: 0 16px 40px rgba(0,84,61,.11) !important; border-color: #12A06A !important; }
html body .pi-iq-wrap .pi-iq-card-icon { width: 46px !important; height: 46px !important; border-radius: 13px !important; background: #f4fbe1 !important; display: flex !important; align-items: center !important; justify-content: center !important; margin-bottom: 16px !important; }
html body .pi-iq-wrap .pi-iq-card-icon-o { background: #fff1e5 !important; }
html body .pi-iq-wrap .pi-iq-card p:last-child { margin-bottom: 0 !important; }
html body .pi-iq-wrap .pi-iq-card-tag { display: inline-block !important; font-size: 11px !important; font-weight: 700 !important; letter-spacing: .11em !important; text-transform: uppercase !important; color: #E85D04 !important; background: #fff1e5 !important; padding: 4px 11px !important; border-radius: 999px !important; margin-bottom: 11px !important; }
html body .pi-iq-wrap .pi-iq-card-tag-g { color: #0a6e50 !important; background: #e8f6ee !important; }
html body .pi-iq-wrap .pi-iq-card-link { display: inline-flex !important; align-items: center !important; gap: 7px !important; margin-top: 14px !important; font-weight: 700 !important; font-size: 14.5px !important; color: #00543D !important; text-decoration: none !important; border-bottom: 2px solid #D3FA00 !important; padding-bottom: 2px !important; }
html body .pi-iq-wrap .pi-iq-card-link:hover { color: #E85D04 !important; border-bottom-color: #FF7A18 !important; }

/* ---------- Timeline ---------- */
html body .pi-iq-wrap .pi-iq-tl { position: relative !important; padding-left: 34px !important; }
html body .pi-iq-wrap .pi-iq-tl::before { content: '' !important; position: absolute !important; left: 9px !important; top: 8px !important; bottom: 8px !important; width: 2px !important; background: linear-gradient(180deg, #D3FA00 0%, #12A06A 50%, #FF7A18 100%) !important; }
html body .pi-iq-wrap .pi-iq-tl-item { position: relative !important; margin-bottom: 26px !important; }
html body .pi-iq-wrap .pi-iq-tl-item:last-child { margin-bottom: 0 !important; }
html body .pi-iq-wrap .pi-iq-tl-item::before { content: '' !important; position: absolute !important; left: -30px !important; top: 7px !important; width: 12px !important; height: 12px !important; border-radius: 50% !important; background: #ffffff !important; border: 3px solid #00543D !important; }
html body .pi-iq-wrap .pi-iq-tl-year { font-size: 12.5px !important; font-weight: 700 !important; letter-spacing: .1em !important; text-transform: uppercase !important; color: #E85D04 !important; margin-bottom: 3px !important; }
html body .pi-iq-wrap .pi-iq-tl-item p { margin-bottom: 0 !important; font-size: 16px !important; }

/* ---------- Tabelle ---------- */
html body .pi-iq-wrap .pi-iq-tablewrap { overflow-x: auto !important; border-radius: 16px !important; border: 1px solid #dfe8e2 !important; background: #ffffff !important; -webkit-overflow-scrolling: touch !important; }
html body .pi-iq-wrap .pi-iq-table { width: 100% !important; border-collapse: collapse !important; font-size: 15px !important; min-width: 720px !important; }
html body .pi-iq-wrap .pi-iq-table thead th { background: #00543D !important; color: #ffffff !important; text-align: left !important; padding: 15px 18px !important; font-size: 13px !important; font-weight: 700 !important; letter-spacing: .06em !important; text-transform: uppercase !important; }
html body .pi-iq-wrap .pi-iq-table tbody td { padding: 14px 18px !important; border-top: 1px solid #ecf2ee !important; color: #34453d !important; vertical-align: top !important; }
html body .pi-iq-wrap .pi-iq-table tbody tr:nth-child(even) { background: #fafdf4 !important; }
html body .pi-iq-wrap .pi-iq-table tbody tr:hover { background: #f4fbe1 !important; }
html body .pi-iq-wrap .pi-iq-table td strong { display: block !important; color: #00543D !important; }
html body .pi-iq-wrap .pi-iq-table td small { color: #6b7d74 !important; font-size: 12.5px !important; }
html body .pi-iq-wrap .pi-iq-caption { font-size: 13px !important; color: #6b7d74 !important; margin-top: 11px !important; font-style: italic !important; }

/* ---------- Split ---------- */
html body .pi-iq-wrap .pi-iq-split { display: flex !important; flex-wrap: wrap !important; gap: 44px !important; align-items: center !important; }
html body .pi-iq-wrap .pi-iq-split-col { flex: 1 1 400px !important; min-width: 280px !important; }

/* ---------- Steps ---------- */
html body .pi-iq-wrap .pi-iq-steps { display: flex !important; flex-wrap: wrap !important; gap: 20px !important; }
html body .pi-iq-wrap .pi-iq-step { flex: 1 1 220px !important; min-width: 210px !important; background: #ffffff !important; border-radius: 18px !important; padding: 26px 24px !important; border: 1px solid #dfe8e2 !important; position: relative !important; }
html body .pi-iq-wrap .pi-iq-step-n { width: 38px !important; height: 38px !important; border-radius: 11px !important; background: #00543D !important; color: #D3FA00 !important; display: flex !important; align-items: center !important; justify-content: center !important; font-weight: 700 !important; font-size: 16px !important; margin-bottom: 15px !important; }
html body .pi-iq-wrap .pi-iq-step:last-child .pi-iq-step-n { background: #FF7A18 !important; color: #ffffff !important; }
html body .pi-iq-wrap .pi-iq-step p { font-size: 15.5px !important; margin-bottom: 0 !important; }

/* ---------- KPI ---------- */
html body .pi-iq-wrap .pi-iq-kpis { display: flex !important; flex-wrap: wrap !important; gap: 18px !important; }
html body .pi-iq-wrap .pi-iq-kpi { flex: 1 1 200px !important; min-width: 170px !important; background: rgba(255,255,255,.07) !important; border: 1px solid rgba(255,255,255,.16) !important; border-radius: 16px !important; padding: 22px 20px !important; }
html body .pi-iq-wrap .pi-iq-kpi-v { font-family: 'DM Serif Display', Georgia, serif !important; font-size: 38px !important; line-height: 1 !important; color: #D3FA00 !important; margin-bottom: 7px !important; }
html body .pi-iq-wrap .pi-iq-kpi-v.pi-iq-kpi-o { color: #FF9A4D !important; }
html body .pi-iq-wrap .pi-iq-kpi-k { font-size: 14px !important; color: rgba(255,255,255,.72) !important; line-height: 1.45 !important; }

/* ---------- Callout ---------- */
html body .pi-iq-wrap .pi-iq-callout { background: #f4fbe1 !important; border-left: 5px solid #D3FA00 !important; border-radius: 0 16px 16px 0 !important; padding: 24px 28px !important; margin: 26px 0 !important; }
html body .pi-iq-wrap .pi-iq-callout-o { background: #fff6ee !important; border-left-color: #FF7A18 !important; }
html body .pi-iq-wrap .pi-iq-callout p:last-child { margin-bottom: 0 !important; }
html body .pi-iq-wrap .pi-iq-callout-title { font-weight: 700 !important; color: #00543D !important; margin-bottom: 7px !important; display: flex !important; align-items: center !important; gap: 9px !important; }

/* ---------- Myth / Fact ---------- */
html body .pi-iq-wrap .pi-iq-mf { display: flex !important; flex-wrap: wrap !important; gap: 20px !important; }
html body .pi-iq-wrap .pi-iq-mf-item { flex: 1 1 320px !important; min-width: 270px !important; border-radius: 18px !important; padding: 25px 26px !important; border: 1px solid #dfe8e2 !important; background: #ffffff !important; }
html body .pi-iq-wrap .pi-iq-mf-myth { border-top: 4px solid #FF7A18 !important; }
html body .pi-iq-wrap .pi-iq-mf-fact { border-top: 4px solid #12A06A !important; }
html body .pi-iq-wrap .pi-iq-mf-lbl { font-size: 11px !important; font-weight: 700 !important; letter-spacing: .14em !important; text-transform: uppercase !important; margin-bottom: 9px !important; }
html body .pi-iq-wrap .pi-iq-mf-myth .pi-iq-mf-lbl { color: #E85D04 !important; }
html body .pi-iq-wrap .pi-iq-mf-fact .pi-iq-mf-lbl { color: #0a6e50 !important; }
html body .pi-iq-wrap .pi-iq-mf-item p:last-child { margin-bottom: 0 !important; }

/* ---------- Standorte ---------- */
html body .pi-iq-wrap .pi-iq-locs { display: flex !important; flex-wrap: wrap !important; gap: 14px !important; }
html body .pi-iq-wrap .pi-iq-loc { flex: 1 1 200px !important; min-width: 170px !important; background: #ffffff !important; border: 1px solid #dfe8e2 !important; border-radius: 16px !important; padding: 20px 22px !important; text-decoration: none !important; transition: all .2s ease !important; display: block !important; }
html body .pi-iq-wrap .pi-iq-loc:hover { border-color: #FF7A18 !important; transform: translateY(-3px) !important; box-shadow: 0 12px 30px rgba(255,122,24,.14) !important; }
html body .pi-iq-wrap .pi-iq-loc-city { font-family: 'DM Serif Display', Georgia, serif !important; font-size: 22px !important; color: #00543D !important; margin-bottom: 3px !important; }
html body .pi-iq-wrap .pi-iq-loc-sub { font-size: 13px !important; color: #6b7d74 !important; }
html body .pi-iq-wrap .pi-iq-map { max-width: 300px !important; margin: 0 auto !important; }

/* ---------- Preise ---------- */
html body .pi-iq-wrap .pi-iq-price { flex: 1 1 280px !important; min-width: 250px !important; background: #ffffff !important; border: 1px solid #dfe8e2 !important; border-radius: 20px !important; padding: 28px 26px !important; position: relative !important; }
html body .pi-iq-wrap .pi-iq-price-hi { border: 2px solid #FF7A18 !important; box-shadow: 0 14px 40px rgba(255,122,24,.13) !important; }
html body .pi-iq-wrap .pi-iq-price-flag { position: absolute !important; top: -13px !important; left: 26px !important; background: #FF7A18 !important; color: #ffffff !important; font-size: 11px !important; font-weight: 700 !important; letter-spacing: .12em !important; text-transform: uppercase !important; padding: 5px 14px !important; border-radius: 999px !important; }
html body .pi-iq-wrap .pi-iq-price-amt { font-family: 'DM Serif Display', Georgia, serif !important; font-size: 36px !important; color: #00543D !important; margin: 8px 0 4px 0 !important; }
html body .pi-iq-wrap .pi-iq-price ul { list-style: none !important; padding: 0 !important; margin: 16px 0 20px 0 !important; }
html body .pi-iq-wrap .pi-iq-price li { position: relative !important; padding-left: 26px !important; font-size: 15px !important; margin-bottom: 9px !important; }
html body .pi-iq-wrap .pi-iq-price li::before { content: '' !important; position: absolute !important; left: 0 !important; top: 10px !important; width: 13px !important; height: 3px !important; background: #D3FA00 !important; border-radius: 2px !important; }

/* ---------- FAQ ---------- */
html body .pi-iq-wrap .pi-iq-faq-item { background: #ffffff !important; border: 1px solid #dfe8e2 !important; border-radius: 14px !important; margin-bottom: 12px !important; overflow: hidden !important; }
html body .pi-iq-wrap .pi-iq-faq-q { width: 100% !important; text-align: left !important; background: transparent !important; border: none !important; padding: 20px 56px 20px 24px !important; font-size: 17px !important; font-weight: 700 !important; color: #00543D !important; cursor: pointer !important; position: relative !important; font-family: 'DM Sans', sans-serif !important; line-height: 1.45 !important; }
html body .pi-iq-wrap .pi-iq-faq-q:hover { background: #f4fbe1 !important; }
html body .pi-iq-wrap .pi-iq-faq-q::after { content: '' !important; position: absolute !important; right: 24px !important; top: 50% !important; width: 11px !important; height: 11px !important; border-right: 2.5px solid #FF7A18 !important; border-bottom: 2.5px solid #FF7A18 !important; transform: translateY(-70%) rotate(45deg) !important; transition: transform .22s ease !important; }
html body .pi-iq-wrap .pi-iq-faq-item.pi-iq-open .pi-iq-faq-q::after { transform: translateY(-25%) rotate(-135deg) !important; }
html body .pi-iq-wrap .pi-iq-faq-a { max-height: 0 !important; overflow: hidden !important; transition: max-height .3s ease !important; }
html body .pi-iq-wrap .pi-iq-faq-a-in { padding: 0 24px 22px 24px !important; }
html body .pi-iq-wrap .pi-iq-faq-a p:last-child { margin-bottom: 0 !important; }

/* ---------- Quellen ---------- */
html body .pi-iq-wrap .pi-iq-src { list-style: none !important; padding: 0 !important; margin: 0 !important; }
html body .pi-iq-wrap .pi-iq-src li { position: relative !important; padding-left: 26px !important; font-size: 14.5px !important; color: #4a5c53 !important; margin-bottom: 11px !important; line-height: 1.55 !important; }
html body .pi-iq-wrap .pi-iq-src li::before { content: '' !important; position: absolute !important; left: 0 !important; top: 9px !important; width: 13px !important; height: 3px !important; background: #12A06A !important; border-radius: 2px !important; }

/* ---------- Autoren ---------- */
html body .pi-iq-wrap .pi-iq-authors { display: flex !important; flex-wrap: wrap !important; gap: 22px !important; }
html body .pi-iq-wrap .pi-iq-author { flex: 1 1 380px !important; min-width: 280px !important; background: #ffffff !important; border: 1px solid #dfe8e2 !important; border-radius: 20px !important; padding: 28px 26px !important; }
html body .pi-iq-wrap .pi-iq-author-top { display: flex !important; gap: 18px !important; align-items: center !important; margin-bottom: 16px !important; }
html body .pi-iq-wrap .pi-iq-author-img { width: 86px !important; height: 86px !important; border-radius: 50% !important; object-fit: cover !important; flex-shrink: 0 !important; border: 3px solid #D3FA00 !important; }
html body .pi-iq-wrap .pi-iq-author-name { font-family: 'DM Serif Display', Georgia, serif !important; font-size: 24px !important; color: #00543D !important; line-height: 1.2 !important; }
html body .pi-iq-wrap .pi-iq-author-role { font-size: 14px !important; color: #E85D04 !important; font-weight: 700 !important; margin-top: 3px !important; }
html body .pi-iq-wrap .pi-iq-author p { font-size: 15.5px !important; }
html body .pi-iq-wrap .pi-iq-chips { display: flex !important; flex-wrap: wrap !important; gap: 8px !important; margin-top: 14px !important; }
html body .pi-iq-wrap .pi-iq-chip { font-size: 12.5px !important; font-weight: 600 !important; color: #0a6e50 !important; background: #f4fbe1 !important; border: 1px solid #e2eecb !important; padding: 5px 12px !important; border-radius: 999px !important; }

/* ---------- Spoke-Nav ---------- */
html body .pi-iq-wrap .pi-iq-nav-group { margin-bottom: 26px !important; }
html body .pi-iq-wrap .pi-iq-nav-title { font-size: 12px !important; font-weight: 700 !important; letter-spacing: .15em !important; text-transform: uppercase !important; color: #D3FA00 !important; margin-bottom: 13px !important; display: flex !important; align-items: center !important; gap: 10px !important; }
html body .pi-iq-wrap .pi-iq-nav-title::after { content: '' !important; flex: 1 !important; height: 1px !important; background: rgba(255,255,255,.16) !important; }
html body .pi-iq-wrap .pi-iq-nav-links { display: flex !important; flex-wrap: wrap !important; gap: 9px !important; }
html body .pi-iq-wrap .pi-iq-nav-links a { display: inline-flex !important; align-items: center !important; background: rgba(255,255,255,.07) !important; border: 1px solid rgba(255,255,255,.15) !important; color: rgba(255,255,255,.92) !important; font-size: 14.5px !important; font-weight: 600 !important; padding: 9px 17px !important; border-radius: 999px !important; text-decoration: none !important; transition: all .18s ease !important; }
html body .pi-iq-wrap .pi-iq-nav-links a:hover { background: #D3FA00 !important; color: #00543D !important; border-color: #D3FA00 !important; transform: translateY(-2px) !important; }
html body .pi-iq-wrap .pi-iq-nav-links a.pi-iq-nav-o:hover { background: #FF7A18 !important; color: #ffffff !important; border-color: #FF7A18 !important; }

/* ---------- Final CTA ---------- */
html body .pi-iq-wrap .pi-iq-final { background: linear-gradient(140deg, #003A2A 0%, #00543D 60%, #0a6e50 100%) !important; border-radius: 26px !important; padding: 52px 44px !important; text-align: center !important; position: relative !important; overflow: hidden !important; }
html body .pi-iq-wrap .pi-iq-final::before { content: '' !important; position: absolute !important; left: -120px !important; bottom: -160px !important; width: 460px !important; height: 460px !important; border-radius: 50% !important; background: radial-gradient(circle, rgba(255,122,24,.20) 0%, transparent 66%) !important; }
html body .pi-iq-wrap .pi-iq-final-in { position: relative !important; z-index: 2 !important; }
html body .pi-iq-wrap .pi-iq-final .pi-iq-btnrow { justify-content: center !important; }

/* ---------- Responsive ---------- */
@media (max-width: 980px) {
  html body .pi-iq-wrap .pi-iq-h1 { font-size: 38px !important; }
  html body .pi-iq-wrap .pi-iq-h2 { font-size: 31px !important; }
  html body .pi-iq-wrap .pi-iq-hero-flex { gap: 34px !important; }
}
@media (max-width: 640px) {
  html body .pi-iq-wrap { font-size: 16.5px !important; }
  html body .pi-iq-wrap .pi-iq-sec { padding: 48px 16px !important; }
  html body .pi-iq-wrap .pi-iq-hero { padding: 26px 16px 54px 16px !important; }
  html body .pi-iq-wrap .pi-iq-h1 { font-size: 31px !important; }
  html body .pi-iq-wrap .pi-iq-h2 { font-size: 26px !important; }
  html body .pi-iq-wrap .pi-iq-lead { font-size: 17.5px !important; }
  html body .pi-iq-wrap .pi-iq-explorer { padding: 20px 18px !important; }
  html body .pi-iq-wrap .pi-iq-explorer-val { font-size: 42px !important; }
  html body .pi-iq-wrap .pi-iq-tldr, html body .pi-iq-toc { padding: 24px 20px !important; }
  html body .pi-iq-wrap .pi-iq-final { padding: 38px 22px !important; border-radius: 20px !important; }
  html body .pi-iq-wrap .pi-iq-btn { width: 100% !important; }
  html body .pi-iq-wrap .pi-iq-explorer-top { flex-direction: column !important; align-items: flex-start !important; }
  html body .pi-iq-wrap .pi-iq-explorer-class { text-align: left !important; }
}
@media (prefers-reduced-motion: reduce) {
  html body .pi-iq-wrap *, html body .pi-iq-progress-bar { transition: none !important; animation: none !important; }
  html body .pi-iq-wrap .pi-iq-card:hover, html body .pi-iq-loc:hover, html body .pi-iq-btn:hover { transform: none !important; }
}

/* ---------- Fix: gestapelte Karten (Column-Flex) ---------- */
html body .pi-iq-wrap .pi-iq-cards-stack { display: flex !important; flex-direction: column !important; gap: 16px !important; }
html body .pi-iq-wrap .pi-iq-cards-stack .pi-iq-card { flex: 0 0 auto !important; min-width: 0 !important; width: 100% !important; padding: 22px 24px !important; }
html body .pi-iq-wrap .pi-iq-cards-stack .pi-iq-card p { font-size: 15.5px !important; }
/* ---------- Fix: Bildmasse gegen globale img-Regel ---------- */
html body .pi-iq-wrap img.pi-iq-author-img { width: 86px !important; height: 86px !important; min-width: 86px !important; min-height: 86px !important; aspect-ratio: 1 / 1 !important; object-fit: cover !important; border-radius: 50% !important; display: block !important; }
/* ---------- Fix: Links in Buttons/Karten ---------- */
html body .pi-iq-wrap a.pi-iq-btn, html body .pi-iq-wrap a.pi-iq-loc, html body .pi-iq-wrap a.pi-iq-card-link, html body .pi-iq-wrap .pi-iq-toc-grid a, html body .pi-iq-wrap .pi-iq-nav-links a, html body .pi-iq-wrap .pi-iq-crumb a { text-decoration: none !important; }
html body .pi-iq-wrap a.pi-iq-btn-lime, html body .pi-iq-wrap a.pi-iq-btn-lime:hover { color: #00543D !important; }
html body .pi-iq-wrap a.pi-iq-btn-orange, html body .pi-iq-wrap a.pi-iq-btn-orange:hover, html body .pi-iq-wrap a.pi-iq-btn-green, html body .pi-iq-wrap a.pi-iq-btn-green:hover, html body .pi-iq-wrap a.pi-iq-btn-ghost, html body .pi-iq-wrap a.pi-iq-btn-ghost:hover { color: #ffffff !important; }
html body .pi-iq-wrap a.pi-iq-btn-outline { color: #00543D !important; }
html body .pi-iq-wrap a.pi-iq-btn-outline:hover { color: #ffffff !important; }
/* ---------- Fix: Textfarben auf dunklem Grund ---------- */
html body .pi-iq-wrap .pi-iq-hero-sub, html body .pi-iq-wrap p.pi-iq-hero-sub { color: rgba(255,255,255,.86) !important; }
html body .pi-iq-wrap .pi-iq-lead-w, html body .pi-iq-wrap p.pi-iq-lead-w { color: rgba(255,255,255,.85) !important; }
html body .pi-iq-wrap .pi-iq-explorer-note, html body .pi-iq-wrap p.pi-iq-explorer-note { color: rgba(255,255,255,.62) !important; }
html body .pi-iq-wrap .pi-iq-sec-deep p { color: rgba(255,255,255,.82) !important; }
html body .pi-iq-wrap .pi-iq-sec-deep li { color: rgba(255,255,255,.82) !important; }
html body .pi-iq-wrap .pi-iq-sec-deep .pi-iq-tablewrap p, html body .pi-iq-wrap .pi-iq-sec-deep .pi-iq-table td { color: #34453d !important; }
html body .pi-iq-wrap .pi-iq-sec-deep a { color: #D3FA00 !important; }
html body .pi-iq-wrap .pi-iq-sec-deep a:hover { color: #ffffff !important; }
html body .pi-iq-wrap .pi-iq-sec-deep .pi-iq-table a { color: #00543D !important; }
html body .pi-iq-wrap .pi-iq-sec-deep .pi-iq-btn-lime { color: #00543D !important; }
html body .pi-iq-wrap .pi-iq-hero a:not(.pi-iq-btn) { color: rgba(255,255,255,.80) !important; }
html body .pi-iq-wrap .pi-iq-hero a:not(.pi-iq-btn):hover { color: #D3FA00 !important; }
html body .pi-iq-wrap .pi-iq-explorer a { color: #D3FA00 !important; }
/* ---------- Fix: kompaktere Vertikalrhythmik ---------- */
html body .pi-iq-wrap .pi-iq-sec { padding: 58px 20px !important; }
html body .pi-iq-wrap .pi-iq-card { padding: 24px 24px !important; }
html body .pi-iq-wrap .pi-iq-split { gap: 36px !important; }
@media (max-width: 640px) {
  html body .pi-iq-wrap .pi-iq-sec { padding: 40px 16px !important; }
  html body .pi-iq-wrap .pi-iq-cards { gap: 14px !important; }
  html body .pi-iq-wrap .pi-iq-card { padding: 20px 20px !important; }
  html body .pi-iq-wrap .pi-iq-split { gap: 28px !important; }
  html body .pi-iq-wrap .pi-iq-steps { gap: 14px !important; }
  html body .pi-iq-wrap .pi-iq-mf-item { padding: 20px 20px !important; }
  html body .pi-iq-wrap .pi-iq-author { padding: 22px 20px !important; }
  html body .pi-iq-wrap .pi-iq-author-top { gap: 14px !important; }
}

/* ---------- Bildkomponenten ---------- */
html body .pi-iq-wrap .pi-iq-figure { margin: 0 0 8px 0 !important; border-radius: 18px !important; overflow: hidden !important; border: 1px solid #dfe8e2 !important; background: #f4fbe1 !important; }
html body .pi-iq-wrap img.pi-iq-figure-img { width: 100% !important; height: auto !important; aspect-ratio: 3 / 2 !important; object-fit: cover !important; display: block !important; }
html body .pi-iq-wrap .pi-iq-figcap { font-size: 13px !important; color: #6b7d74 !important; font-style: italic !important; line-height: 1.5 !important; margin: 10px 2px 0 2px !important; }

html body .pi-iq-wrap .pi-iq-card-media { margin: -24px -24px 18px -24px !important; border-radius: 18px 18px 0 0 !important; overflow: hidden !important; }
html body .pi-iq-wrap img.pi-iq-card-img { width: 100% !important; height: auto !important; aspect-ratio: 16 / 9 !important; object-fit: cover !important; display: block !important; }

html body .pi-iq-wrap .pi-iq-banner { position: relative !important; border-radius: 22px !important; overflow: hidden !important; margin-top: 40px !important; min-height: 260px !important; display: flex !important; align-items: flex-end !important; }
html body .pi-iq-wrap img.pi-iq-banner-img { position: absolute !important; inset: 0 !important; width: 100% !important; height: 100% !important; object-fit: cover !important; display: block !important; }
html body .pi-iq-wrap .pi-iq-banner-veil { position: absolute !important; inset: 0 !important; background: linear-gradient(100deg, rgba(0,58,42,.93) 0%, rgba(0,84,61,.82) 42%, rgba(10,110,80,.42) 100%) !important; }
html body .pi-iq-wrap .pi-iq-banner-body { position: relative !important; z-index: 2 !important; padding: 34px 34px !important; max-width: 660px !important; }
html body .pi-iq-wrap .pi-iq-banner-body p { color: rgba(255,255,255,.86) !important; margin-bottom: 18px !important; }
html body .pi-iq-wrap .pi-iq-banner-body a:not(.pi-iq-btn) { color: #D3FA00 !important; }
@media (max-width: 640px) {
  html body .pi-iq-wrap .pi-iq-card-media { margin: -20px -20px 16px -20px !important; }
  html body .pi-iq-wrap .pi-iq-banner-body { padding: 26px 22px !important; }
  html body .pi-iq-wrap .pi-iq-banner { min-height: 300px !important; }
}

/* ---------- TOC als kompakte Wolke ---------- */
html body .pi-iq-wrap .pi-iq-toc { padding: 22px 22px !important; }
html body .pi-iq-wrap .pi-iq-toc-grid { gap: 7px !important; }
html body .pi-iq-wrap .pi-iq-toc-grid a { font-size: 13.5px !important; font-weight: 600 !important; padding: 6px 13px !important; gap: 6px !important; line-height: 1.35 !important; letter-spacing: -0.005em !important; }
html body .pi-iq-wrap .pi-iq-toc-num { font-size: 10px !important; font-weight: 700 !important; letter-spacing: .04em !important; opacity: .85 !important; }
html body .pi-iq-wrap .pi-iq-toc .pi-iq-h3 { font-size: 15px !important; letter-spacing: .01em !important; margin-bottom: 13px !important; }
@media (max-width: 640px) {
  html body .pi-iq-wrap .pi-iq-toc { padding: 18px 16px !important; }
  html body .pi-iq-wrap .pi-iq-toc-grid { gap: 6px !important; }
  html body .pi-iq-wrap .pi-iq-toc-grid a { font-size: 12.5px !important; padding: 5px 11px !important; gap: 5px !important; }
  html body .pi-iq-wrap .pi-iq-toc-num { font-size: 9.5px !important; }
}

/* ---------- Grafik-Container ---------- */
html body .pi-iq-wrap .pi-iq-viz { background: #ffffff !important; border: 1px solid #dfe8e2 !important; border-radius: 20px !important; padding: 26px 24px 20px 24px !important; margin: 26px 0 0 0 !important; }
html body .pi-iq-wrap .pi-iq-viz-dark { background: rgba(255,255,255,.055) !important; border: 1px solid rgba(255,255,255,.16) !important; }
html body .pi-iq-wrap .pi-iq-viz-title { font-size: 12px !important; font-weight: 700 !important; letter-spacing: .14em !important; text-transform: uppercase !important; color: #0a6e50 !important; margin-bottom: 16px !important; display: flex !important; align-items: center !important; gap: 10px !important; }
html body .pi-iq-wrap .pi-iq-viz-title::before { content: '' !important; width: 22px !important; height: 3px !important; background: #FF7A18 !important; border-radius: 2px !important; flex-shrink: 0 !important; }
html body .pi-iq-wrap .pi-iq-viz-dark .pi-iq-viz-title { color: #D3FA00 !important; }
html body .pi-iq-wrap .pi-iq-viz svg { width: 100% !important; height: auto !important; display: block !important; overflow: visible !important; }
html body .pi-iq-wrap .pi-iq-viz-cap { font-size: 13px !important; color: #6b7d74 !important; line-height: 1.55 !important; margin: 16px 0 0 0 !important; font-style: italic !important; }
html body .pi-iq-wrap .pi-iq-viz-dark .pi-iq-viz-cap { color: rgba(255,255,255,.62) !important; }
html body .pi-iq-wrap .pi-iq-viz-legend { display: flex !important; flex-wrap: wrap !important; gap: 8px 20px !important; margin-top: 14px !important; }
html body .pi-iq-wrap .pi-iq-viz-key { display: inline-flex !important; align-items: center !important; gap: 8px !important; font-size: 13px !important; font-weight: 600 !important; color: #34453d !important; }
html body .pi-iq-wrap .pi-iq-viz-dot { width: 12px !important; height: 12px !important; border-radius: 3px !important; flex-shrink: 0 !important; }
/* Hero-Matrizenmuster */
html body .pi-iq-wrap .pi-iq-hero-pattern { position: absolute !important; right: -40px !important; bottom: -60px !important; width: 460px !important; max-width: 62% !important; opacity: .13 !important; pointer-events: none !important; z-index: 1 !important; }
@media (max-width: 980px) { html body .pi-iq-wrap .pi-iq-hero-pattern { display: none !important; } }
@media (max-width: 640px) {
  html body .pi-iq-wrap .pi-iq-viz { padding: 20px 16px 16px 16px !important; margin-top: 20px !important; }
  html body .pi-iq-wrap .pi-iq-viz-cap { font-size: 12.5px !important; }
}

/* ---------- Externe Quellenlinks ---------- */
html body .pi-iq-wrap .pi-iq-src a[target="_blank"]::after, html body .pi-iq-wrap p a[target="_blank"]::after { content: '' !important; display: inline-block !important; width: 9px !important; height: 9px !important; margin-left: 4px !important; border-top: 1.6px solid currentColor !important; border-right: 1.6px solid currentColor !important; transform: rotate(45deg) translate(-1px,1px) !important; opacity: .55 !important; }

/* ---------- Beispielaufgaben ---------- */
html body .pi-iq-wrap .pi-iq-task { background: #ffffff !important; border: 1px solid #dfe8e2 !important; border-radius: 20px !important; padding: 26px 26px !important; margin-bottom: 18px !important; }
html body .pi-iq-wrap .pi-iq-task-head { display: flex !important; align-items: center !important; gap: 12px !important; margin-bottom: 16px !important; flex-wrap: wrap !important; }
html body .pi-iq-wrap .pi-iq-task-n { width: 30px !important; height: 30px !important; border-radius: 9px !important; background: #00543D !important; color: #D3FA00 !important; display: flex !important; align-items: center !important; justify-content: center !important; font-weight: 700 !important; font-size: 14px !important; flex-shrink: 0 !important; }
html body .pi-iq-wrap .pi-iq-task-kind { font-size: 11px !important; font-weight: 700 !important; letter-spacing: .12em !important; text-transform: uppercase !important; color: #E85D04 !important; background: #fff1e5 !important; padding: 4px 11px !important; border-radius: 999px !important; }
html body .pi-iq-wrap .pi-iq-task-q { font-size: 16.5px !important; font-weight: 700 !important; color: #00543D !important; margin: 0 0 16px 0 !important; }
html body .pi-iq-wrap .pi-iq-task-stim { background: #f4fbe1 !important; border-radius: 14px !important; padding: 18px !important; margin-bottom: 18px !important; }
html body .pi-iq-wrap .pi-iq-task-stim svg { width: 100% !important; height: auto !important; display: block !important; max-width: 460px !important; margin: 0 auto !important; }
html body .pi-iq-wrap .pi-iq-seq { font-family: 'DM Serif Display', Georgia, serif !important; font-size: 30px !important; color: #00543D !important; text-align: center !important; letter-spacing: .06em !important; margin: 6px 0 !important; }
html body .pi-iq-wrap .pi-iq-opts { display: flex !important; flex-wrap: wrap !important; gap: 10px !important; }
html body .pi-iq-wrap .pi-iq-opt { flex: 1 1 100px !important; min-width: 84px !important; background: #ffffff !important; border: 2px solid #dfe8e2 !important; border-radius: 14px !important; padding: 13px 10px !important; cursor: pointer !important; font-family: 'DM Sans', sans-serif !important; font-size: 15.5px !important; font-weight: 700 !important; color: #00543D !important; transition: all .16s ease !important; text-align: center !important; }
html body .pi-iq-wrap .pi-iq-opt:hover { border-color: #12A06A !important; transform: translateY(-2px) !important; }
html body .pi-iq-wrap .pi-iq-opt svg { width: 100% !important; height: auto !important; max-width: 62px !important; margin: 0 auto !important; display: block !important; }
html body .pi-iq-wrap .pi-iq-opt.pi-iq-right { border-color: #12A06A !important; background: #e8f6ee !important; }
html body .pi-iq-wrap .pi-iq-opt.pi-iq-wrong { border-color: #FF7A18 !important; background: #fff1e5 !important; opacity: .75 !important; }
html body .pi-iq-wrap .pi-iq-sol { display: none !important; margin-top: 16px !important; background: #f4fbe1 !important; border-left: 4px solid #D3FA00 !important; border-radius: 0 12px 12px 0 !important; padding: 15px 18px !important; }
html body .pi-iq-wrap .pi-iq-sol.pi-iq-vis { display: block !important; }
html body .pi-iq-wrap .pi-iq-sol p { margin: 0 !important; font-size: 15px !important; }
html body .pi-iq-wrap .pi-iq-sol-lbl { font-size: 11px !important; font-weight: 700 !important; letter-spacing: .12em !important; text-transform: uppercase !important; color: #0a6e50 !important; margin-bottom: 6px !important; }
@media (max-width: 640px) {
  html body .pi-iq-wrap .pi-iq-task { padding: 20px 18px !important; }
  html body .pi-iq-wrap .pi-iq-seq { font-size: 23px !important; }
  html body .pi-iq-wrap .pi-iq-opt { font-size: 14.5px !important; padding: 11px 8px !important; }
}

/* FIX: Open-State des FAQ-Akkordeons (schlaegt die !important-Regel des geschlossenen Zustands) */
html body .pi-iq-wrap .pi-iq-faq-item.pi-iq-open .pi-iq-faq-a { max-height: 1500px !important; }

/* FIX: Hero-Spalte auf sehr schmalen Geraeten (min-width 300px sprengt sonst den 320px-Viewport) */
@media (max-width: 600px) { html body .pi-iq-wrap .pi-iq-hero-col { min-width: 0 !important; } }

/* --- Grafiken Kosten- und Hochbegabungsseite (29.08.2026) --- */
html body .pi-iq-wrap .pi-iq-viz svg.pi-iq-svgd { display: block !important; max-width: 720px !important; margin: 0 auto !important; }
html body .pi-iq-wrap .pi-iq-viz svg.pi-iq-svgm { display: none !important; }
html body .pi-iq-wrap table.pi-iq-table tr.pi-iq-own td { background: #EDF7F1 !important; }
@media (max-width: 700px) {
html body .pi-iq-wrap .pi-iq-viz svg.pi-iq-svgd { display: none !important; }
html body .pi-iq-wrap .pi-iq-viz svg.pi-iq-svgm { display: block !important; max-width: none !important; }
}

/* --- Fix: Weiterlesen auf hellem Grund (29.08.2026) --- */
html body .pi-iq-wrap .pi-iq-sec:not(.pi-iq-sec-deep) .pi-iq-nav-title { color: #0a6e50 !important; }
html body .pi-iq-wrap .pi-iq-sec:not(.pi-iq-sec-deep) .pi-iq-nav-title::after { background: #DCEAE2 !important; }
html body .pi-iq-wrap .pi-iq-sec:not(.pi-iq-sec-deep) .pi-iq-nav-links a { background: #FFFFFF !important; border: 1px solid #DCEAE2 !important; color: #00543D !important; }
html body .pi-iq-wrap .pi-iq-sec:not(.pi-iq-sec-deep) .pi-iq-nav-links a:hover { background: #00543D !important; border-color: #00543D !important; color: #FFFFFF !important; }

/* ============================================================
   LESBARKEITS-FIX 30.08.2026
   Anlass: Faktenkacheln im Hero liefen ineinander ("zu gedraengt"),
   dazu 8 Stellen unter 4,5:1 Kontrast und drei helle Inseln in
   dunklen Sektionen, die die Hell-auf-Dunkel-Regeln geerbt haben.
   Gilt fuer alle Seiten, die stadt.css laden.
   ============================================================ */

/* --- 1) Hero-Faktenkacheln: Label und Wert werden auf 6 der 7
       Seiten als <span> ausgeliefert und standen deshalb in einer
       Zeile ("VERFAHRENIST 2000 R"). Beide auf Block. --- */
html body .pi-iq-wrap .pi-iq-explorer-fact-k { display: block !important; font-size: 11px !important; line-height: 1.25 !important; color: #C6E3D5 !important; margin-bottom: 4px !important; }
html body .pi-iq-wrap .pi-iq-explorer-fact-v { display: block !important; font-size: 16px !important; line-height: 1.34 !important; margin-top: 0 !important; -webkit-hyphens: auto !important; hyphens: auto !important; }
html body .pi-iq-wrap .pi-iq-explorer-fact { flex: 1 1 132px !important; padding: 13px 15px !important; background: rgba(0,0,0,.26) !important; }
html body .pi-iq-wrap .pi-iq-explorer-facts { gap: 11px !important; }

@media (max-width: 480px) {
  html body .pi-iq-wrap .pi-iq-explorer-facts { flex-direction: column !important; gap: 9px !important; }
  html body .pi-iq-wrap .pi-iq-explorer-fact { flex: 0 0 auto !important; width: 100% !important; min-width: 0 !important; padding: 12px 15px !important; }
  html body .pi-iq-wrap .pi-iq-explorer-fact-v { font-size: 15.5px !important; }
}

/* --- 2) Glaskarte im Hero abdunkeln statt aufhellen: die kleinen
       Labels lagen am hellen Verlaufsende bei 2,8-3,2:1 --- */
html body .pi-iq-wrap .pi-iq-explorer { background: rgba(0,44,32,.42) !important; border-color: rgba(255,255,255,.20) !important; }
html body .pi-iq-wrap .pi-iq-explorer-lbl { color: #C6E3D5 !important; }
html body .pi-iq-wrap .pi-iq-explorer-note,
html body .pi-iq-wrap p.pi-iq-explorer-note { color: #D5E9DE !important; }

/* --- 3) Kleintexte direkt auf dem Verlauf: Volltonwerte statt
       rgba-Transparenzen (Hausregel seit 26.08.) --- */
html body .pi-iq-wrap .pi-iq-crumb { color: #CFE6DA !important; }
html body .pi-iq-wrap .pi-iq-hero-meta { color: #CFE6DA !important; }
html body .pi-iq-wrap .pi-iq-hero-meta a,
html body .pi-iq-wrap .pi-iq-hero a:not(.pi-iq-btn),
html body .pi-iq-wrap .pi-iq-crumb a { color: #EAF6EF !important; }
html body .pi-iq-wrap .pi-iq-hero-sub,
html body .pi-iq-wrap p.pi-iq-hero-sub { color: #E4F2EA !important; }
html body .pi-iq-wrap .pi-iq-lead-w,
html body .pi-iq-wrap p.pi-iq-lead-w { color: #E4F2EA !important; }
html body .pi-iq-wrap .pi-iq-sec-deep p { color: #E0EFE7 !important; }
html body .pi-iq-wrap .pi-iq-sec-deep li { color: #E0EFE7 !important; }
html body .pi-iq-wrap .pi-iq-kpi { background: rgba(0,44,32,.30) !important; }
html body .pi-iq-wrap .pi-iq-kpi-k { color: #E6F6ED !important; }

/* Badge: Limette auf limettengetoenter Flaeche kam am hellen
   Verlaufsende nur auf 4,0:1 - Grund abdunkeln */
html body .pi-iq-wrap .pi-iq-hero-badge { background: rgba(0,44,32,.55) !important; border-color: rgba(211,250,0,.55) !important; }

/* --- 4) Kontraste auf hellem Grund --- */
html body .pi-iq-wrap .pi-iq-caption,
html body .pi-iq-wrap p.pi-iq-caption,
html body .pi-iq-wrap .pi-iq-viz-cap,
html body .pi-iq-wrap .pi-iq-figcap { color: #59695F !important; }
html body .pi-iq-wrap .pi-iq-author-role { color: #C2410C !important; }
html body .pi-iq-wrap .pi-iq-price-flag { color: #003A2A !important; }

/* --- 5) Helle Inseln in dunklen Sektionen: Callouts, Karten und
       FAQ erbten sonst die Hell-auf-Dunkel-Textfarben (weisse
       Schrift auf cremefarbenem Grund) --- */
html body .pi-iq-wrap .pi-iq-sec-deep .pi-iq-callout p,
html body .pi-iq-wrap .pi-iq-sec-deep .pi-iq-callout li,
html body .pi-iq-wrap .pi-iq-sec-deep .pi-iq-card p,
html body .pi-iq-wrap .pi-iq-sec-deep .pi-iq-card li,
html body .pi-iq-wrap .pi-iq-sec-deep .pi-iq-faq-item p,
html body .pi-iq-wrap .pi-iq-sec-deep .pi-iq-faq-item li,
html body .pi-iq-wrap .pi-iq-sec-deep .pi-iq-price p,
html body .pi-iq-wrap .pi-iq-sec-deep .pi-iq-price li { color: #34453d !important; }

html body .pi-iq-wrap .pi-iq-sec-deep .pi-iq-callout strong,
html body .pi-iq-wrap .pi-iq-sec-deep .pi-iq-callout a,
html body .pi-iq-wrap .pi-iq-sec-deep .pi-iq-card strong,
html body .pi-iq-wrap .pi-iq-sec-deep .pi-iq-card a,
html body .pi-iq-wrap .pi-iq-sec-deep .pi-iq-faq-item strong,
html body .pi-iq-wrap .pi-iq-sec-deep .pi-iq-faq-item a,
html body .pi-iq-wrap .pi-iq-sec-deep .pi-iq-price strong { color: #00543D !important; }

/* --- 6) Fliesstext, der direkt im Container einer dunklen Sektion
       haengt, und <strong> darin: standen in Dunkelgruen auf
       Dunkelgruen (praktisch unsichtbar) --- */
html body .pi-iq-wrap .pi-iq-sec-deep .pi-iq-inner,
html body .pi-iq-wrap .pi-iq-sec-deep .pi-iq-narrow { color: #E0EFE7 !important; }
html body .pi-iq-wrap .pi-iq-sec-deep .pi-iq-inner > p strong,
html body .pi-iq-wrap .pi-iq-sec-deep .pi-iq-narrow > p strong,
html body .pi-iq-wrap .pi-iq-sec-deep .pi-iq-inner > ul strong,
html body .pi-iq-wrap .pi-iq-sec-deep .pi-iq-narrow > ul strong,
html body .pi-iq-wrap .pi-iq-sec-deep .pi-iq-kpi strong,
html body .pi-iq-wrap .pi-iq-sec-deep .pi-iq-lead strong,
html body .pi-iq-wrap .pi-iq-sec-deep .pi-iq-lead-w strong { color: #ffffff !important; }

/* --- 7) Etwas mehr Luft im Fliesstext (Jan: "zu gedraengt") --- */
html body .pi-iq-wrap .pi-iq-lead { line-height: 1.68 !important; }
html body .pi-iq-wrap .pi-iq-callout { padding: 22px 26px !important; }

@media (max-width: 600px) {
  html body .pi-iq-wrap .pi-iq-explorer { padding: 20px 17px !important; }
  html body .pi-iq-wrap .pi-iq-hero-meta { gap: 7px 16px !important; }
}

/* ============================================================
   LESBARKEITS-FIX TEIL 2 · 30.08.2026
   Orange auf hellen Toenen lag bei 3,2-3,5:1, Orange-Buttons mit
   heller Schrift bei 2,2:1. Dunkleres Orange fuer Kleintext,
   dunkelgruene Schrift auf orangefarbenen Buttons.
   ============================================================ */
html body .pi-iq-wrap .pi-iq-card-tag,
html body .pi-iq-wrap .pi-iq-eyebrow-o,
html body .pi-iq-wrap .pi-iq-tl-year,
html body .pi-iq-wrap .pi-iq-mf-lbl,
html body .pi-iq-wrap .pi-iq-task-kind,
html body .pi-iq-wrap .pi-iq-sol-lbl,
html body .pi-iq-wrap .pi-iq-author-role,
html body .pi-iq-wrap .pi-iq-explorer-pr { color: #B4450A !important; }

html body .pi-iq-wrap a.pi-iq-btn-orange,
html body .pi-iq-wrap a.pi-iq-btn-orange:hover,
html body .pi-iq-wrap .pi-iq-btn-orange { color: #003A2A !important; }

html body .pi-iq-wrap .pi-iq-loc-sub,
html body .pi-iq-wrap .pi-iq-table td small,
html body .pi-iq-wrap .pi-iq-src li,
html body .pi-iq-wrap small { color: #59695F !important; }

/* 07.09.2026: TOC-Kopf (neue Spokes Gutachten, Wann sinnvoll, Mensa) */
html body .pi-iq-wrap .pi-iq-toc-head { display:block !important; margin-bottom:14px !important; }