/* ═══════════════════════════════════════════════════════════
   Home v2 — Scrollytelling, Flow, Pillars (Premium RTL)
   ═══════════════════════════════════════════════════════════ */

:root {
    --h-violet: #7c3aed;
    --h-violet-soft: rgba(124, 58, 237, 0.12);
    --h-navy: #0f172a;
    --h-ease: cubic-bezier(0.22, 1, 0.36, 1);
    --h-ease-slow: cubic-bezier(0.16, 1, 0.3, 1);
    --h-story-dur: 1.05s;
    --h-container: min(1200px, calc(100vw - 2rem));
    --h-nav-offset: 4.5rem;
    --section-space-xl: clamp(3.5rem, 8vw, 5.5rem);
    --section-space-lg: clamp(2.5rem, 6vw, 4rem);
    --section-space-md: clamp(1.5rem, 4vw, 2.5rem);
    --h-type-h2: clamp(1.35rem, 3.6vw, 2.05rem);
    --h-type-lead: clamp(0.92rem, 2.2vw, 1.05rem);
    --h-type-eyebrow: 0.72rem;
    --h-measure: 38rem;
}

.mk-home-body {
    overflow-x: clip;
}

.mk-home-body .container {
    max-width: var(--h-container);
}

/* Hero ends flush with body — no white fade into stats (see mizkar-home cinema ::after override) */
.mk-home-page .mk-hero--cinema .mk-hero-bg::after {
    display: none !important;
    content: none !important;
    background: none !important;
}

.mk-home-body {
    background: #f8fafc;
}

html.mk-public[data-theme="dark"] .mk-home-body {
    background: #0b1220;
}

/* ─── Stats strip ─── */
.h-stats--strip {
    padding: var(--section-space-md) 0;
    margin-top: 0;
}

.h-stats__strip {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 1rem 1.25rem;
    padding: 0.85rem 1.1rem;
    border-radius: 14px;
    border: 1px solid rgba(15, 23, 42, 0.06);
    background: rgba(255, 255, 255, 0.82);
    backdrop-filter: blur(10px);
    box-shadow: 0 12px 40px -28px rgba(15, 23, 42, 0.2);
}

html.mk-public[data-theme="dark"] .h-stats__strip {
    background: rgba(15, 23, 42, 0.75);
    border-color: rgba(148, 163, 184, 0.12);
}

.h-stats__meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.65rem 1rem;
}

.h-stats__live {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    font-size: var(--h-type-eyebrow);
    font-weight: 700;
    color: var(--h-violet);
}

.h-stats__uptime {
    font-size: 0.72rem;
    font-weight: 600;
    color: #64748b;
}

.h-stats__live-dot {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #34d399;
    box-shadow: 0 0 0 0 rgba(52, 211, 153, 0.45);
    animation: h-live-pulse 2.4s ease infinite;
}

@keyframes h-live-pulse {
    70% { box-shadow: 0 0 0 7px rgba(52, 211, 153, 0); }
    100% { box-shadow: 0 0 0 0 rgba(52, 211, 153, 0); }
}

.h-stats__grid {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem 0.85rem;
    flex: 1;
    justify-content: flex-end;
    min-width: min(100%, 20rem);
}

.h-stats__sep {
    width: 1px;
    height: 1.75rem;
    background: rgba(148, 163, 184, 0.25);
}

.h-stats__item {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    min-width: 4.5rem;
    padding-inline: 0.15rem;
}

.h-stats__val {
    font-size: clamp(1.05rem, 2.4vw, 1.25rem);
    font-weight: 800;
    line-height: 1.1;
    color: var(--mk-text, #0f172a);
    font-variant-numeric: tabular-nums;
}

.h-stats__val small {
    font-size: 0.72em;
    font-weight: 700;
}

.h-stats__lbl {
    font-size: 0.68rem;
    font-weight: 600;
    color: #64748b;
    margin-top: 0.12rem;
}

@media (max-width: 640px) {
    .h-stats__strip {
        flex-direction: column;
        align-items: stretch;
    }

    .h-stats__grid {
        justify-content: space-between;
    }

    .h-stats__sep {
        display: none;
    }

    .h-stats__item {
        flex: 1 1 42%;
    }
}

.h-intro-feature {
    padding: var(--section-space-md) 0;
}

.mk-home-page .h-intro-showcase {
    scroll-margin-top: calc(var(--h-nav-offset, 4.5rem) + 0.75rem);
    padding: clamp(1.75rem, 4vw, 2.75rem) 0 clamp(2rem, 4.5vw, 3rem);
    --h-intro-showcase-bg: linear-gradient(180deg, #faf7ff 0%, #fff 42%, #fff 100%);
    --h-intro-showcase-border: rgba(120, 40, 245, 0.08);
    --h-intro-fallback-bg: #fff;
    --h-intro-fallback-border: rgba(120, 40, 245, 0.22);
    --h-intro-fallback-text: #625d70;
    --h-intro-fallback-link: #7828f5;
    background: var(--h-intro-showcase-bg);
    border-bottom: 1px solid var(--h-intro-showcase-border);
}

.mk-home-page .h-intro-feature__player {
    max-width: min(1180px, 100%);
}

.mk-home-page .h-intro-showcase__fallback {
    text-align: center;
    padding: 1.5rem 1rem;
    border-radius: 1rem;
    border: 1px dashed var(--h-intro-fallback-border);
    background: var(--h-intro-fallback-bg);
}

.mk-home-page .h-intro-showcase__fallback-text {
    margin: 0;
    font-size: 1rem;
    color: var(--h-intro-fallback-text);
}

.mk-home-page .h-intro-showcase__fallback a {
    color: var(--h-intro-fallback-link);
    font-weight: 700;
    text-decoration: none;
}

.mk-home-page .h-intro-showcase__fallback a:hover {
    text-decoration: underline;
}

.h-intro-feature__player .mk-intro-vid--marketing {
    margin: 0;
}

html.mk-public[data-theme="dark"] .mk-home-page .h-intro-showcase {
    --h-intro-showcase-bg: linear-gradient(180deg, rgba(18, 24, 38, 0.95) 0%, #0b1220 55%, #0b1220 100%);
    --h-intro-showcase-border: rgba(148, 163, 184, 0.12);
    --h-intro-fallback-bg: #121826;
    --h-intro-fallback-border: rgba(148, 163, 184, 0.22);
    --h-intro-fallback-text: #94a3b8;
    --h-intro-fallback-link: #c4b5fd;
    color-scheme: dark;
}

html.mk-public[data-theme="light"] .mk-home-page .h-intro-showcase {
    color-scheme: light;
}

/* ─── Story — editorial scrollytelling ─── */
.h-story {
    --h-story-accent-violet: #7c3aed;
    --h-story-accent-sky: #0ea5e9;
    --h-story-accent-amber: #f59e0b;
    --h-story-accent-rose: #f43f5e;
    --h-story-accent-emerald: #10b981;
    --h-story-active-accent: var(--h-story-accent-violet);
    position: relative;
    padding-block: var(--section-space-lg) var(--section-space-md);
    overflow: hidden;
}

.h-story__atmosphere {
    position: absolute;
    inset: 0;
    pointer-events: none;
    background:
        radial-gradient(ellipse 90% 55% at 12% 8%, rgba(124, 58, 237, 0.09), transparent 58%),
        radial-gradient(ellipse 70% 45% at 88% 22%, rgba(14, 165, 233, 0.06), transparent 55%),
        linear-gradient(180deg, #f8fafc 0%, #f1f5f9 48%, #f8fafc 100%);
    z-index: 0;
}

html.mk-public[data-theme="dark"] .h-story__atmosphere {
    background:
        radial-gradient(ellipse 85% 50% at 15% 10%, rgba(124, 58, 237, 0.14), transparent 55%),
        linear-gradient(180deg, #0b1220 0%, #111827 50%, #0b1220 100%);
}

.h-story > .container,
.h-story__rail {
    position: relative;
    z-index: 1;
}

.h-story__hook {
    text-align: center;
    max-width: var(--h-measure);
    margin: 0 auto var(--section-space-md);
    padding-inline: 0.5rem;
}

.h-story__kicker {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    margin-bottom: 0.65rem;
    padding: 0.3rem 0.75rem;
    font-size: var(--h-type-eyebrow);
    font-weight: 700;
    color: var(--h-violet);
    background: var(--h-violet-soft);
    border-radius: 999px;
}

.h-story__title {
    margin: 0 0 0.55rem;
    font-size: var(--h-type-h2);
    font-weight: 800;
    line-height: 1.28;
    text-wrap: balance;
}

.h-story__sub {
    margin: 0;
    font-size: var(--h-type-lead);
    line-height: 1.75;
    color: #64748b;
}

html.mk-public[data-theme="dark"] .h-story__sub {
    color: #94a3b8;
}

.h-story__mobile {
    display: none;
}

.h-story__rail {
    position: relative;
}

.h-story__pin {
    position: relative;
    z-index: 2;
}

.h-story__pin-inner {
    width: 100%;
    max-width: var(--h-container);
    margin-inline: auto;
}

.h-story__sentinels {
    display: none;
}

/* Timeline (desktop) */
.h-story__timeline {
    display: none;
}

.h-story__stage {
    position: relative;
    width: 100%;
    min-height: clamp(28rem, 62vh, 38rem);
}

.h-story__scene {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1.35rem;
    align-items: center;
    opacity: 0;
    transform: translateY(24px) scale(0.985);
    transition:
        opacity var(--h-story-dur) var(--h-ease-slow),
        transform var(--h-story-dur) var(--h-ease-slow);
    pointer-events: none;
    position: absolute;
    inset: 0;
    width: 100%;
}

.h-story__scene.is-active {
    opacity: 1;
    transform: translateY(0) scale(1);
    pointer-events: auto;
}

.h-story__scene[data-accent="violet"] { --scene-accent: var(--h-story-accent-violet); }
.h-story__scene[data-accent="sky"] { --scene-accent: var(--h-story-accent-sky); }
.h-story__scene[data-accent="amber"] { --scene-accent: var(--h-story-accent-amber); }
.h-story__scene[data-accent="rose"] { --scene-accent: var(--h-story-accent-rose); }
.h-story__scene[data-accent="emerald"] { --scene-accent: var(--h-story-accent-emerald); }

.h-story__step {
    display: inline-block;
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    color: var(--scene-accent, var(--h-violet));
}

.h-story__scene-head {
    margin-bottom: 1rem;
}

.h-story__scene-title {
    margin: 0.35rem 0 0;
    font-size: clamp(1.25rem, 3vw, 1.85rem);
    font-weight: 800;
    line-height: 1.3;
    text-wrap: balance;
}

.h-story__beats {
    display: flex;
    flex-direction: column;
    gap: 0.65rem;
}

.h-story__beat {
    display: flex;
    gap: 0.75rem;
    align-items: flex-start;
    padding: 0.85rem 0.9rem;
    border-radius: 14px;
    border: 1px solid rgba(15, 23, 42, 0.06);
    background: rgba(255, 255, 255, 0.72);
}

html.mk-public[data-theme="dark"] .h-story__beat {
    background: rgba(15, 23, 42, 0.55);
    border-color: rgba(148, 163, 184, 0.12);
}

.h-story__beat--pain {
    border-inline-start: 3px solid rgba(244, 63, 94, 0.45);
}

.h-story__beat--outcome {
    border-inline-start: 3px solid var(--scene-accent, var(--h-violet));
    box-shadow: 0 12px 32px -24px color-mix(in srgb, var(--scene-accent, #7c3aed) 35%, transparent);
}

.h-story__beat-mark {
    flex-shrink: 0;
    width: 2rem;
    height: 2rem;
    display: grid;
    place-items: center;
    border-radius: 10px;
    font-size: 0.82rem;
    background: rgba(148, 163, 184, 0.12);
    color: #64748b;
}

.h-story__beat--outcome .h-story__beat-mark {
    color: var(--scene-accent, var(--h-violet));
    background: color-mix(in srgb, var(--scene-accent, #7c3aed) 14%, transparent);
}

.h-story__beat-label {
    display: block;
    margin-bottom: 0.25rem;
    font-size: 0.68rem;
    font-weight: 800;
    letter-spacing: 0.04em;
    color: #94a3b8;
}

.h-story__pain,
.h-story__outcome {
    margin: 0;
    font-size: clamp(0.88rem, 2vw, 0.95rem);
    line-height: 1.7;
}

.h-story__pain {
    color: #64748b;
}

.h-story__outcome {
    font-weight: 650;
    color: #1e293b;
}

html.mk-public[data-theme="dark"] .h-story__outcome {
    color: #e2e8f0;
}

.h-story__solution-badge {
    color: var(--scene-accent, #059669) !important;
}

.h-story__beat-flow {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.15rem;
    color: color-mix(in srgb, var(--scene-accent, #7c3aed) 55%, #94a3b8);
    font-size: 0.7rem;
}

.h-story__beat-flow-line {
    width: 1px;
    height: 0.65rem;
    background: linear-gradient(180deg, transparent, currentColor);
}

.h-story__narrative,
.h-story__montage {
    opacity: 0;
    transform: translateY(18px);
    transition:
        opacity calc(var(--h-story-dur) * 0.88) var(--h-ease-slow),
        transform calc(var(--h-story-dur) * 0.88) var(--h-ease-slow);
}

.h-story__montage {
    transform: translateY(22px) scale(0.98);
}

.h-story__scene.is-active .h-story__narrative {
    opacity: 1;
    transform: translateY(0);
    transition-delay: 0.1s;
}

.h-story__scene.is-active .h-story__montage {
    opacity: 1;
    transform: translateY(0) scale(1);
    transition-delay: 0.22s;
}

/* Montage — before + product */
.h-story__montage {
    position: relative;
    min-height: clamp(16rem, 38vh, 22rem);
}

.h-story__montage-before {
    position: absolute;
    inset-inline-end: 8%;
    top: 6%;
    width: min(38%, 200px);
    margin: 0;
    border-radius: 12px;
    overflow: hidden;
    border: 1px solid rgba(148, 163, 184, 0.25);
    box-shadow: 0 16px 40px -20px rgba(15, 23, 42, 0.45);
    transform: rotate(-4deg);
    z-index: 1;
    opacity: 0.92;
}

.h-story__montage-after {
    position: relative;
    margin: 0;
    margin-inline-start: 0;
    width: min(92%, 100%);
    border-radius: 18px;
    overflow: hidden;
    border: 1px solid rgba(167, 139, 250, 0.22);
    background: #0f172a;
    box-shadow:
        0 28px 60px -28px rgba(15, 23, 42, 0.5),
        0 0 0 1px color-mix(in srgb, var(--scene-accent, #7c3aed) 18%, transparent);
    aspect-ratio: 16 / 10;
    z-index: 2;
}

.h-story__img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform calc(var(--h-story-dur) * 1.05) var(--h-ease-slow);
}

.h-story__scene.is-active .h-story__montage-after .h-story__img {
    transform: scale(1);
}

.h-story__montage-after .h-story__img {
    transform: scale(1.04);
}

.h-story__montage-before .h-story__img {
    filter: saturate(0.8) contrast(0.95);
    aspect-ratio: 4 / 3;
}

.h-story__montage-tag {
    position: absolute;
    inset-inline-start: 0.5rem;
    top: 0.5rem;
    padding: 0.22rem 0.5rem;
    font-size: 0.62rem;
    font-weight: 800;
    border-radius: 6px;
}

.h-story__montage-tag--before {
    color: #9f1239;
    background: rgba(255, 228, 230, 0.95);
}

.h-story__montage-tag--after {
    color: #047857;
    background: rgba(209, 250, 229, 0.95);
}

.h-story__chrome {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.35rem 0.55rem;
    background: rgba(15, 23, 42, 0.94);
    font-size: 0.58rem;
}

.h-story__chrome span {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: rgba(148, 163, 184, 0.35);
}

.h-story__chrome em {
    margin-inline-start: auto;
    font-style: normal;
    color: #94a3b8;
}

@media (min-width: 992px) {
    .h-story__rail {
        height: calc(var(--scene-count) * 100vh);
    }

    .h-story__pin {
        position: sticky;
        top: 0;
        height: 100vh;
        height: 100dvh;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: stretch;
        padding-block: 1.25rem;
    }

    .h-story__pin-inner {
        display: grid;
        grid-template-columns: minmax(0, 1fr) minmax(11rem, 15.5rem);
        gap: clamp(1.25rem, 3vw, 2.25rem);
        align-items: stretch;
        flex: 1;
        min-height: 0;
        width: 100%;
    }

    .h-story__timeline {
        display: flex;
        flex-direction: column;
        order: 2;
        padding-block: 0.5rem;
    }

    .h-story__timeline-rail {
        position: absolute;
        inset-inline-end: 0.65rem;
        top: 0.75rem;
        bottom: 0.75rem;
        width: 2px;
        border-radius: 2px;
        background: rgba(124, 58, 237, 0.12);
        pointer-events: none;
    }

    .h-story__timeline {
        position: relative;
    }

    .h-story__timeline-fill {
        position: absolute;
        inset-inline: 0;
        bottom: 0;
        height: 20%;
        background: linear-gradient(180deg, var(--h-story-active-accent, #7c3aed), #a78bfa);
        border-radius: inherit;
        transition: height 0.85s var(--h-ease-slow);
    }

    .h-story__timeline-steps {
        display: flex;
        flex-direction: column;
        gap: 0.35rem;
        position: relative;
        z-index: 1;
    }

    .h-story__timeline-step {
        display: flex;
        align-items: flex-start;
        gap: 0.55rem;
        width: 100%;
        padding: 0.55rem 0.5rem 0.55rem 0.35rem;
        border: none;
        border-radius: 12px;
        background: transparent;
        text-align: start;
        cursor: pointer;
        color: #64748b;
        transition:
            background 0.45s var(--h-ease),
            color 0.45s var(--h-ease);
    }

    .h-story__timeline-step:hover,
    .h-story__timeline-step:focus-visible {
        background: rgba(124, 58, 237, 0.06);
        outline: none;
    }

    .h-story__timeline-dot {
        flex-shrink: 0;
        width: 0.65rem;
        height: 0.65rem;
        margin-top: 0.35rem;
        border-radius: 50%;
        border: 2px solid rgba(148, 163, 184, 0.45);
        background: #fff;
        transition:
            border-color 0.45s var(--h-ease),
            background 0.45s var(--h-ease),
            box-shadow 0.45s var(--h-ease);
    }

    html.mk-public[data-theme="dark"] .h-story__timeline-dot {
        background: #0f172a;
    }

    .h-story__timeline-step.is-active {
        color: #1e293b;
    }

    html.mk-public[data-theme="dark"] .h-story__timeline-step.is-active {
        color: #f1f5f9;
    }

    .h-story__timeline-step.is-active .h-story__timeline-dot {
        border-color: var(--h-story-active-accent, #7c3aed);
        background: var(--h-story-active-accent, #7c3aed);
        box-shadow: 0 0 0 4px color-mix(in srgb, var(--h-story-active-accent, #7c3aed) 22%, transparent);
    }

    .h-story__timeline-meta {
        display: flex;
        flex-direction: column;
        gap: 0.15rem;
        min-width: 0;
    }

    .h-story__timeline-num {
        font-size: 0.65rem;
        font-weight: 800;
        letter-spacing: 0.06em;
        color: var(--h-story-active-accent, var(--h-violet));
        opacity: 0.85;
    }

    .h-story__timeline-label {
        font-size: 0.78rem;
        font-weight: 700;
        line-height: 1.45;
        text-wrap: balance;
    }

    .h-story__stage {
        order: 1;
    }

    .h-story__sentinels {
        display: block;
        position: absolute;
        inset: 0;
        width: 100%;
        pointer-events: none;
    }

    .h-story__sentinel {
        height: 100vh;
        height: 100dvh;
    }

    .h-story__stage {
        flex: 1;
        min-height: min(68vh, 640px);
        display: flex;
        align-items: center;
    }

    .h-story__scene {
        grid-template-columns: minmax(0, 0.95fr) minmax(0, 1.05fr);
        gap: clamp(1.75rem, 3.5vw, 3rem);
        align-items: center;
        position: absolute;
        inset: auto 0;
        top: 50%;
        left: 0;
        right: 0;
        width: 100%;
        transform: translateY(calc(-50% + 16px)) scale(0.99);
    }

    .h-story__scene.is-active {
        transform: translateY(-50%) scale(1);
    }

    .h-story__scene-title {
        font-size: clamp(1.55rem, 2.2vw, 2.05rem);
    }

    .h-story__montage {
        min-height: min(42vh, 400px);
    }


    .h-pillars__showcase {
        padding: clamp(1.25rem, 2.5vw, 1.65rem);
    }

    .h-pillar-panel {
        grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr);
        gap: clamp(1.25rem, 2.5vw, 2rem);
    }

    .h-pricing .mk-tier-grid {
        max-width: 56rem;
        margin-inline: auto;
    }

    .h-final-cta {
        padding-block: clamp(4rem, 9vw, 6rem);
    }

    .h-final-cta__inner {
        max-width: 42rem;
    }

    .h-final-cta__title {
        font-size: clamp(1.65rem, 3.2vw, 2.35rem);
    }
}

@media (max-width: 991px) {
    .h-stats {
        padding-inline: clamp(0.85rem, 4vw, 1.25rem);
    }

    .h-stats__panel {
        padding: 1rem 1rem 1.1rem;
    }

    .h-story__rail {
        display: none;
    }

    .h-story__mobile {
        display: flex;
        flex-direction: column;
        gap: clamp(1.25rem, 4vw, 1.75rem);
        padding: 0 clamp(1rem, 4vw, 1.25rem) var(--section-space-lg);
    }

    .h-story__mobile-card {
        scroll-margin-top: var(--h-nav-offset);
        padding-block: 0.25rem 1.25rem;
        border-block-end: 1px solid rgba(148, 163, 184, 0.2);
        opacity: 0;
        transform: translateY(20px);
        transition:
            opacity var(--h-story-dur) var(--h-ease-slow),
            transform var(--h-story-dur) var(--h-ease-slow);
    }

    .h-story__mobile-card:last-child {
        border-block-end: none;
    }

    .h-story__mobile-card.is-inview {
        opacity: 1;
        transform: translateY(0);
    }

    .h-story__mobile-head {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 0.75rem;
        margin-bottom: 0.5rem;
    }

    .h-story__mobile-progress {
        font-size: 0.72rem;
        font-weight: 700;
        color: #94a3b8;
    }

    .h-story__mobile-title {
        margin: 0 0 0.75rem;
        font-size: clamp(1.2rem, 5vw, 1.45rem);
        font-weight: 800;
        line-height: 1.35;
        text-wrap: balance;
    }

    .h-story__mobile-beats {
        display: flex;
        flex-direction: column;
        gap: 0.55rem;
        margin-bottom: 1rem;
    }

    .h-story__mobile-pain,
    .h-story__mobile-outcome {
        margin: 0;
        font-size: var(--hm-body, 0.9rem);
        line-height: 1.65;
    }

    .h-story__mobile-pain {
        color: #64748b;
    }

    .h-story__mobile-pain span,
    .h-story__mobile-outcome span {
        display: inline-block;
        margin-inline-end: 0.35rem;
        font-size: 0.68rem;
        font-weight: 800;
        color: var(--h-violet);
    }

    .h-story__mobile-outcome {
        font-weight: 650;
        color: #1e293b;
    }

    html.mk-public[data-theme="dark"] .h-story__mobile-outcome {
        color: #e2e8f0;
    }

    .h-story__mobile-montage {
        display: grid;
        grid-template-columns: 1fr 1.35fr;
        gap: 0.55rem;
        align-items: stretch;
    }

    .h-story__mobile-before,
    .h-story__mobile-after {
        position: relative;
        margin: 0;
        border-radius: 12px;
        overflow: hidden;
        border: 1px solid rgba(148, 163, 184, 0.16);
        min-height: 7.5rem;
    }

    .h-story__mobile-before img,
    .h-story__mobile-after img {
        width: 100%;
        height: 100%;
        min-height: 7.5rem;
        object-fit: cover;
        display: block;
    }

    .h-story__mobile-before span,
    .h-story__mobile-after span {
        position: absolute;
        inset-inline-start: 0.4rem;
        top: 0.4rem;
        padding: 0.15rem 0.4rem;
        font-size: 0.6rem;
        font-weight: 800;
        border-radius: 5px;
        background: rgba(255, 255, 255, 0.92);
    }

    .h-story__mobile-before img {
        filter: saturate(0.85);
    }

    .h-flow__detail {
        display: none;
    }

    .h-flow__layout {
        display: block;
    }

    .h-flow__journey-line {
        display: none;
    }

    .h-flow__nodes {
        flex-direction: column;
        gap: 0.5rem;
    }

    .h-pillars {
        padding-inline: clamp(1rem, 4vw, 1.25rem);
    }

    .h-pillars__nav {
        overflow-x: auto;
        scroll-snap-type: x mandatory;
        scrollbar-width: none;
        -webkit-overflow-scrolling: touch;
    }

    .h-pillars__nav::-webkit-scrollbar {
        display: none;
    }

    .h-pillars__nav-btn {
        scroll-snap-align: start;
        flex: 0 0 auto;
        min-width: max-content;
    }

    .h-pillar-panel {
        grid-template-columns: 1fr;
    }

    .h-pillar-panel__visual {
        min-height: 12rem;
    }

    .h-pillars__orbit-track {
        justify-content: flex-start;
        overflow-x: auto;
        flex-wrap: nowrap;
        scrollbar-width: none;
        padding-bottom: 0.25rem;
    }

    .h-pillars__orbit-track::-webkit-scrollbar {
        display: none;
    }

    .h-pillar-chip {
        flex-shrink: 0;
    }

    .h-stats__item {
        min-height: 44px;
        padding: 0.75rem 0.85rem;
    }

    .h-final-cta__actions {
        flex-direction: column;
        align-items: stretch;
    }

    .h-final-cta__btn {
        width: 100%;
        min-height: 48px;
    }
}

@media (min-width: 768px) and (max-width: 991px) {
    .h-pillar-panel {
        grid-template-columns: 1fr;
    }
}

/* ─── Compare — symmetric before / after board ─── */
.h-compare {
    position: relative;
    padding: clamp(2rem, 4vw, 2.75rem) 0;
    overflow: hidden;
}

.h-compare__bg {
    position: absolute;
    inset: 0;
    pointer-events: none;
    background:
        radial-gradient(ellipse 65% 45% at 50% 0%, rgba(167, 139, 250, 0.12), transparent 58%),
        linear-gradient(180deg, #f7f5ff 0%, #ffffff 55%);
}

html.mk-public[data-theme="dark"] .h-compare__bg {
    background:
        radial-gradient(ellipse 65% 45% at 50% 0%, rgba(124, 58, 237, 0.12), transparent 58%),
        linear-gradient(180deg, #0f172a 0%, #111827 100%);
}

.h-compare__deco {
    position: absolute;
    display: grid;
    place-items: center;
    width: 2.75rem;
    height: 2.75rem;
    border-radius: 12px;
    font-size: 0.95rem;
    color: rgba(124, 58, 237, 0.22);
    background: rgba(255, 255, 255, 0.45);
    border: 1px solid rgba(167, 139, 250, 0.12);
    opacity: 0.55;
}

.h-compare__deco--chart {
    top: 18%;
    inset-inline-start: 1%;
}

.h-compare__deco--files {
    top: 16%;
    inset-inline-end: 1%;
}

.h-compare__container {
    position: relative;
    z-index: 1;
    max-width: 77.5rem;
}

.h-compare__head {
    text-align: center;
    max-width: 36rem;
    margin: 0 auto 1rem;
}

.h-compare__title {
    margin: 0 0 0.35rem;
    font-size: clamp(1.25rem, 2.8vw, var(--h-type-h2));
    font-weight: 800;
    line-height: 1.32;
    text-wrap: balance;
    color: #312e81;
}

html.mk-public[data-theme="dark"] .h-compare__title {
    color: #ede9fe;
}

.h-compare__subtitle {
    margin: 0;
    font-size: clamp(0.88rem, 1.8vw, var(--h-type-lead));
    color: #64748b;
    line-height: 1.55;
}

html.mk-public[data-theme="dark"] .h-compare__subtitle {
    color: #94a3b8;
}

.h-compare__panel {
    padding: clamp(0.85rem, 2vw, 1.15rem) clamp(0.9rem, 2.2vw, 1.25rem);
    border-radius: 20px;
    border: 1px solid rgba(226, 232, 240, 0.95);
    background: #fff;
    box-shadow: 0 20px 48px -36px rgba(79, 70, 229, 0.22);
}

html.mk-public[data-theme="dark"] .h-compare__panel {
    background: rgba(15, 23, 42, 0.88);
    border-color: rgba(148, 163, 184, 0.14);
}

.h-compare__board {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 2.65rem minmax(0, 1fr);
    column-gap: clamp(0.55rem, 1.6vw, 0.85rem);
    align-items: start;
}

.h-compare__col {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
    min-width: 0;
}

.h-compare__col--old {
    grid-column: 1;
}

.h-compare__col--rail {
    grid-column: 2;
    align-items: center;
}

.h-compare__col--new {
    grid-column: 3;
    padding: 0.2rem;
    margin: -0.2rem;
    border-radius: 16px;
    background: rgba(124, 58, 237, 0.035);
    box-shadow: inset 0 0 0 1px rgba(124, 58, 237, 0.08);
}

html.mk-public[data-theme="dark"] .h-compare__col--new {
    background: rgba(124, 58, 237, 0.08);
}

.h-compare__col-head {
    display: flex;
    flex-direction: column;
    gap: 0.45rem;
    min-height: 6.25rem;
    padding-bottom: 0.55rem;
    margin-bottom: 0.1rem;
    border-bottom: 1px solid rgba(226, 232, 240, 0.9);
}

.h-compare__col-head--rail {
    align-items: center;
    justify-content: flex-end;
    padding-bottom: 0.55rem;
    border-bottom-color: transparent;
}

.h-compare__col-head--new {
    border-bottom-color: rgba(196, 181, 253, 0.35);
}

.h-compare__side-head {
    display: flex;
    align-items: flex-start;
    gap: 0.5rem;
}

.h-compare__side-icon {
    flex-shrink: 0;
    width: 2rem;
    height: 2rem;
    display: grid;
    place-items: center;
    border-radius: 10px;
    font-size: 0.85rem;
}

.h-compare__side-icon--muted {
    color: #94a3b8;
    background: #f1f5f9;
    border: 1px solid #e2e8f0;
}

.h-compare__side-icon--brand {
    color: #fff;
    background: #7c3aed;
    box-shadow: 0 6px 16px -10px rgba(124, 58, 237, 0.65);
}

.h-compare__side-titles {
    min-width: 0;
}

.h-compare__side-title {
    margin: 0;
    font-size: 0.92rem;
    font-weight: 800;
    line-height: 1.35;
    color: #475569;
}

.h-compare__side-title--brand {
    color: #5b21b6;
}

html.mk-public[data-theme="dark"] .h-compare__side-title--brand {
    color: #ddd6fe;
}

.h-compare__side-tagline {
    margin: 0.1rem 0 0;
    font-size: 0.68rem;
    line-height: 1.4;
    color: #94a3b8;
}

.h-compare__side-tagline--brand {
    color: #7c3aed;
}

.h-compare__chips {
    margin: 0;
    padding: 0;
    list-style: none;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.3rem;
}

.h-compare__chips li {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.28rem;
    padding: 0.28rem 0.4rem;
    border-radius: 999px;
    font-size: 0.62rem;
    font-weight: 600;
    line-height: 1.3;
    text-align: center;
    min-height: 1.65rem;
}

.h-compare__chip-wide {
    grid-column: 1 / -1;
}

.h-compare__chips--old li {
    color: #64748b;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
}

.h-compare__chips--old .h-compare__chip-wide {
    border-radius: 10px;
    color: #94a3b8;
}

.h-compare__chips--new li {
    color: #5b21b6;
    background: rgba(124, 58, 237, 0.08);
    border: 1px solid rgba(124, 58, 237, 0.14);
}

.h-compare__chips--new .h-compare__chip-wide--accent {
    border-radius: 10px;
    color: #5b21b6;
    background: rgba(124, 58, 237, 0.12);
    border-color: rgba(124, 58, 237, 0.22);
}

html.mk-public[data-theme="dark"] .h-compare__chips--new li {
    color: #ddd6fe;
}

.h-compare__chips i {
    font-size: 0.58rem;
}

.h-compare__outcome {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    gap: 0.45rem;
    min-height: 3.35rem;
    padding: 0.45rem 0.55rem;
    border-radius: 12px;
}

.h-compare__outcome--old {
    background: #f8fafc;
    border: 1px solid #eef2f6;
    opacity: 0;
    transform: translateY(4px);
    transition: opacity 0.35s var(--h-ease), transform 0.35s var(--h-ease);
}

.h-compare__outcome--old.is-visible {
    opacity: 1;
    transform: translateY(0);
}

.h-compare__outcome--new {
    background: #fff;
    border: 1px solid rgba(226, 232, 240, 0.95);
    box-shadow: 0 8px 20px -18px rgba(15, 23, 42, 0.18);
}

html.mk-public[data-theme="dark"] .h-compare__outcome--old {
    background: rgba(30, 41, 59, 0.45);
    border-color: rgba(148, 163, 184, 0.12);
}

html.mk-public[data-theme="dark"] .h-compare__outcome--new {
    background: rgba(15, 23, 42, 0.55);
}

.h-compare__outcome-mark {
    width: 1.45rem;
    height: 1.45rem;
    display: grid;
    place-items: center;
    border-radius: 50%;
    font-size: 0.52rem;
    flex-shrink: 0;
}

.h-compare__outcome-mark--muted {
    color: #94a3b8;
    background: #fff;
    border: 1px solid #e2e8f0;
}

.h-compare__outcome-mark--ok {
    color: #fff;
    background: #10b981;
}

.h-compare__outcome-copy {
    min-width: 0;
}

.h-compare__outcome-title {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    font-size: 0.78rem;
    font-weight: 600;
    line-height: 1.38;
    color: #64748b;
}

.h-compare__outcome-title--brand {
    font-weight: 800;
    color: #4c1d95;
}

html.mk-public[data-theme="dark"] .h-compare__outcome-title--brand {
    color: #e9d5ff;
}

.h-compare__outcome-desc {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    margin: 0.08rem 0 0;
    font-size: 0.64rem;
    line-height: 1.4;
    color: #94a3b8;
}

.h-compare__rail-btn {
    width: 1.85rem;
    height: 1.85rem;
    display: grid;
    place-items: center;
    border-radius: 50%;
    font-size: 0.62rem;
    color: #fff;
    background: #7c3aed;
    box-shadow: 0 6px 16px -10px rgba(124, 58, 237, 0.65);
}

.h-compare__rail-track {
    position: relative;
    display: grid;
    grid-template-rows: repeat(4, minmax(3.35rem, auto));
    gap: 0.35rem;
    align-items: center;
    justify-items: center;
    width: 100%;
}

.h-compare__rail-track::before {
    content: "";
    position: absolute;
    top: 0.25rem;
    bottom: 0.25rem;
    width: 1px;
    background: linear-gradient(180deg, rgba(167, 139, 250, 0.65), rgba(167, 139, 250, 0.12));
    pointer-events: none;
}

.h-compare__rail-tag {
    position: relative;
    z-index: 1;
    max-width: 100%;
    padding: 0.12rem 0.32rem;
    border-radius: 999px;
    font-size: 0.52rem;
    font-weight: 700;
    line-height: 1.3;
    text-align: center;
    white-space: nowrap;
    color: #6d28d9;
    background: #fff;
    border: 1px solid rgba(167, 139, 250, 0.35);
}

html.mk-public[data-theme="dark"] .h-compare__rail-tag {
    color: #ddd6fe;
    background: rgba(30, 41, 59, 0.95);
}

@media (max-width: 768px) {
    .h-compare {
        padding: 1.75rem 0;
    }

    .h-compare__deco {
        display: none;
    }

    .h-compare__board {
        display: flex;
        flex-direction: column;
        gap: 0.75rem;
    }

    .h-compare__col--old,
    .h-compare__col--rail,
    .h-compare__col--new {
        grid-column: auto;
        width: 100%;
    }

    .h-compare__col--old {
        order: 1;
    }

    .h-compare__col--rail {
        order: 2;
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: center;
        gap: 0.35rem;
        padding: 0.5rem 0;
        border-top: 1px dashed rgba(167, 139, 250, 0.25);
        border-bottom: 1px dashed rgba(167, 139, 250, 0.25);
    }

    .h-compare__col--new {
        order: 3;
        padding: 0.35rem;
        margin: 0;
    }

    .h-compare__col-head--rail {
        min-height: 0;
        padding: 0;
        margin: 0;
        border: none;
        width: 100%;
        justify-content: center;
    }

    .h-compare__rail-track {
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: center;
        gap: 0.3rem;
        padding: 0;
        width: auto;
        flex: 1;
    }

    .h-compare__rail-track::before {
        display: none;
    }

    .h-compare__col-head {
        min-height: 0;
    }

    .h-compare__chips {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

/* ─── Product flow (reference mockup) ─── */
.h-flow {
    position: relative;
    padding: clamp(2rem, 4vw, 3rem) 0;
    overflow: hidden;
}

.h-flow__scene {
    position: absolute;
    inset: 0;
    pointer-events: none;
}

.h-flow__scene-glow {
    position: absolute;
    inset: 10% -10% auto;
    height: 55%;
    background: radial-gradient(ellipse 55% 70% at 70% 30%, rgba(167, 139, 250, 0.14), transparent 68%);
}

.h-flow__scene-house {
    position: absolute;
    inset-inline-end: 4%;
    top: 18%;
    font-size: clamp(4rem, 12vw, 7rem);
    color: rgba(167, 139, 250, 0.08);
}

.h-flow__container {
    position: relative;
    z-index: 1;
    max-width: 77.5rem;
}

.h-flow__head {
    text-align: center;
    margin-bottom: 1.1rem;
    max-width: 34rem;
    margin-inline: auto;
}

.h-flow__kicker {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    margin-bottom: 0.35rem;
    padding: 0.22rem 0.55rem;
    border-radius: 999px;
    border: 1px solid rgba(124, 58, 237, 0.16);
    background: rgba(124, 58, 237, 0.06);
    font-size: 0.68rem;
    font-weight: 700;
    color: var(--h-violet);
}

.h-flow__title {
    margin: 0 0 0.35rem;
    font-size: clamp(1.25rem, 3vw, 1.85rem);
    font-weight: 800;
    text-wrap: balance;
    color: #1e1b4b;
}

html.mk-public[data-theme="dark"] .h-flow__title {
    color: #ede9fe;
}

.h-flow__subtitle {
    margin: 0;
    font-size: 0.88rem;
    line-height: 1.55;
    color: #64748b;
}

html.mk-public[data-theme="dark"] .h-flow__subtitle {
    color: #94a3b8;
}

.h-flow__panel {
    padding: clamp(0.85rem, 2vw, 1.1rem);
    border-radius: 24px;
    border: 1px solid rgba(226, 232, 240, 0.95);
    background: #fff;
    box-shadow: 0 24px 56px -40px rgba(79, 70, 229, 0.22);
}

html.mk-public[data-theme="dark"] .h-flow__panel {
    background: rgba(15, 23, 42, 0.9);
    border-color: rgba(148, 163, 184, 0.14);
}

.h-flow__layout {
    display: grid;
    grid-template-columns: 1fr;
    gap: 0.75rem;
}

@media (min-width: 992px) {
    .h-flow__layout {
        grid-template-columns: minmax(0, 0.92fr) minmax(0, 1.35fr);
        gap: clamp(0.85rem, 2vw, 1.25rem);
        align-items: start;
    }

    .h-flow__mobile-detail {
        display: none !important;
    }
}

.h-flow__detail[data-accent="violet"] { --flow-accent: #7c3aed; --flow-soft: rgba(124, 58, 237, 0.12); }
.h-flow__detail[data-accent="indigo"] { --flow-accent: #6366f1; --flow-soft: rgba(99, 102, 241, 0.12); }
.h-flow__detail[data-accent="emerald"] { --flow-accent: #10b981; --flow-soft: rgba(16, 185, 129, 0.12); }
.h-flow__detail[data-accent="sky"] { --flow-accent: #0ea5e9; --flow-soft: rgba(14, 165, 233, 0.12); }
.h-flow__detail[data-accent="amber"] { --flow-accent: #f59e0b; --flow-soft: rgba(245, 158, 11, 0.12); }

.h-flow__detail {
    display: flex;
    flex-direction: column;
    gap: 0.65rem;
    min-width: 0;
    padding: clamp(0.65rem, 1.5vw, 0.85rem);
    border-radius: 18px;
    border: 1px solid rgba(226, 232, 240, 0.85);
    background: linear-gradient(180deg, rgba(248, 250, 252, 0.65), rgba(255, 255, 255, 0.95));
}

html.mk-public[data-theme="dark"] .h-flow__detail {
    background: rgba(30, 41, 59, 0.45);
    border-color: rgba(148, 163, 184, 0.12);
}

.h-flow__ai-note {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.35rem;
    align-self: center;
    margin: 0;
    padding: 0.28rem 0.65rem;
    border-radius: 999px;
    font-size: 0.66rem;
    font-weight: 700;
    color: #6d28d9;
    background: rgba(124, 58, 237, 0.08);
    border: 1px solid rgba(167, 139, 250, 0.22);
}

.h-flow__panes {
    position: relative;
    min-height: 0;
}

.h-flow__pane {
    display: none;
    flex-direction: column;
    gap: 0.55rem;
}

.h-flow__pane.is-active {
    display: flex;
}

.h-flow__pane-head {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.h-flow__pane-step {
    font-size: 0.66rem;
    font-weight: 800;
    color: var(--flow-accent, var(--h-violet));
}

.h-flow__pane-title {
    margin: 0;
    font-size: clamp(1rem, 2vw, 1.2rem);
    font-weight: 800;
    line-height: 1.35;
    color: #0f172a;
}

html.mk-public[data-theme="dark"] .h-flow__pane-title {
    color: #f8fafc;
}

.h-flow__pane-text {
    margin: 0;
    font-size: 0.8rem;
    line-height: 1.6;
    color: #64748b;
}

.h-flow__features {
    margin: 0;
    padding: 0;
    list-style: none;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.35rem;
}

.h-flow__features li {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.38rem 0.5rem;
    border-radius: 10px;
    font-size: 0.68rem;
    font-weight: 600;
    color: #475569;
    background: #fff;
    border: 1px solid #eef2f6;
}

.h-flow__features i {
    font-size: 0.62rem;
    color: var(--flow-accent, var(--h-violet));
}

html.mk-public[data-theme="dark"] .h-flow__features li {
    background: rgba(15, 23, 42, 0.55);
    border-color: rgba(148, 163, 184, 0.12);
    color: #cbd5e1;
}

.h-flow__preview {
    margin: 0;
    border-radius: 14px;
    overflow: hidden;
    border: 1px solid rgba(226, 232, 240, 0.9);
    box-shadow: 0 16px 36px -28px rgba(15, 23, 42, 0.25);
}

.h-flow__preview img {
    display: block;
    width: 100%;
    height: auto;
    vertical-align: middle;
}

.h-flow__footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    margin-top: 0.15rem;
    padding-top: 0.45rem;
    border-top: 1px solid rgba(226, 232, 240, 0.85);
}

.h-flow__footer-progress {
    position: relative;
    flex: 1;
    height: 4px;
    border-radius: 999px;
    overflow: hidden;
    max-width: 12rem;
}

.h-flow__footer-progress-track {
    position: absolute;
    inset: 0;
    background: rgba(124, 58, 237, 0.1);
}

.h-flow__footer-progress-fill {
    position: absolute;
    inset-block: 0;
    inset-inline-start: 0;
    width: 0;
    border-radius: inherit;
    background: var(--flow-accent, #7c3aed);
    transition: width 0.4s var(--h-ease);
}

.h-flow__footer-nav {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
}

.h-flow__footer-count {
    font-size: 0.72rem;
    font-weight: 700;
    color: #64748b;
    min-width: 2.5rem;
    text-align: center;
}

.h-flow__footer-btn {
    width: 2rem;
    height: 2rem;
    display: grid;
    place-items: center;
    border-radius: 50%;
    border: 1px solid rgba(148, 163, 184, 0.25);
    background: #fff;
    color: #64748b;
    cursor: pointer;
    transition: border-color 0.2s ease, color 0.2s ease, box-shadow 0.2s ease;
}

.h-flow__footer-btn:hover {
    border-color: rgba(124, 58, 237, 0.35);
    color: #7c3aed;
    box-shadow: 0 8px 18px -14px rgba(124, 58, 237, 0.45);
}

.h-flow__footer-btn:disabled {
    opacity: 0.4;
    cursor: not-allowed;
    box-shadow: none;
}

.h-flow__journey {
    position: relative;
    min-width: 0;
}

.h-flow__journey-line {
    position: absolute;
    inset-inline-end: 1.28rem;
    top: 0.75rem;
    bottom: 0.75rem;
    width: 1px;
    background: #e2e8f0;
    pointer-events: none;
}

.h-flow__nodes {
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
    margin: 0;
    padding: 0;
    list-style: none;
}

.h-flow__node[data-accent="violet"] { --node-accent: #7c3aed; --node-soft: rgba(124, 58, 237, 0.16); }
.h-flow__node[data-accent="indigo"] { --node-accent: #6366f1; --node-soft: rgba(99, 102, 241, 0.16); }
.h-flow__node[data-accent="emerald"] { --node-accent: #10b981; --node-soft: rgba(16, 185, 129, 0.16); }
.h-flow__node[data-accent="sky"] { --node-accent: #0ea5e9; --node-soft: rgba(14, 165, 233, 0.16); }
.h-flow__node[data-accent="amber"] { --node-accent: #f59e0b; --node-soft: rgba(245, 158, 11, 0.16); }

.h-flow__node-btn {
    display: flex;
    align-items: center;
    gap: 0.55rem;
    width: 100%;
    padding: 0.5rem 0.45rem 0.5rem 0.55rem;
    border: 1px solid transparent;
    border-radius: 999px;
    background: transparent;
    cursor: pointer;
    text-align: start;
    color: inherit;
    font: inherit;
    transition: background 0.25s ease, border-color 0.25s ease, box-shadow 0.25s ease;
}

.h-flow__node-btn:focus-visible {
    outline: 2px solid var(--node-accent, var(--h-violet));
    outline-offset: 2px;
}

.h-flow__node-marker {
    position: relative;
    flex-shrink: 0;
    width: 2.35rem;
    height: 2.35rem;
    display: grid;
    place-items: center;
}

.h-flow__node-dot {
    position: absolute;
    inset: 0.2rem;
    border-radius: 50%;
    border: 1px solid #e2e8f0;
    background: #f8fafc;
    transition: background 0.25s ease, border-color 0.25s ease, box-shadow 0.25s ease;
}

html.mk-public[data-theme="dark"] .h-flow__node-dot {
    background: rgba(15, 23, 42, 0.9);
    border-color: rgba(148, 163, 184, 0.2);
}

.h-flow__node-icon {
    position: relative;
    z-index: 1;
    font-size: 0.72rem;
    color: #94a3b8;
    transition: color 0.25s ease;
}

.h-flow__node-copy {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 0.06rem;
}

.h-flow__node-index {
    font-size: 0.58rem;
    font-weight: 800;
    letter-spacing: 0.05em;
    color: #94a3b8;
    font-style: normal;
}

.h-flow__node-title {
    font-size: 0.82rem;
    font-weight: 800;
    line-height: 1.32;
    color: #334155;
}

html.mk-public[data-theme="dark"] .h-flow__node-title {
    color: #e2e8f0;
}

.h-flow__node-desc {
    font-size: 0.68rem;
    font-style: normal;
    line-height: 1.4;
    color: #94a3b8;
}

.h-flow__node-chevron {
    flex-shrink: 0;
    width: 1.35rem;
    height: 1.35rem;
    display: grid;
    place-items: center;
    border-radius: 50%;
    font-size: 0.55rem;
    color: #cbd5e1;
    background: #f1f5f9;
    opacity: 0;
    transition: opacity 0.25s ease, color 0.25s ease, background 0.25s ease;
}

.h-flow__node.is-active .h-flow__node-btn {
    background: #fff;
    border-color: rgba(124, 58, 237, 0.22);
    box-shadow: 0 12px 28px -22px rgba(124, 58, 237, 0.35);
}

html.mk-public[data-theme="dark"] .h-flow__node.is-active .h-flow__node-btn {
    background: rgba(15, 23, 42, 0.75);
    border-color: rgba(167, 139, 250, 0.2);
}

.h-flow__node.is-active .h-flow__node-dot {
    inset: 0;
    border-color: transparent;
    background: var(--node-accent, var(--h-violet));
    box-shadow: 0 0 0 3px var(--node-soft, var(--h-violet-soft));
}

.h-flow__node.is-active .h-flow__node-icon {
    color: #fff;
}

.h-flow__node.is-active .h-flow__node-index,
.h-flow__node.is-active .h-flow__node-title {
    color: var(--node-accent, var(--h-violet));
}

.h-flow__node.is-active .h-flow__node-chevron {
    opacity: 1;
    color: #94a3b8;
    background: #f1f5f9;
}

.h-flow__node.is-active::after {
    content: "";
    position: absolute;
    inset-inline-end: 1.22rem;
    top: 50%;
    width: 6px;
    height: 6px;
    margin-top: -3px;
    border-radius: 50%;
    background: var(--node-accent, var(--h-violet));
    box-shadow: 0 0 0 3px var(--node-soft, var(--h-violet-soft));
    z-index: 2;
}

.h-flow__node {
    position: relative;
}

.h-flow__mobile-detail {
    margin-top: 0.65rem;
    padding: 0.75rem;
    border-radius: 14px;
    border: 1px solid rgba(226, 232, 240, 0.9);
    background: #f8fafc;
}

/* ─── Pillars ─── */
.h-pillars {
    position: relative;
    padding: clamp(2.75rem, 6vw, 4.5rem) 0;
}

.h-pillars__head {
    text-align: center;
    margin-bottom: clamp(1.35rem, 3vw, 2rem);
    max-width: 38rem;
    margin-inline: auto;
}

.h-pillars__kicker {
    display: inline-flex;
    align-items: center;
    margin-bottom: 0.45rem;
    padding: 0.28rem 0.65rem;
    border-radius: 999px;
    border: 1px solid rgba(124, 58, 237, 0.18);
    background: rgba(124, 58, 237, 0.06);
    font-size: 0.72rem;
    font-weight: 700;
    color: var(--h-violet);
}

.h-pillars__title {
    margin: 0 0 0.45rem;
    font-size: clamp(1.35rem, 3.8vw, 2rem);
    font-weight: 800;
    text-wrap: balance;
}

.h-pillars__subtitle {
    margin: 0;
    font-size: 0.92rem;
    line-height: 1.65;
    color: #64748b;
}

html.mk-public[data-theme="dark"] .h-pillars__subtitle {
    color: #94a3b8;
}

.h-pillars__showcase {
    border-radius: 22px;
    border: 1px solid rgba(124, 58, 237, 0.14);
    background: linear-gradient(165deg, rgba(255, 255, 255, 0.96), rgba(248, 250, 252, 0.88));
    box-shadow: 0 28px 64px -40px rgba(15, 23, 42, 0.28);
    overflow: hidden;
}

html.mk-public[data-theme="dark"] .h-pillars__showcase {
    background: linear-gradient(165deg, rgba(15, 23, 42, 0.94), rgba(30, 27, 75, 0.62));
    border-color: rgba(167, 139, 250, 0.18);
}

.h-pillars__nav {
    display: flex;
    gap: 0.45rem;
    padding: 0.65rem;
    border-bottom: 1px solid rgba(148, 163, 184, 0.12);
    background: rgba(124, 58, 237, 0.03);
}

.h-pillars__nav-btn {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    min-height: 44px;
    padding: 0.55rem 0.95rem;
    border: 1px solid transparent;
    border-radius: 12px;
    background: transparent;
    font-size: 0.82rem;
    font-weight: 700;
    color: #64748b;
    cursor: pointer;
    transition:
        color 0.3s var(--h-ease),
        background 0.3s var(--h-ease),
        border-color 0.3s var(--h-ease),
        box-shadow 0.3s var(--h-ease);
}

.h-pillars__nav-btn[data-accent="indigo"] { --pillar-accent: #6366f1; --pillar-soft: rgba(99, 102, 241, 0.12); }
.h-pillars__nav-btn[data-accent="violet"] { --pillar-accent: #7c3aed; --pillar-soft: rgba(124, 58, 237, 0.12); }
.h-pillars__nav-btn[data-accent="emerald"] { --pillar-accent: #10b981; --pillar-soft: rgba(16, 185, 129, 0.12); }

.h-pillars__nav-btn:focus-visible {
    outline: 2px solid var(--pillar-accent, var(--h-violet));
    outline-offset: 2px;
}

.h-pillars__nav-icon {
    width: 1.75rem;
    height: 1.75rem;
    display: grid;
    place-items: center;
    border-radius: 8px;
    font-size: 0.78rem;
    background: rgba(148, 163, 184, 0.12);
    color: #64748b;
    transition: background 0.3s var(--h-ease), color 0.3s var(--h-ease);
}

.h-pillars__nav-btn.is-active {
    color: var(--pillar-accent, var(--h-violet));
    background: #fff;
    border-color: rgba(148, 163, 184, 0.14);
    box-shadow: 0 8px 24px -16px rgba(15, 23, 42, 0.25);
}

html.mk-public[data-theme="dark"] .h-pillars__nav-btn.is-active {
    background: rgba(15, 23, 42, 0.88);
}

.h-pillars__nav-btn.is-active .h-pillars__nav-icon {
    background: var(--pillar-soft, var(--h-violet-soft));
    color: var(--pillar-accent, var(--h-violet));
}

.h-pillars__panels {
    position: relative;
    min-height: min(24rem, 70vw);
}

.h-pillar-panel {
    display: grid;
    grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr);
    gap: clamp(1rem, 2.5vw, 1.75rem);
    padding: clamp(1rem, 2.5vw, 1.5rem);
    opacity: 0;
    transform: translateY(8px);
    transition: opacity 0.4s var(--h-ease), transform 0.4s var(--h-ease);
}

.h-pillar-panel.is-active {
    opacity: 1;
    transform: translateY(0);
}

.h-pillar-panel[hidden] {
    display: none !important;
}

.h-pillar-panel:not([hidden]) {
    display: grid;
}

.h-pillar-panel__visual {
    position: relative;
    margin: 0;
    border-radius: 16px;
    overflow: hidden;
    aspect-ratio: 16 / 10;
    border: 1px solid rgba(148, 163, 184, 0.14);
    background: #0f172a;
    box-shadow: 0 20px 48px -28px rgba(15, 23, 42, 0.45);
}

.h-pillar-panel--indigo .h-pillar-panel__visual { --panel-glow: rgba(99, 102, 241, 0.35); }
.h-pillar-panel--violet .h-pillar-panel__visual { --panel-glow: rgba(124, 58, 237, 0.35); }
.h-pillar-panel--emerald .h-pillar-panel__visual { --panel-glow: rgba(16, 185, 129, 0.35); }

.h-pillar-panel__visual::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, transparent 55%, rgba(15, 23, 42, 0.55) 100%);
    pointer-events: none;
}

.h-pillar-panel__frame {
    position: absolute;
    top: 0;
    inset-inline: 0;
    z-index: 2;
    display: flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.45rem 0.65rem;
    background: rgba(15, 23, 42, 0.72);
    border-bottom: 1px solid rgba(148, 163, 184, 0.12);
}

.h-pillar-panel__frame span {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: rgba(148, 163, 184, 0.35);
}

.h-pillar-panel__frame span:first-child { background: #f87171; }
.h-pillar-panel__frame span:nth-child(2) { background: #fbbf24; }
.h-pillar-panel__frame span:nth-child(3) { background: #34d399; }

.h-pillar-panel__img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: top center;
}

.h-pillar-panel__badge {
    position: absolute;
    inset-inline-start: 0.75rem;
    bottom: 0.75rem;
    z-index: 2;
    padding: 0.28rem 0.6rem;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.92);
    font-size: 0.68rem;
    font-weight: 800;
    color: #1e293b;
    box-shadow: 0 8px 20px -12px rgba(0, 0, 0, 0.35);
}

.h-pillar-panel__body {
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 0.25rem 0;
}

.h-pillar-panel__title {
    margin: 0 0 0.5rem;
    font-size: clamp(1.15rem, 2.5vw, 1.45rem);
    font-weight: 800;
    line-height: 1.3;
}

.h-pillar-panel--indigo .h-pillar-panel__title { color: #6366f1; }
.h-pillar-panel--violet .h-pillar-panel__title { color: #7c3aed; }
.h-pillar-panel--emerald .h-pillar-panel__title { color: #059669; }

.h-pillar-panel__outcome {
    margin: 0 0 1rem;
    font-size: 0.92rem;
    line-height: 1.7;
    color: #475569;
}

html.mk-public[data-theme="dark"] .h-pillar-panel__outcome {
    color: #cbd5e1;
}

.h-pillar-panel__features {
    margin: 0 0 1.15rem;
    padding: 0;
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 0.55rem;
}

.h-pillar-panel__features li {
    display: flex;
    align-items: flex-start;
    gap: 0.55rem;
    font-size: 0.84rem;
    font-weight: 600;
    line-height: 1.55;
}

.h-pillar-panel__feat-icon {
    flex-shrink: 0;
    width: 1.35rem;
    height: 1.35rem;
    display: grid;
    place-items: center;
    border-radius: 999px;
    background: rgba(16, 185, 129, 0.12);
    color: #10b981;
    font-size: 0.58rem;
}

.h-pillar-panel__link {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    align-self: flex-start;
    min-height: 44px;
    padding: 0.55rem 1rem;
    border-radius: 12px;
    background: linear-gradient(135deg, rgba(124, 58, 237, 0.1), rgba(109, 40, 217, 0.06));
    border: 1px solid rgba(124, 58, 237, 0.18);
    font-size: 0.82rem;
    font-weight: 700;
    color: var(--h-violet);
    text-decoration: none;
    transition: transform 0.25s var(--h-ease), box-shadow 0.25s var(--h-ease);
}

.h-pillar-panel__link:hover {
    transform: translateY(-1px);
    box-shadow: 0 10px 24px -16px rgba(124, 58, 237, 0.45);
}

.h-pillars__orbit {
    margin-top: clamp(1.25rem, 3vw, 1.75rem);
    padding: 0.85rem 0;
    border-top: 1px dashed rgba(124, 58, 237, 0.16);
}

.h-pillars__orbit-label {
    display: block;
    margin-bottom: 0.65rem;
    text-align: center;
    font-size: 0.72rem;
    font-weight: 700;
    color: #94a3b8;
    letter-spacing: 0.03em;
}

.h-pillars__orbit-track {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 0.45rem;
}

.h-pillar-chip {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.42rem 0.75rem;
    font-size: 0.74rem;
    font-weight: 600;
    border-radius: 999px;
    border: 1px solid rgba(124, 58, 237, 0.14);
    color: #64748b;
    background: rgba(255, 255, 255, 0.75);
    transition: transform 0.25s var(--h-ease), border-color 0.25s var(--h-ease);
}

html.mk-public[data-theme="dark"] .h-pillar-chip {
    background: rgba(15, 23, 42, 0.65);
    color: #94a3b8;
}

.h-pillar-chip i {
    color: var(--h-violet);
    font-size: 0.72rem;
}

.h-pillar-chip:hover {
    transform: translateY(-1px);
    border-color: rgba(124, 58, 237, 0.28);
}

/* ─── Compact pricing ─── */
.h-pricing {
    padding: clamp(2rem, 5vw, 3rem) 0;
}

.h-pricing .mk-tier-grid {
    gap: 1rem;
}

.h-pricing .mk-tier-card {
    padding: 1.15rem 1.25rem;
}

.h-pricing .mk-tier-features {
    margin-bottom: 0.85rem;
}

.h-pricing .mk-tier-features li {
    font-size: 0.82rem;
    padding: 0.25rem 0;
}

.h-pricing .mk-section-head {
    margin-bottom: 1.25rem;
}

.h-pricing .mk-tier-price-note {
    display: block;
}

.h-pricing .mk-tier-price-hint {
    display: block;
    margin-top: 0.35rem;
    font-size: 0.78rem;
    font-weight: 600;
    color: #64748b;
    line-height: 1.5;
}

html.mk-public[data-theme="dark"] .h-pricing .mk-tier-price-hint {
    color: #94a3b8;
}

.h-pricing .mk-section-desc {
    display: block;
    max-width: 36rem;
    margin-inline: auto;
    font-size: 0.92rem;
    line-height: 1.65;
    color: #64748b;
}

html.mk-public[data-theme="dark"] .h-pricing .mk-section-desc {
    color: #94a3b8;
}

/* ─── FAQ (home premium) ─── */
.h-faq {
    position: relative;
    padding: clamp(2rem, 5vw, 3.25rem) 0;
    background:
        radial-gradient(ellipse 80% 55% at 50% 0%, rgba(167, 139, 250, 0.1), transparent 62%),
        linear-gradient(180deg, #faf8ff 0%, #ffffff 45%);
}

html.mk-public[data-theme="dark"] .h-faq {
    background:
        radial-gradient(ellipse 80% 55% at 50% 0%, rgba(124, 58, 237, 0.12), transparent 62%),
        linear-gradient(180deg, #0f172a 0%, #111827 100%);
}

.h-faq__container.mk-faq-wrap {
    max-width: 77.5rem;
    grid-template-columns: minmax(0, 0.95fr) minmax(0, 1.35fr);
    gap: clamp(1.25rem, 3vw, 2rem);
}

.h-faq__intro {
    position: sticky;
    top: 1.25rem;
}

.h-faq__eyebrow {
    display: inline-flex;
    align-items: center;
    padding: 0.22rem 0.55rem;
    border-radius: 999px;
    font-size: 0.66rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    color: #6d28d9;
    background: rgba(124, 58, 237, 0.08);
    border: 1px solid rgba(167, 139, 250, 0.22);
    margin-bottom: 0.55rem;
}

.h-faq__title {
    margin: 0 0 0.5rem;
    font-size: clamp(1.25rem, 2.8vw, 1.75rem);
    font-weight: 800;
    line-height: 1.32;
    color: #1e1b4b;
}

html.mk-public[data-theme="dark"] .h-faq__title {
    color: #ede9fe;
}

.h-faq__desc {
    display: block !important;
    margin: 0 0 0.85rem;
    max-width: 26rem;
    font-size: 0.88rem;
    line-height: 1.65;
    color: #64748b;
}

html.mk-public[data-theme="dark"] .h-faq__desc {
    color: #94a3b8;
}

.h-faq__highlights {
    margin: 0;
    padding: 0;
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
}

.h-faq__highlights li {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    font-size: 0.78rem;
    font-weight: 600;
    color: #475569;
}

.h-faq__highlights i {
    width: 1.65rem;
    height: 1.65rem;
    display: grid;
    place-items: center;
    border-radius: 8px;
    font-size: 0.68rem;
    color: #7c3aed;
    background: rgba(124, 58, 237, 0.1);
}

html.mk-public[data-theme="dark"] .h-faq__highlights li {
    color: #cbd5e1;
}

.h-faq__panel.mk-faq-panel {
    display: flex;
    flex-direction: column;
    gap: 0.45rem;
    padding: 0;
    border: none;
    background: transparent;
    overflow: visible;
}

.h-faq__item.mk-faq-item {
    border: 1px solid rgba(226, 232, 240, 0.95);
    border-radius: 14px;
    background: #fff;
    box-shadow: 0 10px 28px -24px rgba(15, 23, 42, 0.12);
    border-bottom: 1px solid rgba(226, 232, 240, 0.95);
}

html.mk-public[data-theme="dark"] .h-faq__item.mk-faq-item {
    background: rgba(15, 23, 42, 0.72);
    border-color: rgba(148, 163, 184, 0.14);
    box-shadow: none;
}

.h-faq__item.mk-faq-item[open] {
    border-color: rgba(167, 139, 250, 0.45);
    background: #fff;
    border-inline-start: 3px solid #7c3aed;
    box-shadow: 0 14px 36px -26px rgba(124, 58, 237, 0.22);
}

html.mk-public[data-theme="dark"] .h-faq__item.mk-faq-item[open] {
    background: rgba(30, 41, 59, 0.85);
}

.h-faq__item summary {
    padding: 0.85rem 1rem;
    gap: 0.65rem;
}

.h-faq__num {
    font-size: 0.68rem;
    font-weight: 800;
    color: #94a3b8;
    opacity: 1;
    min-width: 1.5rem;
}

.h-faq__item[open] .h-faq__num {
    color: #7c3aed;
}

.h-faq__q {
    font-size: 0.86rem;
    font-weight: 700;
    color: #1e293b;
    line-height: 1.5;
}

html.mk-public[data-theme="dark"] .h-faq__q {
    color: #f1f5f9;
}

.h-faq__item[open] .h-faq__q {
    color: #5b21b6;
}

html.mk-public[data-theme="dark"] .h-faq__item[open] .h-faq__q {
    color: #ddd6fe;
}

.h-faq__toggle {
    flex-shrink: 0;
}

.h-faq__toggle .mk-faq-icon {
    width: 1.75rem;
    height: 1.75rem;
    display: grid;
    place-items: center;
    border-radius: 50%;
    font-size: 0.65rem;
    color: #64748b;
    background: #f1f5f9;
    border: 1px solid #e2e8f0;
    transition: transform 0.25s ease, background 0.25s ease, color 0.25s ease;
}

.h-faq__item[open] .h-faq__toggle .mk-faq-icon {
    transform: rotate(45deg);
    color: #fff;
    background: #7c3aed;
    border-color: transparent;
}

.h-faq__answer {
    padding: 0 1rem 0.95rem 2.15rem;
}

.h-faq__answer > p {
    margin: 0;
    font-size: 0.82rem;
    line-height: 1.75;
    color: #64748b;
}

html.mk-public[data-theme="dark"] .h-faq__answer > p {
    color: #94a3b8;
}

.h-faq__foot {
    grid-column: 1 / -1;
    margin: 0.35rem 0 0;
    text-align: center;
    font-size: 0.82rem;
    color: #64748b;
}

.h-faq__foot a {
    margin-inline-start: 0.35rem;
    font-weight: 700;
    color: #7c3aed;
    text-decoration: none;
}

.h-faq__foot a:hover {
    text-decoration: underline;
}

@media (max-width: 991px) {
    .h-faq__container.mk-faq-wrap {
        grid-template-columns: 1fr;
    }

    .h-faq__intro {
        position: static;
        text-align: center;
    }

    .h-faq__desc {
        margin-inline: auto;
    }

    .h-faq__highlights {
        align-items: center;
    }

    .h-faq__answer {
        padding-inline: 1rem 1rem;
    }
}

/* ─── Final CTA (light-first, readable on mk-home-page) ─── */
.h-final-cta {
    position: relative;
    padding: clamp(2.5rem, 6vw, 4rem) 0;
    overflow: hidden;
    background:
        radial-gradient(ellipse 90% 70% at 50% 0%, rgba(167, 139, 250, 0.14), transparent 58%),
        linear-gradient(180deg, #f8f6ff 0%, #ffffff 55%);
}

.h-final-cta__glow {
    position: absolute;
    inset: 0;
    background: radial-gradient(ellipse 60% 50% at 80% 20%, rgba(124, 58, 237, 0.08), transparent 70%);
    pointer-events: none;
}

.h-final-cta__mesh {
    position: absolute;
    inset: 0;
    opacity: 0.45;
    background-image: radial-gradient(rgba(124, 58, 237, 0.12) 1px, transparent 1px);
    background-size: 24px 24px;
    pointer-events: none;
    mask-image: linear-gradient(180deg, transparent, #000 20%, #000 80%, transparent);
}

.h-final-cta__inner {
    position: relative;
    z-index: 1;
    text-align: center;
    max-width: 42rem;
    margin: 0 auto;
    padding: clamp(1.35rem, 3vw, 1.85rem);
    border-radius: 22px;
    border: 1px solid rgba(199, 181, 255, 0.35);
    background: #fff;
    box-shadow:
        0 24px 56px -40px rgba(79, 70, 229, 0.28),
        0 0 0 1px rgba(255, 255, 255, 0.9) inset;
}

html.mk-public .mk-home-page .h-final-cta .h-final-cta__title {
    margin: 0 0 0.65rem;
    font-size: clamp(1.3rem, 3.5vw, 2rem);
    font-weight: 800;
    line-height: 1.38;
    color: #1e1b4b;
    text-wrap: balance;
}

html.mk-public .mk-home-page .h-final-cta .h-final-cta__desc {
    margin: 0 0 1.35rem;
    font-size: clamp(0.88rem, 1.8vw, 0.98rem);
    line-height: 1.75;
    color: #475569;
}

.h-final-cta__actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 0.65rem;
}

.h-final-cta__btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.45rem;
    min-height: 46px;
    padding: 0.7rem 1.35rem;
    border-radius: 12px;
    font-size: 0.9rem;
    font-weight: 700;
    text-decoration: none;
    transition: transform 0.2s var(--h-ease), box-shadow 0.2s var(--h-ease), background 0.2s ease, border-color 0.2s ease;
}

.h-final-cta__btn--primary {
    color: #fff;
    background: linear-gradient(135deg, #9333ea, #7c3aed);
    box-shadow: 0 12px 32px -14px rgba(124, 58, 237, 0.55);
}

.h-final-cta__btn--primary:hover {
    box-shadow: 0 16px 36px -12px rgba(124, 58, 237, 0.62);
}

.h-final-cta__btn--ghost {
    color: #334155;
    border: 1px solid #e2e8f0;
    background: #f8fafc;
}

.h-final-cta__btn--ghost:hover {
    background: #fff;
    border-color: rgba(124, 58, 237, 0.28);
    color: #5b21b6;
}

.h-final-cta__btn:active {
    transform: scale(0.98);
}

html.mk-public .mk-home-page .h-final-cta .h-final-cta__edu {
    margin: 1.15rem 0 0;
    font-size: 0.8rem;
    color: #64748b;
}

html.mk-public .mk-home-page .h-final-cta .h-final-cta__edu a {
    color: #7c3aed;
    font-weight: 600;
    text-decoration: none;
}

html.mk-public .mk-home-page .h-final-cta .h-final-cta__edu a:hover {
    color: #6d28d9;
    text-decoration: underline;
}

.h-final-cta__edu span {
    opacity: 0.5;
    margin-inline: 0.35rem;
}

html.mk-public[data-theme="dark"] .h-final-cta {
    background:
        radial-gradient(ellipse 90% 70% at 50% 0%, rgba(124, 58, 237, 0.16), transparent 58%),
        linear-gradient(180deg, #0f172a 0%, #111827 100%);
}

html.mk-public[data-theme="dark"] .h-final-cta__inner {
    background: rgba(15, 23, 42, 0.88);
    border-color: rgba(148, 163, 184, 0.16);
    box-shadow: 0 24px 56px -40px rgba(0, 0, 0, 0.45);
}

html.mk-public[data-theme="dark"] .mk-home-page .h-final-cta .h-final-cta__title {
    color: #f8fafc;
}

html.mk-public[data-theme="dark"] .mk-home-page .h-final-cta .h-final-cta__desc {
    color: #cbd5e1;
}

html.mk-public[data-theme="dark"] .h-final-cta__btn--ghost {
    color: #e2e8f0;
    border-color: rgba(148, 163, 184, 0.28);
    background: rgba(30, 41, 59, 0.65);
}

html.mk-public[data-theme="dark"] .mk-home-page .h-final-cta .h-final-cta__edu {
    color: #94a3b8;
}

html.mk-public[data-theme="dark"] .mk-home-page .h-final-cta .h-final-cta__edu a {
    color: #c4b5fd;
}

/* ─── Intelligence layer (reference UI) ─── */
html.mk-public .mk-home-page .h-intel h2,
html.mk-public .mk-home-page .h-intel h3 {
    color: #f8fafc;
}

html.mk-public .mk-home-page .h-intel p {
    color: inherit;
}

html.mk-public .mk-home-page .h-intel strong {
    color: #f1f5f9;
}

.h-intel {
    position: relative;
    padding: clamp(2.5rem, 6vw, 4.25rem) 0;
    color: #e2e8f0;
    overflow: hidden;
    isolation: isolate;
}

.h-intel__backdrop {
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, #060a14 0%, #0a1020 38%, #12102a 100%);
    z-index: 0;
}

.h-intel__blob {
    position: absolute;
    border-radius: 50%;
    filter: blur(72px);
    pointer-events: none;
}

.h-intel__blob--a {
    width: min(42vw, 28rem);
    height: min(42vw, 28rem);
    top: 8%;
    inset-inline-end: -8%;
    background: rgba(124, 58, 237, 0.35);
}

.h-intel__blob--b {
    width: min(36vw, 22rem);
    height: min(36vw, 22rem);
    bottom: 5%;
    inset-inline-start: -6%;
    background: rgba(59, 130, 246, 0.22);
}

.h-intel__grid-glow {
    position: absolute;
    inset: 0;
    background-image:
        linear-gradient(rgba(139, 92, 246, 0.07) 1px, transparent 1px),
        linear-gradient(90deg, rgba(139, 92, 246, 0.05) 1px, transparent 1px);
    background-size: 40px 40px;
    mask-image: radial-gradient(ellipse 85% 75% at 50% 35%, #000 15%, transparent 72%);
    opacity: 0.55;
}

.h-intel__line {
    position: absolute;
    height: 1px;
    inset-inline: 0;
    background: linear-gradient(90deg, transparent, rgba(167, 139, 250, 0.28), transparent);
}

.h-intel__line--a { top: 14%; }
.h-intel__line--b { bottom: 18%; opacity: 0.45; }

.h-intel .container {
    position: relative;
    z-index: 1;
}

.h-intel__head {
    text-align: center;
    max-width: 40rem;
    margin: 0 auto clamp(1.35rem, 3.2vw, 2rem);
}

.h-intel__kicker {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    margin-bottom: 0.85rem;
    padding: 0.32rem 0.85rem;
    border-radius: 999px;
    border: 1px solid rgba(167, 139, 250, 0.45);
    background: rgba(124, 58, 237, 0.12);
    box-shadow: 0 0 28px rgba(124, 58, 237, 0.28);
    font-size: 0.78rem;
    font-weight: 700;
    color: #e9d5ff;
}

.h-intel__title {
    margin: 0 0 0.75rem;
    font-size: clamp(1.45rem, 3.8vw, 2.15rem);
    font-weight: 800;
    line-height: 1.35;
    text-wrap: balance;
    color: #f8fafc;
}

.h-intel__title-accent {
    display: inline;
    background: linear-gradient(90deg, #c4b5fd, #a78bfa 45%, #60a5fa);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    filter: drop-shadow(0 0 18px rgba(167, 139, 250, 0.35));
}

.h-intel__sub {
    margin: 0;
    font-size: clamp(0.9rem, 2.2vw, 1.02rem);
    line-height: 1.75;
    color: #94a3b8;
    max-width: 34rem;
    margin-inline: auto;
}

.h-intel__panels {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: clamp(0.7rem, 1.6vw, 0.95rem);
    align-items: stretch;
    perspective: 1280px;
    perspective-origin: 50% 28%;
}

.h-intel-panel {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 0.6rem;
    padding: clamp(0.8rem, 1.8vw, 1.05rem);
    border-radius: 18px;
    border: 1px solid rgba(255, 255, 255, 0.09);
    background: rgba(15, 23, 42, 0.42);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    box-shadow:
        0 0 0 1px rgba(255, 255, 255, 0.04) inset,
        0 28px 64px -36px rgba(0, 0, 0, 0.65);
    transform-style: preserve-3d;
    transform-origin: center center;
    will-change: transform;
    animation: h-intel-card-breathe 11s cubic-bezier(0.45, 0.05, 0.55, 0.95) infinite;
}

.h-intel-panel--voice {
    animation-name: h-intel-card-breathe-voice;
    animation-duration: 10.5s;
    animation-delay: -1.2s;
}

.h-intel-panel--matching {
    animation-name: h-intel-card-breathe-match;
    animation-duration: 12s;
    animation-delay: -3.4s;
}

.h-intel-panel--summary {
    animation-name: h-intel-card-breathe-summary;
    animation-duration: 11.5s;
    animation-delay: -5.1s;
}

.h-intel-panel::after {
    content: '';
    position: absolute;
    inset: 0;
    border-radius: inherit;
    pointer-events: none;
    opacity: 0;
    background: linear-gradient(
        125deg,
        transparent 38%,
        rgba(167, 139, 250, 0.14) 48%,
        transparent 58%
    );
    background-size: 220% 220%;
    animation: h-intel-card-shine 14s ease-in-out infinite;
}

.h-intel-panel--voice::after {
    animation-duration: 12s;
    animation-delay: -2s;
}

.h-intel-panel--matching::after {
    animation-duration: 15s;
    animation-delay: -4.5s;
}

.h-intel-panel--summary::after {
    animation-duration: 13s;
    animation-delay: -1s;
}

@keyframes h-intel-card-breathe {
    0%, 100% {
        transform: translate3d(0, 0, 0) rotateX(1.2deg) rotateY(-2deg) rotateZ(0deg);
    }
    50% {
        transform: translate3d(0, -5px, 4px) rotateX(-1deg) rotateY(2deg) rotateZ(0.35deg);
    }
}

@keyframes h-intel-card-breathe-voice {
    0%, 100% {
        transform: translate3d(0, 1px, 0) rotateX(0.8deg) rotateY(2.5deg) rotateZ(-0.4deg);
    }
    33% {
        transform: translate3d(0, -4px, 6px) rotateX(-1.4deg) rotateY(-3deg) rotateZ(0.5deg);
    }
    66% {
        transform: translate3d(0, -6px, 8px) rotateX(1deg) rotateY(3.5deg) rotateZ(-0.25deg);
    }
}

@keyframes h-intel-card-breathe-match {
    0%, 100% {
        transform: translate3d(0, 0, 0) rotateX(1.5deg) rotateY(-3deg) rotateZ(0.3deg);
    }
    40% {
        transform: translate3d(0, -5px, 5px) rotateX(-0.6deg) rotateY(2.8deg) rotateZ(-0.45deg);
    }
    70% {
        transform: translate3d(0, -3px, 3px) rotateX(0.9deg) rotateY(-2.2deg) rotateZ(0.2deg);
    }
}

@keyframes h-intel-card-breathe-summary {
    0%, 100% {
        transform: translate3d(0, 0, 0) rotateX(-0.6deg) rotateY(2.2deg) rotateZ(0.2deg);
    }
    45% {
        transform: translate3d(0, -6px, 7px) rotateX(1.3deg) rotateY(-3.2deg) rotateZ(-0.35deg);
    }
    80% {
        transform: translate3d(0, -2px, 2px) rotateX(-0.8deg) rotateY(1.5deg) rotateZ(0.15deg);
    }
}

@keyframes h-intel-card-shine {
    0%, 72%, 100% {
        opacity: 0;
        background-position: 120% 40%;
    }
    78% {
        opacity: 0.55;
        background-position: 40% 60%;
    }
    86% {
        opacity: 0;
        background-position: -20% 80%;
    }
}

@media (hover: hover) and (pointer: fine) {
    .h-intel-panel {
        transition: box-shadow 0.45s ease, border-color 0.45s ease;
    }

    .h-intel-panel:hover {
        border-color: rgba(167, 139, 250, 0.22);
        box-shadow:
            0 0 0 1px rgba(255, 255, 255, 0.06) inset,
            0 36px 72px -32px rgba(0, 0, 0, 0.7),
            0 0 40px rgba(124, 58, 237, 0.12);
    }
}

.h-intel-panel__head {
    text-align: center;
}

.h-intel-panel__hero {
    position: relative;
    width: 3.25rem;
    height: 3.25rem;
    margin: 0 auto 0.65rem;
    display: grid;
    place-items: center;
    border-radius: 14px;
    font-size: 1.15rem;
    color: #e9d5ff;
    background: linear-gradient(145deg, rgba(124, 58, 237, 0.35), rgba(59, 130, 246, 0.2));
    border: 1px solid rgba(167, 139, 250, 0.35);
    box-shadow: 0 0 24px rgba(124, 58, 237, 0.35);
}

.h-intel-panel__hero--art {
    width: min(100%, 10.75rem);
    height: auto;
    min-height: 4.85rem;
    margin: 0 auto 0.1rem;
    padding: 0;
    background: transparent;
    border: none;
    box-shadow: none;
    border-radius: 0;
    perspective: 980px;
    perspective-origin: 50% 40%;
    transform-style: preserve-3d;
}

.h-intel-panel__hero--art .h-intel-panel__hero-glow {
    display: none;
}

.h-intel-panel__hero-stage {
    position: relative;
    z-index: 1;
    display: flex;
    justify-content: center;
    align-items: center;
    transform-style: preserve-3d;
    will-change: transform;
    isolation: isolate;
    animation: h-intel-hero-float 5.6s ease-in-out infinite;
    filter:
        drop-shadow(0 20px 28px rgba(15, 23, 42, 0.55))
        drop-shadow(0 0 26px rgba(124, 58, 237, 0.22));
}

.h-intel-panel--voice .h-intel-panel__hero-stage {
    animation-name: h-intel-hero-float-voice;
    animation-duration: 5.1s;
    animation-delay: -0.8s;
    filter:
        drop-shadow(0 22px 34px rgba(15, 23, 42, 0.5))
        drop-shadow(0 0 32px rgba(59, 130, 246, 0.32));
}

.h-intel-panel--matching .h-intel-panel__hero-stage {
    animation-name: h-intel-hero-float-match;
    animation-duration: 5.8s;
    animation-delay: -1.4s;
    filter:
        drop-shadow(0 20px 30px rgba(15, 23, 42, 0.52))
        drop-shadow(0 0 28px rgba(99, 102, 241, 0.28));
}

.h-intel-panel--summary .h-intel-panel__hero-stage {
    animation-name: h-intel-hero-float-summary;
    animation-duration: 6.2s;
    animation-delay: -0.5s;
    filter:
        drop-shadow(0 20px 30px rgba(15, 23, 42, 0.52))
        drop-shadow(0 0 30px rgba(167, 139, 250, 0.26));
}

@keyframes h-intel-hero-float {
    0%, 100% {
        transform: translate3d(0, 0, 0) rotateX(10deg) rotateY(-16deg) rotateZ(-1deg);
    }
    25% {
        transform: translate3d(1px, -4px, 8px) rotateX(-6deg) rotateY(8deg) rotateZ(1.5deg);
    }
    50% {
        transform: translate3d(0, -8px, 14px) rotateX(-10deg) rotateY(18deg) rotateZ(2deg);
    }
    75% {
        transform: translate3d(-1px, -3px, 6px) rotateX(5deg) rotateY(-10deg) rotateZ(-0.5deg);
    }
}

@keyframes h-intel-hero-float-voice {
    0%, 100% {
        transform: translate3d(0, 2px, 0) rotateX(8deg) rotateY(14deg) rotateZ(-2deg);
    }
    30% {
        transform: translate3d(2px, -5px, 10px) rotateX(-5deg) rotateY(-10deg) rotateZ(2deg);
    }
    55% {
        transform: translate3d(0, -10px, 16px) rotateX(-9deg) rotateY(-18deg) rotateZ(3deg);
    }
    80% {
        transform: translate3d(-2px, -4px, 8px) rotateX(6deg) rotateY(12deg) rotateZ(-1deg);
    }
}

@keyframes h-intel-hero-float-match {
    0%, 100% {
        transform: translate3d(0, 0, 0) rotateX(9deg) rotateY(-18deg) rotateZ(1deg);
    }
    35% {
        transform: translate3d(0, -5px, 9px) rotateX(-4deg) rotateY(12deg) rotateZ(-2deg);
    }
    65% {
        transform: translate3d(0, -7px, 12px) rotateX(-8deg) rotateY(20deg) rotateZ(2.5deg);
    }
}

@keyframes h-intel-hero-float-summary {
    0%, 100% {
        transform: translate3d(0, 1px, 0) rotateX(7deg) rotateY(12deg) rotateZ(0.5deg);
    }
    28% {
        transform: translate3d(-1px, -4px, 7px) rotateX(-5deg) rotateY(-14deg) rotateZ(-1.5deg);
    }
    52% {
        transform: translate3d(0, -9px, 15px) rotateX(-9deg) rotateY(-20deg) rotateZ(-2.5deg);
    }
    78% {
        transform: translate3d(1px, -3px, 5px) rotateX(4deg) rotateY(8deg) rotateZ(1deg);
    }
}

.h-intel-panel__hero-stage::before {
    content: '';
    position: absolute;
    inset: 8% 2% 0;
    z-index: 0;
    border-radius: 50%;
    background: radial-gradient(ellipse 75% 65% at 50% 58%, rgba(30, 41, 59, 0.55), transparent 72%);
    pointer-events: none;
}

.h-intel-panel__hero-img {
    position: relative;
    z-index: 1;
    display: block;
    width: auto;
    max-width: 100%;
    height: clamp(4.1rem, 9.5vw, 5.35rem);
    margin-inline: auto;
    object-fit: contain;
    object-position: center;
    background: transparent;
    mix-blend-mode: darken;
    user-select: none;
    -webkit-user-drag: none;
    transform: translateZ(16px);
    filter: brightness(1.12) contrast(1.06) saturate(1.1);
    animation: h-intel-hero-img-tilt 7.5s cubic-bezier(0.45, 0.05, 0.55, 0.95) infinite;
}

.h-intel-panel--voice .h-intel-panel__hero-img {
    animation-name: h-intel-hero-img-tilt-voice;
    animation-duration: 6.8s;
    animation-delay: -1.5s;
}

.h-intel-panel--matching .h-intel-panel__hero-img {
    animation-name: h-intel-hero-img-tilt-match;
    animation-duration: 7.8s;
    animation-delay: -2.8s;
}

.h-intel-panel--summary .h-intel-panel__hero-img {
    animation-name: h-intel-hero-img-tilt-summary;
    animation-duration: 8.2s;
    animation-delay: -0.9s;
}

@keyframes h-intel-hero-img-tilt {
    0%, 100% { transform: translateZ(16px) rotateY(-6deg); }
    50% { transform: translateZ(22px) rotateY(8deg); }
}

@keyframes h-intel-hero-img-tilt-voice {
    0%, 100% { transform: translateZ(18px) rotateY(8deg) rotateX(2deg); }
    50% { transform: translateZ(24px) rotateY(-10deg) rotateX(-3deg); }
}

@keyframes h-intel-hero-img-tilt-match {
    0%, 100% { transform: translateZ(16px) rotateY(-9deg); }
    50% { transform: translateZ(21px) rotateY(11deg); }
}

@keyframes h-intel-hero-img-tilt-summary {
    0%, 100% { transform: translateZ(17px) rotateY(7deg); }
    50% { transform: translateZ(23px) rotateY(-9deg); }
}

.h-intel-panel--voice .h-intel-panel__hero-img {
    height: clamp(4.5rem, 10.5vw, 5.85rem);
}

.h-intel-panel--matching .h-intel-panel__hero-img {
    height: clamp(4.25rem, 9.8vw, 5.65rem);
}

html.mk-public[data-theme="light"] .h-intel-panel__hero-img {
    mix-blend-mode: multiply;
    filter: brightness(1.06) saturate(1.05);
}

.h-intel-panel__hero-glow {
    position: absolute;
    inset: -8px;
    border-radius: inherit;
    border: 1px solid rgba(167, 139, 250, 0.2);
    opacity: 0.6;
}

.h-intel-panel__hero--art .h-intel-panel__hero-glow {
    pointer-events: none;
}

.h-intel-panel__title {
    margin: 0 0 0.2rem;
    font-size: clamp(0.94rem, 2vw, 1.05rem);
    font-weight: 800;
    line-height: 1.35;
    color: #f8fafc;
}

.h-intel-panel__desc {
    margin: 0;
    font-size: 0.72rem;
    line-height: 1.55;
    color: #94a3b8;
}

.h-intel-panel__body {
    flex: 1;
    display: flex;
    flex-direction: column;
}

/* Summary column */
.h-intel-summary {
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
    flex: 1;
}

.h-intel-summary__box {
    padding: 0.6rem 0.68rem;
    border-radius: 12px;
    border: 1px solid rgba(148, 163, 184, 0.14);
    background: rgba(8, 12, 22, 0.72);
}

.h-intel-summary__box--ai {
    border-color: rgba(167, 139, 250, 0.55);
    background: linear-gradient(160deg, rgba(124, 58, 237, 0.18), rgba(15, 23, 42, 0.85));
    box-shadow: 0 0 32px rgba(124, 58, 237, 0.22);
}

.h-intel-summary__box-head {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    margin-bottom: 0.35rem;
    font-size: 0.72rem;
    font-weight: 700;
    color: #c4b5fd;
}

.h-intel-summary__box-head i {
    opacity: 0.9;
}

.h-intel-summary__raw-lines {
    margin: 0;
    padding: 0;
    list-style: none;
    font-size: 0.72rem;
    line-height: 1.6;
    color: #cbd5e1;
}

.h-intel-summary__flow {
    display: flex;
    justify-content: center;
    padding: 0.15rem 0;
}

.h-intel-summary__flow-btn {
    width: 1.75rem;
    height: 1.75rem;
    display: grid;
    place-items: center;
    border-radius: 10px;
    font-size: 0.7rem;
    color: #e9d5ff;
    background: rgba(124, 58, 237, 0.25);
    border: 1px solid rgba(167, 139, 250, 0.45);
    box-shadow: 0 0 20px rgba(124, 58, 237, 0.45);
}

.h-intel-summary__insights {
    margin: 0;
    padding: 0;
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
}

.h-intel-summary__insights li {
    display: grid;
    grid-template-columns: auto 1fr auto;
    gap: 0.5rem;
    align-items: start;
}

.h-intel-summary__insight-icon {
    width: 1.6rem;
    height: 1.6rem;
    display: grid;
    place-items: center;
    border-radius: 50%;
    font-size: 0.72rem;
    color: #c4b5fd;
    background: rgba(124, 58, 237, 0.2);
    border: 1px solid rgba(167, 139, 250, 0.25);
}

.h-intel-summary__insight-copy strong {
    display: block;
    font-size: 0.78rem;
    font-weight: 800;
    line-height: 1.35;
    color: #f1f5f9;
}

.h-intel-summary__insight-copy p {
    margin: 0.12rem 0 0;
    font-size: 0.68rem;
    line-height: 1.5;
    color: #94a3b8;
}

.h-intel-summary__check {
    margin-top: 0.2rem;
    font-size: 0.65rem;
    color: #34d399;
}

/* Matching column */
.h-intel-match {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    flex: 1;
    font-size: 0.74rem;
}

.h-intel-match__need {
    padding: 0.55rem 0.65rem;
    border-radius: 11px;
    background: rgba(8, 12, 22, 0.8);
    border: 1px solid rgba(148, 163, 184, 0.12);
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.h-intel-match__need-label {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    font-size: 0.68rem;
    font-weight: 700;
    color: #a5b4fc;
}

.h-intel-match__need strong {
    font-size: 0.82rem;
    color: #f8fafc;
}

.h-intel-match__need em {
    font-style: normal;
    color: #94a3b8;
    line-height: 1.5;
}

.h-intel-match__viz {
    position: relative;
    min-height: 4.65rem;
    padding: 0.2rem 0;
}

.h-intel-match__viz-need {
    display: none;
}

.h-intel-match__viz-hub {
    position: relative;
    display: flex;
    justify-content: center;
    padding: 0.35rem 0 1.35rem;
}

.h-intel-match__pill {
    position: relative;
    z-index: 2;
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.35rem 0.75rem;
    border-radius: 999px;
    font-size: 0.68rem;
    font-weight: 800;
    color: #ede9fe;
    background: linear-gradient(90deg, rgba(124, 58, 237, 0.55), rgba(99, 102, 241, 0.45));
    border: 1px solid rgba(196, 181, 253, 0.45);
    box-shadow: 0 0 22px rgba(124, 58, 237, 0.4);
}

.h-intel-match__viz-line {
    position: absolute;
    width: 1px;
    height: 2.25rem;
    background: repeating-linear-gradient(180deg, rgba(148, 163, 184, 0.5) 0 4px, transparent 4px 8px);
    top: 2.1rem;
    opacity: 0.7;
}

.h-intel-match__viz-line--1 { inset-inline-start: 28%; transform: rotate(22deg); }
.h-intel-match__viz-line--2 { left: 50%; transform: translateX(-50%); }
.h-intel-match__viz-line--3 { inset-inline-end: 28%; transform: rotate(-22deg); }

.h-intel-match__viz-thumbs {
    display: flex;
    justify-content: center;
    gap: 0.45rem;
    margin-top: -0.35rem;
}

.h-intel-match__viz-thumbs span {
    width: 2rem;
    height: 2rem;
    border-radius: 8px;
    background: linear-gradient(145deg, rgba(51, 65, 85, 0.9), rgba(30, 41, 59, 0.95));
    border: 1px solid rgba(148, 163, 184, 0.2);
    box-shadow: 0 8px 20px -10px rgba(0, 0, 0, 0.6);
}

.h-intel-match__list-title {
    display: block;
    font-size: 0.68rem;
    font-weight: 700;
    color: #94a3b8;
    margin-bottom: 0.4rem;
}

.h-intel-match__list {
    margin: 0;
    padding: 0;
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
}

.h-intel-match__list li {
    display: grid;
    grid-template-columns: auto 1fr auto auto;
    gap: 0.4rem;
    align-items: center;
    padding: 0.38rem 0.45rem;
    border-radius: 9px;
    background: rgba(8, 12, 22, 0.65);
    border: 1px solid rgba(148, 163, 184, 0.1);
}

.h-intel-match__thumb {
    width: 1.85rem;
    height: 1.85rem;
    border-radius: 8px;
    background: linear-gradient(145deg, #475569, #334155);
    border: 1px solid rgba(148, 163, 184, 0.15);
}

.h-intel-match__meta strong {
    display: block;
    font-size: 0.72rem;
    font-weight: 700;
    color: #f1f5f9;
    line-height: 1.35;
}

.h-intel-match__meta span {
    font-size: 0.65rem;
    color: #94a3b8;
}

.h-intel-match__badge {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0.2rem 0.45rem;
    border-radius: 999px;
    font-size: 0.58rem;
    font-weight: 800;
    white-space: nowrap;
}

.h-intel-match__badge--high {
    color: #6ee7b7;
    background: rgba(16, 185, 129, 0.15);
    border: 1px solid rgba(52, 211, 153, 0.35);
}

.h-intel-match__badge--good {
    color: #93c5fd;
    background: rgba(59, 130, 246, 0.12);
    border: 1px solid rgba(96, 165, 250, 0.35);
}

.h-intel-match__badge--near {
    color: #fdba74;
    background: rgba(245, 158, 11, 0.12);
    border: 1px solid rgba(251, 191, 36, 0.35);
}

.h-intel-match__badge-bars {
    display: inline-flex;
    gap: 1px;
    align-items: flex-end;
    height: 0.55rem;
}

.h-intel-match__badge-bars i {
    display: block;
    width: 2px;
    border-radius: 1px;
    background: currentColor;
}

.h-intel-match__badge--high .h-intel-match__badge-bars i:nth-child(1) { height: 35%; opacity: 0.5; }
.h-intel-match__badge--high .h-intel-match__badge-bars i:nth-child(2) { height: 65%; opacity: 0.75; }
.h-intel-match__badge--high .h-intel-match__badge-bars i:nth-child(3) { height: 100%; }

.h-intel-match__badge--good .h-intel-match__badge-bars i:nth-child(1) { height: 40%; opacity: 0.55; }
.h-intel-match__badge--good .h-intel-match__badge-bars i:nth-child(2) { height: 75%; }
.h-intel-match__badge--good .h-intel-match__badge-bars i:nth-child(3) { height: 100%; opacity: 0.25; }

.h-intel-match__badge--near .h-intel-match__badge-bars i:nth-child(1) { height: 55%; }
.h-intel-match__badge--near .h-intel-match__badge-bars i:nth-child(2),
.h-intel-match__badge--near .h-intel-match__badge-bars i:nth-child(3) { height: 55%; opacity: 0.25; }

.h-intel-match__chev {
    font-size: 0.55rem;
    color: #64748b;
}

.h-intel-match__need,
.h-intel-match__pill,
.h-intel-match__list li,
.h-intel-match__viz-thumbs span {
    transition:
        border-color 0.45s ease,
        box-shadow 0.45s ease,
        transform 0.45s ease,
        background 0.45s ease,
        opacity 0.45s ease;
}

.h-intel-match.is-cycle-need .h-intel-match__need {
    border-color: rgba(167, 139, 250, 0.45);
    box-shadow: 0 0 24px rgba(124, 58, 237, 0.2);
}

.h-intel-match.is-cycle-hub .h-intel-match__pill {
    transform: scale(1.06);
    box-shadow: 0 0 28px rgba(124, 58, 237, 0.45);
}

.h-intel-match.is-cycle-hub .h-intel-match__viz-thumbs span {
    opacity: 0.95;
    transform: translateY(-2px);
}

.h-intel-match.is-cycle-list-0 .h-intel-match__list li:nth-child(1),
.h-intel-match.is-cycle-list-1 .h-intel-match__list li:nth-child(2),
.h-intel-match.is-cycle-list-2 .h-intel-match__list li:nth-child(3) {
    border-color: rgba(52, 211, 153, 0.35);
    background: rgba(16, 185, 129, 0.1);
    box-shadow: 0 0 20px rgba(16, 185, 129, 0.12);
    transform: translateX(-2px);
}

.h-intel-summary__box,
.h-intel-summary__flow-btn,
.h-intel-summary__insights li {
    transition:
        border-color 0.45s ease,
        box-shadow 0.45s ease,
        transform 0.45s ease,
        opacity 0.45s ease;
}

.h-intel-summary.is-cycle-raw .h-intel-summary__box--raw {
    border-color: rgba(148, 163, 184, 0.35);
    box-shadow: 0 0 22px rgba(148, 163, 184, 0.12);
}

.h-intel-summary.is-cycle-flow .h-intel-summary__flow-btn {
    animation: h-intel-summary-flow-spin 0.9s ease-in-out infinite;
}

@keyframes h-intel-summary-flow-spin {
    0%, 100% { transform: translateY(0); box-shadow: 0 0 20px rgba(124, 58, 237, 0.45); }
    50% { transform: translateY(3px); box-shadow: 0 0 28px rgba(124, 58, 237, 0.55); }
}

.h-intel-summary.is-cycle-ai .h-intel-summary__box--ai {
    border-color: rgba(167, 139, 250, 0.65);
    box-shadow: 0 0 32px rgba(124, 58, 237, 0.28);
}

.h-intel-summary.is-cycle-insight-0 .h-intel-summary__insights li:nth-child(1),
.h-intel-summary.is-cycle-insight-1 .h-intel-summary__insights li:nth-child(2),
.h-intel-summary.is-cycle-insight-2 .h-intel-summary__insights li:nth-child(3) {
    transform: translateX(-3px);
}

.h-intel-summary.is-cycle-insight-0 .h-intel-summary__insights li:nth-child(1) .h-intel-summary__check,
.h-intel-summary.is-cycle-insight-1 .h-intel-summary__insights li:nth-child(2) .h-intel-summary__check,
.h-intel-summary.is-cycle-insight-2 .h-intel-summary__insights li:nth-child(3) .h-intel-summary__check {
    color: #34d399;
    transform: scale(1.2);
}

/* Voice column */
.h-intel-voice {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    flex: 1;
}

.h-intel-voice__demos {
    flex: 1;
}

.h-intel-voice__bar {
    display: grid;
    grid-template-columns: auto 1fr auto;
    align-items: center;
    gap: 0.45rem;
    padding: 0.5rem 0.65rem;
    border-radius: 12px;
    background: rgba(8, 12, 22, 0.85);
    border: 1px solid rgba(148, 163, 184, 0.14);
    margin-bottom: 0.35rem;
    transition:
        border-color 0.35s ease,
        box-shadow 0.35s ease,
        background 0.35s ease;
}

.h-intel-voice__bar.is-recording {
    border-color: rgba(244, 63, 94, 0.45);
    background: linear-gradient(135deg, rgba(30, 27, 75, 0.92), rgba(8, 12, 22, 0.92));
    box-shadow:
        0 0 0 1px rgba(244, 63, 94, 0.12) inset,
        0 0 28px rgba(244, 63, 94, 0.18),
        0 0 40px rgba(124, 58, 237, 0.12);
    animation: h-intel-bar-rec 1.6s ease-in-out infinite;
}

.h-intel-voice__bar.is-complete {
    border-color: rgba(148, 163, 184, 0.18);
    box-shadow: none;
    animation: none;
}

@keyframes h-intel-bar-rec {
    0%, 100% { box-shadow: 0 0 0 1px rgba(244, 63, 94, 0.1) inset, 0 0 22px rgba(244, 63, 94, 0.14); }
    50% { box-shadow: 0 0 0 1px rgba(244, 63, 94, 0.18) inset, 0 0 32px rgba(244, 63, 94, 0.26); }
}

.h-intel-voice__wave {
    display: flex;
    align-items: flex-end;
    gap: 2px;
    height: 1.25rem;
    opacity: 0.55;
    transition: opacity 0.3s ease;
}

.h-intel-voice__bar.is-recording .h-intel-voice__wave {
    opacity: 1;
}

.h-intel-voice__wave span {
    width: 2px;
    border-radius: 2px;
    background: linear-gradient(180deg, #60a5fa, #3b82f6);
    animation: h-intel-wave 1.1s ease-in-out infinite;
    animation-play-state: paused;
}

.h-intel-voice__bar.is-recording .h-intel-voice__wave span {
    animation-play-state: running;
}

.h-intel-voice__wave span:nth-child(odd) { animation-delay: 0.08s; }
.h-intel-voice__wave span:nth-child(3n) { animation-delay: 0.22s; }

@keyframes h-intel-wave {
    0%, 100% { height: 0.25rem; opacity: 0.5; }
    50% { height: 1.1rem; opacity: 1; }
}

.h-intel-voice__utterance {
    margin: 0;
    min-height: 2.15em;
    font-size: 0.7rem;
    line-height: 1.55;
    color: #f1f5f9;
}

.h-intel-voice__typed {
    white-space: normal;
}

.h-intel-voice__caret {
    display: inline-block;
    width: 2px;
    height: 0.95em;
    margin-inline-start: 2px;
    vertical-align: -0.12em;
    border-radius: 1px;
    background: #a78bfa;
    opacity: 0;
}

.h-intel-voice__bar.is-recording .h-intel-voice__caret {
    opacity: 1;
    animation: h-intel-caret 0.85s step-end infinite;
}

@keyframes h-intel-caret {
    0%, 100% { opacity: 1; }
    50% { opacity: 0; }
}

.h-intel-voice__mic {
    display: grid;
    place-items: center;
    flex-shrink: 0;
    font-size: 0.82rem;
    color: #c4b5fd;
    background: transparent;
    border: none;
    box-shadow: none;
    transition: color 0.3s ease, opacity 0.3s ease, transform 0.3s ease;
}

.h-intel-voice__mic.is-live {
    color: #fb7185;
    background: transparent;
    border: none;
    box-shadow: none;
    animation: h-intel-mic-live 1.1s ease-in-out infinite;
}

@keyframes h-intel-mic-live {
    0%, 100% { opacity: 0.88; transform: scale(1); }
    50% { opacity: 1; transform: scale(1.1); }
}

.h-intel-voice__demo.is-voice-busy .h-intel-voice__chips {
    opacity: 0.45;
    filter: saturate(0.7);
    transition: opacity 0.35s ease, filter 0.35s ease;
}

.h-intel-voice__demo.is-transcribed .h-intel-voice__chips {
    opacity: 1;
    filter: none;
}

.h-intel-voice__chips {
    display: flex;
    flex-wrap: wrap;
    gap: 0.3rem;
    margin-bottom: 0.4rem;
}

.h-intel-voice__chip {
    padding: 0.22rem 0.5rem;
    border-radius: 999px;
    font-size: 0.62rem;
    font-weight: 600;
    color: #94a3b8;
    background: rgba(30, 41, 59, 0.65);
    border: 1px solid rgba(148, 163, 184, 0.12);
}

.h-intel-voice__success {
    display: grid;
    grid-template-columns: auto 1fr auto;
    gap: 0.45rem;
    align-items: center;
    padding: 0.52rem 0.6rem;
    border-radius: 12px;
    border: 1px solid rgba(148, 163, 184, 0.16);
    background: rgba(8, 12, 22, 0.72);
    box-shadow: none;
    opacity: 0.42;
    transform: translateY(6px) scale(0.98);
    filter: saturate(0.55);
    transition:
        opacity 0.4s ease,
        transform 0.4s ease,
        border-color 0.4s ease,
        box-shadow 0.4s ease,
        background 0.4s ease,
        filter 0.4s ease;
}

.h-intel-voice__success.is-processing {
    opacity: 0.88;
    transform: translateY(2px) scale(0.99);
    filter: saturate(0.85);
    border-color: rgba(167, 139, 250, 0.35);
    background: linear-gradient(135deg, rgba(124, 58, 237, 0.1), rgba(8, 12, 22, 0.88));
    box-shadow: 0 0 24px rgba(124, 58, 237, 0.15);
    animation: h-intel-success-process 0.85s ease-in-out infinite;
}

.h-intel-voice__success.is-confirmed {
    opacity: 1;
    transform: translateY(0) scale(1);
    filter: none;
    border-color: rgba(52, 211, 153, 0.42);
    background: linear-gradient(135deg, rgba(16, 185, 129, 0.14), rgba(8, 12, 22, 0.88));
    box-shadow: 0 0 32px rgba(16, 185, 129, 0.22);
    animation: none;
}

@keyframes h-intel-success-process {
    0%, 100% { box-shadow: 0 0 18px rgba(124, 58, 237, 0.12); }
    50% { box-shadow: 0 0 28px rgba(124, 58, 237, 0.22); }
}

.h-intel-voice__success-check {
    position: relative;
    width: 1.75rem;
    height: 1.75rem;
    display: grid;
    place-items: center;
    border-radius: 50%;
    font-size: 0.65rem;
    color: #fff;
    background: rgba(51, 65, 85, 0.85);
    border: 1px solid rgba(148, 163, 184, 0.2);
    box-shadow: none;
    transform: scale(0.72);
    opacity: 0.35;
}

.h-intel-voice__success.is-processing .h-intel-voice__success-check {
    opacity: 0.65;
    transform: scale(0.88);
    background: rgba(124, 58, 237, 0.25);
    border-color: rgba(167, 139, 250, 0.35);
    animation: h-intel-check-wait 0.7s ease-in-out infinite;
}

.h-intel-voice__success.is-confirmed .h-intel-voice__success-check {
    background: linear-gradient(145deg, #34d399, #10b981);
    border-color: transparent;
    box-shadow: 0 0 20px rgba(52, 211, 153, 0.55);
    animation: h-intel-check-pop 0.55s cubic-bezier(0.34, 1.4, 0.64, 1) forwards;
}

.h-intel-voice__success-check-ring {
    position: absolute;
    inset: -5px;
    border-radius: 50%;
    border: 2px solid rgba(52, 211, 153, 0.55);
    opacity: 0;
    transform: scale(0.6);
}

.h-intel-voice__success.is-confirmed .h-intel-voice__success-check-ring {
    animation: h-intel-check-ring 0.65s ease-out 0.08s forwards;
}

.h-intel-voice__success.is-confirmed .h-intel-voice__success-check i {
    animation: h-intel-check-icon 0.35s ease-out 0.12s both;
}

@keyframes h-intel-check-wait {
    0%, 100% { transform: scale(0.88); }
    50% { transform: scale(0.94); }
}

@keyframes h-intel-check-pop {
    0% { transform: scale(0.5); opacity: 0.4; }
    70% { transform: scale(1.12); opacity: 1; }
    100% { transform: scale(1); opacity: 1; }
}

@keyframes h-intel-check-ring {
    0% { opacity: 0.85; transform: scale(0.65); }
    100% { opacity: 0; transform: scale(1.35); }
}

@keyframes h-intel-check-icon {
    0% { transform: scale(0) rotate(-18deg); opacity: 0; }
    100% { transform: scale(1) rotate(0); opacity: 1; }
}

.h-intel-voice__success-copy {
    opacity: 0.35;
    transform: translateY(4px);
}

.h-intel-voice__success.is-processing .h-intel-voice__success-copy {
    opacity: 0.55;
}

.h-intel-voice__success.is-confirmed .h-intel-voice__success-copy {
    animation: h-intel-success-copy-in 0.45s ease 0.18s forwards;
}

@keyframes h-intel-success-copy-in {
    from { opacity: 0.35; transform: translateY(6px); }
    to { opacity: 1; transform: translateY(0); }
}

.h-intel-voice__success-copy strong {
    display: block;
    font-size: 0.78rem;
    font-weight: 800;
    color: #ecfdf5;
}

.h-intel-voice__success-copy p {
    margin: 0.15rem 0 0;
    font-size: 0.65rem;
    color: #94a3b8;
}

.h-intel-voice__success-cal {
    width: 1.85rem;
    height: 1.85rem;
    display: grid;
    place-items: center;
    border-radius: 10px;
    font-size: 0.75rem;
    color: #64748b;
    background: rgba(30, 41, 59, 0.65);
    border: 1px solid rgba(148, 163, 184, 0.12);
    transform: scale(0.85);
    opacity: 0.35;
}

.h-intel-voice__success.is-processing .h-intel-voice__success-cal {
    opacity: 0.5;
    color: #a5b4fc;
    background: rgba(124, 58, 237, 0.12);
}

.h-intel-voice__success.is-confirmed .h-intel-voice__success-cal {
    color: #6ee7b7;
    background: rgba(16, 185, 129, 0.14);
    border-color: rgba(52, 211, 153, 0.28);
    animation: h-intel-cal-pop 0.5s cubic-bezier(0.34, 1.25, 0.64, 1) 0.32s forwards;
}

@keyframes h-intel-cal-pop {
    0% { transform: scale(0.6) rotate(-8deg); opacity: 0; }
    100% { transform: scale(1) rotate(0); opacity: 1; }
}

.h-intel-voice__tabs {
    display: flex;
    gap: 0.4rem;
    margin-top: auto;
    padding-top: 0.2rem;
}

.h-intel-voice__tab {
    flex: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.3rem;
    min-height: 2.05rem;
    border-radius: 9px;
    border: 1px solid rgba(148, 163, 184, 0.18);
    background: rgba(15, 23, 42, 0.55);
    color: #94a3b8;
    font-size: 0.68rem;
    font-weight: 700;
    cursor: pointer;
    transition: border-color 0.2s ease, box-shadow 0.2s ease, color 0.2s ease;
}

.h-intel-voice__tab i {
    font-size: 0.55rem;
}

.h-intel-voice__tab.is-active {
    border-color: transparent;
    color: #fff;
    background: linear-gradient(90deg, #7c3aed, #6366f1);
    box-shadow: 0 0 24px rgba(124, 58, 237, 0.45);
}

.h-intel-voice__tab:focus-visible {
    outline: 2px solid rgba(167, 139, 250, 0.55);
    outline-offset: 2px;
}

@media (max-width: 991px) {
    .h-intel__panels {
        grid-template-columns: 1fr;
        max-width: 26rem;
        margin-inline: auto;
    }

    .h-intel-match__viz {
        min-height: 4.5rem;
    }
}

/* ─── Product ecosystem bento ─── */
.h-ecosystem {
    padding: var(--section-space-xl) 0;
    background:
        radial-gradient(ellipse 70% 50% at 50% 0%, rgba(124, 58, 237, 0.05), transparent 65%);
}

.h-ecosystem__head {
    text-align: center;
    max-width: var(--h-measure);
    margin: 0 auto var(--section-space-md);
}

.h-ecosystem__kicker {
    display: inline-block;
    margin-bottom: 0.5rem;
    font-size: var(--h-type-eyebrow);
    font-weight: 700;
    color: var(--h-violet);
}

.h-ecosystem__title {
    margin: 0 0 0.5rem;
    font-size: var(--h-type-h2);
    font-weight: 800;
    line-height: 1.28;
}

.h-ecosystem__subtitle {
    margin: 0;
    font-size: var(--h-type-lead);
    line-height: 1.7;
    color: #64748b;
}

.h-bento {
    display: grid;
    grid-template-columns: repeat(12, minmax(0, 1fr));
    gap: 0.85rem;
    grid-auto-rows: minmax(8.5rem, auto);
}

.h-bento__cell {
    position: relative;
    display: grid;
    grid-template-columns: 1fr;
    border-radius: 18px;
    overflow: hidden;
    border: 1px solid rgba(15, 23, 42, 0.06);
    background: #fff;
    min-height: 8.5rem;
}

html.mk-public[data-theme="dark"] .h-bento__cell {
    background: rgba(15, 23, 42, 0.65);
    border-color: rgba(148, 163, 184, 0.12);
}

.h-bento__cell--hero { grid-column: span 7; grid-row: span 2; }
.h-bento__cell--wide { grid-column: span 5; }
.h-bento__cell--tall { grid-column: span 5; grid-row: span 2; }
.h-bento__cell--compact { grid-column: span 4; }

.h-bento__body {
    position: relative;
    z-index: 2;
    padding: 1rem 1.05rem;
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
    max-width: 22rem;
}

.h-bento__icon {
    width: 2rem;
    height: 2rem;
    display: grid;
    place-items: center;
    border-radius: 9px;
    background: var(--h-violet-soft);
    color: var(--h-violet);
    font-size: 0.85rem;
}

.h-bento__title {
    margin: 0;
    font-size: 1rem;
    font-weight: 800;
}

.h-bento__outcome {
    margin: 0;
    font-size: 0.82rem;
    line-height: 1.6;
    color: #64748b;
}

.h-bento__benefits {
    margin: 0.25rem 0 0;
    padding: 0;
    list-style: none;
    font-size: 0.75rem;
    color: #475569;
}

.h-bento__benefits li::before {
    content: '·';
    margin-inline-end: 0.35rem;
    color: var(--h-violet);
}

.h-bento__link {
    margin-top: 0.35rem;
    font-size: 0.78rem;
    font-weight: 700;
    color: var(--h-violet);
    text-decoration: none;
}

.h-bento__visual {
    position: absolute;
    inset: 0;
    margin: 0;
    pointer-events: none;
}

.h-bento__img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: left center;
    opacity: 0.35;
    mask-image: linear-gradient(90deg, transparent 0%, #000 45%);
}

.h-bento__cell--hero .h-bento__img {
    opacity: 0.42;
    mask-image: linear-gradient(90deg, transparent 5%, #000 50%);
}

@media (max-width: 991px) {
    .h-bento {
        grid-template-columns: 1fr;
        grid-auto-rows: auto;
    }

    .h-bento__cell--hero,
    .h-bento__cell--wide,
    .h-bento__cell--tall,
    .h-bento__cell--compact {
        grid-column: 1;
        grid-row: auto;
        min-height: 10rem;
    }
}

/* ─── Pricing polish ─── */
.h-pricing {
    padding-block: var(--section-space-xl);
    background: linear-gradient(180deg, transparent, rgba(124, 58, 237, 0.04) 40%, transparent);
}

.h-pricing__hint {
    margin: 0.65rem auto 0;
    max-width: 28rem;
    font-size: 0.82rem;
    font-weight: 600;
    color: #64748b;
    line-height: 1.55;
}

.h-pricing__grid {
    align-items: stretch;
}

.h-pricing__card--featured {
    position: relative;
    box-shadow: 0 28px 60px -32px rgba(16, 185, 129, 0.25);
}

.h-pricing__card--featured::before {
    content: 'مزیت رقابتی';
    position: absolute;
    top: 0.85rem;
    inset-inline-end: 0.85rem;
    font-size: 0.65rem;
    font-weight: 800;
    padding: 0.2rem 0.5rem;
    border-radius: 999px;
    background: rgba(16, 185, 129, 0.12);
    color: #059669;
}

.mk-home-body .mk-faq-item summary:focus-visible {
    outline: 2px solid rgba(124, 58, 237, 0.45);
    outline-offset: 2px;
    border-radius: 8px;
}

/* ─── Reduced motion ─── */
@media (prefers-reduced-motion: reduce) {
    .h-stats__live-dot {
        animation: none;
    }

    .h-story__scene,
    .h-flow__node-dot,
    .h-flow__node-icon,
    .h-flow__node-chevron,
    .h-flow__footer-progress-fill,
    .h-pillar-panel,
    .h-story__timeline-fill,
    .h-story__narrative,
    .h-story__montage,
    .h-story__img,
    .h-story__mobile-card,
    .h-compare__outcome--old,
    .h-compare__outcome--new,
    .h-intel-voice__wave span,
    .h-intel-voice__success.is-processing,
    .h-intel-voice__success.is-confirmed .h-intel-voice__success-check,
    .h-intel-voice__success.is-confirmed .h-intel-voice__success-check-ring,
    .h-intel-voice__success.is-confirmed .h-intel-voice__success-check i,
    .h-intel-voice__success.is-confirmed .h-intel-voice__success-copy,
    .h-intel-voice__success.is-confirmed .h-intel-voice__success-cal,
    .h-pillar {
        transition: none !important;
        animation: none !important;
    }

    .h-story__scene,
    .h-story__mobile-card,
    .h-story__narrative,
    .h-story__montage {
        opacity: 1;
        transform: none;
    }

    .h-story__scene {
        opacity: 1;
        transform: none;
        position: relative;
    }

    .h-story__scene:not(:first-child) {
        margin-top: 2rem;
    }

    .h-pillar-panel {
        opacity: 1;
        transform: none;
    }

    .h-compare__outcome--old,
    .h-compare__outcome--new {
        opacity: 1;
        transform: none;
    }

    .h-intel-voice__success.is-confirmed {
        opacity: 1;
        transform: none;
        filter: none;
    }

    .h-intel-voice__success.is-confirmed .h-intel-voice__success-check,
    .h-intel-voice__success.is-confirmed .h-intel-voice__success-copy,
    .h-intel-voice__success.is-confirmed .h-intel-voice__success-cal {
        opacity: 1;
        transform: none;
    }

    .h-intel-voice__success.is-confirmed .h-intel-voice__success-check {
        background: linear-gradient(145deg, #34d399, #10b981);
    }

    .h-intel-panel,
    .h-intel-panel::after,
    .h-intel-panel__hero-stage,
    .h-intel-panel__hero--art .h-intel-panel__hero-glow,
    .h-intel-panel__hero-img {
        animation: none !important;
        transform: none !important;
    }

    .h-intel-voice__mic.is-live {
        animation: none;
    }

    .h-intel-summary.is-cycle-flow .h-intel-summary__flow-btn {
        animation: none;
    }

    .h-intel-panel__hero-img {
        transform: translateZ(0);
    }
}

@media (prefers-reduced-motion: reduce) and (min-width: 992px) {
    .h-story__rail {
        height: auto !important;
    }

    .h-story__pin {
        position: relative !important;
        height: auto !important;
    }

    .h-story__rail .h-story__pin {
        display: none;
    }

    .h-story__mobile {
        display: flex !important;
    }
}