.evo-showcase {
        --showcase-grid: color-mix(in srgb, var(--ta-border-soft) 66%, transparent);
        position: relative;
        isolation: isolate;
    }

    .evo-showcase::before {
        position: fixed;
        inset: 0;
        z-index: -1;
        pointer-events: none;
        content: "";
        background:
            radial-gradient(circle at 10% 12%, rgb(var(--ta-primary-rgb) / 0.09), transparent 28rem),
            radial-gradient(circle at 88% 28%, rgb(var(--ta-primary-rgb) / 0.06), transparent 24rem);
    }

    .evo-showcase-hero {
        position: relative;
        overflow: hidden;
        background:
            linear-gradient(var(--showcase-grid) 1px, transparent 1px),
            linear-gradient(90deg, var(--showcase-grid) 1px, transparent 1px),
            linear-gradient(140deg, color-mix(in srgb, var(--ta-bg-card) 90%, var(--ta-primary) 10%), var(--ta-bg-card));
        background-size: 42px 42px, 42px 42px, auto;
    }

    .evo-showcase-hero::after {
        position: absolute;
        right: -9rem;
        bottom: -12rem;
        width: 30rem;
        height: 30rem;
        border: 1px solid rgb(var(--ta-primary-rgb) / 0.2);
        border-radius: 999px;
        box-shadow: 0 0 0 4rem rgb(var(--ta-primary-rgb) / 0.035), 0 0 0 8rem rgb(var(--ta-primary-rgb) / 0.025);
        content: "";
    }

    .evo-showcase-kicker,
    .evo-showcase-pill {
        display: inline-flex;
        align-items: center;
        gap: 0.5rem;
        border: 1px solid color-mix(in srgb, var(--ta-primary) 24%, var(--ta-border-soft));
        border-radius: 999px;
        background: color-mix(in srgb, var(--ta-bg-surface) 90%, var(--ta-primary) 10%);
        color: var(--ta-primary);
    }

    .evo-showcase-kicker::before {
        width: 0.5rem;
        height: 0.5rem;
        border-radius: 999px;
        background: var(--ta-primary);
        box-shadow: 0 0 0 0.3rem rgb(var(--ta-primary-rgb) / 0.12);
        content: "";
    }

    .evo-showcase-display {
        max-width: 48rem;
        letter-spacing: -0.055em;
        text-wrap: balance;
    }

    .evo-showcase-display span {
        color: var(--ta-primary);
    }

    .evo-showcase-map {
        position: relative;
        min-height: 26rem;
        border: 1px solid var(--ta-border-soft);
        border-radius: 1.5rem;
        background:
            radial-gradient(circle at center, rgb(var(--ta-primary-rgb) / 0.15), transparent 43%),
            color-mix(in srgb, var(--ta-bg-surface) 92%, transparent);
        box-shadow: inset 0 1px 0 rgb(255 255 255 / 0.08);
    }

    .evo-showcase-map::before,
    .evo-showcase-map::after {
        position: absolute;
        inset: 50% auto auto 50%;
        border: 1px dashed color-mix(in srgb, var(--ta-primary) 32%, var(--ta-border-soft));
        border-radius: 999px;
        content: "";
        transform: translate(-50%, -50%);
    }

    .evo-showcase-map::before {
        width: 16rem;
        height: 16rem;
    }

    .evo-showcase-map::after {
        width: 22rem;
        height: 22rem;
        opacity: 0.55;
    }

    .evo-showcase-core {
        position: absolute;
        inset: 50% auto auto 50%;
        z-index: 2;
        display: grid;
        width: 8.25rem;
        height: 8.25rem;
        place-items: center;
        border: 1px solid color-mix(in srgb, var(--ta-primary) 34%, var(--ta-border-soft));
        border-radius: 2rem;
        background: var(--ta-bg-card);
        box-shadow: 0 1.5rem 4rem rgb(15 23 42 / 0.18), 0 0 0 0.75rem rgb(var(--ta-primary-rgb) / 0.07);
        transform: translate(-50%, -50%) rotate(-4deg);
    }

    .evo-showcase-core img {
        max-width: 5.4rem;
        max-height: 3.6rem;
        object-fit: contain;
        transform: rotate(4deg);
    }

    .evo-showcase-node {
        position: absolute;
        z-index: 3;
        display: flex;
        align-items: center;
        gap: 0.55rem;
        min-width: 7.8rem;
        padding: 0.7rem 0.85rem;
        border: 1px solid var(--ta-border-soft);
        border-radius: 1rem;
        background: var(--ta-bg-card);
        box-shadow: var(--ta-shadow-soft);
        font-size: 0.78rem;
        font-weight: 750;
    }

    .evo-showcase-node .evo-icon-mask {
        width: 1.1rem;
        height: 1.1rem;
        color: var(--ta-primary);
    }

    .evo-showcase-node--one { top: 12%; left: 8%; }
    .evo-showcase-node--two { top: 16%; right: 7%; }
    .evo-showcase-node--three { right: 6%; bottom: 14%; }
    .evo-showcase-node--four { bottom: 12%; left: 8%; }

    .evo-showcase-metric {
        position: relative;
        min-height: 7.5rem;
        overflow: hidden;
        border: 1px solid var(--ta-border-soft);
        border-radius: 1.2rem;
        background: var(--ta-bg-card);
        padding: 1.15rem;
    }

    .evo-showcase-metric::after {
        position: absolute;
        right: -1.25rem;
        bottom: -1.75rem;
        width: 5rem;
        height: 5rem;
        border-radius: 999px;
        background: rgb(var(--ta-primary-rgb) / 0.08);
        content: "";
    }

    .evo-showcase-section-heading {
        max-width: 48rem;
    }

    .evo-showcase-section-heading h2 {
        letter-spacing: -0.035em;
        text-wrap: balance;
    }

    .evo-showcase-feature,
    .evo-showcase-project,
    .evo-showcase-principle {
        transition: transform 180ms ease, border-color 180ms ease, box-shadow 180ms ease;
    }

    .evo-showcase-feature:hover,
    .evo-showcase-project:hover,
    .evo-showcase-principle:hover {
        border-color: color-mix(in srgb, var(--ta-primary) 42%, var(--ta-border-soft));
        box-shadow: 0 1.25rem 2.5rem rgb(15 23 42 / 0.09);
        transform: translateY(-3px);
    }

    .evo-showcase-icon {
        display: grid;
        width: 3rem;
        height: 3rem;
        flex: 0 0 auto;
        place-items: center;
        border: 1px solid color-mix(in srgb, var(--ta-primary) 22%, var(--ta-border-soft));
        border-radius: 1rem;
        background: rgb(var(--ta-primary-rgb) / 0.1);
        color: var(--ta-primary);
    }

    .evo-showcase-icon .evo-icon-mask {
        width: 1.35rem;
        height: 1.35rem;
    }

    .evo-showcase-ecosystem {
        display: flex;
        min-height: 10rem;
        flex-direction: column;
        border: 1px solid var(--ta-border-soft);
        border-radius: 1.15rem;
        background: color-mix(in srgb, var(--ta-bg-card) 94%, var(--ta-primary) 6%);
        padding: 1rem;
    }

    .evo-showcase-ecosystem .evo-icon-mask {
        width: 1.2rem;
        height: 1.2rem;
        color: var(--ta-primary);
    }

    .evo-showcase-project {
        display: flex;
        min-height: 18rem;
        flex-direction: column;
        overflow: hidden;
        border: 1px solid var(--ta-border-soft);
        border-radius: 1.35rem;
        background: var(--ta-bg-card);
    }

    .evo-showcase-project__visual {
        position: relative;
        display: flex;
        min-height: 8.5rem;
        align-items: center;
        justify-content: center;
        overflow: hidden;
        background:
            linear-gradient(135deg, rgb(var(--ta-primary-rgb) / 0.15), transparent),
            color-mix(in srgb, var(--ta-bg-surface-2) 90%, var(--ta-primary) 10%);
    }

    .evo-showcase-project__visual::before,
    .evo-showcase-project__visual::after {
        position: absolute;
        border: 1px solid rgb(var(--ta-primary-rgb) / 0.2);
        border-radius: 999px;
        content: "";
    }

    .evo-showcase-project__visual::before { width: 8rem; height: 8rem; }
    .evo-showcase-project__visual::after { width: 12rem; height: 12rem; opacity: 0.55; }

    .evo-showcase-project__visual .evo-icon-mask {
        z-index: 1;
        width: 2.5rem;
        height: 2.5rem;
        color: var(--ta-primary);
    }

    .evo-showcase-step {
        position: relative;
        padding-left: 4.25rem;
    }

    .evo-showcase-step__number {
        position: absolute;
        top: 0;
        left: 0;
        display: grid;
        width: 3rem;
        height: 3rem;
        place-items: center;
        border: 1px solid color-mix(in srgb, var(--ta-primary) 28%, var(--ta-border-soft));
        border-radius: 1rem;
        background: rgb(var(--ta-primary-rgb) / 0.1);
        color: var(--ta-primary);
        font-weight: 900;
    }

    .evo-showcase-cta {
        position: relative;
        overflow: hidden;
        background:
            radial-gradient(circle at 86% 24%, rgb(var(--ta-primary-rgb) / 0.24), transparent 18rem),
            linear-gradient(135deg, color-mix(in srgb, var(--ta-bg-card) 84%, var(--ta-primary) 16%), var(--ta-bg-card));
    }

    .evo-project-gallery-hero {
        position: relative;
        overflow: hidden;
        background:
            linear-gradient(var(--showcase-grid) 1px, transparent 1px),
            linear-gradient(90deg, var(--showcase-grid) 1px, transparent 1px),
            linear-gradient(140deg, color-mix(in srgb, var(--ta-bg-card) 90%, var(--ta-primary) 10%), var(--ta-bg-card));
        background-size: 42px 42px, 42px 42px, auto;
    }

    .evo-project-gallery-hero::after {
        position: absolute;
        right: -5rem;
        bottom: -8rem;
        width: 24rem;
        height: 24rem;
        border: 1px solid rgb(var(--ta-primary-rgb) / 0.2);
        border-radius: 999px;
        box-shadow: 0 0 0 3rem rgb(var(--ta-primary-rgb) / 0.035), 0 0 0 6rem rgb(var(--ta-primary-rgb) / 0.025);
        content: "";
    }

    .evo-project-gallery__summary {
        min-width: 13rem;
        border: 1px solid color-mix(in srgb, var(--ta-primary) 24%, var(--ta-border-soft));
        border-radius: 1.25rem;
        background: color-mix(in srgb, var(--ta-bg-surface) 90%, var(--ta-primary) 10%);
        padding: 1.25rem;
    }

    .evo-project-gallery__availability {
        display: flex;
        align-items: flex-start;
        gap: 0.65rem;
        border-left: 2px solid var(--ta-primary);
        padding-left: 1rem;
    }

    .evo-project-gallery__card {
        min-height: 23rem;
    }

    .evo-project-gallery__platform {
        display: flex;
        gap: 1rem;
        min-height: 9.5rem;
        border: 1px solid var(--ta-border-soft);
        border-radius: 1.15rem;
        background: color-mix(in srgb, var(--ta-bg-card) 94%, var(--ta-primary) 6%);
        padding: 1rem;
        transition: border-color 180ms ease, transform 180ms ease;
    }

    .evo-project-gallery__platform:hover {
        border-color: color-mix(in srgb, var(--ta-primary) 42%, var(--ta-border-soft));
        transform: translateY(-2px);
    }

    html[data-theme="dark"] .evo-showcase-map,
    html[data-theme="dark"] .evo-showcase-project__visual,
    html[data-theme="dark"] .evo-showcase-hero,
    html[data-theme="dark"] .evo-project-gallery-hero,
    html[data-theme="dark"] .evo-showcase-cta {
        background-color: var(--ta-bg-card);
    }

    @media (max-width: 639px) {
        .evo-showcase-display { letter-spacing: -0.042em; }
        .evo-showcase-map { min-height: 22rem; }
        .evo-showcase-map::before { width: 13rem; height: 13rem; }
        .evo-showcase-map::after { width: 18rem; height: 18rem; }
        .evo-showcase-core { width: 7rem; height: 7rem; }
        .evo-showcase-node { min-width: auto; padding: 0.6rem 0.7rem; font-size: 0.7rem; }
        .evo-showcase-node--one { top: 9%; left: 4%; }
        .evo-showcase-node--two { top: 12%; right: 3%; }
        .evo-showcase-node--three { right: 3%; bottom: 10%; }
        .evo-showcase-node--four { bottom: 8%; left: 4%; }
        .evo-project-gallery__summary { min-width: 0; }
    }

    @media (prefers-reduced-motion: reduce) {
        .evo-showcase-feature,
        .evo-showcase-project,
        .evo-showcase-principle,
        .evo-project-gallery__platform { transition: none; }
    }

.evo-showcase-project-logo { position: relative; z-index: 1; width: 4rem; height: 4rem; object-fit: contain; }