/**
 * Immobiliengalerie – Kapitalanlage-Seite (Widgets ig-anlage-*).
 * Baut auf ig-pages.css auf (Farben, Abstände, Buttons). Nur CI-Farben:
 * Navy, Hellblau, helle Blautöne, Weiß.
 */

.iga-visual,
.iga-cf,
.iga-ges,
.iga-inv,
.iga-strat,
.iga-note,
.iga-check {
    font-family: "Plus Jakarta Sans", sans-serif;
    color: var(--ig-navy);
}

.iga-cf ul, .iga-ges ul, .iga-strat ul, .iga-strat ol, .iga-inv ul, .iga-check ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

.iga-cf li, .iga-strat li, .iga-inv li, .iga-check li { margin: 0; }

/* Eigene display-Regeln dürfen das hidden-Attribut nicht aushebeln. */
.iga-check [hidden],
.iga-check[hidden],
.iga-strat [hidden] { display: none !important; }

/* ===================================================================== */
/* Hero-Bild mit schwebender Karte                                        */
/* ===================================================================== */

.iga-visual { margin: 0; }

.iga-visual__card {
    position: absolute;
    left: -30px;
    bottom: 36px;
    width: 260px;
    padding: 16px 18px 14px;
    border-radius: var(--ig-radius);
    background: #fff;
    box-shadow: 0 18px 40px rgba(0, 68, 91, 0.18);
    animation: iga-float 7s ease-in-out infinite;
}

.iga-visual__card strong {
    display: block;
    font-size: 14px;
    line-height: 1.35;
    font-weight: 700;
    color: var(--ig-navy);
}

.iga-visual__card svg {
    display: block;
    width: 100%;
    height: auto;
    margin: 10px 0 8px;
    overflow: visible;
}

.iga-visual__grid { stroke: var(--ig-line); stroke-width: 1; fill: none; }

.iga-visual__up,
.iga-visual__down {
    fill: none;
    stroke-linecap: round;
    stroke-dasharray: 1;
    stroke-dashoffset: 1;
    animation: iga-draw 1.4s 0.5s cubic-bezier(0.65, 0, 0.35, 1) forwards;
}

.iga-visual__up { stroke: var(--ig-blue); stroke-width: 3.5; }
.iga-visual__down { stroke: rgba(0, 68, 91, 0.45); stroke-width: 3; animation-delay: 0.75s; }

.iga-visual__legend {
    display: flex;
    flex-wrap: wrap;
    gap: 4px 14px;
    font-size: 12.5px;
    font-weight: 600;
    color: var(--ig-muted);
}

.iga-visual__legend span {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.iga-visual__legend span::before {
    content: "";
    width: 14px;
    height: 3px;
    border-radius: 3px;
    background: var(--ig-blue);
}

.iga-visual__legend .is-down::before { background: rgba(0, 68, 91, 0.45); }

@keyframes iga-draw { to { stroke-dashoffset: 0; } }

@keyframes iga-float {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-6px); }
}

/* ===================================================================== */
/* Cashflow heute / morgen                                                */
/* ===================================================================== */

.iga-cf__pair {
    position: relative;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--ig-gap);
}

.iga-cf__card {
    display: flex;
    flex-direction: column;
    padding: 36px;
    border-radius: 22px;
    border: 1px solid var(--ig-line);
    background: #fff;
    transition: opacity 0.6s ease, transform 0.6s cubic-bezier(0.22, 1, 0.36, 1);
}

.iga-cf__card--tomorrow {
    border-color: var(--ig-navy);
    background: var(--ig-navy);
    color: #fff;
    transition-delay: 0.12s;
}

.ig-js .iga-cf__card[data-ig-reveal]:not(.is-visible) {
    opacity: 0;
    transform: translateY(18px);
}

.iga-cf__top {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-bottom: 24px;
}

.iga-cf__icon {
    display: inline-grid;
    place-items: center;
    flex: 0 0 52px;
    width: 52px;
    height: 52px;
    border-radius: 16px;
    background: var(--ig-sky);
    color: var(--ig-navy);
}

.iga-cf__card--tomorrow .iga-cf__icon { background: rgba(255, 255, 255, 0.12); color: #7fdcf5; }

.iga-cf__icon .ig-icon { width: 26px; height: 26px; stroke-width: 1.8; }

.iga-cf__tag {
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 1px;
    text-transform: uppercase;
    color: var(--ig-blue);
}

.iga-cf__card--tomorrow .iga-cf__tag { color: #7fdcf5; }

.iga-cf__spark {
    width: 120px;
    height: 48px;
    margin-left: auto;
    overflow: visible;
}

.iga-cf__card--today .iga-cf__spark path { fill: rgba(0, 178, 227, 0.22); stroke: var(--ig-blue); stroke-width: 1.5; }

.iga-cf__card--tomorrow .iga-cf__spark path {
    fill: none;
    stroke: var(--ig-blue);
    stroke-width: 4;
    stroke-linecap: round;
    stroke-dasharray: 1;
    stroke-dashoffset: 0;
    transition: stroke-dashoffset 1.2s 0.4s cubic-bezier(0.65, 0, 0.35, 1);
}

.ig-js .iga-cf__card--tomorrow:not(.is-visible) .iga-cf__spark path { stroke-dashoffset: 1; }

.iga-cf .iga-cf__title {
    margin: 0 0 12px;
    font-size: clamp(22px, 2.2vw, 26px);
    line-height: 1.3;
    font-weight: 700;
    text-transform: none;
    color: inherit;
}

.iga-cf p.iga-cf__text {
    margin: 0;
    font-size: 16px;
    line-height: 1.7;
    color: var(--ig-muted);
}

.iga-cf__card--tomorrow p.iga-cf__text { color: rgba(255, 255, 255, 0.78); }

.iga-cf p.iga-cf__label {
    margin: 26px 0 12px;
    font-size: 12.5px;
    font-weight: 700;
    letter-spacing: 1px;
    text-transform: uppercase;
    color: var(--ig-muted);
}

.iga-cf__card--tomorrow p.iga-cf__label { color: rgba(255, 255, 255, 0.6); }

.iga-cf__fit { display: grid; gap: 10px; }

.iga-cf__fit li {
    position: relative;
    padding-left: 30px;
    font-size: 15.5px;
    line-height: 1.5;
    font-weight: 600;
}

.iga-cf__fit li::before {
    content: "";
    position: absolute;
    left: 0;
    top: 1px;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background: var(--ig-blue) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 12.5l4 4 8-9' fill='none' stroke='%23fff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat center / 12px;
}

.iga-cf p.iga-cf__label--ways { margin-top: auto; padding-top: 26px; }

.iga-cf__ways {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.iga-cf__ways li {
    padding: 7px 14px;
    border-radius: 50px;
    background: var(--ig-sky-soft);
    border: 1px solid var(--ig-line);
    font-size: 14px;
    font-weight: 600;
}

.iga-cf__card--tomorrow .iga-cf__ways li { background: rgba(255, 255, 255, 0.08); border-color: rgba(255, 255, 255, 0.18); }

.iga-cf__or {
    position: absolute;
    left: 50%;
    top: 50%;
    z-index: 2;
    display: grid;
    place-items: center;
    width: 60px;
    height: 60px;
    border-radius: 50%;
    background: #fff;
    border: 6px solid var(--ig-sky);
    transform: translate(-50%, -50%);
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 0.5px;
    text-transform: uppercase;
    color: var(--ig-navy);
}

.iga-cf__factors { margin-top: 70px; }

.iga-cf .iga-cf__factors-title {
    margin: 0 0 24px;
    font-size: 22px;
    line-height: 1.3;
    font-weight: 700;
    text-transform: none;
    color: var(--ig-navy);
}

.iga-cf__grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 16px;
}

.iga-cf__grid li {
    display: grid;
    grid-template-columns: 44px minmax(0, 1fr);
    column-gap: 14px;
    row-gap: 2px;
    align-items: start;
    padding: 20px;
    border-radius: var(--ig-radius);
    background: var(--ig-sky-soft);
    transition: opacity 0.5s ease, transform 0.5s cubic-bezier(0.22, 1, 0.36, 1);
    transition-delay: calc(var(--ig-i, 0) * 0.06s);
}

.ig-js .iga-cf__grid:not(.is-visible) li { opacity: 0; transform: translateY(12px); }

.iga-cf__ficon {
    grid-row: span 2;
    display: grid;
    place-items: center;
    width: 44px;
    height: 44px;
    border-radius: 12px;
    background: #fff;
    color: var(--ig-blue);
}

.iga-cf__ficon .ig-icon { width: 22px; height: 22px; stroke-width: 2; }
.iga-cf__grid strong { font-size: 16px; line-height: 1.35; font-weight: 700; }
.iga-cf__grid li > span:last-child { font-size: 14px; line-height: 1.5; color: var(--ig-muted); }

/* ===================================================================== */
/* Formel GES                                                             */
/* ===================================================================== */

.iga-ges {
    display: grid;
    grid-template-columns: minmax(0, 1.15fr) minmax(0, 0.85fr);
    gap: var(--ig-gap);
    align-items: start;
}

.iga-ges__chart {
    margin: 0;
    padding: 26px 24px 20px;
    border-radius: 22px;
    background: #fff;
    border: 1px solid var(--ig-line);
    box-shadow: var(--ig-shadow);
}

.iga-ges__chart svg { display: block; width: 100%; height: auto; overflow: visible; }

.iga-ges__grid path { stroke: var(--ig-line); stroke-width: 1; fill: none; }
.iga-ges__grid path.is-base { stroke: rgba(0, 68, 91, 0.3); stroke-dasharray: 4 4; }
.iga-ges__grid text { fill: var(--ig-muted); font: 600 13px "Plus Jakarta Sans", sans-serif; }

.iga-ges .iga-ges__ten { stroke: var(--ig-blue); stroke-dasharray: 5 5; opacity: 0.7; }

.iga-ges__line {
    fill: none;
    stroke-width: 3.5;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-dasharray: 1;
    stroke-dashoffset: 0;
    transition: stroke-dashoffset 1.6s cubic-bezier(0.65, 0, 0.35, 1);
    transition-delay: calc(var(--ig-i, 0) * 0.25s);
}

.iga-ges__series circle,
.iga-ges__series text {
    transition: opacity 0.5s ease;
    transition-delay: calc(1.2s + var(--ig-i, 0) * 0.25s);
}

.ig-js .iga-ges__chart:not(.is-visible) .iga-ges__line { stroke-dashoffset: 1; }
.ig-js .iga-ges__chart:not(.is-visible) .iga-ges__series circle,
.ig-js .iga-ges__chart:not(.is-visible) .iga-ges__series text { opacity: 0; }

.iga-ges__series text { font: 600 14px "Plus Jakarta Sans", sans-serif; fill: var(--ig-navy); }
.iga-ges__series .iga-ges__val { font-weight: 800; }
.iga-ges__series .iga-ges__short { display: none; }
.iga-ges__series--s text { fill: #0093bd; }
.iga-ges__series--g text { fill: rgba(0, 68, 91, 0.7); }

.iga-ges .iga-ges__grid .iga-ges__axis { font-size: 12.5px; font-weight: 700; letter-spacing: 0.3px; fill: var(--ig-navy); }

.iga-ges p.iga-ges__chart-title {
    margin: 0 0 14px;
    font-size: 17px;
    line-height: 1.35;
    font-weight: 700;
    color: var(--ig-navy);
}

.iga-ges__key {
    display: grid;
    gap: 8px;
    margin: 16px 0 0 !important;
    padding: 16px 0 0 !important;
    border-top: 1px solid var(--ig-line);
}

.iga-ges__key li {
    position: relative;
    padding-left: 30px;
    font-size: 14px;
    line-height: 1.5;
    color: var(--ig-muted);
}

.iga-ges__key li strong { color: var(--ig-navy); }

.iga-ges__key li::before {
    content: "";
    position: absolute;
    left: 0;
    top: 9px;
    width: 20px;
    height: 0;
    border-top: 4px solid var(--ig-blue);
    border-radius: 4px;
}

.iga-ges__key li.is-e::before { border-top-color: var(--ig-navy); border-top-width: 3.5px; }
.iga-ges__key li.is-g::before { border-top-color: rgba(0, 68, 91, 0.4); border-top-width: 3.5px; }
.iga-ges__key li.is-ten::before { border-top: 2px dashed var(--ig-blue); top: 10px; }

.iga-ges p.iga-ges__example {
    grid-column: 1 / -1;
    margin: 14px 0 0;
    padding: 10px 14px;
    border-radius: 10px;
    background: var(--ig-sky-soft);
    font-size: 14px;
    line-height: 1.5;
    font-weight: 600;
    color: var(--ig-navy);
}

.iga-ges p.iga-ges__example span {
    display: block;
    margin-bottom: 2px;
    font-size: 11.5px;
    font-weight: 700;
    letter-spacing: 1px;
    text-transform: uppercase;
    color: var(--ig-blue);
}

.iga-ges__words { display: block; margin-top: 6px; font-size: 14px; font-style: normal; font-weight: 600; color: var(--ig-navy); }

.iga-ges__series--g .iga-ges__line { stroke: rgba(0, 68, 91, 0.4); }
.iga-ges__series--g circle { fill: rgba(0, 68, 91, 0.4); }
.iga-ges__series--e .iga-ges__line { stroke: var(--ig-navy); }
.iga-ges__series--e circle { fill: var(--ig-navy); }
.iga-ges__series--s .iga-ges__line { stroke: var(--ig-blue); stroke-width: 4.5; }
.iga-ges__series--s circle { fill: var(--ig-blue); }
.iga-ges__series--s .iga-ges__letter { fill: var(--ig-blue); }

.iga-ges__chart figcaption {
    margin-top: 10px;
    font-size: 13px;
    line-height: 1.5;
    color: var(--ig-muted);
}

.iga-ges__cards { display: grid; gap: 16px; }

.iga-ges__card {
    display: grid;
    grid-template-columns: 56px minmax(0, 1fr);
    column-gap: 16px;
    align-items: center;
    padding: 22px 24px;
    border-radius: var(--ig-radius);
    background: #fff;
    border: 1px solid var(--ig-line);
}

.iga-ges__tile {
    display: grid;
    place-items: center;
    width: 56px;
    height: 56px;
    border-radius: 14px;
    background: var(--ig-sky);
    font-size: 26px;
    font-weight: 800;
    color: var(--ig-navy);
}

.iga-ges__card--e .iga-ges__tile { background: var(--ig-navy); color: #fff; }
.iga-ges__card--s .iga-ges__tile { background: var(--ig-blue); color: #fff; }

.iga-ges .iga-ges__title {
    margin: 0;
    font-size: 19px;
    line-height: 1.3;
    font-weight: 700;
    text-transform: none;
    color: var(--ig-navy);
}

.iga-ges p.iga-ges__sub {
    margin: 2px 0 0;
    font-size: 14px;
    font-weight: 700;
    color: var(--ig-blue);
}

.iga-ges p.iga-ges__text {
    grid-column: 1 / -1;
    margin: 14px 0 0;
    font-size: 15px;
    line-height: 1.65;
    color: var(--ig-muted);
}

.iga-ges__formula,
.iga-ges__formulas code {
    display: inline-block;
    padding: 6px 12px;
    border-radius: 8px;
    background: var(--ig-sky-soft);
    font-family: "Plus Jakarta Sans", sans-serif;
    font-size: 13.5px;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    color: var(--ig-navy);
    white-space: normal;
}

.iga-ges__card .iga-ges__formula { grid-column: 1 / -1; justify-self: start; margin-top: 12px; }

.iga-ges__details {
    grid-column: 1 / -1;
    border-radius: var(--ig-radius);
    background: #fff;
    border: 1px solid var(--ig-line);
}

.iga-ges__details summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 20px 24px;
    list-style: none;
    cursor: pointer;
    font-size: 17px;
    font-weight: 700;
    color: var(--ig-navy);
}

.iga-ges__details summary::-webkit-details-marker { display: none; }

.iga-ges__plus,
.iga-inv__more summary::after {
    position: relative;
    flex: 0 0 28px;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: var(--ig-sky);
}

.iga-ges__plus::before,
.iga-ges__plus::after {
    content: "";
    position: absolute;
    left: 8px;
    right: 8px;
    top: 13px;
    height: 2px;
    border-radius: 2px;
    background: var(--ig-navy);
    transition: transform 0.25s ease;
}

.iga-ges__plus::after { transform: rotate(90deg); }
.iga-ges__details[open] .iga-ges__plus::after { transform: rotate(0deg); }

.iga-ges__detail-body {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 40px;
    padding: 4px 24px 26px;
}

.iga-ges__formulas { display: grid; gap: 18px; margin: 0; }
.iga-ges__formulas dt { font-size: 12.5px; font-weight: 700; letter-spacing: 1px; text-transform: uppercase; color: var(--ig-blue); }
.iga-ges__formulas dd { margin: 6px 0 0; }
.iga-ges__formulas dd span { display: block; margin-top: 6px; font-size: 14px; line-height: 1.55; color: var(--ig-muted); }

.iga-ges__legend {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px 20px;
    align-content: start;
    margin: 0;
}

.iga-ges__legend div { display: grid; grid-template-columns: 46px minmax(0, 1fr); gap: 8px; font-size: 14px; line-height: 1.45; }
.iga-ges__legend dt { font-weight: 800; color: var(--ig-navy); }
.iga-ges__legend dd { margin: 0; color: var(--ig-muted); }

/* ===================================================================== */
/* Rechenbeispiele                                                        */
/* ===================================================================== */

.iga-ex__grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: var(--ig-gap);
    align-items: start;
}

/* Zugeklappte Karte: zwei Kernzahlen, Rechnung zum Aufklappen */
.iga-ex__kpis {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    margin: 18px 0 0;
}

.iga-ex__kpis > div { padding: 12px 14px; border-radius: 12px; background: var(--ig-sky-soft); }
.iga-ex__kpis dt { font-size: 12px; font-weight: 600; color: var(--ig-muted); }
.iga-ex__kpis dd { margin: 3px 0 0; font-size: 21px; line-height: 1.2; font-weight: 800; font-variant-numeric: tabular-nums; white-space: nowrap; color: var(--ig-navy); }
.iga-ex__kpis dd small { font-size: 12px; font-weight: 600; color: var(--ig-muted); }
.iga-ex__kpis .is-pos dd, .iga-ex__kpis .is-share dd { color: #0093bd; }

.iga-ex__more { margin-top: 14px; }

.iga-ex__more summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 12px 0;
    border-top: 1px solid var(--ig-line);
    border-bottom: 1px solid var(--ig-line);
    list-style: none;
    cursor: pointer;
    font-size: 15px;
    font-weight: 700;
    color: var(--ig-navy);
}

.iga-ex__more summary::-webkit-details-marker { display: none; }
.iga-ex__more summary:hover { color: #0093bd; }
.iga-ex__more summary:focus-visible { outline: 2px solid var(--ig-blue); outline-offset: 2px; border-radius: 6px; }
.iga-ex__more-close { display: none; }
.iga-ex__more[open] .iga-ex__more-open { display: none; }
.iga-ex__more[open] .iga-ex__more-close { display: inline; }

.iga-ex__chev {
    flex: 0 0 26px;
    width: 26px;
    height: 26px;
    border-radius: 50%;
    background: var(--ig-sky) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 9.5l6 6 6-6' fill='none' stroke='%2300445b' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat center / 16px;
    transition: transform 0.25s ease;
}

.iga-ex__more[open] .iga-ex__chev { transform: rotate(180deg); }
.iga-ex__more[open] summary { border-bottom-color: transparent; }
.iga-ex__more-body { padding-bottom: 4px; animation: iga-ex-open 0.3s ease; }
.iga-ex__more-body > .iga-ex__facts { margin-top: 4px; }

@keyframes iga-ex-open { from { opacity: 0; transform: translateY(-6px); } to { opacity: 1; transform: none; } }

.iga-ex__card {
    display: flex;
    flex-direction: column;
    padding: 28px;
    border-radius: 22px;
    background: #fff;
    border: 1px solid var(--ig-line);
    box-shadow: 0 12px 34px rgba(0, 68, 91, 0.07);
}

.iga-ex__top { display: flex; align-items: center; justify-content: space-between; }

.iga-ex__icon {
    display: grid;
    place-items: center;
    width: 46px;
    height: 46px;
    border-radius: 14px;
    background: var(--ig-sky);
    color: var(--ig-navy);
}

.iga-ex__icon .ig-icon { width: 24px; height: 24px; stroke-width: 1.8; }

.iga-ex__tag {
    padding: 5px 11px;
    border-radius: 50px;
    background: var(--ig-navy);
    font-size: 12px;
    font-weight: 700;
    color: #fff;
}

.iga-ex__card.is-heute .iga-ex__tag { background: var(--ig-sky); color: var(--ig-navy); }

.iga-ex .iga-ex__title {
    margin: 18px 0 0;
    font-size: 21px;
    line-height: 1.3;
    font-weight: 700;
    text-transform: none;
    color: var(--ig-navy);
}

.iga-ex p.iga-ex__persona { margin: 4px 0 0; font-size: 14.5px; line-height: 1.5; color: var(--ig-muted); }

.iga-ex__facts {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1px;
    margin: 18px 0 0;
    border-radius: 12px;
    overflow: hidden;
    background: var(--ig-line);
    border: 1px solid var(--ig-line);
}

.iga-ex__facts > div { padding: 10px 12px; background: var(--ig-sky-soft); }
.iga-ex__facts > div.is-wide { grid-column: 1 / -1; background: #fff; }
.iga-ex__facts dt { font-size: 11.5px; font-weight: 600; color: var(--ig-muted); }
.iga-ex__facts dd { margin: 2px 0 0; font-size: 15px; font-weight: 700; font-variant-numeric: tabular-nums; color: var(--ig-navy); }
.iga-ex__facts dd small { font-size: 12px; font-weight: 500; color: var(--ig-muted); }

.iga-ex p.iga-ex__label {
    margin: 22px 0 10px;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 1px;
    text-transform: uppercase;
    color: var(--ig-blue);
}

.iga-ex__ledger { display: grid; gap: 0; list-style: none; margin: 0; padding: 0; }

.iga-ex__ledger li {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    padding: 7px 0;
    border-bottom: 1px dashed var(--ig-line);
    font-size: 14px;
    color: var(--ig-muted);
}

.iga-ex__ledger li strong { font-variant-numeric: tabular-nums; white-space: nowrap; color: var(--ig-navy); }
.iga-ex__ledger li.is-plus strong { color: #0093bd; }
.iga-ex__ledger li.is-repay span { color: var(--ig-navy); }

.iga-ex__ledger li.iga-ex__sum {
    margin-top: 6px;
    padding: 10px 12px;
    border: 0;
    border-radius: 10px;
    background: var(--ig-blue);
    font-weight: 700;
    color: #fff;
}

.iga-ex__ledger li.iga-ex__sum strong { font-size: 16px; color: #fff; }
.iga-ex__ledger li.iga-ex__sum.is-neg { background: var(--ig-navy); }

.iga-ex__bars { display: grid; gap: 12px; }

.iga-ex__bar {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 5px 12px;
    align-items: baseline;
    font-size: 13.5px;
    font-weight: 600;
    color: var(--ig-navy);
}

.iga-ex__bar small { font-weight: 500; color: var(--ig-muted); }
.iga-ex__bar strong { font-size: 16px; font-variant-numeric: tabular-nums; }

.iga-ex__bar i {
    grid-column: 1 / -1;
    grid-row: 2;
    display: block;
    width: var(--w);
    min-width: 6px;
    height: 12px;
    border-radius: 12px;
    background: rgba(0, 68, 91, 0.35);
}

.iga-ex__bar.is-share i { background: var(--ig-blue); }
.iga-ex__bar.is-share strong { color: #0093bd; }

.iga-ex p.iga-ex__flat { margin: 8px 0 0; font-size: 13px; color: var(--ig-muted); }

.iga-ex p.iga-ex__takeaway {
    margin: 18px 0 0;
    padding-top: 16px;
    border-top: 1px solid var(--ig-line);
    font-size: 14.5px;
    line-height: 1.6;
    font-weight: 600;
    color: var(--ig-navy);
}

.iga-ex__load {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    margin-top: auto;
    padding: 13px 22px;
    border: 1px solid var(--ig-navy);
    border-radius: 50px;
    background: transparent;
    font: 600 15px/1.2 "Plus Jakarta Sans", sans-serif;
    color: var(--ig-navy);
    cursor: pointer;
    transition: background-color 0.25s ease, color 0.25s ease;
}

.iga-ex p.iga-ex__takeaway { margin-bottom: 4px; }
.iga-ex__load { margin-top: 18px; }
.iga-ex__load:hover, .iga-ex__load:focus-visible { background: var(--ig-navy); color: #fff; }
.iga-ex__load-icon { width: 18px; height: 18px; stroke-width: 2.2; transform: rotate(90deg); }

.iga-ex p.iga-ex__note { margin: 24px 0 0; font-size: 13px; line-height: 1.6; color: var(--ig-muted); }

/* Aufblitzen, wenn ein Beispiel in den Rechner geladen wurde */
.iga-inv.is-loaded .iga-inv__result { animation: iga-flash 1.2s ease; }
@keyframes iga-flash { 0% { box-shadow: 0 0 0 0 rgba(0, 178, 227, 0.8); } 100% { box-shadow: 0 0 0 18px rgba(0, 178, 227, 0); } }

/* ===================================================================== */
/* Investment-Rechner                                                     */
/* ===================================================================== */

.iga-inv {
    display: grid;
    grid-template-columns: minmax(0, 0.92fr) minmax(0, 1.08fr);
    gap: var(--ig-gap);
    align-items: start;
    max-width: 1240px;
    margin-inline: auto;
}

.iga-inv__controls {
    padding: 28px;
    border-radius: var(--ig-radius);
    background: rgba(255, 255, 255, 0.07);
    border: 1px solid rgba(255, 255, 255, 0.16);
    color: #fff;
}

.iga-inv__group {
    min-width: 0;
    margin: 0 0 24px;
    padding: 0;
    border: 0;
}

.iga-inv__group legend {
    float: none;
    width: auto;
    margin: 0 0 12px;
    padding: 0;
    font-size: 12.5px;
    font-weight: 700;
    letter-spacing: 1px;
    text-transform: uppercase;
    color: #7fdcf5;
}

.iga-inv__field + .iga-inv__field { margin-top: 14px; }

.iga-inv__row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.iga-inv__row label {
    margin: 0;
    font-size: 14px;
    line-height: 1.35;
    font-weight: 600;
    color: rgba(255, 255, 255, 0.82);
}

.iga-inv__num {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    flex: 0 0 auto;
    padding: 3px 10px 3px 6px;
    border-radius: 10px;
    background: rgba(255, 255, 255, 0.1);
    font-size: 14px;
    font-weight: 600;
    color: rgba(255, 255, 255, 0.72);
    transition: background-color 0.2s ease, box-shadow 0.2s ease;
}

.iga-inv__num:focus-within { background: rgba(255, 255, 255, 0.18); box-shadow: 0 0 0 2px var(--ig-blue); }

.iga-inv__num input {
    width: 8.5ch;
    padding: 4px 0;
    border: 0;
    background: transparent;
    font: 700 17px/1.2 "Plus Jakarta Sans", sans-serif;
    font-variant-numeric: tabular-nums;
    text-align: right;
    color: #fff;
    outline: none;
    box-shadow: none;
}

.iga-inv input[type="range"] {
    --iga-fill: 50%;
    -webkit-appearance: none;
    appearance: none;
    display: block;
    width: 100%;
    height: 26px;
    margin: 6px 0 0;
    background: transparent;
    cursor: pointer;
}

.iga-inv input[type="range"]::-webkit-slider-runnable-track {
    height: 6px;
    border-radius: 6px;
    background: linear-gradient(to right, var(--ig-blue) 0 var(--iga-fill), rgba(255, 255, 255, 0.2) var(--iga-fill) 100%);
}

.iga-inv input[type="range"]::-moz-range-track {
    height: 6px;
    border-radius: 6px;
    background: linear-gradient(to right, var(--ig-blue) 0 var(--iga-fill), rgba(255, 255, 255, 0.2) var(--iga-fill) 100%);
}

.iga-inv input[type="range"]::-webkit-slider-thumb {
    -webkit-appearance: none;
    width: 22px;
    height: 22px;
    margin-top: -8px;
    border-radius: 50%;
    border: 5px solid var(--ig-blue);
    background: #fff;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.25);
    transition: transform 0.15s ease;
}

.iga-inv input[type="range"]::-moz-range-thumb {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    border: 5px solid var(--ig-blue);
    background: #fff;
}

.iga-inv input[type="range"]:active::-webkit-slider-thumb { transform: scale(1.12); }
.iga-inv input[type="range"]:focus-visible { outline: 2px solid #7fdcf5; outline-offset: 2px; border-radius: 6px; }

.iga-inv p.iga-inv__hint {
    margin: 2px 0 0;
    font-size: 12.5px;
    line-height: 1.5;
    color: rgba(255, 255, 255, 0.58);
}

.iga-inv__more {
    border-top: 1px solid rgba(255, 255, 255, 0.16);
}

.iga-inv__more summary {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 18px 0 0;
    list-style: none;
    cursor: pointer;
    font-size: 15px;
    font-weight: 700;
    color: #fff;
}

.iga-inv__more summary::-webkit-details-marker { display: none; }

.iga-inv__more summary::after {
    content: "";
    margin-left: auto;
    flex-basis: 26px;
    width: 26px;
    height: 26px;
    background: rgba(255, 255, 255, 0.12) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 9.5l6 6 6-6' fill='none' stroke='%23fff' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat center / 16px;
    transition: transform 0.25s ease;
}

.iga-inv__more[open] summary::after { transform: rotate(180deg); }

.iga-inv__more-hint { font-size: 13px; font-weight: 500; color: rgba(255, 255, 255, 0.58); }

.iga-inv__more-body { padding-top: 18px; }

.iga-inv__result {
    padding: 30px;
    border-radius: var(--ig-radius);
    background: #fff;
    color: var(--ig-navy);
}

.iga-inv p.iga-inv__kicker {
    margin: 0;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 0.8px;
    text-transform: uppercase;
    color: var(--ig-muted);
}

.iga-inv p.iga-inv__big {
    display: flex;
    align-items: baseline;
    flex-wrap: wrap;
    gap: 4px 12px;
    margin: 6px 0 0;
}

.iga-inv__big strong {
    font-size: clamp(40px, 4.4vw, 56px);
    line-height: 1.05;
    font-weight: 800;
    letter-spacing: -1px;
    font-variant-numeric: tabular-nums;
    color: var(--ig-blue);
}

.iga-inv__big.is-neg strong { color: var(--ig-navy); }
.iga-inv__big span { font-size: 15px; font-weight: 600; color: var(--ig-muted); }

.iga-inv p.iga-inv__verdict {
    min-height: 4.95em;
    margin: 10px 0 0;
    font-size: 15px;
    line-height: 1.65;
    color: var(--ig-muted);
}

.iga-inv__flow {
    display: grid;
    gap: 9px;
    margin: 18px 0 0 !important;
    padding: 18px 0 0 !important;
    border-top: 1px solid var(--ig-line);
}

.iga-inv__flow-row {
    display: grid;
    grid-template-columns: 190px minmax(0, 1fr) 84px;
    align-items: center;
    gap: 12px;
    font-size: 14px;
}

.iga-inv__flow-label { font-weight: 600; color: var(--ig-navy); }

.iga-inv__flow-bar {
    height: 10px;
    border-radius: 10px;
    background: var(--ig-sky-soft);
    overflow: hidden;
}

.iga-inv__flow-bar i {
    display: block;
    width: 0;
    height: 100%;
    border-radius: 10px;
    background: rgba(0, 68, 91, 0.7);
    transition: width 0.45s cubic-bezier(0.22, 1, 0.36, 1);
}

.iga-inv__flow-row.is-plus .iga-inv__flow-bar i { background: var(--ig-blue); }

.ig-js .iga-inv:not(.is-ready) .iga-inv__flow-bar i { width: 0 !important; }

.iga-inv__flow-val {
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    text-align: right;
    white-space: nowrap;
}

.iga-inv__kpis {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
    margin: 22px 0 0;
}

.iga-inv__kpis div {
    padding: 12px;
    border-radius: 12px;
    background: var(--ig-sky-soft);
}

.iga-inv__kpis dt { font-size: 12px; line-height: 1.3; font-weight: 600; color: var(--ig-muted); }
.iga-inv__kpis dd { margin: 4px 0 0; font-size: 18px; font-weight: 800; font-variant-numeric: tabular-nums; white-space: nowrap; }

.iga-inv__chart {
    margin: 24px 0 0;
    padding-top: 20px;
    border-top: 1px solid var(--ig-line);
}

.iga-inv__chart figcaption {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: baseline;
    gap: 8px 16px;
}

.iga-inv__chart figcaption strong { font-size: 16px; font-weight: 700; }

.iga-inv__legend { display: flex; flex-wrap: wrap; gap: 4px 14px; font-size: 12.5px; font-weight: 600; color: var(--ig-muted); }
.iga-inv__legend span { display: inline-flex; align-items: center; gap: 6px; }
.iga-inv__legend span::before { content: ""; width: 16px; height: 0; border-top: 3px solid var(--ig-blue); }
.iga-inv__legend .is-debt::before { border-top-color: var(--ig-navy); }
.iga-inv__legend .is-real::before { border-top: 2px dashed rgba(0, 68, 91, 0.55); }

.iga-inv__chart svg { display: block; width: 100%; height: auto; margin-top: 12px; overflow: visible; }

.iga-inv__grid path { stroke: var(--ig-line); stroke-width: 1; fill: none; }
.iga-inv__grid text { fill: var(--ig-muted); font: 600 12px "Plus Jakarta Sans", sans-serif; }
.iga-inv__grid .iga-inv__ten { stroke: var(--ig-blue); stroke-dasharray: 4 4; opacity: 0.7; }
.iga-inv__grid .iga-inv__ten-label { fill: var(--ig-blue); font-weight: 700; font-size: 11.5px; }

.iga-inv__area { fill: rgba(0, 178, 227, 0.12); }
.iga-inv__line { fill: none; stroke-linecap: round; stroke-linejoin: round; }
.iga-inv__line--value { stroke: var(--ig-blue); stroke-width: 3.5; }
.iga-inv__line--debt { stroke: var(--ig-navy); stroke-width: 2.5; }
.iga-inv__line--real { stroke: rgba(0, 68, 91, 0.55); stroke-width: 2; stroke-dasharray: 5 5; }
.iga-inv__area-label { fill: var(--ig-blue); font: 700 12.5px "Plus Jakarta Sans", sans-serif; }

.iga-inv p.iga-inv__summary {
    margin: 10px 0 0;
    font-size: 14.5px;
    line-height: 1.6;
    color: var(--ig-navy);
}

.iga-inv p.iga-inv__note {
    margin: 18px 0 0;
    font-size: 12.5px;
    line-height: 1.6;
    color: var(--ig-muted);
}

/* ===================================================================== */
/* Strategien                                                             */
/* ===================================================================== */

.iga-strat__filter {
    display: inline-flex;
    flex-wrap: wrap;
    gap: 4px;
    margin-bottom: 30px;
    padding: 5px;
    border-radius: 50px;
    background: var(--ig-sky-soft);
    border: 1px solid var(--ig-line);
}

.iga-strat__filter button {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 18px;
    border: 0;
    border-radius: 50px;
    background: transparent;
    font: 600 15px/1.2 "Plus Jakarta Sans", sans-serif;
    color: var(--ig-navy);
    cursor: pointer;
    transition: background-color 0.2s ease, color 0.2s ease;
}

.iga-strat__filter button span {
    min-width: 22px;
    padding: 2px 6px;
    border-radius: 20px;
    background: #fff;
    font-size: 12px;
    font-weight: 700;
    text-align: center;
}

.iga-strat__filter button:hover { background: var(--ig-sky); }
.iga-strat__filter button.is-active { background: var(--ig-navy); color: #fff; }
.iga-strat__filter button.is-active span { background: var(--ig-blue); color: #fff; }
.iga-strat__filter button:focus-visible { outline: 2px solid var(--ig-blue); outline-offset: 2px; }

.iga-strat__grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 20px;
}

.iga-strat__card {
    display: flex;
    flex-direction: column;
    padding: 24px;
    border-radius: var(--ig-radius);
    background: #fff;
    border: 1px solid var(--ig-line);
    transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
}

.iga-strat__card[hidden] { display: none; }

.iga-strat__card:hover {
    transform: translateY(-4px);
    border-color: rgba(0, 178, 227, 0.45);
    box-shadow: var(--ig-shadow);
}

.iga-strat__top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 16px;
}

.iga-strat__icon {
    display: grid;
    place-items: center;
    width: 46px;
    height: 46px;
    border-radius: 14px;
    background: var(--ig-sky);
    color: var(--ig-navy);
}

.iga-strat__icon .ig-icon { width: 24px; height: 24px; stroke-width: 1.8; }

.iga-strat__no {
    font-size: 30px;
    font-weight: 800;
    line-height: 1;
    color: rgba(0, 68, 91, 0.1);
}

.iga-strat__tag {
    align-self: flex-start;
    padding: 5px 11px;
    border-radius: 50px;
    background: var(--ig-sky);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.3px;
    color: var(--ig-navy);
}

.iga-strat__card.is-morgen .iga-strat__tag { background: var(--ig-navy); color: #fff; }
.iga-strat__card.is-beides .iga-strat__tag { background: #fff; border: 1px solid var(--ig-line); }

.iga-strat .iga-strat__title {
    margin: 14px 0 0;
    font-size: 20px;
    line-height: 1.3;
    font-weight: 700;
    text-transform: none;
    color: var(--ig-navy);
}

.iga-strat p.iga-strat__alias { margin: 2px 0 0; font-size: 13.5px; font-weight: 600; color: var(--ig-blue); }
.iga-strat p.iga-strat__text { margin: 12px 0 0; font-size: 15px; line-height: 1.65; color: var(--ig-muted); }
.iga-strat p.iga-strat__fit { margin: 14px 0 0; font-size: 14.5px; line-height: 1.55; color: var(--ig-navy); }
.iga-strat__fit strong { color: var(--ig-blue); }

.iga-strat p.iga-strat__caution {
    margin: 14px 0 0;
    padding: 10px 12px;
    border-radius: 10px;
    background: var(--ig-sky-soft);
    font-size: 13px;
    line-height: 1.5;
    color: var(--ig-navy);
}

.iga-strat__meters {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
    margin: auto 0 0;
    padding-top: 20px;
}

.iga-strat__meters > div { padding-top: 14px; border-top: 1px solid var(--ig-line); }
.iga-strat__meters dt { font-size: 11.5px; font-weight: 600; color: var(--ig-muted); }
.iga-strat__meters dd { margin: 6px 0 0; }

.iga-strat__dots { display: inline-flex; gap: 4px; }
.iga-strat__dots i { width: 9px; height: 9px; border-radius: 50%; background: var(--ig-sky); }
.iga-strat__dots[data-level="1"] i:nth-child(-n+1),
.iga-strat__dots[data-level="2"] i:nth-child(-n+2),
.iga-strat__dots[data-level="3"] i { background: var(--ig-blue); }

.iga-strat__markets {
    display: flex;
    flex-direction: column;
    padding: 26px;
    border-radius: var(--ig-radius);
    background: var(--ig-navy);
    color: #fff;
}

.iga-strat .iga-strat__markets h3 {
    margin: 0 0 16px;
    font-size: 20px;
    line-height: 1.3;
    font-weight: 700;
    text-transform: none;
    color: #fff;
}

.iga-strat__markets ul { display: flex; flex-wrap: wrap; gap: 8px; }

.iga-strat__markets li {
    padding: 6px 12px;
    border-radius: 50px;
    border: 1px solid rgba(255, 255, 255, 0.2);
    background: rgba(255, 255, 255, 0.06);
    font-size: 13.5px;
    font-weight: 600;
    color: #fff;
}

.iga-strat .iga-strat__markets p {
    margin: auto 0 0;
    padding-top: 18px;
    font-size: 14.5px;
    line-height: 1.6;
    color: rgba(255, 255, 255, 0.78);
}

/* ===================================================================== */
/* Zitat und Notiz                                                        */
/* ===================================================================== */

.iga-note {
    display: grid;
    grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
    gap: 70px;
    align-items: center;
}

.iga-note__quote {
    position: relative;
    overflow: hidden;
    margin: 0;
    padding: 46px 44px 40px;
    border-radius: 22px;
    background: var(--ig-navy);
    color: #fff;
    transition: opacity 0.6s ease, transform 0.6s cubic-bezier(0.22, 1, 0.36, 1);
}

.ig-js .iga-note__quote:not(.is-visible) { opacity: 0; transform: translateY(16px); }

.iga-note__quote::after {
    content: "";
    position: absolute;
    right: -80px;
    bottom: -80px;
    width: 240px;
    height: 240px;
    border-radius: 50%;
    border: 40px solid rgba(0, 178, 227, 0.14);
}

.iga-note__mark { width: 46px; height: auto; fill: var(--ig-blue); }

.iga-note__quote blockquote {
    position: relative;
    z-index: 1;
    margin: 22px 0 0;
    padding: 0;
    border: 0;
    background: none;
}

.iga-note__quote blockquote p {
    margin: 0;
    font-size: clamp(19px, 1.8vw, 23px);
    line-height: 1.55;
    font-weight: 600;
    color: #fff;
}

.iga-note__quote figcaption {
    position: relative;
    z-index: 1;
    margin-top: 20px;
    font-size: 14px;
    color: rgba(255, 255, 255, 0.7);
}

.iga-note p.iga-note__eyebrow {
    margin: 0 0 16px;
    font-size: 14px;
    line-height: 1.3;
    letter-spacing: 1px;
    font-weight: 700;
    text-transform: uppercase;
    color: var(--ig-blue);
}

.iga-note p.iga-note__eyebrow::before { content: "//"; margin-right: 0.4em; }

.iga-note .iga-note__title {
    margin: 0 0 18px;
    font-size: clamp(28px, 3vw, 36px);
    line-height: 1.28;
    font-weight: 700;
    text-transform: uppercase;
    color: var(--ig-navy);
}

.iga-note p.iga-note__text {
    margin: 0 0 14px;
    font-size: 17px;
    line-height: 1.7;
    color: var(--ig-muted);
}

.iga-note__sign {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px 22px;
    margin-top: 26px;
}

.iga-note .iga-note__sign img { width: auto; height: 46px; max-width: 100%; }
.iga-note__sign span { font-size: 14px; line-height: 1.45; color: var(--ig-muted); }
.iga-note__sign strong { display: block; font-size: 16px; color: var(--ig-navy); }

/* Variante mit Foto: Zitat-Karte ragt unten ins Foto */
.iga-note--photo { align-items: start; }
.iga-note__media { position: relative; padding-bottom: 210px; }
.iga-note__photo img { aspect-ratio: 4 / 3; }
.iga-note--photo .iga-note__quote {
    position: absolute;
    right: -36px;
    bottom: 0;
    z-index: 2;
    width: min(400px, 78%);
    padding: 30px 30px 26px;
    box-shadow: 0 24px 50px rgba(0, 68, 91, 0.25);
}
.iga-note--photo .iga-note__mark { width: 34px; }
.iga-note--photo .iga-note__quote blockquote { margin-top: 14px; }
.iga-note--photo .iga-note__quote blockquote p { font-size: clamp(16px, 1.4vw, 18px); }
.iga-note--photo .iga-note__body { padding-top: 30px; }

/* ===================================================================== */
/* Anlage-Check                                                           */
/* ===================================================================== */

.iga-check {
    position: relative;
    padding: 34px;
    border-radius: 22px;
    background: #fff;
    border: 1px solid var(--ig-line);
    box-shadow: var(--ig-shadow);
}

.iga-check p.iga-check__kicker {
    margin: 0;
    font-size: 12.5px;
    font-weight: 700;
    letter-spacing: 1px;
    text-transform: uppercase;
    color: var(--ig-blue);
}

.iga-check p.iga-check__title {
    margin: 8px 0 0;
    font-size: clamp(22px, 2.2vw, 27px);
    line-height: 1.25;
    font-weight: 800;
    color: var(--ig-navy);
}

.iga-check p.iga-check__intro {
    margin: 8px 0 0;
    font-size: 15px;
    line-height: 1.6;
    color: var(--ig-muted);
}

.iga-check__progress {
    display: flex;
    align-items: center;
    gap: 14px;
    margin: 24px 0 20px;
}

.iga-check__count {
    flex: 0 0 auto;
    min-width: 7.5em;
    font-size: 13px;
    font-weight: 700;
    color: var(--ig-muted);
}

.iga-check__bar {
    flex: 1 1 auto;
    height: 6px;
    border-radius: 6px;
    background: var(--ig-sky);
    overflow: hidden;
}

.iga-check__bar i {
    display: block;
    width: 0;
    height: 100%;
    border-radius: 6px;
    background: var(--ig-blue);
    transition: width 0.45s cubic-bezier(0.22, 1, 0.36, 1);
}

.iga-check__form { margin: 0; }

/* Alle Fragen liegen im selben Rasterfeld: Die Karte ist so hoch wie die
   längste Frage und springt beim Weiterklicken nicht. */
.iga-check__steps { display: grid; }

.iga-check__step {
    grid-area: 1 / 1;
    min-width: 0;
    margin: 0;
    padding: 0;
    border: 0;
    visibility: hidden;
    opacity: 0;
    transform: translateX(18px);
    transition: opacity 0.3s ease, transform 0.35s cubic-bezier(0.22, 1, 0.36, 1), visibility 0s 0.35s;
}

.iga-check__step.is-past { transform: translateX(-18px); }

.iga-check__step.is-active {
    visibility: visible;
    opacity: 1;
    transform: none;
    transition: opacity 0.3s 0.05s ease, transform 0.35s 0.05s cubic-bezier(0.22, 1, 0.36, 1), visibility 0s;
}

.iga-check .iga-check__q {
    float: none;
    display: block;
    width: 100%;
    margin: 0 0 16px;
    padding: 0;
    font-size: 19px;
    line-height: 1.35;
    font-weight: 700;
    color: var(--ig-navy);
    outline: none;
}

.iga-check .iga-check__q small {
    display: block;
    margin-top: 4px;
    font-size: 13px;
    font-weight: 500;
    color: var(--ig-muted);
}

.iga-check__opts {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

.iga-check__opt {
    position: relative;
    display: grid;
    grid-template-columns: 40px minmax(0, 1fr);
    align-items: center;
    gap: 12px;
    margin: 0;
    padding: 12px 14px;
    border: 1.5px solid var(--ig-line);
    border-radius: 14px;
    background: #fff;
    cursor: pointer;
    transition: border-color 0.2s ease, background-color 0.2s ease, transform 0.15s ease;
}

.iga-check__opt:hover { border-color: rgba(0, 178, 227, 0.55); }
.iga-check__opt:active { transform: scale(0.99); }

.iga-check__opt input {
    position: absolute;
    width: 1px;
    height: 1px;
    opacity: 0;
    pointer-events: none;
}

.iga-check__opt:has(input:focus-visible) { outline: 2px solid var(--ig-blue); outline-offset: 2px; }

.iga-check__opt:has(input:checked) {
    border-color: var(--ig-blue);
    background: var(--ig-sky-soft);
}

.iga-check__opt-icon {
    display: grid;
    place-items: center;
    width: 40px;
    height: 40px;
    border-radius: 12px;
    background: var(--ig-sky);
    color: var(--ig-navy);
    transition: background-color 0.2s ease, color 0.2s ease;
}

.iga-check__opt-icon .ig-icon { width: 21px; height: 21px; stroke-width: 1.9; }
.iga-check__opt:has(input:checked) .iga-check__opt-icon { background: var(--ig-blue); color: #fff; }

.iga-check__opt-text { min-width: 0; overflow-wrap: break-word; }
.iga-check__opt-text strong { hyphens: auto; }
.iga-check__opt-text strong { display: block; font-size: 15px; line-height: 1.3; font-weight: 700; color: var(--ig-navy); }
.iga-check__opt-text small { display: block; margin-top: 2px; font-size: 12.5px; line-height: 1.4; color: var(--ig-muted); }

/* Ergebnis */
.iga-check p.iga-check__result-kicker,
.iga-check p.iga-check__pick-label {
    margin: 0;
    font-size: 12.5px;
    font-weight: 700;
    letter-spacing: 1px;
    text-transform: uppercase;
    color: var(--ig-muted);
}

.iga-check p.iga-check__result-dir {
    margin: 4px 0 0;
    font-size: clamp(26px, 2.8vw, 32px);
    line-height: 1.15;
    font-weight: 800;
    text-transform: uppercase;
    color: var(--ig-blue);
    outline: none;
}

.iga-check__scale {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 12px;
    margin: 16px 0 0;
    font-size: 12px;
    font-weight: 700;
    color: var(--ig-muted);
}

.iga-check__track {
    position: relative;
    height: 8px;
    border-radius: 8px;
    background: linear-gradient(90deg, var(--ig-sky), var(--ig-blue));
}

.iga-check__track i {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    border: 5px solid var(--ig-navy);
    background: #fff;
    transform: translate(-50%, -50%);
    transition: left 0.8s 0.2s cubic-bezier(0.22, 1, 0.36, 1);
}

.iga-check__pick {
    margin: 20px 0 0;
    padding: 20px;
    border-radius: var(--ig-radius);
    background: var(--ig-sky-soft);
}

.iga-check p.iga-check__pick-title { margin: 4px 0 0; font-size: 22px; line-height: 1.3; font-weight: 800; color: var(--ig-navy); }
.iga-check p.iga-check__pick-text { margin: 8px 0 0; font-size: 15px; line-height: 1.6; color: var(--ig-muted); }
.iga-check p.iga-check__pick-alt { margin: 12px 0 0; font-size: 14px; color: var(--ig-navy); }

.iga-check__reasons { display: grid; gap: 10px; margin: 18px 0 0 !important; }

.iga-check__reasons li {
    position: relative;
    padding-left: 30px;
    font-size: 14.5px;
    line-height: 1.55;
    color: var(--ig-navy);
}

.iga-check__reasons li::before {
    content: "";
    position: absolute;
    left: 0;
    top: 1px;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background: var(--ig-blue) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 12.5l4 4 8-9' fill='none' stroke='%23fff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat center / 12px;
}

.iga-check p.iga-check__result-cta {
    margin: 18px 0 0;
    font-size: 14.5px;
    line-height: 1.6;
    font-weight: 600;
    color: var(--ig-navy);
}

/* Kontakt */
.iga-check__row {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
}

.iga-check__field { margin-bottom: 14px; }

.iga-check__field label,
.iga-check__reach legend {
    display: block;
    float: none;
    width: auto;
    margin: 0 0 6px;
    padding: 0;
    font-size: 13.5px;
    font-weight: 600;
    color: var(--ig-navy);
}

.iga-check__field label small { font-weight: 500; color: var(--ig-muted); }

.iga-check__field input,
.iga-check__field textarea {
    display: block;
    width: 100%;
    margin: 0;
    padding: 12px 14px;
    border: 1.5px solid var(--ig-line);
    border-radius: 12px;
    background: #fff;
    font: 500 16px/1.4 "Plus Jakarta Sans", sans-serif;
    color: var(--ig-navy);
    box-shadow: none;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.iga-check__field textarea { resize: vertical; min-height: 84px; }

.iga-check__field input:focus,
.iga-check__field textarea:focus {
    border-color: var(--ig-blue);
    outline: none;
    box-shadow: 0 0 0 3px rgba(0, 178, 227, 0.18);
}

.iga-check__field [aria-invalid="true"] { border-color: #c62828; }

.iga-check__reach {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 0 0 14px;
    padding: 0;
    border: 0;
}

.iga-check__reach legend { width: 100%; }

.iga-check__reach label { position: relative; margin: 0; cursor: pointer; }
.iga-check__reach input { position: absolute; opacity: 0; width: 1px; height: 1px; }

.iga-check__reach span {
    display: inline-block;
    padding: 8px 16px;
    border-radius: 50px;
    border: 1.5px solid var(--ig-line);
    font-size: 14px;
    font-weight: 600;
    color: var(--ig-navy);
    transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}

.iga-check__reach input:checked + span { background: var(--ig-navy); border-color: var(--ig-navy); color: #fff; }
.iga-check__reach input:focus-visible + span { outline: 2px solid var(--ig-blue); outline-offset: 2px; }

.iga-check__privacy {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    margin: 4px 0 0;
    font-size: 13.5px;
    line-height: 1.5;
    font-weight: 500;
    color: var(--ig-muted);
    cursor: pointer;
}

.iga-check__privacy input { flex: 0 0 18px; width: 18px; height: 18px; margin: 2px 0 0; accent-color: var(--ig-blue); }
.iga-check__privacy a { color: var(--ig-navy); font-weight: 700; text-decoration: underline; }

.iga-check__error { display: block; margin-top: 4px; font-size: 12.5px; font-weight: 600; color: #c62828; }
.iga-check__error:empty { display: none; }

.iga-check p.iga-check__feedback { margin: 10px 0 0; font-size: 14px; font-weight: 600; }
.iga-check p.iga-check__feedback:empty { display: none; }
.iga-check p.iga-check__feedback.is-error { color: #c62828; }

/* Navigation */
.iga-check__nav {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-top: 24px;
}

.iga-check__back {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 4px;
    border: 0;
    background: none;
    font: 600 15px/1.2 "Plus Jakarta Sans", sans-serif;
    color: var(--ig-navy);
    cursor: pointer;
}

.iga-check__back[hidden], .iga-check__next[hidden] { display: none; }
.iga-check__back:hover { color: var(--ig-blue); }
.iga-check__back-icon { width: 18px; height: 18px; stroke-width: 2.2; transform: rotate(180deg); }

.iga-check__next {
    margin-left: auto;
    padding: 15px 32px;
    border: 0;
    border-radius: 50px;
    background: var(--ig-blue);
    font: 600 16px/22px "Plus Jakarta Sans", sans-serif;
    color: #fff;
    cursor: pointer;
    transition: background-color 0.3s ease, opacity 0.2s ease;
}

.iga-check__next:hover:not(:disabled),
.iga-check__next:focus-visible { background: var(--ig-navy); }
.iga-check__next:focus-visible { outline: 2px solid var(--ig-blue); outline-offset: 2px; }
.iga-check__next:disabled { opacity: 0.4; cursor: not-allowed; }
.iga-check__next.is-busy { opacity: 0.7; cursor: progress; }

.iga-check p.iga-check__alt {
    margin: 16px 0 0;
    font-size: 14px;
    text-align: right;
    color: var(--ig-muted);
}

.iga-check__alt a { font-weight: 700; color: var(--ig-navy); border-bottom: 1px solid var(--ig-blue); text-decoration: none; }

/* Danke-Ansicht (Markup und Animation aus den Kurzformularen) */
.iga-check__done .igoo-quick__done { padding: 10px 0 4px; }

.iga-check__done h3.igoo-quick__done-title {
    max-width: 440px;
    margin: 0 auto 10px;
    font-size: 24px;
    font-weight: 700;
    line-height: 1.25;
    text-transform: none;
    color: var(--ig-navy);
    outline: none;
}

.iga-check__done .igoo-quick__done-mark { color: var(--ig-blue); }

.iga-check__done p.igoo-quick__done-text {
    max-width: 420px;
    margin: 0 auto;
    font-size: 16px;
    line-height: 1.55;
    color: var(--ig-muted);
}

.iga-check__done p.igoo-quick__done-alt { margin: 18px 0 0; font-size: 14px; color: var(--ig-muted); }

.iga-check__done .igoo-quick__done-alt a {
    margin-left: 4px;
    font-weight: 700;
    color: var(--ig-navy);
    text-decoration: none;
    border-bottom: 1px solid var(--ig-blue);
}

/* Anlage-Check im Hero: Karte rechts neben der Überschrift */
.ig-ci .igp-hero .elementor-widget-ig-anlage-check { scroll-margin-top: 90px; }
.igp-hero .iga-check { box-shadow: 0 24px 60px rgba(0, 68, 91, 0.14); border-color: rgba(0, 68, 91, 0.08); }

/* Kontaktbereich neben dem Check */
.ig-ci .igp-split--check { grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr); }

.ig-ci .igp-split--check > .igp-copy {
    position: sticky;
    top: calc(var(--ig-sticky-top) + 96px);
}

/* ===================================================================== */
/* Responsive                                                             */
/* ===================================================================== */

@media (max-width: 1200px) {
    .iga-strat__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .iga-inv__flow-row { grid-template-columns: 160px minmax(0, 1fr) 80px; }
}

@media (max-width: 1100px) {
    .iga-ex__grid { grid-template-columns: 1fr; max-width: 640px; gap: 16px; }
    .iga-ges { grid-template-columns: 1fr; }
    .iga-ges__cards { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .iga-ges__card { align-items: start; }
    .iga-inv { grid-template-columns: 1fr; max-width: 760px; }
    .iga-cf__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .iga-note { gap: 48px; }
}

@media (max-width: 991px) {
    .iga-visual { max-width: 640px; }
    .iga-visual__card { left: 16px; bottom: 16px; }
    .iga-cf__pair { grid-template-columns: 1fr; }
    .iga-ges__cards { grid-template-columns: 1fr; }
    .iga-strat__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .iga-note { grid-template-columns: 1fr; }
    .iga-note--photo .iga-note__quote { right: 16px; }
    .iga-note__media { max-width: 680px; }
    .ig-ci .igp-split--check { grid-template-columns: 1fr; }
    .ig-ci .igp-split--check > .igp-copy { position: static; }
    .iga-ges__detail-body { grid-template-columns: 1fr; gap: 28px; }
}

@media (max-width: 991px) {
    /* Hero: der Anlage-Check kommt direkt nach dem Einleitungstext, Buttons und
       Häkchen danach – so ist die erste Frage ohne langes Scrollen zu sehen. */
    .ig-ci .igp-hero__grid:has(> .elementor-widget-ig-anlage-check) { display: flex; flex-direction: column; align-items: stretch; gap: 0; }
    .ig-ci .igp-hero__grid:has(> .elementor-widget-ig-anlage-check) > .igp-copy { display: contents; }
    .ig-ci .igp-hero__grid > .igp-copy > .igp-actions { order: 5; }
    .ig-ci .igp-hero__grid > .igp-copy > .elementor-widget-ig-facts { order: 6; }
    .ig-ci .igp-hero__grid > .elementor-widget-ig-anlage-check { order: 4; width: 100%; margin-top: 28px; }

    /* Anlage-Check: auf dem Handy erst Text und Check, dann die Kontaktkarte */
    .ig-ci .igp-split.igp-split--check { display: flex; flex-direction: column; align-items: stretch; gap: 0; }
    .ig-ci .igp-split--check > .igp-copy { display: contents; }
    .ig-ci .igp-split--check > .igp-copy > *,
    .ig-ci .igp-split--check > .elementor-widget-ig-anlage-check { width: 100%; max-width: 100%; align-self: stretch; }
    .ig-ci .igp-split--check > .elementor-widget-ig-anlage-check { order: 5; margin-top: 30px; }
    .ig-ci .igp-split--check .elementor-widget-ig-contact-card { order: 6; margin-top: 20px; }

    .iga-cf__or {
        position: relative;
        left: auto;
        top: auto;
        justify-self: center;
        margin: -44px 0;
        transform: none;
    }
}

@media (max-width: 767px) {
    .iga-visual__card { left: 10px; bottom: 10px; width: min(210px, 64%); padding: 12px 14px 10px; }
    .iga-visual__card strong { font-size: 12.5px; }
    .iga-visual__card svg { margin: 6px 0 4px; }
    .iga-visual__legend { font-size: 11.5px; }

    .iga-cf__card { padding: 26px 22px; border-radius: 18px; }
    .iga-ex__card { padding: 22px 18px; border-radius: 18px; }
    .iga-cf__spark { width: 84px; height: 34px; }
    .iga-cf__or { width: 50px; height: 50px; margin: -40px 0; font-size: 11px; border-width: 5px; }
    .iga-cf__factors { margin-top: 50px; }
    .iga-cf__grid { grid-template-columns: 1fr; gap: 10px; }
    .iga-cf__grid li { padding: 16px; }

    .iga-ges__chart { padding: 18px 12px 14px; border-radius: 18px; }
    .iga-ges__grid text { font-size: 21px; }
    .iga-ges .iga-ges__grid .iga-ges__axis { font-size: 21px; }
    .iga-ges__series text { font-size: 25px; }
    .iga-ges__series .iga-ges__name { display: none; }
    .iga-ges__series .iga-ges__short { display: inline; }
    .iga-ges p.iga-ges__chart-title { font-size: 16px; }
    .iga-ges__key li { font-size: 13.5px; }
    .iga-ges__card { padding: 18px; grid-template-columns: 48px minmax(0, 1fr); }
    .iga-ges__tile { width: 48px; height: 48px; font-size: 22px; }
    .iga-ges__details summary { padding: 18px; font-size: 16px; }
    .iga-ges__detail-body { padding: 0 18px 20px; }
    .iga-ges__legend { grid-template-columns: 1fr; }

    .iga-inv__controls, .iga-inv__result { padding: 22px 18px; }
    .iga-inv__row label { font-size: 13.5px; }
    .iga-inv__num input { width: 7.5ch; font-size: 16px; }
    .iga-inv__flow-row { grid-template-columns: minmax(0, 1fr) 76px; row-gap: 5px; }
    .iga-inv__flow-bar { grid-column: 1 / -1; grid-row: 2; height: 8px; }
    .iga-inv__kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .iga-inv p.iga-inv__verdict { min-height: 6.6em; }

    /* Strategien als wischbare Leiste */
    .iga-strat__filter { display: flex; flex-wrap: nowrap; width: 100%; }
    .iga-strat__filter button { flex: 1 1 auto; justify-content: center; gap: 6px; padding: 9px 8px; font-size: 13px; white-space: nowrap; }
    .iga-inv__more-hint { display: none; }
    .iga-check .iga-check__opts--compact { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .iga-check .iga-check__opts--compact .iga-check__opt { grid-template-columns: 1fr; gap: 8px; padding: 12px; }
    .iga-check .iga-check__opts--compact .iga-check__opt-icon { width: 34px; height: 34px; border-radius: 10px; }
    .iga-strat__grid {
        grid-template-columns: none;
        grid-auto-flow: column;
        grid-auto-columns: 84%;
        gap: 14px;
        margin-inline: -16px;
        padding: 4px 16px 18px;
        overflow-x: auto;
        scroll-snap-type: x mandatory;
        scroll-padding-inline: 16px;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
    }
    .iga-strat__grid::-webkit-scrollbar { display: none; }
    .iga-strat__card, .iga-strat__markets { scroll-snap-align: start; }
    .iga-strat__card:hover { transform: none; }

    .iga-note__quote { padding: 34px 26px 30px; }
    .iga-note__media { padding-bottom: 0; }
    .iga-note--photo .iga-note__quote { position: relative; right: auto; width: auto; margin: -40px 12px 0; padding: 24px 22px 22px; }
    .iga-note--photo .iga-note__body { padding-top: 0; }
    .iga-note p.iga-note__text { font-size: 16px; }
    .iga-note .iga-note__sign img { height: 38px; }

    .iga-check { padding: 24px 18px; border-radius: 18px; }
    .iga-check__opts { grid-template-columns: 1fr; gap: 8px; }
    .iga-check__opt { padding: 10px 12px; }
    .iga-check__row { grid-template-columns: 1fr; gap: 0; }
    .iga-check__scale { grid-template-columns: 1fr 1fr; }
    .iga-check__scale .iga-check__track { grid-column: 1 / -1; grid-row: 1; }
    .iga-check__scale span:last-child { text-align: right; }
    .iga-check__next { padding: 14px 24px; }
    .iga-check p.iga-check__alt { text-align: left; }
}

@media (max-width: 400px) {
    .iga-strat__filter button span { display: none; }
}

@media (prefers-reduced-motion: reduce) {
    .iga-visual__card, .iga-ex__more-body { animation: none; }
    .iga-visual__up, .iga-visual__down { animation: none; stroke-dashoffset: 0; }
    .iga-cf__card, .iga-cf__grid li, .iga-ges__line, .iga-ges__series circle, .iga-ges__series text,
    .iga-inv__flow-bar i, .iga-check__step, .iga-check__bar i, .iga-check__track i, .iga-note__quote,
    .iga-cf__card--tomorrow .iga-cf__spark path {
        transition: none !important;
    }
}

/* ===================================================================== */
/* Leitsatz-Streifen                                                      */
/* ===================================================================== */

.ig-ci .igp-section.igp-section--motto { padding: 0; }

.iga-motto {
    position: relative;
    display: flex;
    align-items: center;
    gap: 18px;
    min-height: 78px;
    padding: 12px 0;
    font-family: "Plus Jakarta Sans", sans-serif;
    color: #fff;
}

.iga-motto[hidden], .iga-motto [hidden] { display: none !important; }

.iga-motto__mark {
    flex: 0 0 auto;
    display: grid;
    place-items: center;
    width: 42px;
    height: 42px;
    border-radius: 50%;
    background: rgba(127, 220, 245, 0.12);
    color: #7fdcf5;
}

.iga-motto__mark svg { width: 21px; height: 21px; }

.iga-motto__mark-door {
    stroke-dasharray: 14;
    stroke-dashoffset: 0;
}

.iga-motto.is-ready .iga-motto__mark-door { animation: iga-motto-door 6.5s ease-in-out infinite; }

@keyframes iga-motto-door {
    0%, 70%, 100% { stroke-dashoffset: 0; }
    82% { stroke-dashoffset: 14; }
    92% { stroke-dashoffset: 0; }
}

/* Alle Sprüche im selben Rasterfeld: der Streifen springt nicht. */
.iga-motto__stage {
    flex: 1 1 auto;
    display: grid;
    min-width: 0;
}

.iga-motto p.iga-motto__q {
    grid-area: 1 / 1;
    align-self: center;
    margin: 0;
    font-size: clamp(16px, 1.55vw, 22px);
    line-height: 1.4;
    color: #fff;
    visibility: hidden;
    transition: visibility 0s 0.6s;
}

.iga-motto p.iga-motto__q.is-active,
.iga-motto p.iga-motto__q.is-leaving { visibility: visible; transition: none; }

.iga-motto__lead,
.iga-motto__main {
    display: inline;
    opacity: 0;
    transform: translateY(10px);
    transition: opacity 0.45s ease, transform 0.55s cubic-bezier(0.22, 1, 0.36, 1);
}

.iga-motto .iga-motto__lead { font-weight: 500; color: rgba(255, 255, 255, 0.68); }
.iga-motto .iga-motto__main { font-weight: 700; color: #fff; }

.iga-motto p.is-active .iga-motto__lead { opacity: 1; transform: none; transition-delay: 0.08s; }
.iga-motto p.is-active .iga-motto__main { opacity: 1; transform: none; transition-delay: 0.22s; }

.iga-motto p.is-leaving .iga-motto__lead,
.iga-motto p.is-leaving .iga-motto__main { opacity: 0; transform: translateY(-10px); transition-delay: 0s; transition-duration: 0.35s; }

/* Markiertes Wort: Unterstreichung zieht sich auf */
.iga-motto .iga-motto__main em {
    font-style: normal;
    color: #7fdcf5;
    background: linear-gradient(#00b2e3, #00b2e3) left 100% / 0 3px no-repeat;
    padding-bottom: 2px;
    transition: background-size 0.6s cubic-bezier(0.22, 1, 0.36, 1) 0.65s;
}

.iga-motto p.is-active .iga-motto__main em { background-size: 100% 3px; }

.iga-motto__dots {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
}

.iga-motto__dot {
    display: block;
    margin: 0;
    padding: 14px 4px;
    border: 0;
    background: none;
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
}

.iga-motto__dot i {
    position: relative;
    display: block;
    width: 8px;
    height: 8px;
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.28);
    overflow: hidden;
    transition: width 0.4s cubic-bezier(0.22, 1, 0.36, 1), background-color 0.2s ease;
}

.iga-motto__dot:hover i { background: rgba(255, 255, 255, 0.5); }
.iga-motto__dot:focus-visible { outline: 2px solid #7fdcf5; outline-offset: -4px; border-radius: 10px; }
.iga-motto__dot.is-active i { width: 30px; background: rgba(255, 255, 255, 0.28); }

.iga-motto__dot i::after {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    background: #00b2e3;
    transform: scaleX(0);
    transform-origin: left;
}

/* Ohne Wechsel (ein Spruch, Skript aus, reduzierte Bewegung) zeigt der aktive Punkt voll gefüllt. */
.iga-motto__dot.is-active i::after { transform: scaleX(1); }
.iga-motto.is-running .iga-motto__dot.is-active i::after {
    transform: scaleX(0);
    animation: iga-motto-fill var(--iga-motto-ms, 6500ms) linear forwards;
}
.iga-motto.is-paused .iga-motto__dot.is-active i::after { animation-play-state: paused; }

@keyframes iga-motto-fill { to { transform: scaleX(1); } }

@media (max-width: 767px) {
    .iga-motto {
        flex-wrap: wrap;
        justify-content: center;
        gap: 0;
        min-height: 0;
        padding: 16px 0 4px;
        text-align: center;
    }
    .iga-motto__mark { display: none; }
    .iga-motto__stage { flex: 1 0 100%; }
    .iga-motto p.iga-motto__q { font-size: 17px; line-height: 1.4; }
    .iga-motto__lead, .iga-motto__main { display: block; }
    .iga-motto .iga-motto__lead { font-size: 14.5px; margin-bottom: 2px; }
    .iga-motto__dot { padding: 12px 4px 14px; }
}

/* ===================================================================== */
/* Finanzierungsanfrage                                                   */
/* ===================================================================== */

.ig-ci .igp-section.igp-section--fin { padding: 72px 0; }

.iga-fin {
    display: grid;
    grid-template-columns: minmax(0, 0.94fr) minmax(0, 1.06fr);
    border-radius: 26px;
    overflow: hidden;
    background: #fff;
    border: 1px solid var(--ig-line);
    box-shadow: 0 24px 60px rgba(0, 68, 91, 0.12);
    font-family: "Plus Jakarta Sans", sans-serif;
    color: var(--ig-navy);
}

.iga-fin ul { list-style: none; margin: 0; padding: 0; }
.iga-fin li { margin: 0; }
.iga-fin [hidden] { display: none !important; }

/* ---- Linke Seite: Nutzen ---- */
.iga-fin__pitch {
    position: relative;
    isolation: isolate;
    display: flex;
    flex-direction: column;
    gap: 30px;
    padding: 48px 44px 40px;
    overflow: hidden;
    background:
        radial-gradient(90% 70% at 100% 100%, rgba(0, 178, 227, 0.26), transparent 62%),
        linear-gradient(158deg, #00445b 0%, #005672 100%);
    color: #fff;
}

.iga-fin__deco {
    position: absolute;
    right: -60px;
    bottom: -100px;
    z-index: -1;
    width: 360px;
    height: 360px;
    pointer-events: none;
}

.iga-fin__ring { stroke: rgba(127, 220, 245, 0.2); stroke-width: 1.2; transform-origin: 160px 160px; }
.iga-fin__roof, .iga-fin__walls, .iga-fin__door {
    stroke: #7fdcf5;
    stroke-width: 2.4;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-dasharray: 100;
    stroke-dashoffset: 0;
}

.iga-fin__pitch-body { display: flex; flex-direction: column; }

.iga-fin p.iga-fin__eyebrow {
    margin: 0 0 14px;
    font-size: 14px;
    line-height: 1.3;
    font-weight: 700;
    letter-spacing: 1px;
    text-transform: uppercase;
    color: #7fdcf5;
}

.iga-fin p.iga-fin__eyebrow::before { content: "//"; margin-right: 0.4em; }

.iga-fin h2.iga-fin__title {
    margin: 0;
    font-size: clamp(28px, 3vw, 36px);
    line-height: 1.22;
    font-weight: 700;
    text-transform: uppercase;
    color: #fff;
}

.iga-fin p.iga-fin__lead {
    margin: 18px 0 0;
    max-width: 34em;
    font-size: 16.5px;
    line-height: 1.7;
    color: rgba(255, 255, 255, 0.82);
}

.iga-fin ul.iga-fin__points { display: grid; gap: 13px; margin-top: 28px; }

.iga-fin__points li {
    display: flex;
    align-items: flex-start;
    gap: 13px;
    font-size: 16px;
    line-height: 1.45;
    font-weight: 600;
    color: #fff;
}

.iga-fin__tick {
    flex: 0 0 26px;
    display: grid;
    place-items: center;
    width: 26px;
    height: 26px;
    margin-top: -1px;
    border-radius: 50%;
    background: rgba(127, 220, 245, 0.16);
    color: #7fdcf5;
}

.iga-fin__tick .ig-icon { width: 15px; height: 15px; stroke-width: 2.6; }

.iga-fin__person {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-top: auto;
    padding-top: 24px;
    border-top: 1px solid rgba(255, 255, 255, 0.16);
}

.iga-fin img.iga-fin__photo,
.iga-fin span.iga-fin__photo {
    flex: 0 0 54px;
    display: grid;
    place-items: center;
    width: 54px;
    height: 54px;
    margin: 0;
    border-radius: 50%;
    object-fit: cover;
    border: 2px solid rgba(255, 255, 255, 0.4);
    background: rgba(255, 255, 255, 0.1);
    color: #fff;
}

.iga-fin span.iga-fin__photo .ig-icon { width: 26px; height: 26px; }

.iga-fin__person-text { display: flex; flex-direction: column; gap: 2px; min-width: 0; font-size: 14px; color: rgba(255, 255, 255, 0.78); }
.iga-fin__person-text strong { font-size: 16.5px; font-weight: 700; color: #fff; }
.iga-fin .iga-fin__person-text a { font-size: 15px; font-weight: 600; color: #7fdcf5; text-decoration: none; }
.iga-fin .iga-fin__person-text a:hover { text-decoration: underline; }

/* ---- Rechte Seite: Formular ---- */
.iga-fin__card { position: relative; padding: 48px 44px 40px; background: #fff; }

.iga-fin p.iga-fin__kicker {
    margin: 0;
    font-size: 12.5px;
    font-weight: 700;
    letter-spacing: 1px;
    text-transform: uppercase;
    color: var(--ig-blue);
}

.iga-fin p.iga-fin__form-title {
    margin: 8px 0 24px;
    font-size: clamp(22px, 2.2vw, 27px);
    line-height: 1.25;
    font-weight: 800;
    color: var(--ig-navy);
}

.iga-fin__form { margin: 0; }
.iga-fin__row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 14px; }

/* Schwebende Beschriftung: liegt im Feld, rutscht beim Tippen nach oben */
.iga-fin__field { position: relative; margin: 0 0 14px; }

.iga-fin__field input {
    display: block;
    width: 100%;
    height: 58px;
    margin: 0;
    padding: 23px 16px 7px;
    border: 1.5px solid var(--ig-line);
    border-radius: 14px;
    background: #fff;
    font: 500 16px/1.3 "Plus Jakarta Sans", sans-serif;
    color: var(--ig-navy);
    box-shadow: none;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.iga-fin__field input:hover { border-color: rgba(0, 178, 227, 0.5); }

.iga-fin__field input:focus {
    border-color: var(--ig-blue);
    outline: none;
    box-shadow: 0 0 0 4px rgba(0, 178, 227, 0.16);
}

.iga-fin__field label {
    position: absolute;
    left: 17px;
    top: 18px;
    margin: 0;
    padding: 0;
    max-width: calc(100% - 34px);
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    font: 500 16px/22px "Plus Jakarta Sans", sans-serif;
    color: var(--ig-muted);
    transform-origin: left top;
    pointer-events: none;
    transition: transform 0.22s cubic-bezier(0.22, 1, 0.36, 1), color 0.2s ease;
}

.iga-fin__field label small { font-size: inherit; font-weight: 500; }

.iga-fin__field input:focus + label,
.iga-fin__field input:not(:placeholder-shown) + label,
.iga-fin__field input:-webkit-autofill + label {
    transform: translateY(-12px) scale(0.74);
}

.iga-fin__field input:focus + label { color: var(--ig-blue); }
.iga-fin__field input[aria-invalid="true"] { border-color: #c62828; }

.iga-fin__error { display: block; margin-top: 5px; font-size: 12.5px; font-weight: 600; color: #c62828; }
.iga-fin__error:empty { display: none; }

.iga-fin fieldset.iga-fin__prices { margin: 4px 0 18px; padding: 0; border: 0; min-width: 0; }

.iga-fin fieldset.iga-fin__prices legend {
    float: none;
    width: auto;
    margin: 0 0 9px;
    padding: 0;
    font-size: 13.5px;
    font-weight: 600;
    color: var(--ig-navy);
}

.iga-fin__prices legend small { font-weight: 500; color: var(--ig-muted); font-size: inherit; }
.iga-fin__chips { display: flex; flex-wrap: wrap; gap: 8px; }
.iga-fin__chip { position: relative; margin: 0; cursor: pointer; }
.iga-fin__chip input { position: absolute; opacity: 0; width: 1px; height: 1px; }

.iga-fin__chip span {
    display: inline-block;
    padding: 8px 15px;
    border: 1.5px solid var(--ig-line);
    border-radius: 50px;
    font-size: 14px;
    line-height: 1.3;
    font-weight: 600;
    color: var(--ig-navy);
    transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease, transform 0.15s ease;
}

.iga-fin__chip:hover span { border-color: rgba(0, 178, 227, 0.6); }
.iga-fin__chip:active span { transform: scale(0.97); }
.iga-fin__chip input:checked + span { background: var(--ig-navy); border-color: var(--ig-navy); color: #fff; }
.iga-fin__chip input:focus-visible + span { outline: 2px solid var(--ig-blue); outline-offset: 2px; }

.iga-fin__privacy {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    margin: 0;
    font-size: 13.5px;
    line-height: 1.5;
    font-weight: 500;
    color: var(--ig-muted);
    cursor: pointer;
}

.iga-fin__privacy input { flex: 0 0 18px; width: 18px; height: 18px; margin: 2px 0 0; accent-color: var(--ig-blue); }
.iga-fin__privacy a { color: var(--ig-navy); font-weight: 700; text-decoration: underline; }

.iga-fin p.iga-fin__feedback { margin: 10px 0 0; font-size: 14px; font-weight: 600; }
.iga-fin p.iga-fin__feedback:empty { display: none; }
.iga-fin p.iga-fin__feedback.is-error { color: #c62828; }

.iga-fin__submit {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    width: 100%;
    margin: 22px 0 0;
    padding: 16px 28px;
    border: 0;
    border-radius: 50px;
    overflow: hidden;
    background: var(--ig-blue);
    font: 600 16px/22px "Plus Jakarta Sans", sans-serif;
    color: #fff;
    cursor: pointer;
    transition: background-color 0.3s ease, transform 0.15s ease, box-shadow 0.3s ease;
}

.iga-fin__submit::before {
    content: "";
    position: absolute;
    inset: 0 auto 0 -60%;
    width: 40%;
    background: linear-gradient(100deg, transparent, rgba(255, 255, 255, 0.35), transparent);
    transform: skewX(-18deg);
    pointer-events: none;
}

.iga-fin.is-visible .iga-fin__submit::before { animation: iga-fin-shine 1.3s 1.4s ease-out 1 both; }
@keyframes iga-fin-shine { to { left: 130%; } }

.iga-fin__submit:hover:not(:disabled),
.iga-fin__submit:focus-visible { background: var(--ig-navy); box-shadow: 0 10px 24px rgba(0, 68, 91, 0.25); }
.iga-fin__submit:focus-visible { outline: 2px solid var(--ig-blue); outline-offset: 3px; }
.iga-fin__submit:active:not(:disabled) { transform: scale(0.985); }
.iga-fin__submit:disabled { cursor: not-allowed; opacity: 0.6; }
.iga-fin__submit.is-busy { cursor: progress; opacity: 0.75; }
.iga-fin__submit-icon { width: 19px; height: 19px; stroke-width: 2.2; transition: transform 0.25s cubic-bezier(0.22, 1, 0.36, 1); }
.iga-fin__submit:hover .iga-fin__submit-icon { transform: translateX(4px); }

/* Danke-Ansicht (Markup und Animation aus den Kurzformularen) */
.iga-fin__done .igoo-quick__done { padding: 14px 0 6px; }

.iga-fin__done h3.igoo-quick__done-title {
    max-width: 440px;
    margin: 0 auto 10px;
    font-size: 24px;
    font-weight: 700;
    line-height: 1.25;
    text-transform: none;
    color: var(--ig-navy);
    outline: none;
}

.iga-fin__done .igoo-quick__done-mark { color: var(--ig-blue); }

.iga-fin__done p.igoo-quick__done-text {
    max-width: 420px;
    margin: 0 auto;
    font-size: 16px;
    line-height: 1.55;
    color: var(--ig-muted);
}

.iga-fin__done p.igoo-quick__done-alt { margin: 18px 0 0; font-size: 14px; color: var(--ig-muted); }

.iga-fin__done .igoo-quick__done-alt a {
    margin-left: 4px;
    font-weight: 700;
    color: var(--ig-navy);
    text-decoration: none;
    border-bottom: 1px solid var(--ig-blue);
}

/* ---- Einblenden beim Scrollen (nur mit JS) ---- */
.ig-js .iga-fin[data-ig-reveal]:not(.is-visible) { opacity: 0; transform: translateY(28px); }
.iga-fin { transition: opacity 0.7s ease, transform 0.8s cubic-bezier(0.22, 1, 0.36, 1); }

.ig-js .iga-fin[data-ig-reveal]:not(.is-visible) .iga-fin__points li { opacity: 0; transform: translateX(-14px); }
.iga-fin__points li { transition: opacity 0.5s ease, transform 0.6s cubic-bezier(0.22, 1, 0.36, 1); transition-delay: calc(0.35s + var(--i, 0) * 0.11s); }

.ig-js .iga-fin[data-ig-reveal]:not(.is-visible) .iga-fin__roof,
.ig-js .iga-fin[data-ig-reveal]:not(.is-visible) .iga-fin__walls,
.ig-js .iga-fin[data-ig-reveal]:not(.is-visible) .iga-fin__door { stroke-dashoffset: 100; }

.iga-fin__walls { transition: stroke-dashoffset 0.9s cubic-bezier(0.65, 0, 0.35, 1) 0.2s; }
.iga-fin__roof { transition: stroke-dashoffset 0.8s cubic-bezier(0.65, 0, 0.35, 1) 0.75s; }
.iga-fin__door { transition: stroke-dashoffset 0.6s cubic-bezier(0.65, 0, 0.35, 1) 1.2s; }

/* Ruhige Ringe hinter dem Haus (Wellen, die nach außen laufen) */
.iga-fin.is-visible .iga-fin__ring { animation: iga-fin-ring 7s ease-in-out infinite; }
.iga-fin.is-visible .iga-fin__ring--b { animation-delay: 1.6s; }
.iga-fin.is-visible .iga-fin__ring--c { animation-delay: 3.2s; }

@keyframes iga-fin-ring {
    0%, 100% { transform: scale(0.96); opacity: 0.55; }
    50% { transform: scale(1.03); opacity: 1; }
}

/* ---- Responsive ---- */
@media (max-width: 1100px) {
    .iga-fin__pitch, .iga-fin__card { padding: 40px 32px 34px; }
}

@media (max-width: 991px) {
    .ig-ci .igp-section.igp-section--fin { padding: 56px 0; }
    .iga-fin { grid-template-columns: 1fr; border-radius: 22px; }
    .iga-fin__pitch { gap: 24px; padding: 34px 28px 28px; }
    .iga-fin__deco { right: -90px; bottom: -80px; width: 340px; height: 340px; opacity: 0.8; }
    .iga-fin ul.iga-fin__points { margin-top: 22px; }
    .iga-fin__card { padding: 32px 28px 30px; }
}

@media (max-width: 600px) {
    .ig-ci .igp-section.igp-section--fin { padding: 40px 0; }
    .iga-fin { border-radius: 18px; }
    .iga-fin__pitch { padding: 28px 20px 22px; gap: 20px; }
    .iga-fin p.iga-fin__lead { font-size: 15.5px; line-height: 1.65; }
    .iga-fin ul.iga-fin__points { gap: 11px; }
    .iga-fin__points li { font-size: 15px; }
    /* Handy: Formular soll schnell erreichbar sein, daher kürzerer Nutzenblock */
    .iga-fin__points li:nth-child(n+3) { display: none; }
    .iga-fin__roof, .iga-fin__walls, .iga-fin__door { display: none; }
    .iga-fin__person { padding-top: 18px; }
    .iga-fin__card { padding: 26px 20px 24px; }
    .iga-fin__row { grid-template-columns: 1fr; }
    .iga-fin__chip span { padding: 8px 13px; font-size: 13.5px; }
}

@media (prefers-reduced-motion: reduce) {
    .iga-fin, .iga-fin__points li, .iga-fin__walls, .iga-fin__roof, .iga-fin__door,
    .iga-motto__lead, .iga-motto__main, .iga-motto .iga-motto__main em { transition: none !important; }
    .iga-fin__ring, .iga-fin__submit::before, .iga-motto__mark-door { animation: none !important; }
    .iga-fin.is-visible .iga-fin__ring { animation: none !important; }
    .iga-motto__lead, .iga-motto__main { opacity: 1; transform: none; }
    .iga-motto .iga-motto__main em { background-size: 100% 3px; }
}

/* Fußnote zu den Sternchen (Stand der Zins- und Steueraussagen) */
.ig-ci .igp-section.igp-section--note { padding: 0 0 48px; }
.ig-ci .igp-footnote { max-width: 860px; font-size: 13px; line-height: 1.6; color: var(--ig-muted); }