/* Mutual Funds — Phase 01 Hero */
*, *::before, *::after { box-sizing: border-box; }
.mf-hero { min-height: 0; padding: clamp(3rem, 7vw, 6.5rem) 0; padding-top: max(clamp(3rem, 7vw, 6.5rem), env(safe-area-inset-top)); padding-bottom: max(clamp(3rem, 7vw, 6.5rem), env(safe-area-inset-bottom)); background: #f3f7fb; color: #0f172a; }
.mf-hero__container { display: grid; grid-template-columns: minmax(0, 56fr) minmax(0, 44fr); align-items: center; width: calc(100% - 3rem); max-width: 1280px; min-height: 0; margin: 0 auto; grid-column-gap: clamp(1.5rem, 4vw, 4rem); grid-row-gap: 2rem; }
.mf-hero__content { display: flex; flex-direction: column; align-items: center; min-width: 0; min-height: 0; text-align: center; }.mf-hero__eyebrow { margin: 0 0 .9rem; color: #006b48; font-size: .72rem; font-weight: 800; letter-spacing: .13em; line-height: 1.35; text-transform: uppercase; }.mf-hero h1 { max-width: 43rem; margin: 0; color: #0f172a; font-size: clamp(2rem, 4.5vw, 4rem); letter-spacing: -.055em; line-height: 1.1; }.mf-hero h1 span { color: #00875a; }.mf-hero__description { max-width: 36rem; margin: 1.25rem 0 0; color: #405267; font-size: clamp(.95rem, 1.5vw, 1.1rem); line-height: 1.7; }.mf-hero__callout { margin: 1.3rem 0 0; padding: .7rem 1rem; border: 1px solid #a7d7c6; border-radius: 999px; background: #e8f5ef; color: #006b48; font-size: clamp(.8rem, 1.25vw, .94rem); font-weight: 750; line-height: 1.35; }
.mf-hero__stats { display: flex; align-items: stretch; justify-content: center; width: 100%; margin: clamp(1.8rem, 4vw, 2.6rem) 0 0; padding: 0; }.mf-hero__stats > div { flex: 1 1 0; min-width: 0; margin: 0 .25rem; padding: .15rem .2rem; text-align: center; }.mf-hero__stats dt { color: #00875a; font-size: clamp(1.2rem, 3.2vw, 2rem); font-weight: 800; letter-spacing: -.04em; line-height: 1.1; }.mf-hero__stats dd { margin: .35rem 0 0; color: #0f172a; font-size: clamp(.62rem, 1.35vw, .86rem); font-weight: 700; line-height: 1.3; }
.mf-hero__actions { display: flex; align-items: stretch; justify-content: center; width: 100%; margin: 1.9rem 0 0; }.mf-hero__button { display: inline-flex; flex: 1 1 0; align-items: center; justify-content: center; min-width: 0; min-height: 50px; margin: 0 .3rem; padding: .75rem clamp(.5rem, 1.7vw, 1.25rem); border: 1px solid #0f172a; border-radius: .7rem; color: #0f172a; cursor: pointer; font-size: clamp(.62rem, 1.15vw, .84rem); font-weight: 800; letter-spacing: .035em; line-height: 1.25; text-align: center; text-decoration: none; text-transform: uppercase; -webkit-appearance: none; -webkit-tap-highlight-color: transparent; transition: transform 180ms ease, opacity 180ms ease, background-color 180ms ease; }.mf-hero__button span { margin-left: .38rem; font-size: 1.05em; }.mf-hero__button--primary { border-color: #00875a; background: #00875a; color: #fff; }.mf-hero__button:hover { transform: translateY(-2px); }.mf-hero__button--primary:hover { background: #006b48; }.mf-hero__button--secondary:hover { background: #e4edf5; }.mf-hero__button:focus-visible, .mf-sip input:focus-visible { outline: 3px solid #00875a; outline-offset: 3px; }
.mf-hero__calculator-wrap { min-width: 0; }.mf-sip { min-height: 0; padding: clamp(1.2rem, 3vw, 2rem); border: 1px solid #d4e0ea; border-radius: 1rem; background: #eaf1f7; box-shadow: 0 18px 38px rgba(15, 23, 42, .1); }.mf-sip__header { margin-bottom: 1.4rem; text-align: center; }.mf-sip__header p { margin: 0; color: #006b48; font-size: .72rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }.mf-sip__header h2 { margin: .35rem 0 0; color: #0f172a; font-size: clamp(1.45rem, 2.7vw, 2rem); letter-spacing: -.035em; line-height: 1.2; }.mf-sip__field { margin: 0 0 1.25rem; }.mf-sip__field label { display: block; margin-bottom: .52rem; color: #0f172a; font-size: .82rem; font-weight: 750; line-height: 1.35; }.mf-sip__field label span { color: #52657a; font-weight: 600; }.mf-sip__input-row { display: flex; align-items: center; min-height: 46px; padding: 0 .8rem; border: 1px solid #b8c9d8; border-radius: .58rem; background: #fff; color: #52657a; font-size: .9rem; }.mf-sip__input-row input { flex: 1 1 auto; min-width: 0; height: 44px; margin: 0 .35rem; border: 0; outline: 0; background: transparent; color: #0f172a; font: inherit; font-weight: 750; -webkit-appearance: none; appearance: none; }.mf-sip__range { display: block; width: 100%; height: 22px; margin: .45rem 0 0; cursor: pointer; accent-color: #00875a; -webkit-appearance: none; appearance: none; background: transparent; -webkit-tap-highlight-color: transparent; }.mf-sip__range::-webkit-slider-runnable-track { height: 5px; border-radius: 999px; background: #b8c9d8; }.mf-sip__range::-webkit-slider-thumb { width: 18px; height: 18px; margin-top: -6.5px; border: 3px solid #fff; border-radius: 50%; background: #00875a; box-shadow: 0 1px 5px rgba(15,23,42,.25); -webkit-appearance: none; appearance: none; }.mf-sip__range::-moz-range-track { height: 5px; border-radius: 999px; background: #b8c9d8; }.mf-sip__range::-moz-range-thumb { width: 18px; height: 18px; border: 3px solid #fff; border-radius: 50%; background: #00875a; box-shadow: 0 1px 5px rgba(15,23,42,.25); }
.mf-sip__result { display: block; margin: 1.55rem 0 0; padding: 1rem; border-radius: .75rem; background: #fff; }.mf-sip__result-row, .mf-sip__result-total { display: flex; align-items: center; justify-content: space-between; min-width: 0; }.mf-sip__result-row { margin-bottom: .68rem; color: #52657a; font-size: .84rem; }.mf-sip__result-row strong { color: #0f172a; font-size: .92rem; }.mf-sip__result-total { margin-top: .85rem; padding-top: .85rem; border-top: 1px solid #dbe5ed; color: #0f172a; font-size: .88rem; font-weight: 750; }.mf-sip__result-total strong { color: #006b48; font-size: clamp(1.35rem, 2.6vw, 1.85rem); letter-spacing: -.045em; line-height: 1.1; }.mf-sip__result.is-updated .mf-sip__result-total strong { animation: mf-value-pulse 260ms ease-out; }.mf-hero__disclaimer { margin: .85rem 0 0; color: #52657a; font-size: .72rem; line-height: 1.55; text-align: center; }.mf-sip__sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
@keyframes mf-value-pulse { 50% { opacity: .65; transform: scale(1.035); } }
@media (max-width: 360px) { .mf-hero { padding-right: 12px; padding-left: 12px; }.mf-hero__container { display: flex; flex-direction: column; width: 100%; }.mf-hero h1 { font-size: 2rem; }.mf-hero__stats > div { margin-right: .08rem; margin-left: .08rem; }.mf-hero__button { min-height: 44px; margin-right: .15rem; margin-left: .15rem; font-size: .59rem; letter-spacing: .015em; }.mf-sip { padding: 1rem; }.mf-sip__result { padding: .85rem; } }
@media (min-width: 361px) and (max-width: 480px) { .mf-hero__container { display: flex; flex-direction: column; width: calc(100% - 2rem); }.mf-hero__button { min-height: 48px; } }
@media (min-width: 481px) and (max-width: 767px) { .mf-hero__container { display: flex; flex-direction: column; width: calc(100% - 3rem); }.mf-hero__calculator-wrap { width: 100%; max-width: 35rem; margin: 0 auto; } }
@media (min-width: 768px) and (max-width: 1023px) { .mf-hero__container { grid-template-columns: 1fr; width: calc(100% - 4rem); }.mf-hero__content { max-width: 46rem; margin: 0 auto; }.mf-hero__calculator-wrap { width: 100%; max-width: 42rem; margin: 0 auto; } }
@media (min-width: 1024px) and (max-width: 1279px) { .mf-hero__container { width: calc(100% - 4rem); } }
@media (min-width: 1280px) { .mf-sip { box-shadow: 0 22px 46px rgba(15,23,42,.12); } }
@media (prefers-reduced-motion: reduce) { .mf-hero__button { transition: none; }.mf-sip__result.is-updated .mf-sip__result-total strong { animation: none; } }

/* Mobile input and slider touch corrections. */
.mf-sip input[type="number"],
.mf-sip input[type="text"] { -webkit-tap-highlight-color: transparent; }
.mf-sip input[type="number"]:focus,
.mf-sip input[type="text"]:focus,
.mf-sip input[type="number"]:active,
.mf-sip input[type="text"]:active { outline: none !important; box-shadow: none !important; -webkit-tap-highlight-color: transparent; }
@media (max-width: 1023px) {
    .mf-sip__range { display: block; width: 82%; margin: .45rem auto 0; }
}

/* Mutual Funds — Phase 02: Why Mutual Funds */
.mf-phase2, .mf-phase2 *, .mf-phase2 *::before, .mf-phase2 *::after { box-sizing: border-box; }
.mf-phase2 { min-height: 0; padding: clamp(3.75rem, 7vw, 7rem) 0; padding-top: max(clamp(3.75rem, 7vw, 7rem), env(safe-area-inset-top)); padding-bottom: max(clamp(3.75rem, 7vw, 7rem), env(safe-area-inset-bottom)); background: #fff; color: #0f172a; text-align: center; }
.mf-phase2__container { width: calc(100% - 3rem); max-width: 1280px; min-height: 0; margin: 0 auto; }.mf-phase2__header { text-align: center; }.mf-phase2__eyebrow { margin: 0; color: #006b48; font-size: clamp(.7rem, 1.1vw, .8rem); font-weight: 800; letter-spacing: .13em; line-height: 1.4; text-transform: uppercase; }.mf-phase2 h2 { margin: .85rem auto 0; color: #0f172a; font-size: clamp(1.9rem, 4vw, 3.4rem); letter-spacing: -.045em; line-height: 1.14; }
.mf-phase2__highlights { display: flex; align-items: center; justify-content: center; margin: clamp(1.7rem, 4vw, 2.7rem) -4px 0; padding: 0; list-style: none; }.mf-phase2__highlights li { display: inline-flex; align-items: center; justify-content: center; min-height: 42px; margin: 0 4px 8px; padding: .62rem .82rem; border: 1px solid #b9dece; border-radius: 999px; background: #edf7f2; color: #0f172a; font-size: clamp(.72rem, 1.2vw, .88rem); font-weight: 700; line-height: 1.35; }.mf-phase2__highlights svg { flex: 0 0 18px; width: 18px; height: 18px; margin-right: .44rem; fill: none; stroke: #00875a; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.8; }
.mf-phase2__goals { margin: clamp(3.5rem, 7vw, 6rem) 0 0; }.mf-phase2 h3 { margin: 0; color: #0f172a; font-size: clamp(1.35rem, 2.5vw, 2rem); letter-spacing: -.03em; line-height: 1.2; }.mf-phase2__goals-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); align-items: stretch; margin: clamp(1.8rem, 4vw, 3.1rem) -10px 0; }.mf-goal-card { display: flex; flex-direction: column; align-items: center; min-width: 0; min-height: 0; margin: 0 10px 1.25rem; padding: clamp(1.45rem, 3.2vw, 2.35rem); border: 1px solid #e2e8f0; border-radius: clamp(1rem, 2vw, 1.25rem); background: #f8fafc; text-align: center; transition: transform 180ms ease, opacity 180ms ease; }.mf-goal-card:hover { opacity: .96; transform: translateY(-4px); }.mf-goal-card__icon { display: block; width: clamp(2.9rem, 5vw, 3.8rem); height: clamp(2.9rem, 5vw, 3.8rem); margin: 0 auto 1rem; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 2; }.mf-goal-card--wealth { color: #00875a; }.mf-goal-card--retirement { color: #0f172a; }.mf-goal-card--child { color: #0284c7; }.mf-goal-card h4 { margin: 0; color: #0f172a; font-size: clamp(1rem, 1.65vw, 1.2rem); letter-spacing: -.02em; line-height: 1.3; text-transform: uppercase; }.mf-goal-card p { margin: .68rem 0 0; color: #52657a; font-size: clamp(.84rem, 1.2vw, .96rem); line-height: 1.6; }
.mf-phase2__benefits { margin: clamp(2.3rem, 5vw, 4rem) 0 0; padding: clamp(1.4rem, 3.5vw, 2.7rem); border: 1px solid #e2e8f0; border-radius: clamp(1rem, 2vw, 1.25rem); background: #f8fafc; box-shadow: 0 12px 28px rgba(15,23,42,.05); text-align: center; }.mf-phase2__benefits ul { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); margin: clamp(1.35rem, 3vw, 2.2rem) -7px 0; padding: 0; list-style: none; }.mf-phase2__benefits li { display: flex; flex-direction: column; align-items: center; min-width: 0; margin: 0 7px 1.25rem; color: #34455a; font-size: clamp(.78rem, 1.15vw, .92rem); font-weight: 650; line-height: 1.55; text-align: center; }.mf-phase2__benefits li::before { display: grid; width: 1.45rem; height: 1.45rem; margin: 0 auto .62rem; place-items: center; border-radius: 50%; background: #00875a; color: #fff; content: "✓"; font-size: .88rem; font-weight: 800; line-height: 1; }
@media (max-width: 360px) { .mf-phase2 { padding-right: 12px; padding-left: 12px; }.mf-phase2__container { width: 100%; }.mf-phase2 h2 { font-size: 1.8rem; }.mf-phase2__highlights { display: block; margin-right: 0; margin-left: 0; }.mf-phase2__highlights li { display: flex; width: 100%; min-height: 44px; margin: 0 0 .5rem; }.mf-phase2__goals-grid { grid-template-columns: 1fr; margin-right: 0; margin-left: 0; }.mf-goal-card { margin-right: 0; margin-left: 0; padding: 1.35rem 1rem; }.mf-phase2__benefits { padding: 1.25rem .9rem; }.mf-phase2__benefits ul { grid-template-columns: 1fr; margin-right: 0; margin-left: 0; }.mf-phase2__benefits li { margin-right: 0; margin-left: 0; } }
@media (min-width: 361px) and (max-width: 480px) { .mf-phase2__container { width: calc(100% - 2rem); }.mf-phase2__highlights { flex-wrap: wrap; }.mf-phase2__goals-grid { grid-template-columns: 1fr; margin-right: 0; margin-left: 0; }.mf-goal-card { margin-right: 0; margin-left: 0; }.mf-phase2__benefits ul { grid-template-columns: 1fr; margin-right: 0; margin-left: 0; }.mf-phase2__benefits li { margin-right: 0; margin-left: 0; } }
@media (min-width: 481px) and (max-width: 767px) { .mf-phase2__container { width: calc(100% - 3rem); }.mf-phase2__highlights { flex-wrap: wrap; }.mf-phase2__goals-grid { grid-template-columns: 1fr; max-width: 27.5rem; margin-right: auto; margin-left: auto; }.mf-goal-card { margin-right: 0; margin-left: 0; }.mf-phase2__benefits ul { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 768px) and (max-width: 1023px) { .mf-phase2__container { width: calc(100% - 4rem); }.mf-phase2__highlights { flex-wrap: wrap; }.mf-phase2__benefits ul { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1024px) and (max-width: 1279px) { .mf-phase2__container { width: calc(100% - 4rem); } }
@media (min-width: 1280px) { .mf-goal-card, .mf-phase2__benefits { border-radius: 20px; } }
@media (prefers-reduced-motion: reduce) { .mf-goal-card { transition: none; } }

/* Phase 02 structural correction: accent-led goal rows. */
.mf-goal-card {
    display: grid;
    grid-template-columns: clamp(2.8rem, 5vw, 3.8rem) minmax(0, 1fr);
    grid-template-rows: auto auto;
    align-items: center;
    justify-items: start;
    min-height: 0;
    padding: clamp(1.1rem, 2.5vw, 1.75rem);
    border: 0;
    border-left: 4px solid #00875a;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    column-gap: clamp(.75rem, 1.6vw, 1rem);
    text-align: left;
}
.mf-goal-card:hover { opacity: 1; transform: none; }
.mf-goal-card--wealth { border-left-color: #00875a; }
.mf-goal-card--retirement { border-left-color: #0f172a; }
.mf-goal-card--child { border-left-color: #0284c7; }
.mf-goal-card__icon {
    grid-row: 1;
    grid-column: 1;
    width: clamp(2.8rem, 5vw, 3.8rem);
    height: clamp(2.8rem, 5vw, 3.8rem);
    margin: 0;
    padding: .58rem;
    background: #e8f5ef;
    clip-path: polygon(25% 6.7%, 75% 6.7%, 100% 50%, 75% 93.3%, 25% 93.3%, 0 50%);
}
.mf-goal-card--wealth .mf-goal-card__icon { background: #e8f5ef; }
.mf-goal-card--retirement .mf-goal-card__icon { background: #e8eef5; }
.mf-goal-card--child .mf-goal-card__icon { background: #e6f5fc; }
.mf-goal-card h4 { grid-row: 1; grid-column: 2; margin: 0; text-align: left; }
.mf-goal-card p { grid-row: 2; grid-column: 2; margin: .35rem 0 0; text-align: left; }
@media (max-width: 767px) {
    .mf-phase2__benefits .mf-benefits-list li {
        flex-direction: row;
        align-items: flex-start;
        justify-content: flex-start;
        text-align: left;
    }
    .mf-phase2__benefits .mf-benefits-list li::before {
        flex: 0 0 1.45rem;
        margin: .1rem .62rem 0 0;
    }
}

/* Mutual Funds — Phase 03: Investment journey */
.mf-phase3, .mf-phase3 *, .mf-phase3 *::before, .mf-phase3 *::after { box-sizing: border-box; }
.mf-phase3 { min-height: 0; padding: clamp(3.75rem, 7vw, 7rem) 0; padding-top: max(clamp(3.75rem, 7vw, 7rem), env(safe-area-inset-top)); padding-bottom: max(clamp(3.75rem, 7vw, 7rem), env(safe-area-inset-bottom)); overflow: hidden; background: #f8fafc; color: #0f172a; }
.mf-phase3__container { position: relative; width: calc(100% - 3rem); max-width: 1280px; min-height: 0; margin: 0 auto; }.mf-phase3__header { position: relative; z-index: 2; text-align: center; }.mf-phase3__header p { margin: 0; color: #006b48; font-size: clamp(.7rem, 1.1vw, .8rem); font-weight: 800; letter-spacing: .13em; line-height: 1.4; text-transform: uppercase; }.mf-phase3__header h2 { margin: .8rem 0 0; color: #0f172a; font-size: clamp(1.9rem, 4vw, 3.4rem); letter-spacing: -.045em; line-height: 1.14; }.mf-phase3__header span { display: block; margin: .8rem 0 0; color: #52657a; font-size: clamp(.92rem, 1.4vw, 1.08rem); line-height: 1.6; text-align: center; }
.mf-phase3__path { position: absolute; pointer-events: none; }.mf-phase3__path path { fill: none; stroke: #00875a; stroke-dasharray: 8 6; stroke-width: 3; vector-effect: non-scaling-stroke; will-change: stroke-dashoffset; animation: mf-path-flow 1.4s linear infinite; }.mf-phase3__path circle { fill: #00875a; }.mf-phase3__path--mobile { display: none; }
.mf-phase3__steps { position: relative; z-index: 1; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); align-items: start; margin: clamp(3.4rem, 8vw, 6.2rem) -9px 0; padding: 0; list-style: none; }.mf-process-step { position: relative; min-width: 0; min-height: 0; margin: 0 9px 1.15rem; padding: clamp(1rem, 2vw, 1.45rem); border: 1px solid #dbe5ed; border-radius: 1rem; background: #fff; opacity: 1; transform: none; transition: transform 180ms ease, border-color 180ms ease; }.mf-process-step:nth-child(even) { margin-top: clamp(3.1rem, 5vw, 3.75rem); }.mf-process-step__serial { display: grid; width: 2.1rem; height: 2.1rem; margin: 0 0 .95rem; place-items: center; border-radius: 50%; background: #00875a; color: #fff; font-size: .78rem; font-weight: 800; line-height: 1; }.mf-process-step__heading { display: flex; align-items: center; min-width: 0; }.mf-process-step__heading svg { flex: 0 0 34px; width: 34px; height: 34px; margin-right: .72rem; fill: none; stroke: #00875a; stroke-linecap: round; stroke-linejoin: round; stroke-width: 2; }.mf-process-step:nth-child(2) .mf-process-step__heading svg, .mf-process-step:nth-child(4) .mf-process-step__heading svg { stroke: #0284c7; }.mf-process-step h3 { margin: 0; color: #0f172a; font-size: clamp(.9rem, 1.35vw, 1.08rem); line-height: 1.3; }.mf-process-step p { margin: .8rem 0 0; color: #52657a; font-size: clamp(.8rem, 1.15vw, .92rem); line-height: 1.6; }.mf-process-step:hover, .mf-process-step.is-active { border-color: #00875a; transform: translateY(-4px); }
@keyframes mf-path-flow { to { stroke-dashoffset: -28; } }
@media (max-width: 360px) { .mf-phase3 { padding-right: 12px; padding-left: 12px; }.mf-phase3__container { width: 100%; }.mf-phase3__header h2 { font-size: 1.8rem; }.mf-phase3__path--desktop { display: none; }.mf-phase3__path--mobile { display: block; top: 11.4rem; bottom: 2rem; left: 50%; width: 26px; height: calc(100% - 12rem); transform: translateX(-50%); }.mf-phase3__steps { display: block; margin: 2.6rem 0 0; }.mf-process-step { width: calc(100% - 1.4rem); margin: 0 0 1.3rem; padding: 12px 14px; }.mf-process-step:nth-child(even) { margin-top: 0; margin-left: auto; }.mf-process-step:nth-child(odd) { margin-right: auto; }.mf-process-step__serial { width: 30px; height: 30px; margin-bottom: .7rem; font-size: .7rem; } }
@media (min-width: 361px) and (max-width: 480px) { .mf-phase3__container { width: calc(100% - 2rem); }.mf-phase3__path--desktop { display: none; }.mf-phase3__path--mobile { display: block; top: 11rem; bottom: 2rem; left: 50%; width: 28px; height: calc(100% - 11.5rem); transform: translateX(-50%); }.mf-phase3__steps { display: block; margin: 2.9rem 0 0; }.mf-process-step { width: calc(100% - 2rem); margin: 0 0 1.45rem; }.mf-process-step:nth-child(even) { margin-top: 0; margin-left: auto; }.mf-process-step:nth-child(odd) { margin-right: auto; }.mf-process-step__heading svg { flex-basis: 32px; width: 32px; height: 32px; } }
@media (min-width: 481px) and (max-width: 767px) { .mf-phase3__container { width: calc(100% - 3rem); max-width: 580px; }.mf-phase3__path--desktop { display: none; }.mf-phase3__path--mobile { display: block; top: 11rem; bottom: 2rem; left: 50%; width: 32px; height: calc(100% - 11.5rem); transform: translateX(-50%); }.mf-phase3__steps { grid-template-columns: repeat(2, minmax(0, 1fr)); margin: 3rem -8px 0; }.mf-process-step { margin: 0 8px 1.4rem; }.mf-process-step:nth-child(even) { margin-top: 2.6rem; }.mf-process-step:nth-child(3) { margin-top: .4rem; } }
@media (min-width: 768px) and (max-width: 1023px) { .mf-phase3__container { width: calc(100% - 4rem); }.mf-phase3__path--desktop { display: none; }.mf-phase3__path--mobile { display: block; top: 11.3rem; bottom: 2rem; left: 50%; width: 34px; height: calc(100% - 12rem); transform: translateX(-50%); }.mf-phase3__steps { grid-template-columns: repeat(2, minmax(0, 1fr)); margin: 3.4rem -12px 0; }.mf-process-step { margin: 0 12px 1.7rem; }.mf-process-step:nth-child(even) { margin-top: 3rem; }.mf-process-step:nth-child(3) { margin-top: .4rem; } }
@media (min-width: 1024px) and (max-width: 1279px) { .mf-phase3__container { width: calc(100% - 4rem); }.mf-phase3__path--desktop { display: block; top: 11.2rem; left: 4%; width: 92%; height: 12rem; } }
@media (min-width: 1280px) { .mf-phase3__path--desktop { display: block; top: 11.1rem; left: 4%; width: 92%; height: 13rem; }.mf-process-step:nth-child(even) { margin-top: 3.75rem; }.mf-process-step:hover { transform: translateY(-6px); } }
@media (prefers-reduced-motion: reduce) { .mf-phase3__path path { animation: none !important; }.mf-process-step { transition: none; } }

/* Mutual Funds — Phase 04: Invest your way */
.mf-phase4, .mf-phase4 *, .mf-phase4 *::before, .mf-phase4 *::after { box-sizing: border-box; }
.mf-phase4 { min-height: 0; padding: clamp(3.75rem, 7vw, 7rem) 0; padding-top: max(clamp(3.75rem, 7vw, 7rem), env(safe-area-inset-top)); padding-bottom: max(clamp(3.75rem, 7vw, 7rem), env(safe-area-inset-bottom)); background: #f8fafc; color: #0f172a; }.mf-phase4__container { width: calc(100% - 3rem); max-width: 1140px; min-height: 0; margin: 0 auto; }.mf-phase4__header { text-align: center; }.mf-phase4__header > p { margin: 0; color: #006b48; font-size: clamp(.7rem, 1.1vw, .8rem); font-weight: 800; letter-spacing: .13em; line-height: 1.4; text-transform: uppercase; }.mf-phase4 h2 { margin: .8rem 0 0; color: #0f172a; font-size: clamp(1.9rem, 4vw, 3.4rem); letter-spacing: -.045em; line-height: 1.14; }.mf-phase4__header > span { display: block; margin: .8rem 0 0; color: #52657a; font-size: clamp(.92rem, 1.4vw, 1.08rem); line-height: 1.6; }
.mf-phase4__badges { display: flex; align-items: center; justify-content: center; margin: 1.5rem -4px 0; }.mf-phase4__badges > span { display: inline-flex; align-items: center; justify-content: center; min-height: 40px; margin: 0 4px 8px; padding: .58rem .75rem; border: 1px solid #b9dece; border-radius: 999px; background: #edf7f2; color: #0f172a; font-size: clamp(.7rem, 1.1vw, .84rem); font-weight: 700; line-height: 1.35; text-align: center; }.mf-phase4__badges svg { flex: 0 0 18px; width: 18px; height: 18px; margin-right: .42rem; fill: none; stroke: #00875a; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.8; }.mf-phase4__badges > span:last-child svg { stroke: #0284c7; }
.mf-phase4__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: stretch; margin: clamp(2.5rem, 5vw, 4rem) -12px 0; }.mf-invest-route { display: flex; flex-direction: column; min-width: 0; min-height: 0; margin: 0 12px 1.4rem; overflow: hidden; border: 1px solid #dbe5ed; border-radius: 16px; background: #fff; box-shadow: 0 12px 28px rgba(15,23,42,.06); outline: none; transition: transform 180ms ease, opacity 180ms ease; }.mf-invest-route > header { padding: clamp(1.4rem, 3vw, 2.15rem) 1rem; color: #fff; text-align: center; }.mf-invest-route--sip > header { background: #0f172a; }.mf-invest-route--lumpsum > header { background: #064e3b; }.mf-invest-route h3 { margin: 0; color: #fff; font-size: clamp(1.45rem, 2.8vw, 2rem); letter-spacing: .06em; line-height: 1.1; text-transform: uppercase; }.mf-invest-route > header p { margin: .45rem 0 0; color: #f8fafc; font-size: clamp(.83rem, 1.25vw, .96rem); line-height: 1.5; }.mf-invest-route:hover, .mf-invest-route:focus-visible { opacity: .98; transform: translateY(-4px); }.mf-invest-route:focus-visible { outline: 3px solid #00875a; outline-offset: 3px; }
.mf-route-map { position: relative; flex: 1 1 auto; margin: 0; padding: clamp(1.3rem, 3vw, 2rem) clamp(1rem, 3vw, 2rem) clamp(1.3rem, 3vw, 2rem) calc(clamp(1rem, 3vw, 2rem) + 48px); list-style: none; text-align: left; }.mf-route-map::before { position: absolute; top: calc(clamp(1.3rem, 3vw, 2rem) + 18px); bottom: calc(clamp(1.3rem, 3vw, 2rem) + 18px); left: calc(clamp(1rem, 3vw, 2rem) + 17px); width: 2px; background: #cbd5e1; content: ""; }.mf-route-map li { position: relative; display: flex; align-items: center; min-height: 36px; margin: 0 0 1rem; color: #0f172a; font-size: clamp(.84rem, 1.25vw, .96rem); line-height: 1.45; text-align: left; }.mf-route-map li:last-child { margin-bottom: 0; }.mf-route-map li span { position: absolute; top: 0; right: calc(100% + 12px); z-index: 1; display: flex; width: 36px; height: 36px; align-items: center; justify-content: center; border-radius: 50%; background: #00875a; color: #fff; font-size: .72rem; font-weight: 800; line-height: 1; }.mf-invest-route--lumpsum .mf-route-map li span { background: #0284c7; }
@media (max-width: 360px) { .mf-phase4 { padding-right: 12px; padding-left: 12px; }.mf-phase4__container { width: 100%; }.mf-phase4 h2 { font-size: 1.8rem; }.mf-phase4__badges { display: block; margin-right: 0; margin-left: 0; }.mf-phase4__badges > span { display: flex; width: 100%; min-height: 44px; margin: 0 0 .5rem; }.mf-phase4__grid { grid-template-columns: 1fr; margin-right: 0; margin-left: 0; }.mf-invest-route { margin-right: 0; margin-left: 0; border-radius: 12px; }.mf-route-map { padding: 1.2rem 12px 1.2rem 54px; }.mf-route-map::before { top: 33px; bottom: 33px; left: 27px; }.mf-route-map li { min-height: 30px; margin-bottom: .85rem; }.mf-route-map li span { width: 30px; height: 30px; right: calc(100% + 12px); font-size: .66rem; } }
@media (min-width: 361px) and (max-width: 480px) { .mf-phase4__container { width: calc(100% - 2rem); }.mf-phase4__badges { flex-wrap: wrap; }.mf-phase4__grid { grid-template-columns: 1fr; margin-right: 0; margin-left: 0; }.mf-invest-route { margin-right: 0; margin-left: 0; }.mf-route-map { padding-left: 56px; }.mf-route-map::before { left: 29px; }.mf-route-map li span { right: calc(100% + 8px); } }
@media (min-width: 481px) and (max-width: 767px) { .mf-phase4__container { width: calc(100% - 3rem); max-width: 480px; }.mf-phase4__badges { flex-wrap: wrap; }.mf-phase4__grid { grid-template-columns: 1fr; margin-right: 0; margin-left: 0; }.mf-invest-route { margin-right: 0; margin-left: 0; } }
@media (min-width: 768px) and (max-width: 1023px) { .mf-phase4__container { width: calc(100% - 4rem); }.mf-phase4__badges { flex-wrap: wrap; } }
@media (min-width: 1024px) and (max-width: 1279px) { .mf-phase4__container { width: calc(100% - 4rem); max-width: 980px; }.mf-phase4__grid { margin-right: -16px; margin-left: -16px; }.mf-invest-route { margin-right: 16px; margin-left: 16px; } }
@media (min-width: 1280px) { .mf-phase4__grid { margin-right: -20px; margin-left: -20px; }.mf-invest-route { margin-right: 20px; margin-left: 20px; box-shadow: 0 18px 36px rgba(15,23,42,.08); } }
@media (prefers-reduced-motion: reduce) { .mf-invest-route { transition: none; } }

/* Mutual Funds — Phase 05: Fund exploration hub */
.mf-phase5, .mf-phase5 *, .mf-phase5 *::before, .mf-phase5 *::after { box-sizing: border-box; }
.mf-phase5 { min-height: 0; padding: clamp(3.75rem, 7vw, 7rem) 0; padding-top: max(clamp(3.75rem, 7vw, 7rem), env(safe-area-inset-top)); padding-bottom: max(clamp(3.75rem, 7vw, 7rem), env(safe-area-inset-bottom)); background: #f8fafc; color: #0f172a; }.mf-container { width: calc(100% - 2rem); max-width: 1200px; min-height: 0; margin: 0 auto; }.mf-phase5__header { text-align: center; }.mf-phase5 h2 { margin: 0; color: #0f172a; font-size: clamp(1.9rem, 4vw, 3.4rem); letter-spacing: -.045em; line-height: 1.14; }.mf-phase5__header p { margin: .85rem 0 0; color: #475569; font-size: clamp(.92rem, 1.4vw, 1.08rem); line-height: 1.6; }
.mf-tab-bar { display: flex; align-items: center; justify-content: center; margin: clamp(1.8rem, 4vw, 3rem) -4px 0; }.mf-tab { display: inline-flex; align-items: center; justify-content: center; min-height: 46px; margin: 0 4px 8px; padding: .65rem 1.1rem; border: 1px solid #e2e8f0; border-radius: 50px; background: #fff; color: #0f172a; cursor: pointer; font: inherit; font-size: clamp(.78rem, 1.2vw, .9rem); font-weight: 800; letter-spacing: .04em; line-height: 1.3; text-transform: uppercase; -webkit-appearance: none; -webkit-tap-highlight-color: transparent; transition: transform 180ms ease, opacity 180ms ease, background-color 180ms ease; }.mf-tab .dot { flex: 0 0 10px; width: 10px; height: 10px; margin-right: .48rem; border-radius: 50%; background: #059669; }.mf-tab.debt .dot { background: #2563eb; }.mf-tab.hybrid .dot { background: #7c3aed; }.mf-tab.equity.active { border-color: #059669; background: #059669; color: #fff; }.mf-tab.debt.active { border-color: #2563eb; background: #2563eb; color: #fff; }.mf-tab.hybrid.active { border-color: #7c3aed; background: #7c3aed; color: #fff; }.mf-tab.active .dot { background: #fff; }.mf-tab:hover { transform: translateY(-2px); }.mf-tab:focus-visible { outline: 3px solid #00875a; outline-offset: 3px; }
.mf-content-pane { display: none; margin-top: clamp(2rem, 4vw, 3rem); }.mf-content-pane.active { display: block; animation: mf-fade-in 300ms ease-in-out both; }.mf-summary-card { margin: 0; padding: clamp(1.3rem, 3vw, 2rem); border: 1px solid #e2e8f0; border-left: 6px solid #059669; border-radius: .8rem; background: #fff; box-shadow: 0 8px 18px rgba(15,23,42,.04); }.mf-summary-card.debt-border { border-left-color: #2563eb; }.mf-summary-card.hybrid-border { border-left-color: #7c3aed; }.mf-summary-card h3 { margin: 0; color: #0f172a; font-size: clamp(1.25rem, 2.2vw, 1.65rem); line-height: 1.25; }.mf-summary-card > p { margin: .6rem 0 0; color: #475569; font-size: .92rem; line-height: 1.6; }.mf-summary-card dl { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin: 1.4rem -8px 0; }.mf-summary-card dl > div { min-width: 0; margin: 0 8px 10px; }.mf-summary-card dt { color: #475569; font-size: .72rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }.mf-summary-card dd { margin: .38rem 0 0; color: #0f172a; font-size: clamp(.84rem, 1.2vw, .96rem); font-weight: 700; line-height: 1.45; }.risk-high, .risk-low, .risk-med { display: inline-block; padding: .3rem .55rem; border-radius: 4px; font-size: .78rem; }.risk-high { background: #fef2f2; color: #dc2626; }.risk-low { background: #f0fdf4; color: #16803b; }.risk-med { background: #fffbeb; color: #b45309; }
.mf-fund-group { margin: clamp(2.2rem, 4vw, 3.4rem) 0 0; }.group-title { margin: 0; padding-bottom: .65rem; border-bottom: 2px solid #e2e8f0; color: #0f172a; font-size: 1.25rem; font-weight: 700; line-height: 1.35; }.card-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); margin: 1.3rem -8px 0; }.mf-fund-card { min-width: 0; margin: 0 8px 1.25rem; padding: 1.15rem; border: 1px solid #e2e8f0; border-radius: 10px; background: #fff; transition: transform 180ms ease, box-shadow 180ms ease; }.mf-fund-card:hover { box-shadow: 0 8px 16px rgba(0,0,0,.06); transform: translateY(-3px); }.mf-fund-card h4 { margin: 0; color: #0f172a; font-size: 1.1rem; line-height: 1.35; }.mf-alloc-tag { display: inline-block; margin: .68rem 0 0; padding: .25rem .5rem; border-radius: 4px; background: #f1f5f9; color: #334155; font-size: .75rem; font-weight: 600; line-height: 1.35; }.mf-fund-card p { margin: .72rem 0 0; color: #475569; font-size: .85rem; line-height: 1.55; }.mf-fund-card__breakdown { color: #334155 !important; }.mf-fund-card__breakdown strong { font-weight: 750; }.mf-rules { margin: clamp(2rem, 4vw, 3rem) 0 0; padding: 1rem 1.15rem; border-left: 4px solid #94a3b8; border-radius: .45rem; background: #fff; color: #475569; }.mf-rules strong { color: #0f172a; }.mf-rules p { margin: .42rem 0 0; font-size: .87rem; line-height: 1.6; }
@keyframes mf-fade-in { from { opacity: 0; transform: translateY(4px); } to { opacity: 1; transform: translateY(0); } }
@media (max-width: 360px) { .mf-phase5 { padding-right: 12px; padding-left: 12px; }.mf-container { width: 100%; }.mf-tab-bar { flex-wrap: wrap; margin-right: 0; margin-left: 0; }.mf-tab { padding: .5rem 1rem; }.mf-summary-card dl { grid-template-columns: 1fr; margin-right: 0; margin-left: 0; }.mf-summary-card dl > div { margin-right: 0; margin-left: 0; }.card-grid { grid-template-columns: 1fr; margin-right: 0; margin-left: 0; }.mf-fund-card { margin-right: 0; margin-left: 0; } }
@media (min-width: 361px) and (max-width: 480px) { .mf-container { width: calc(100% - 2rem); }.mf-tab-bar { flex-wrap: wrap; }.mf-summary-card dl { grid-template-columns: 1fr; }.card-grid { grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); } }
@media (min-width: 481px) and (max-width: 767px) { .mf-container { width: calc(100% - 3rem); }.mf-summary-card dl { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 768px) and (max-width: 1023px) { .mf-container { width: calc(100% - 4rem); } }
@media (min-width: 1024px) and (max-width: 1279px) { .mf-container { width: calc(100% - 4rem); } }
@media (prefers-reduced-motion: reduce) { .mf-content-pane.active, .mf-fund-card, .mf-tab { animation: none; transition: none; } }

/* Mutual Funds — Phase 06: PL value and DigiMF app */
.mf-phase6, .mf-phase6 *, .mf-phase6 *::before, .mf-phase6 *::after { box-sizing: border-box; }.mf-phase6 { min-height: 0; padding: clamp(3.75rem, 7vw, 7rem) 0; padding-top: max(clamp(3.75rem, 7vw, 7rem), env(safe-area-inset-top)); padding-bottom: max(clamp(3.75rem, 7vw, 7rem), env(safe-area-inset-bottom)); background: #fff; color: #0f172a; }.mf-phase6__container { width: calc(100% - 3rem); max-width: 1200px; min-height: 0; margin: 0 auto; }.mf-phase6__value { text-align: center; }.mf-phase6__value h2 { margin: 0; color: #0f172a; font-size: clamp(1.9rem, 4vw, 3.35rem); letter-spacing: -.045em; line-height: 1.14; }.mf-phase6__value-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); margin: clamp(2.3rem, 5vw, 4.3rem) -10px 0; }.mf-phase6__value-grid article { display: flex; flex-direction: column; align-items: center; min-width: 0; margin: 0 10px 1.2rem; text-align: center; }.mf-phase6__value-grid svg { width: clamp(2.5rem, 4vw, 3.25rem); height: clamp(2.5rem, 4vw, 3.25rem); margin: 0 auto 1rem; fill: none; stroke: #2563eb; stroke-linecap: round; stroke-linejoin: round; stroke-width: 2; }.mf-phase6__value-grid h3 { margin: 0; color: #0f172a; font-size: clamp(.95rem, 1.45vw, 1.1rem); line-height: 1.35; }.mf-phase6__value-grid p { margin: .58rem 0 0; color: #334155; font-size: clamp(.82rem, 1.1vw, .92rem); line-height: 1.55; }
.mf-digimf { display: grid; grid-template-columns: minmax(0, 45fr) minmax(0, 55fr); align-items: center; margin: clamp(3.6rem, 8vw, 7rem) -24px 0; }.mf-digimf__media, .mf-digimf__content { min-width: 0; margin: 0 24px 1.5rem; }.mf-digimf__media { display: flex; align-items: center; justify-content: center; }.mf-digimf__image { display: block; width: 100%; max-width: 420px; height: auto; opacity: 0; transform: translateY(8px); transition: transform 200ms ease, opacity 200ms ease; }.mf-digimf__image.is-loaded { opacity: 1; transform: translateY(0); }.mf-digimf__content { text-align: left; }.mf-digimf__content h2 { margin: 0; color: #0f172a; font-size: clamp(1.45rem, 2.7vw, 2.15rem); letter-spacing: -.035em; line-height: 1.2; }.mf-digimf__content > p { margin: .75rem 0 0; color: #334155; font-size: clamp(.9rem, 1.35vw, 1.04rem); line-height: 1.6; }.mf-digimf__content ul { margin: 1.4rem 0 0; padding: 0; list-style: none; }.mf-digimf__content li { position: relative; min-height: 24px; margin: 0 0 .78rem; padding-left: 1.8rem; color: #334155; font-size: clamp(.84rem, 1.2vw, .96rem); line-height: 1.5; text-align: left; }.mf-digimf__content li::before { position: absolute; top: .22rem; left: 0; display: grid; width: 1.15rem; height: 1.15rem; place-items: center; border-radius: 50%; background: #e8f5ef; color: #00875a; content: "✓"; font-size: .76rem; font-weight: 800; line-height: 1; }.mf-digimf__badges { display: flex; align-items: center; margin: 1.45rem -5px 0; }.mf-digimf__badges a { display: block; margin: 0 5px 10px; border-radius: .35rem; -webkit-tap-highlight-color: transparent; transition: transform 180ms ease, opacity 180ms ease; }.mf-digimf__badges a:hover { transform: translateY(-2px); }.mf-digimf__badges a:focus-visible { outline: 3px solid #00875a; outline-offset: 3px; }.mf-digimf__badges img { display: block; width: 135px; height: 40px; }
@media (max-width: 360px) { .mf-phase6 { padding-right: 12px; padding-left: 12px; }.mf-phase6__container { width: 100%; }.mf-phase6__value-grid { grid-template-columns: 1fr; margin-right: 0; margin-left: 0; }.mf-phase6__value-grid article { margin-right: 0; margin-left: 0; }.mf-digimf { display: block; margin: 3.2rem 0 0; }.mf-digimf__media, .mf-digimf__content { margin-right: 0; margin-left: 0; }.mf-digimf__image { max-width: 250px; }.mf-digimf__badges { display: block; margin-right: 0; margin-left: 0; }.mf-digimf__badges a { width: 135px; margin-right: auto; margin-left: auto; } }
@media (min-width: 361px) and (max-width: 480px) { .mf-phase6__container { width: calc(100% - 2rem); }.mf-phase6__value-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }.mf-digimf { display: block; margin-right: 0; margin-left: 0; }.mf-digimf__media, .mf-digimf__content { margin-right: 0; margin-left: 0; }.mf-digimf__image { max-width: 280px; }.mf-digimf__content { margin-top: 1.7rem; } }
@media (min-width: 481px) and (max-width: 767px) { .mf-phase6__container { width: calc(100% - 3rem); }.mf-phase6__value-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); max-width: 540px; margin-right: auto; margin-left: auto; }.mf-digimf { display: block; margin-right: 0; margin-left: 0; }.mf-digimf__media, .mf-digimf__content { margin-right: 0; margin-left: 0; }.mf-digimf__image { max-width: 320px; }.mf-digimf__content { margin-top: 2rem; } }
@media (min-width: 768px) and (max-width: 1023px) { .mf-phase6__container { width: calc(100% - 4rem); }.mf-phase6__value-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); margin-right: -18px; margin-left: -18px; }.mf-phase6__value-grid article { margin-right: 18px; margin-left: 18px; }.mf-digimf { grid-template-columns: repeat(2, minmax(0, 1fr)); margin-right: -16px; margin-left: -16px; }.mf-digimf__media, .mf-digimf__content { margin-right: 16px; margin-left: 16px; } }
@media (min-width: 1024px) and (max-width: 1279px) { .mf-phase6__container { width: calc(100% - 4rem); }.mf-digimf { margin-right: -24px; margin-left: -24px; } }
@media (min-width: 1280px) { .mf-phase6__value-grid svg { width: 52px; height: 52px; }.mf-digimf { grid-template-columns: 480px minmax(0, 1fr); margin-right: -32px; margin-left: -32px; }.mf-digimf__media, .mf-digimf__content { margin-right: 32px; margin-left: 32px; } }
@media (prefers-reduced-motion: reduce) { .mf-digimf__image, .mf-digimf__badges a { transition: none; } }

/* Essential app imagery stays visible even when JavaScript is unavailable. */
.mf-digimf__image { opacity: 1; transform: none; }

/* Mutual Funds — Phase 07: How to invest */
.mf-phase7, .mf-phase7 *, .mf-phase7 *::before, .mf-phase7 *::after { box-sizing: border-box; }.mf-phase7 { min-height: 0; padding: clamp(3.75rem, 7vw, 7rem) 0; padding-top: max(clamp(3.75rem, 7vw, 7rem), env(safe-area-inset-top)); padding-bottom: max(clamp(3.75rem, 7vw, 7rem), env(safe-area-inset-bottom)); background: #f8fafc; color: #0f172a; }.mf-phase7__container { width: calc(100% - 3rem); max-width: 1200px; min-height: 0; margin: 0 auto; }.mf-phase7__header { text-align: center; }.mf-phase7__header h2 { margin: 0; color: #0f172a; font-size: clamp(1.5rem, 3.2vw, 2.7rem); letter-spacing: -.04em; line-height: 1.18; }.mf-phase7__header p { margin: .8rem 0 0; color: #475569; font-size: clamp(.9rem, 1.35vw, 1.06rem); line-height: 1.6; text-align: center; }
.mf-phase7__steps { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin: clamp(2.5rem, 5vw, 4rem) -12px 0; padding: 0; list-style: none; }.mf-invest-step { display: flex; flex-direction: column-reverse; align-items: center; min-width: 0; margin: 0 12px 1.3rem; padding: 0; opacity: 1; text-align: center; transform: none; transition: transform 180ms ease, opacity 180ms ease; }.mf-invest-step__badge { display: grid; width: 64px; height: 64px; margin: 0 auto 1.1rem; place-items: center; border-radius: 50%; background: #eff6ff; }.mf-invest-step__badge svg { width: 30px; height: 30px; fill: none; stroke: #2563eb; stroke-linecap: round; stroke-linejoin: round; stroke-width: 2; }.mf-invest-step__text { display: flex; flex-direction: column; align-items: center; text-align: center; }.mf-invest-step__text span { color: #2563eb; font-size: .8rem; font-weight: 700; letter-spacing: .05em; line-height: 1.35; text-transform: uppercase; }.mf-invest-step__text strong { margin: .5rem 0 0; color: #0f172a; font-size: 1.05rem; font-weight: 600; line-height: 1.55; }.mf-invest-step:hover { transform: translateY(-3px); }
@media (max-width: 360px) { .mf-phase7 { padding-right: 12px; padding-left: 12px; }.mf-phase7__container { width: 100%; }.mf-phase7__header h2 { font-size: 1.25rem; }.mf-phase7__steps { display: block; margin: 2rem 0 0; }.mf-invest-step { flex-direction: row; align-items: center; justify-content: space-between; margin: 0 0 12px; padding: 16px; border: 1px solid #e2e8f0; border-radius: 12px; background: #fff; text-align: left; }.mf-invest-step__text { align-items: flex-start; flex: 1 1 auto; order: 1; text-align: left; }.mf-invest-step__text strong { font-size: .92rem; text-align: left; }.mf-invest-step__badge { flex: 0 0 52px; order: 2; width: 52px; height: 52px; margin: 0 0 0 12px; }.mf-invest-step__badge svg { width: 26px; height: 26px; } }
@media (min-width: 361px) and (max-width: 480px) { .mf-phase7__container { width: calc(100% - 2rem); }.mf-phase7__header h2 { font-size: 1.35rem; }.mf-phase7__steps { display: block; margin: 2.2rem 0 0; }.mf-invest-step { flex-direction: row; align-items: center; justify-content: space-between; margin: 0 0 16px; padding: 16px; border: 1px solid #e2e8f0; border-radius: 12px; background: #fff; text-align: left; }.mf-invest-step__text { align-items: flex-start; flex: 1 1 auto; order: 1; text-align: left; }.mf-invest-step__text strong { text-align: left; }.mf-invest-step__badge { flex: 0 0 52px; order: 2; width: 52px; height: 52px; margin: 0 0 0 16px; }.mf-invest-step__badge svg { width: 26px; height: 26px; } }
@media (min-width: 481px) and (max-width: 767px) { .mf-phase7__container { width: calc(100% - 3rem); max-width: 580px; }.mf-phase7__header h2 { font-size: 1.5rem; }.mf-phase7__steps { display: block; margin: 2.4rem 0 0; }.mf-invest-step { flex-direction: row; align-items: center; justify-content: space-between; margin: 0 0 16px; padding: 16px; border: 1px solid #e2e8f0; border-radius: 12px; background: #fff; text-align: left; }.mf-invest-step__text { align-items: flex-start; flex: 1 1 auto; order: 1; text-align: left; }.mf-invest-step__text strong { text-align: left; }.mf-invest-step__badge { flex: 0 0 52px; order: 2; width: 52px; height: 52px; margin: 0 0 0 16px; }.mf-invest-step__badge svg { width: 26px; height: 26px; } }
@media (min-width: 768px) and (max-width: 1023px) { .mf-phase7__container { width: calc(100% - 4rem); }.mf-phase7__steps { margin-right: -12px; margin-left: -12px; }.mf-invest-step__badge { width: 64px; height: 64px; }.mf-invest-step__badge svg { width: 30px; height: 30px; } }
@media (min-width: 1024px) and (max-width: 1279px) { .mf-phase7__container { width: calc(100% - 4rem); }.mf-phase7__steps { margin-right: -16px; margin-left: -16px; }.mf-invest-step { margin-right: 16px; margin-left: 16px; }.mf-invest-step__badge { width: 72px; height: 72px; }.mf-invest-step__badge svg { width: 34px; height: 34px; } }
@media (min-width: 1280px) { .mf-phase7__steps { margin-right: -20px; margin-left: -20px; }.mf-invest-step { margin-right: 20px; margin-left: 20px; }.mf-invest-step__badge { width: 80px; height: 80px; }.mf-invest-step__badge svg { width: 38px; height: 38px; }.mf-invest-step__text strong { font-size: 1.1rem; } }
@media (prefers-reduced-motion: reduce) { .mf-invest-step { transition: none; } }
.mf-phase7.is-pending .mf-invest-step { opacity: 0; transform: translateY(16px); }
.mf-phase7.is-visible .mf-invest-step { animation: mf-step-entry 480ms cubic-bezier(.22, .8, .32, 1) both; }
.mf-phase7.is-visible .mf-invest-step:nth-child(2) { animation-delay: 100ms; }
.mf-phase7.is-visible .mf-invest-step:nth-child(3) { animation-delay: 200ms; }
@keyframes mf-step-entry { from { opacity: 0; transform: translateY(16px); } to { opacity: 1; transform: translateY(0); } }
@media (prefers-reduced-motion: reduce) { .mf-phase7.is-visible .mf-invest-step { animation: none; } }