:root {
    --wbv-blue: #2457f5;
    --wbv-blue-light: #5f86ff;
    --wbv-blue-soft: #eaf1ff;
    --wbv-dark: #06101d;
    --wbv-dark-two: #0b1b33;
    --wbv-dark-three: #14325c;
    --wbv-text: #101a2d;
    --wbv-text-soft: #60718b;
    --wbv-white: #ffffff;
    --wbv-border: rgba(20, 43, 78, 0.10);
    --wbv-shadow: 0 22px 65px rgba(10, 27, 54, 0.11);
}

.wbv-page {
    position: relative;
    overflow: hidden;
    color: var(--wbv-text);
    background: #ffffff;
}

    .wbv-page *,
    .wbv-page *::before,
    .wbv-page *::after {
        box-sizing: border-box;
    }

    .wbv-page .container-fluid {
        width: 100%;
        max-width: 1840px;
        margin-inline: auto;
    }

    .wbv-page p {
        text-align: left;
        text-wrap: pretty;
    }

.wbv-kicker,
.wbv-section-tag,
.wbv-guidance-tag,
.wbv-form-card-head > span,
.wbv-success-modal > span {
    display: inline-flex;
    align-items: center;
    width: fit-content;
    border-radius: 999px;
    font-size: 0.76rem;
    font-weight: 850;
    letter-spacing: 0.085em;
    line-height: 1;
    text-transform: uppercase;
}

.wbv-section-tag {
    margin-bottom: 1rem;
    padding: 0.58rem 0.86rem;
    border: 1px solid rgba(36, 87, 245, 0.16);
    color: #3567f7;
    background: rgba(36, 87, 245, 0.065);
}

.wbv-tag-dark {
    border-color: rgba(255,255,255,.15);
    color: #dce6ff;
    background: rgba(255,255,255,.07);
}

.wbv-section-head h2,
.wbv-evaluation-copy h2,
.wbv-readiness-copy h2,
.wbv-form-heading h2,
.wbv-closing-card h2 {
    margin: 0;
    font-family: "Manrope", sans-serif;
    font-weight: 800;
    letter-spacing: -0.045em;
    text-wrap: balance;
}

.wbv-section-head h2 {
    max-width: 890px;
    font-size: clamp(2.25rem, 4vw, 4.1rem);
    line-height: 1.03;
}

.wbv-section-head > p,
.wbv-evaluation-copy > p,
.wbv-readiness-copy > p,
.wbv-form-heading > p,
.wbv-closing-card > p {
    color: var(--wbv-text-soft);
    font-size: 1.02rem;
    line-height: 1.82;
}

.wbv-head-split {
    display: grid;
    grid-template-columns: minmax(0, 1.12fr) minmax(320px, .72fr);
    align-items: end;
    gap: clamp(2rem, 5vw, 6rem);
    margin-bottom: 2.2rem;
}

    .wbv-head-split > p {
        margin: 0 0 .3rem;
    }

.wbv-head-centered {
    max-width: 1050px;
    margin: 0 auto 2.7rem;
    text-align: center;
}

    .wbv-head-centered .wbv-section-tag {
        margin-inline: auto;
    }

    .wbv-head-centered h2 {
        margin-inline: auto;
        color: #fff;
    }

    .wbv-head-centered > p {
        max-width: 820px;
        margin: 1rem auto 0;
        color: rgba(255,255,255,.70);
        text-align: center;
    }

/* HERO */
.wbv-hero {
    position: relative;
    overflow: hidden;
    padding: 2.5rem 0 2.2rem;
    color: #fff;
    background: radial-gradient(circle at 13% 5%, rgba(79,124,255,.17), transparent 27%), radial-gradient(circle at 89% 54%, rgba(68,117,255,.26), transparent 31%), linear-gradient(135deg, #06101d 0%, #09172b 52%, #143a82 100%);
}

    .wbv-hero::before,
    .wbv-hero::after {
        content: "";
        position: absolute;
        pointer-events: none;
        border: 1px solid rgba(91,139,255,.20);
        border-radius: 50%;
    }

    .wbv-hero::before {
        width: 540px;
        height: 540px;
        top: -330px;
        left: 6%;
    }

    .wbv-hero::after {
        width: 680px;
        height: 680px;
        right: -390px;
        bottom: -470px;
    }

.wbv-hero-grid {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: minmax(0, 1.05fr) minmax(470px, .95fr);
    align-items: center;
    gap: clamp(2.6rem, 5vw, 6rem);
}

.wbv-hero-copy {
    padding: clamp(1rem, 2vw, 2rem) 0;
}

.wbv-kicker {
    margin-bottom: 1.35rem;
    padding: .68rem .98rem;
    border: 1px solid rgba(255,255,255,.16);
    color: #dbe5ff;
    background: rgba(255,255,255,.075);
}

.wbv-hero-copy h1 {
    max-width: 930px;
    margin: 0;
    font-family: "Manrope", sans-serif;
    font-size: clamp(3rem, 5.5vw, 6rem);
    font-weight: 800;
    letter-spacing: -.06em;
    line-height: .97;
    text-wrap: balance;
}

.wbv-hero-copy > p {
    max-width: 870px;
    margin: 1.4rem 0 0;
    color: rgba(255,255,255,.74);
    font-size: clamp(1rem, 1.35vw, 1.13rem);
    line-height: 1.88;
}

.wbv-actions {
    display: flex;
    flex-wrap: wrap;
    gap: .85rem;
    margin-top: 1.65rem;
}

.wbv-btn-primary,
.wbv-btn-outline {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .6rem;
    min-height: 52px;
    border-radius: 999px;
    padding: .88rem 1.45rem;
    font-weight: 800;
    line-height: 1.2;
    transition: transform 180ms ease, background 180ms ease, border-color 180ms ease, box-shadow 180ms ease;
}

.wbv-btn-primary {
    border: 0;
    color: #fff;
    background: linear-gradient(135deg, var(--wbv-blue), var(--wbv-blue-light));
    box-shadow: 0 16px 36px rgba(36,87,245,.28);
}

    .wbv-btn-primary:hover {
        color: #fff;
        transform: translateY(-2px);
        box-shadow: 0 20px 42px rgba(36,87,245,.34);
    }

.wbv-btn-outline {
    border: 1px solid rgba(255,255,255,.20);
    color: #fff;
    background: rgba(255,255,255,.055);
}

    .wbv-btn-outline:hover {
        color: #fff;
        transform: translateY(-2px);
        background: rgba(255,255,255,.10);
    }

.wbv-network {
    position: relative;
    min-height: 500px;
    overflow: hidden;
    border: 1px solid rgba(255,255,255,.16);
    border-radius: 36px;
    background: radial-gradient(circle at 50% 50%, rgba(50,94,190,.30), transparent 38%), linear-gradient(135deg, rgba(255,255,255,.08), rgba(255,255,255,.025));
    box-shadow: 0 34px 90px rgba(0,0,0,.24);
}

    .wbv-network::before,
    .wbv-network::after {
        content: "";
        position: absolute;
        inset: 12% 15%;
        border: 1px solid rgba(127,164,255,.18);
        border-radius: 50%;
    }

    .wbv-network::after {
        inset: 25% 28%;
    }

.wbv-network-core,
.wbv-network-node,
.wbv-network-status {
    position: absolute;
    z-index: 2;
}

.wbv-network-core {
    top: 50%;
    left: 50%;
    width: min(390px, 64%);
    padding: 2rem 1.6rem;
    border: 1px solid rgba(255,255,255,.11);
    border-radius: 30px;
    text-align: center;
    background: rgba(4,14,29,.88);
    box-shadow: 0 22px 55px rgba(0,0,0,.24);
    transform: translate(-50%, -50%);
}

    .wbv-network-core > span {
        display: inline-flex;
        margin-bottom: .8rem;
        padding: .52rem .8rem;
        border-radius: 999px;
        color: #dce6ff;
        background: rgba(61,104,220,.24);
        font-size: .72rem;
        font-weight: 850;
        letter-spacing: .06em;
        text-transform: uppercase;
    }

    .wbv-network-core h2 {
        margin: 0;
        color: #fff;
        font-family: "Manrope", sans-serif;
        font-size: clamp(1.35rem, 2.1vw, 2.05rem);
        font-weight: 800;
        line-height: 1.2;
    }

    .wbv-network-core p {
        margin: .8rem auto 0;
        color: rgba(255,255,255,.65);
        font-size: .86rem;
        line-height: 1.6;
        text-align: center;
    }

.wbv-network-node {
    display: flex;
    align-items: center;
    gap: .65rem;
    min-width: 165px;
    padding: .68rem .85rem;
    border: 1px solid rgba(255,255,255,.13);
    border-radius: 18px;
    color: #fff;
    background: rgba(5,15,31,.90);
    box-shadow: 0 16px 34px rgba(0,0,0,.20);
    font-size: .84rem;
    font-weight: 800;
}

    .wbv-network-node i {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 42px;
        height: 42px;
        border-radius: 13px;
        color: #d9e4ff;
        background: rgba(45,86,185,.40);
        flex: 0 0 auto;
    }

.wbv-node-top {
    top: 8%;
    left: 50%;
    transform: translateX(-50%);
}

.wbv-node-left {
    top: 50%;
    left: 4%;
    transform: translateY(-50%);
}

.wbv-node-right {
    top: 50%;
    right: 4%;
    transform: translateY(-50%);
}

.wbv-node-bottom {
    left: 50%;
    bottom: 12%;
    transform: translateX(-50%);
}

.wbv-network-status {
    right: 1.4rem;
    bottom: 1.1rem;
    display: flex;
    align-items: center;
    gap: .45rem;
    color: rgba(255,255,255,.72);
    font-size: .70rem;
    font-weight: 750;
}

    .wbv-network-status span {
        width: 8px;
        height: 8px;
        border-radius: 50%;
        background: #35d3a0;
        box-shadow: 0 0 0 5px rgba(53,211,160,.10);
    }

.wbv-signal-grid {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1rem;
    margin-top: 1.5rem;
}

    .wbv-signal-grid article {
        display: flex;
        align-items: flex-start;
        gap: .9rem;
        min-height: 118px;
        padding: 1.25rem;
        border: 1px solid rgba(255,255,255,.12);
        border-radius: 24px;
        background: linear-gradient(135deg, rgba(255,255,255,.065), rgba(70,117,225,.13));
    }

    .wbv-signal-grid i,
    .wbv-fit-stack article > i,
    .wbv-evaluation-matrix i,
    .wbv-readiness-list i,
    .wbv-guidance-points i {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        flex: 0 0 auto;
    }

    .wbv-signal-grid i {
        width: 48px;
        height: 48px;
        border-radius: 15px;
        color: #dbe5ff;
        background: rgba(56,100,211,.35);
    }

    .wbv-signal-grid h3 {
        margin: 0;
        color: #fff;
        font-size: .98rem;
        font-weight: 800;
    }

    .wbv-signal-grid p {
        margin: .42rem 0 0;
        color: rgba(255,255,255,.65);
        font-size: .84rem;
        line-height: 1.55;
    }

/* PARTNERSHIP FIT */
.wbv-fit-section {
    position: relative;
    padding: clamp(4rem, 5.5vw, 6.5rem) 0;
    background: radial-gradient(circle at 10% 35%, rgba(36,87,245,.075), transparent 25%), linear-gradient(180deg, #fff 0%, #f5f8fd 100%);
}

.wbv-fit-layout {
    display: grid;
    grid-template-columns: minmax(0, 1.08fr) minmax(380px, .92fr);
    gap: 1rem;
}

.wbv-fit-feature,
.wbv-fit-stack article {
    border: 1px solid var(--wbv-border);
    box-shadow: var(--wbv-shadow);
}

.wbv-fit-feature {
    min-height: 430px;
    padding: clamp(2rem, 4vw, 4rem);
    border-radius: 34px;
    background: radial-gradient(circle at top right, rgba(63,106,240,.14), transparent 30%), #fff;
}

.wbv-fit-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 70px;
    height: 70px;
    margin-bottom: 1.2rem;
    border-radius: 22px;
    color: #2d61f5;
    background: #eaf1ff;
    font-size: 1.45rem;
}

.wbv-fit-feature > span,
.wbv-fit-stack article span {
    display: block;
    color: #4875f7;
    font-size: .72rem;
    font-weight: 850;
    letter-spacing: .07em;
    text-transform: uppercase;
}

.wbv-fit-feature h3 {
    max-width: 760px;
    margin: .8rem 0 1.4rem;
    font-family: "Manrope", sans-serif;
    font-size: clamp(1.8rem, 3vw, 3.1rem);
    font-weight: 800;
    letter-spacing: -.04em;
    line-height: 1.08;
}

.wbv-fit-feature ul {
    display: grid;
    gap: .75rem;
    margin: 0;
    padding: 0;
    list-style: none;
}

.wbv-fit-feature li {
    position: relative;
    padding-left: 1.5rem;
    color: #40516c;
    line-height: 1.65;
}

    .wbv-fit-feature li::before {
        content: "";
        position: absolute;
        top: .7rem;
        left: 0;
        width: 8px;
        height: 8px;
        border-radius: 50%;
        background: #3f70fa;
    }

.wbv-fit-stack {
    display: grid;
    gap: 1rem;
}

    .wbv-fit-stack article {
        display: grid;
        grid-template-columns: auto minmax(0, 1fr);
        align-items: start;
        gap: 1rem;
        min-height: 132px;
        padding: 1.35rem;
        border-radius: 26px;
        background: #fff;
    }

        .wbv-fit-stack article:nth-child(2) {
            color: #fff;
            background: linear-gradient(135deg, #0a1830, #183c7d);
        }

        .wbv-fit-stack article > i {
            width: 52px;
            height: 52px;
            border-radius: 16px;
            color: #3569f7;
            background: #eaf1ff;
            font-size: 1.1rem;
        }

        .wbv-fit-stack article:nth-child(2) > i {
            color: #dbe5ff;
            background: rgba(63,111,226,.34);
        }

    .wbv-fit-stack h3 {
        margin: .42rem 0 0;
        font-size: 1.08rem;
        font-weight: 800;
    }

    .wbv-fit-stack p {
        margin: .45rem 0 0;
        color: var(--wbv-text-soft);
        line-height: 1.65;
    }

    .wbv-fit-stack article:nth-child(2) p {
        color: rgba(255,255,255,.68);
    }

/* PROCESS */
.wbv-process-section {
    position: relative;
    overflow: hidden;
    padding: clamp(4.2rem, 5.5vw, 6.5rem) 0;
    color: #fff;
    background: radial-gradient(circle at 85% 25%, rgba(54,109,232,.22), transparent 30%), linear-gradient(135deg, #06101d 0%, #0a1a31 58%, #153b79 100%);
}

.wbv-process-grid {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: .85rem;
}

    .wbv-process-grid article {
        position: relative;
        min-height: 240px;
        padding: 1.35rem;
        border: 1px solid rgba(255,255,255,.11);
        border-radius: 26px;
        background: rgba(255,255,255,.055);
        backdrop-filter: blur(10px);
    }

.wbv-process-number {
    position: absolute;
    top: 1rem;
    right: 1rem;
    color: rgba(255,255,255,.32);
    font-size: .72rem;
    font-weight: 850;
}

.wbv-process-grid i {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 54px;
    height: 54px;
    margin-bottom: 1.4rem;
    border-radius: 17px;
    color: #dce6ff;
    background: rgba(59,105,218,.35);
}

.wbv-process-grid h3 {
    margin: 0;
    font-size: 1.12rem;
    font-weight: 800;
}

.wbv-process-grid p {
    margin: .6rem 0 0;
    color: rgba(255,255,255,.66);
    line-height: 1.7;
}

/* EVALUATION */
.wbv-evaluation-section {
    padding: clamp(4.2rem, 5.5vw, 6.5rem) 0;
    background: radial-gradient(circle at 90% 15%, rgba(36,87,245,.08), transparent 22%), #fff;
}

.wbv-evaluation-grid {
    display: grid;
    grid-template-columns: minmax(350px, .78fr) minmax(0, 1.22fr);
    align-items: center;
    gap: clamp(2rem, 5vw, 6rem);
}

.wbv-evaluation-copy h2 {
    max-width: 700px;
    font-size: clamp(2.25rem, 4vw, 4rem);
    line-height: 1.03;
}

.wbv-evaluation-copy > p {
    max-width: 690px;
    margin: 1.2rem 0 0;
}

.wbv-evaluation-note {
    display: flex;
    align-items: flex-start;
    gap: .75rem;
    max-width: 680px;
    margin-top: 1.4rem;
    padding: 1rem 1.1rem;
    border: 1px solid rgba(36,87,245,.12);
    border-radius: 18px;
    color: #385074;
    background: rgba(36,87,245,.055);
    line-height: 1.6;
}

    .wbv-evaluation-note i {
        color: #3265f6;
        flex: 0 0 auto;
    }

.wbv-evaluation-matrix {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .9rem;
}

    .wbv-evaluation-matrix article {
        display: grid;
        grid-template-columns: auto minmax(0, 1fr);
        align-items: start;
        gap: .9rem;
        min-height: 138px;
        padding: 1.2rem;
        border: 1px solid var(--wbv-border);
        border-radius: 24px;
        background: #f8faff;
    }

    .wbv-evaluation-matrix i {
        width: 48px;
        height: 48px;
        border-radius: 15px;
        color: #3366f5;
        background: #e8efff;
    }

    .wbv-evaluation-matrix h3 {
        margin: 0;
        font-size: 1rem;
        font-weight: 800;
    }

    .wbv-evaluation-matrix p {
        margin: .45rem 0 0;
        color: var(--wbv-text-soft);
        font-size: .9rem;
        line-height: 1.6;
    }

    .wbv-evaluation-matrix .wbv-matrix-highlight {
        color: #fff;
        background: linear-gradient(135deg, #0b1a31, #2457f5);
    }

        .wbv-evaluation-matrix .wbv-matrix-highlight i {
            color: #e4ebff;
            background: rgba(255,255,255,.13);
        }

        .wbv-evaluation-matrix .wbv-matrix-highlight p {
            color: rgba(255,255,255,.70);
        }

/* READINESS */
.wbv-readiness-section {
    padding: 0 0 clamp(4.2rem, 5.5vw, 6.5rem);
    background: #fff;
}

.wbv-readiness-card {
    display: grid;
    grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr);
    gap: clamp(2rem, 5vw, 5rem);
    padding: clamp(2rem, 4vw, 4rem);
    border-radius: 38px;
    color: #fff;
    background: radial-gradient(circle at top right, rgba(85,132,255,.30), transparent 35%), linear-gradient(135deg, #07111f 0%, #0f284b 60%, #1d4ed8 100%);
    box-shadow: 0 30px 80px rgba(8,25,52,.20);
}

.wbv-readiness-copy h2 {
    max-width: 700px;
    color: #fff;
    font-size: clamp(2.1rem, 3.6vw, 3.7rem);
    line-height: 1.04;
}

.wbv-readiness-copy > p {
    max-width: 730px;
    margin: 1.1rem 0 0;
    color: rgba(255,255,255,.70);
}

.wbv-readiness-list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .85rem;
}

    .wbv-readiness-list > div {
        display: grid;
        grid-template-columns: auto minmax(0, 1fr);
        gap: .8rem;
        min-height: 122px;
        padding: 1rem;
        border: 1px solid rgba(255,255,255,.11);
        border-radius: 22px;
        background: rgba(4,13,27,.42);
    }

    .wbv-readiness-list i {
        width: 44px;
        height: 44px;
        border-radius: 14px;
        color: #dce6ff;
        background: rgba(61,108,223,.36);
    }

    .wbv-readiness-list span {
        color: rgba(255,255,255,.66);
        font-size: .86rem;
        line-height: 1.55;
    }

    .wbv-readiness-list strong {
        display: block;
        margin-bottom: .28rem;
        color: #fff;
        font-size: .94rem;
    }

/* FORM */
.wbv-form-section {
    position: relative;
    padding: clamp(4.2rem, 5.5vw, 6.5rem) 0;
    background: radial-gradient(circle at 8% 15%, rgba(36,87,245,.085), transparent 22%), radial-gradient(circle at 90% 80%, rgba(36,87,245,.06), transparent 24%), linear-gradient(180deg, #f7faff 0%, #fff 100%);
}

.wbv-form-heading {
    max-width: 960px;
    margin-bottom: 2rem;
}

    .wbv-form-heading h2 {
        max-width: 900px;
        font-size: clamp(2.35rem, 4vw, 4.15rem);
        line-height: 1.03;
    }

    .wbv-form-heading > p {
        max-width: 760px;
        margin: 1rem 0 0;
    }

.wbv-form-layout {
    display: grid;
    grid-template-columns: minmax(300px, .34fr) minmax(0, 1fr);
    align-items: start;
    gap: 1.1rem;
}

.wbv-guidance-card {
    position: sticky;
    top: 112px;
    overflow: hidden;
    padding: 1.8rem;
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 30px;
    color: #fff;
    background: radial-gradient(circle at top right, rgba(72,119,238,.22), transparent 30%), linear-gradient(145deg, #07111f 0%, #102b53 100%);
    box-shadow: 0 24px 70px rgba(8,25,52,.17);
}

.wbv-guidance-tag,
.wbv-form-card-head > span {
    margin-bottom: 1rem;
    padding: .52rem .78rem;
}

.wbv-guidance-tag {
    border: 1px solid rgba(255,255,255,.14);
    color: #dce6ff;
    background: rgba(255,255,255,.07);
}

.wbv-guidance-card h3 {
    margin: 0;
    font-family: "Manrope", sans-serif;
    font-size: clamp(1.75rem, 2.6vw, 2.6rem);
    font-weight: 800;
    letter-spacing: -.04em;
    line-height: 1.08;
}

.wbv-guidance-card > p {
    margin: 1rem 0 0;
    color: rgba(255,255,255,.68);
    line-height: 1.75;
}

.wbv-guidance-points {
    display: grid;
    gap: .75rem;
    margin-top: 1.25rem;
}

    .wbv-guidance-points > div {
        display: grid;
        grid-template-columns: auto minmax(0, 1fr);
        gap: .75rem;
        padding: .85rem;
        border: 1px solid rgba(255,255,255,.10);
        border-radius: 18px;
        background: rgba(255,255,255,.055);
    }

    .wbv-guidance-points i {
        width: 42px;
        height: 42px;
        border-radius: 14px;
        color: #dce6ff;
        background: rgba(61,106,215,.34);
    }

    .wbv-guidance-points span {
        color: rgba(255,255,255,.65);
        font-size: .83rem;
        line-height: 1.55;
    }

    .wbv-guidance-points strong {
        display: block;
        margin-bottom: .25rem;
        color: #fff;
        font-size: .92rem;
    }

.wbv-guidance-flow {
    display: grid;
    grid-template-columns: auto auto auto auto auto auto auto;
    align-items: center;
    justify-content: space-between;
    gap: .35rem;
    margin-top: 1rem;
    padding: .8rem;
    border-radius: 16px;
    background: rgba(4,13,27,.45);
    font-size: .66rem;
    font-weight: 800;
}

    .wbv-guidance-flow i {
        color: #8ca9ff;
    }

.wbv-form-card {
    padding: clamp(1.4rem, 2.6vw, 2.4rem);
    border: 1px solid var(--wbv-border);
    border-radius: 32px;
    background: rgba(255,255,255,.94);
    box-shadow: 0 24px 75px rgba(8,25,52,.10);
}

.wbv-form-card-head {
    padding-bottom: 1.35rem;
    border-bottom: 1px solid rgba(20,43,78,.08);
    margin-bottom: 1.45rem;
}

    .wbv-form-card-head > span {
        border: 1px solid rgba(36,87,245,.15);
        color: #3567f7;
        background: rgba(36,87,245,.06);
    }

    .wbv-form-card-head h3 {
        margin: 0;
        font-family: "Manrope", sans-serif;
        font-size: clamp(1.8rem, 3vw, 3rem);
        font-weight: 800;
        letter-spacing: -.04em;
    }

    .wbv-form-card-head p {
        margin: .6rem 0 0;
        color: var(--wbv-text-soft);
        line-height: 1.7;
    }

.wbv-field {
    min-width: 0;
}

.wbv-label {
    margin-bottom: .55rem;
    color: #233c66;
    font-size: .80rem;
    font-weight: 800;
}

.wbv-input {
    width: 100%;
    min-height: 54px;
    border: 1px solid rgba(28,54,102,.13);
    border-radius: 14px;
    color: #162b4f;
    background-color: #fbfcff;
    box-shadow: none !important;
    font-size: .95rem;
}

    .wbv-input:focus {
        border-color: rgba(57,104,255,.50);
        background-color: #fff;
        box-shadow: 0 0 0 .22rem rgba(57,104,255,.08) !important;
    }

.wbv-textarea {
    min-height: 170px;
    resize: vertical;
    line-height: 1.65;
}

.wbv-field-help {
    display: block;
    margin-top: .42rem;
    color: #71809a;
    font-size: .73rem;
    line-height: 1.45;
}

.wbv-field .text-danger {
    display: block;
    margin-top: .38rem;
    color: #c92d43 !important;
    font-size: .75rem;
    font-weight: 700;
    line-height: 1.45;
}

.wbv-invalid,
.wbv-input.input-validation-error,
.wbv-input.is-invalid {
    border-color: #d9364f !important;
    background-image: none !important;
    box-shadow: 0 0 0 .18rem rgba(217,54,79,.06) !important;
}

.wbv-phone-control {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: stretch;
    width: 100%;
    min-width: 0;
}

.wbv-phone-prefix {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 64px;
    padding: .78rem .75rem;
    border: 1px solid rgba(28,54,102,.13);
    border-right: 0;
    border-radius: 14px 0 0 14px;
    color: #203c73;
    background: linear-gradient(180deg, #edf3ff 0%, #e6efff 100%);
    font-size: .94rem;
    font-weight: 850;
    line-height: 1;
    white-space: nowrap;
}

.wbv-phone-control .wbv-phone-input {
    min-width: 0;
    border-radius: 0 14px 14px 0;
}

.wbv-phone-control:focus-within .wbv-phone-prefix {
    border-color: rgba(57,104,255,.48);
    color: #1747ca;
    background: #e9f0ff;
}

.wbv-phone-control:has(.wbv-phone-input.wbv-invalid) .wbv-phone-prefix,
.wbv-phone-control:has(.wbv-phone-input.input-validation-error) .wbv-phone-prefix,
.wbv-phone-control:has(.wbv-phone-input.is-invalid) .wbv-phone-prefix {
    border-color: #d9364f;
    color: #b42335;
    background: #fff3f4;
}

.wbv-validation-summary {
    display: none;
    margin: 0 0 1rem;
    color: #b42335;
}

    .wbv-validation-summary.validation-summary-errors,
    .wbv-validation-summary.wbv-validation-summary-visible,
    .wbv-validation-summary:not(:empty) {
        display: block;
        padding: .9rem 1rem;
        border: 1px solid rgba(220,53,69,.18);
        border-radius: 15px;
        background: rgba(220,53,69,.055);
    }

    .wbv-validation-summary ul {
        margin: 0;
        padding-left: 1.1rem;
    }

.wbv-summary-content {
    display: flex;
    align-items: flex-start;
    gap: .6rem;
    font-size: .82rem;
    font-weight: 750;
    line-height: 1.5;
}

.wbv-submit-panel {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.2rem;
    padding: 1rem;
    border: 1px solid rgba(36,87,245,.11);
    border-radius: 18px;
    background: rgba(36,87,245,.045);
}

    .wbv-submit-panel p {
        max-width: 760px;
        margin: 0;
        color: #62738d;
        font-size: .78rem;
        line-height: 1.6;
    }

.wbv-submit-loading {
    display: none;
    align-items: center;
    justify-content: center;
    gap: .55rem;
}

.wbv-btn-primary.wbv-is-submitting {
    cursor: wait;
    pointer-events: none;
    opacity: .92;
}

    .wbv-btn-primary.wbv-is-submitting .wbv-submit-label {
        display: none;
    }

    .wbv-btn-primary.wbv-is-submitting .wbv-submit-loading {
        display: inline-flex;
    }

/* CLOSING */
.wbv-closing-section {
    padding: 0 0 clamp(4.2rem, 5.5vw, 6.5rem);
    background: #fff;
}

.wbv-closing-card {
    display: grid;
    grid-template-columns: minmax(0, 1.2fr) minmax(300px, .65fr) auto;
    align-items: center;
    gap: clamp(1.5rem, 4vw, 4rem);
    padding: clamp(1.8rem, 3vw, 3rem);
    border-radius: 32px;
    color: #fff;
    background: linear-gradient(135deg, #07111f 0%, #102b51 60%, #2457f5 100%);
    box-shadow: 0 26px 70px rgba(8,25,52,.17);
}

    .wbv-closing-card h2 {
        color: #fff;
        font-size: clamp(1.75rem, 3vw, 3rem);
        line-height: 1.08;
    }

    .wbv-closing-card > p {
        margin: 0;
        color: rgba(255,255,255,.68);
    }

    .wbv-closing-card .wbv-btn-outline {
        white-space: nowrap;
    }

/* SUCCESS */
.wbv-success-overlay {
    position: fixed;
    z-index: 99999;
    inset: 0;
    display: grid;
    place-items: center;
    padding: 1rem;
    background: rgba(2,9,21,.78);
    backdrop-filter: blur(12px);
}

.wbv-success-modal {
    width: min(760px, 100%);
    padding: clamp(1.7rem, 4vw, 3.3rem);
    border: 1px solid rgba(255,255,255,.15);
    border-radius: 34px;
    color: #fff;
    text-align: center;
    background: radial-gradient(circle at top right, rgba(89,135,255,.28), transparent 35%), linear-gradient(145deg, #07111f, #173b7c);
    box-shadow: 0 40px 110px rgba(0,0,0,.40);
}

.wbv-success-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 76px;
    height: 76px;
    margin-bottom: 1.25rem;
    border-radius: 50%;
    background: linear-gradient(135deg, #21bb88, #35d4a4);
    box-shadow: 0 18px 38px rgba(47,201,154,.25);
    font-size: 1.8rem;
}

.wbv-success-modal > span {
    margin: 0 auto 1rem;
    padding: .55rem .85rem;
    border: 1px solid rgba(255,255,255,.14);
    color: #dce6ff;
    background: rgba(255,255,255,.07);
}

.wbv-success-modal h2 {
    max-width: 650px;
    margin: 0 auto;
    color: #fff !important;
    font-family: "Manrope", sans-serif;
    font-size: clamp(2rem, 4vw, 3.6rem);
    font-weight: 800;
    letter-spacing: -.045em;
    line-height: 1.03;
    background: none !important;
    -webkit-text-fill-color: #fff !important;
}

.wbv-success-modal > p {
    max-width: 650px;
    margin: 1rem auto 0;
    color: rgba(255,255,255,.70);
    line-height: 1.75;
    text-align: center;
}

.wbv-success-status {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: .7rem;
    margin: 1.4rem 0;
}

    .wbv-success-status > div {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: .55rem;
        min-height: 56px;
        padding: .8rem;
        border: 1px solid rgba(255,255,255,.10);
        border-radius: 16px;
        background: rgba(4,13,27,.45);
        font-size: .78rem;
        font-weight: 750;
    }

    .wbv-success-status i {
        color: #57dcb4;
    }

/* RESPONSIVE */
@media (max-width: 1399.98px) {
    .wbv-hero-grid {
        grid-template-columns: minmax(0, 1.02fr) minmax(430px, .98fr);
        gap: 2.5rem;
    }

    .wbv-network {
        min-height: 450px;
    }

    .wbv-network-node {
        min-width: 150px;
        font-size: .78rem;
    }

    .wbv-guidance-card {
        top: 100px;
    }
}

@media (max-width: 1199.98px) {
    .wbv-hero-grid,
    .wbv-fit-layout,
    .wbv-evaluation-grid,
    .wbv-readiness-card,
    .wbv-form-layout {
        grid-template-columns: 1fr;
    }

    .wbv-hero-copy {
        padding-bottom: 0;
    }

        .wbv-hero-copy h1 {
            max-width: 1050px;
        }

    .wbv-network {
        min-height: 470px;
    }

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

    .wbv-process-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .wbv-guidance-card {
        position: relative;
        top: auto;
    }

    .wbv-guidance-points {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .wbv-closing-card {
        grid-template-columns: 1fr;
    }

        .wbv-closing-card .wbv-btn-outline {
            width: fit-content;
        }
}

@media (max-width: 991.98px) {
    .wbv-head-split {
        grid-template-columns: 1fr;
        align-items: start;
        gap: 1rem;
    }

        .wbv-head-split > p {
            max-width: 850px;
        }

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

    .wbv-readiness-list {
        grid-template-columns: 1fr;
    }

    .wbv-guidance-points {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 767.98px) {
    .wbv-hero {
        padding: 1.4rem 0 1.6rem;
    }

    .wbv-hero-copy {
        padding-top: .8rem;
    }

        .wbv-hero-copy h1 {
            font-size: clamp(2.65rem, 12vw, 4.4rem);
            line-height: .99;
        }

    .wbv-actions {
        display: grid;
        grid-template-columns: 1fr;
    }

        .wbv-actions .btn {
            width: 100%;
        }

    .wbv-network {
        display: grid;
        grid-template-columns: 1fr;
        gap: .75rem;
        min-height: auto;
        padding: 1rem;
        border-radius: 28px;
    }

        .wbv-network::before,
        .wbv-network::after {
            display: none;
        }

    .wbv-network-core,
    .wbv-network-node,
    .wbv-network-status {
        position: relative;
        inset: auto;
        width: 100%;
        transform: none;
    }

    .wbv-network-core {
        order: 1;
        max-width: none;
        padding: 1.6rem 1rem;
        border-radius: 24px;
    }

    .wbv-node-top {
        order: 2;
    }

    .wbv-node-left {
        order: 3;
    }

    .wbv-node-right {
        order: 4;
    }

    .wbv-node-bottom {
        order: 5;
    }

    .wbv-network-status {
        order: 6;
        justify-content: center;
        padding: .55rem;
    }

    .wbv-signal-grid,
    .wbv-process-grid,
    .wbv-evaluation-matrix,
    .wbv-success-status {
        grid-template-columns: 1fr;
    }

        .wbv-signal-grid article,
        .wbv-process-grid article {
            min-height: auto;
        }

    .wbv-fit-feature {
        min-height: auto;
        padding: 1.6rem;
        border-radius: 28px;
    }

    .wbv-readiness-card,
    .wbv-form-card,
    .wbv-guidance-card,
    .wbv-closing-card {
        border-radius: 27px;
    }

    .wbv-readiness-card {
        padding: 1.5rem 1.1rem;
    }

    .wbv-submit-panel {
        display: grid;
        grid-template-columns: 1fr;
    }

        .wbv-submit-panel .wbv-btn-primary,
        .wbv-closing-card .wbv-btn-outline {
            width: 100%;
        }

    .wbv-guidance-flow {
        grid-template-columns: repeat(4, 1fr);
        gap: .45rem;
    }

        .wbv-guidance-flow i {
            display: none;
        }

        .wbv-guidance-flow span {
            padding: .55rem .35rem;
            border-radius: 10px;
            text-align: center;
            background: rgba(255,255,255,.055);
        }
}

@media (max-width: 419.98px) {
    .wbv-phone-prefix {
        min-width: 56px;
        padding-inline: .58rem;
        font-size: .86rem;
    }

    .wbv-form-card,
    .wbv-guidance-card {
        padding: 1.15rem;
    }
}

@media (prefers-reduced-motion: reduce) {
    .wbv-page *,
    .wbv-page *::before,
    .wbv-page *::after {
        scroll-behavior: auto !important;
        animation: none !important;
        transition: none !important;
    }
}


/* =========================================================
   FINAL HERO VISIBILITY + 14/16-INCH LAPTOP REFINEMENT
   This block affects only the Vendor page hero.
========================================================= */

.wbv-page .wbv-hero-copy h1 {
    color: #ffffff !important;
    background: none !important;
    background-image: none !important;
    -webkit-background-clip: border-box !important;
    background-clip: border-box !important;
    -webkit-text-fill-color: #ffffff !important;
    opacity: 1 !important;
    text-shadow: none !important;
}

@media (min-width: 1200px) and (max-width: 1599.98px) {
    .wbv-hero {
        padding-top: 1.7rem;
        padding-bottom: 1.55rem;
    }

    .wbv-hero-grid {
        grid-template-columns: minmax(0, 1.08fr) minmax(440px, 0.92fr);
        gap: clamp(2rem, 3.4vw, 3.6rem);
    }

    .wbv-hero-copy {
        padding-block: 0.75rem;
    }

        .wbv-hero-copy h1 {
            max-width: 760px;
            font-size: clamp(3.25rem, 4.35vw, 4.75rem);
            line-height: 0.99;
            letter-spacing: -0.052em;
        }

        .wbv-hero-copy > p {
            max-width: 790px;
            margin-top: 1.05rem;
            font-size: 0.98rem;
            line-height: 1.72;
        }

    .wbv-actions {
        margin-top: 1.15rem;
    }

    .wbv-network {
        min-height: 390px;
        border-radius: 30px;
    }

    .wbv-network-core {
        width: min(315px, 57%);
        padding: 1.35rem 1rem;
        border-radius: 25px;
    }

        .wbv-network-core > span {
            margin-bottom: 0.6rem;
            padding: 0.45rem 0.68rem;
            font-size: 0.64rem;
        }

        .wbv-network-core h2 {
            font-size: clamp(1.35rem, 1.7vw, 1.8rem);
            line-height: 1.16;
        }

        .wbv-network-core p {
            margin-top: 0.55rem;
            font-size: 0.72rem;
            line-height: 1.45;
        }

    .wbv-network-node {
        min-width: 126px;
        max-width: 158px;
        gap: 0.48rem;
        padding: 0.5rem 0.62rem;
        border-radius: 15px;
        font-size: 0.69rem;
        line-height: 1.25;
    }

        .wbv-network-node i {
            width: 35px;
            height: 35px;
            border-radius: 11px;
            font-size: 0.82rem;
        }

    .wbv-node-top {
        top: 7%;
    }

    .wbv-node-left {
        left: 2.25%;
    }

    .wbv-node-right {
        right: 2.25%;
    }

    .wbv-node-bottom {
        bottom: 9%;
    }

    .wbv-network-status {
        right: 1rem;
        bottom: 0.8rem;
        font-size: 0.62rem;
    }

    .wbv-signal-grid {
        gap: 0.75rem;
        margin-top: 1rem;
    }

        .wbv-signal-grid article {
            min-height: 94px;
            padding: 0.95rem;
            border-radius: 20px;
        }

        .wbv-signal-grid i {
            width: 42px;
            height: 42px;
            border-radius: 13px;
        }

        .wbv-signal-grid h3 {
            font-size: 0.88rem;
        }

        .wbv-signal-grid p {
            margin-top: 0.25rem;
            font-size: 0.75rem;
            line-height: 1.45;
        }
}

@media (min-width: 1200px) and (max-width: 1299.98px) {
    .wbv-hero-grid {
        grid-template-columns: minmax(0, 1.04fr) minmax(420px, 0.96fr);
        gap: 1.6rem;
    }

    .wbv-hero-copy h1 {
        font-size: clamp(3rem, 4.15vw, 3.8rem);
    }

    .wbv-network {
        min-height: 370px;
    }

    .wbv-network-node {
        min-width: 116px;
        max-width: 142px;
        font-size: 0.64rem;
    }

    .wbv-network-core {
        width: min(292px, 56%);
    }
}


/* =========================================================
   FINAL VENDOR VISIBILITY + ANTI-BOT FIELD + NODE SPACING
========================================================= */

/* Keep the honeypot available to basic bots but invisible to people. */
.wbv-page .wbv-honeypot {
    position: absolute !important;
    left: -10000px !important;
    top: auto !important;
    width: 1px !important;
    height: 1px !important;
    overflow: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
}

/* Prevent global heading effects from making dark-section text invisible. */
.wbv-page .wbv-process-grid h3,
.wbv-page .wbv-guidance-card h3,
.wbv-page .wbv-evaluation-matrix .wbv-matrix-highlight h3,
.wbv-page .wbv-network-core h2 {
    color: #ffffff !important;
    background: none !important;
    background-image: none !important;
    -webkit-background-clip: border-box !important;
    background-clip: border-box !important;
    -webkit-text-fill-color: #ffffff !important;
    opacity: 1 !important;
    text-shadow: none !important;
}

.wbv-page .wbv-process-grid p,
.wbv-page .wbv-guidance-card > p,
.wbv-page .wbv-evaluation-matrix .wbv-matrix-highlight p,
.wbv-page .wbv-network-core p {
    -webkit-text-fill-color: currentColor !important;
    opacity: 1 !important;
}

/* Keep the highlighted evaluation card completely readable. */
.wbv-page .wbv-evaluation-matrix .wbv-matrix-highlight {
    color: #ffffff !important;
}

    .wbv-page .wbv-evaluation-matrix .wbv-matrix-highlight p {
        color: rgba(255,255,255,.74) !important;
    }

/* Separate the bottom Vendor node from the center card on laptop screens. */
@media (min-width: 1200px) and (max-width: 1599.98px) {
    .wbv-page .wbv-network-core {
        top: 46.5%;
    }

    .wbv-page .wbv-node-bottom {
        bottom: 2.5%;
    }

    .wbv-page .wbv-network-core p {
        max-width: 230px;
        margin-inline: auto;
    }
}

/* Preserve spacing on wider desktop screens as well. */
@media (min-width: 1600px) {
    .wbv-page .wbv-network-core {
        top: 47.5%;
    }

    .wbv-page .wbv-node-bottom {
        bottom: 6%;
    }
}


/* =========================================================
   FINAL PROCESS, AOS AND IMMEDIATE-VALIDATION REFINEMENT
========================================================= */

/* The review-stage numbers are intentionally removed from the design.
   This fallback also hides them if an older cached Razor view remains. */
.wbv-page .wbv-process-number {
    display: none !important;
}

/* Preserve balanced spacing after removing the stage numbers. */
.wbv-page .wbv-process-grid article {
    padding-top: 1.35rem;
}

/* Immediate field-validation state used by the Vendor page script. */
.wbv-page .wbv-input {
    transition: border-color 180ms ease, background-color 180ms ease, box-shadow 180ms ease;
}

    .wbv-page .wbv-input.wbv-invalid,
    .wbv-page .wbv-input[aria-invalid="true"] {
        border-color: #d9364f !important;
        background-color: #fffafb !important;
        background-image: none !important;
        box-shadow: 0 0 0 .18rem rgba(217,54,79,.07) !important;
    }

.wbv-page .wbv-field .field-validation-error {
    display: block;
    margin-top: .38rem;
    color: #c92d43 !important;
    font-size: .75rem;
    font-weight: 750;
    line-height: 1.45;
}

.wbv-page .wbv-field .field-validation-valid:empty {
    display: none;
}

.wbv-page .wbv-validation-summary-visible {
    scroll-margin-top: 8rem;
}



/* =========================================================
   VENDOR DOCUMENT QUALIFICATION + SUCCESS REFERENCE
========================================================= */

.wbv-page .wbv-documents-panel {
    position: relative;
    overflow: hidden;
    padding: clamp(1.35rem, 2.2vw, 2rem);
    border: 1px solid rgba(36, 87, 245, 0.13);
    border-radius: 28px;
    background: radial-gradient(circle at top right, rgba(79,124,255,.10), transparent 30%), linear-gradient(180deg, #f9fbff 0%, #f2f6fd 100%);
    box-shadow: 0 18px 45px rgba(18, 32, 51, 0.07);
}

.wbv-page .wbv-documents-heading {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 1.4rem;
    padding-bottom: 1.2rem;
    border-bottom: 1px solid rgba(22, 35, 56, 0.08);
}

    .wbv-page .wbv-documents-heading > div:first-child {
        max-width: 770px;
    }

        .wbv-page .wbv-documents-heading > div:first-child > span {
            display: inline-flex;
            margin-bottom: .55rem;
            color: #2457f5;
            font-size: .72rem;
            font-weight: 800;
            letter-spacing: .10em;
            text-transform: uppercase;
        }

    .wbv-page .wbv-documents-heading h4 {
        margin: 0;
        color: #10203a;
        font-size: clamp(1.25rem, 2vw, 1.7rem);
        line-height: 1.18;
        font-weight: 800;
    }

    .wbv-page .wbv-documents-heading p {
        margin: .65rem 0 0;
        color: #617086;
        font-size: .92rem;
        line-height: 1.7;
    }

.wbv-page .wbv-document-limit {
    display: flex;
    align-items: center;
    gap: .7rem;
    flex: 0 0 auto;
    padding: .8rem .95rem;
    border: 1px solid rgba(36, 87, 245, .14);
    border-radius: 18px;
    background: rgba(255,255,255,.78);
    color: #365175;
    font-size: .78rem;
    line-height: 1.45;
}

    .wbv-page .wbv-document-limit i {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 38px;
        height: 38px;
        border-radius: 12px;
        background: #e6eeff;
        color: #2457f5;
        font-size: 1rem;
    }

.wbv-page .wbv-country-document-guidance {
    display: flex;
    align-items: flex-start;
    gap: .9rem;
    margin-top: 1.1rem;
    padding: 1rem 1.05rem;
    border: 1px solid rgba(36, 87, 245, .13);
    border-radius: 20px;
    background: #ffffff;
}

    .wbv-page .wbv-country-document-guidance > i {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 42px;
        height: 42px;
        flex: 0 0 42px;
        border-radius: 14px;
        background: #e9f0ff;
        color: #2457f5;
    }

    .wbv-page .wbv-country-document-guidance strong,
    .wbv-page .wbv-country-document-guidance span {
        display: block;
    }

    .wbv-page .wbv-country-document-guidance strong {
        color: #162338;
        font-size: .92rem;
        font-weight: 800;
    }

    .wbv-page .wbv-country-document-guidance span {
        margin-top: .22rem;
        color: #63738a;
        font-size: .82rem;
        line-height: 1.55;
    }

.wbv-page .wbv-document-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
    margin-top: 1rem;
}

.wbv-page .wbv-upload-card {
    min-width: 0;
    padding: 1rem;
    border: 1px solid rgba(22, 35, 56, 0.09);
    border-radius: 20px;
    background: rgba(255,255,255,.88);
    transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease;
}

    .wbv-page .wbv-upload-card:hover {
        transform: translateY(-2px);
        border-color: rgba(36, 87, 245, .20);
        box-shadow: 0 13px 28px rgba(18, 32, 51, .08);
    }

.wbv-page .wbv-upload-wide {
    grid-column: 1 / -1;
}

.wbv-page .wbv-upload-card-head {
    display: flex;
    align-items: center;
    gap: .75rem;
    margin-bottom: .8rem;
}

    .wbv-page .wbv-upload-card-head > i {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 42px;
        height: 42px;
        flex: 0 0 42px;
        border-radius: 14px;
        background: #e7efff;
        color: #2457f5;
    }

    .wbv-page .wbv-upload-card-head strong,
    .wbv-page .wbv-upload-card-head span {
        display: block;
    }

    .wbv-page .wbv-upload-card-head strong {
        color: #162338;
        font-size: .9rem;
        line-height: 1.25;
        font-weight: 800;
    }

    .wbv-page .wbv-upload-card-head span {
        margin-top: .18rem;
        color: #738197;
        font-size: .73rem;
        line-height: 1.4;
    }

.wbv-page .wbv-file-input {
    min-height: 50px;
    border: 1px solid rgba(22, 35, 56, .11);
    border-radius: 15px;
    background: #f8faff;
    color: #263d5e;
    font-size: .82rem;
}

    .wbv-page .wbv-file-input::file-selector-button {
        height: 48px;
        margin: -1px .8rem -1px -1px;
        padding: 0 1rem;
        border: 0;
        border-right: 1px solid rgba(22, 35, 56, .10);
        background: #e8efff;
        color: #2457f5;
        font-weight: 800;
        cursor: pointer;
    }

.wbv-page .wbv-upload-card > small {
    display: block;
    margin-top: .5rem;
    color: #748198;
    font-size: .72rem;
    line-height: 1.45;
}

.wbv-page .wbv-authorization-check {
    display: flex;
    align-items: flex-start;
    gap: .8rem;
    margin-top: 1.15rem;
    padding: 1rem 1.05rem;
    border: 1px solid rgba(36, 87, 245, .16);
    border-radius: 18px;
    background: rgba(232, 239, 255, .66);
}

    .wbv-page .wbv-authorization-check .form-check-input {
        width: 1.18rem;
        height: 1.18rem;
        flex: 0 0 1.18rem;
        margin-top: .14rem;
        border-color: rgba(36, 87, 245, .35);
    }

        .wbv-page .wbv-authorization-check .form-check-input:checked {
            border-color: #2457f5;
            background-color: #2457f5;
        }

        .wbv-page .wbv-authorization-check .form-check-input.wbv-invalid,
        .wbv-page .wbv-authorization-check .form-check-input.is-invalid,
        .wbv-page .wbv-authorization-check .form-check-input.input-validation-error {
            border-color: #dc3545 !important;
            box-shadow: 0 0 0 .18rem rgba(220, 53, 69, .09);
        }

    .wbv-page .wbv-authorization-check .form-check-label {
        color: #435672;
        font-size: .84rem;
        line-height: 1.6;
    }

.wbv-page .wbv-authorization-error {
    display: block;
    margin-top: .45rem;
}

.wbv-page .wbv-success-reference {
    width: min(360px, 100%);
    margin: 1rem auto;
    padding: .8rem 1rem;
    border: 1px solid rgba(255,255,255,.13);
    border-radius: 18px;
    background: rgba(7,17,31,.42);
}

    .wbv-page .wbv-success-reference small,
    .wbv-page .wbv-success-reference strong {
        display: block;
    }

    .wbv-page .wbv-success-reference small {
        color: rgba(255,255,255,.62);
        font-size: .68rem;
        font-weight: 800;
        letter-spacing: .09em;
        text-transform: uppercase;
    }

    .wbv-page .wbv-success-reference strong {
        margin-top: .18rem;
        color: #ffffff;
        font-size: 1rem;
        letter-spacing: .05em;
    }

.wbv-page .wbv-success-next {
    margin-top: 1rem;
    padding: 1rem 1.1rem;
    border: 1px solid rgba(255,255,255,.11);
    border-radius: 18px;
    background: rgba(255,255,255,.055);
}

    .wbv-page .wbv-success-next strong {
        color: #dbe5ff;
        font-size: .72rem;
        letter-spacing: .09em;
        text-transform: uppercase;
    }

    .wbv-page .wbv-success-next p {
        margin: .45rem 0 0;
        color: rgba(255,255,255,.72);
        font-size: .82rem;
        line-height: 1.55;
    }

@media (max-width: 991.98px) {
    .wbv-page .wbv-documents-heading {
        flex-direction: column;
    }

    .wbv-page .wbv-document-limit {
        width: 100%;
    }
}

@media (max-width: 767.98px) {
    .wbv-page .wbv-document-grid {
        grid-template-columns: 1fr;
    }

    .wbv-page .wbv-upload-wide {
        grid-column: auto;
    }

    .wbv-page .wbv-documents-panel {
        padding: 1.15rem;
        border-radius: 23px;
    }

    .wbv-page .wbv-country-document-guidance {
        padding: .9rem;
    }
}

@media (prefers-reduced-motion: reduce) {
    .wbv-page .wbv-upload-card {
        transition: none !important;
    }
}


/* =========================================================
   VENDOR PREMIUM ARCHITECTURE FINAL
   DESIGN CORRECTION ONLY — FIRST-SECTION RIGHT VISUAL
   Converts the circular/orbit Vendor graphic into the same
   premium layered rectangular enterprise architecture used
   across Engineering, Solutions, Industries, Careers, and
   Contact. Vendor.cshtml and all remaining page content,
   forms, validation, uploads, routes, and scripts are unchanged.
========================================================= */

/* Right-side visual containment */
.wbv-page .wbv-network {
    width: 100%;
    min-width: 0;
    margin-inline: auto;
}

/* =========================================================
   PREMIUM LAYERED ARCHITECTURE — TABLET AND DESKTOP
========================================================= */

@media (min-width: 768px) {

    .wbv-page .wbv-network {
        isolation: isolate;
        background: linear-gradient( 90deg, transparent 0%, transparent 8%, rgba(92, 145, 255, 0.80) 49.7%, rgba(92, 145, 255, 0.80) 50.3%, transparent 92%, transparent 100% ) center 50% / 84% 2px no-repeat, linear-gradient( 180deg, transparent 0%, transparent 8%, rgba(92, 145, 255, 0.80) 49.7%, rgba(92, 145, 255, 0.80) 50.3%, transparent 92%, transparent 100% ) 50% center / 2px 80% no-repeat, radial-gradient(circle at 88% 8%, rgba(73, 108, 255, 0.50), transparent 32%), radial-gradient(circle at 12% 92%, rgba(55, 205, 222, 0.16), transparent 30%), linear-gradient(145deg, rgba(255, 255, 255, 0.115), rgba(255, 255, 255, 0.035));
        box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.10), 0 34px 92px rgba(0, 0, 0, 0.28);
    }

        /* Replace circular orbit outlines with nested rounded rectangles */
        .wbv-page .wbv-network::before,
        .wbv-page .wbv-network::after {
            content: "";
            position: absolute;
            z-index: 1;
            pointer-events: none;
            border: 1px solid rgba(142, 172, 255, 0.18);
            background: linear-gradient(145deg, rgba(255, 255, 255, 0.018), rgba(255, 255, 255, 0.006));
            box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.025), 0 0 28px rgba(56, 113, 226, 0.055);
        }

        .wbv-page .wbv-network::before {
            inset: 13% 11% 16%;
            border-radius: 42px;
        }

        .wbv-page .wbv-network::after {
            inset: 25% 23% 28%;
            border-radius: 34px;
        }

    .wbv-page .wbv-network-core {
        z-index: 3;
        border-color: rgba(126, 157, 255, 0.17);
        background: radial-gradient(circle at 50% 0%, rgba(46, 85, 179, 0.12), transparent 38%), rgba(4, 13, 27, 0.94);
        box-shadow: 0 26px 62px rgba(0, 0, 0, 0.32), 0 0 0 1px rgba(75, 116, 225, 0.035);
    }

    .wbv-page .wbv-network-node {
        z-index: 4;
        border-color: rgba(139, 169, 255, 0.17);
        background: linear-gradient(145deg, rgba(10, 26, 52, 0.97), rgba(4, 13, 27, 0.94));
        box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.055), 0 16px 34px rgba(0, 0, 0, 0.24);
    }

        .wbv-page .wbv-network-node i {
            border: 1px solid rgba(137, 170, 255, 0.26);
            background: radial-gradient(circle at 30% 18%, rgba(255, 255, 255, 0.20), transparent 34%), linear-gradient(145deg, rgba(57, 98, 204, 0.82), rgba(18, 46, 94, 0.96));
            box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.16), 0 10px 24px rgba(0, 0, 0, 0.18);
        }

    .wbv-page .wbv-network-status {
        z-index: 4;
    }
}

/* =========================================================
   LARGE DESKTOP — 1600PX AND ABOVE
========================================================= */

@media (min-width: 1600px) {

    .wbv-page .wbv-hero-grid {
        grid-template-columns: minmax(0, 1.03fr) minmax(720px, 0.97fr);
        gap: clamp(3rem, 3.7vw, 4.8rem);
    }

    .wbv-page .wbv-network {
        width: min(100%, 840px);
        min-height: 0;
        aspect-ratio: 1.30 / 1;
        border-radius: 38px;
    }

    .wbv-page .wbv-network-core {
        top: 45%;
        width: 350px;
        padding: 1.8rem 1.35rem;
        border-radius: 29px;
    }

        .wbv-page .wbv-network-core > span {
            margin-bottom: 0.82rem;
            font-size: 0.68rem;
        }

        .wbv-page .wbv-network-core h2 {
            max-width: 315px;
            margin-inline: auto;
            font-size: 1.60rem;
            line-height: 1.18;
        }

        .wbv-page .wbv-network-core p {
            max-width: 300px;
            margin-inline: auto;
            font-size: 0.83rem;
            line-height: 1.50;
        }

    .wbv-page .wbv-network-node {
        min-height: 64px;
        gap: 0.64rem;
        padding: 0.66rem 0.76rem;
        border-radius: 18px;
        font-size: 0.80rem;
    }

        .wbv-page .wbv-network-node i {
            width: 38px;
            height: 38px;
            min-width: 38px;
            flex: 0 0 38px;
        }

    .wbv-page .wbv-node-top {
        top: 1.25rem;
        min-width: 190px;
    }

    .wbv-page .wbv-node-left {
        left: 1.25rem;
        min-width: 165px;
    }

    .wbv-page .wbv-node-right {
        right: 1.25rem;
        min-width: 210px;
    }

    .wbv-page .wbv-node-bottom {
        bottom: 1.25rem;
        min-width: 195px;
    }

    .wbv-page .wbv-network-status {
        right: 1.15rem;
        bottom: 0.85rem;
        font-size: 0.64rem;
    }
}

/* =========================================================
   16-INCH LAPTOPS — 1400PX TO 1599PX
========================================================= */

@media (min-width: 1400px) and (max-width: 1599.98px) {

    .wbv-page .wbv-hero-grid {
        grid-template-columns: minmax(0, 1.03fr) minmax(630px, 0.97fr);
        gap: clamp(2.15rem, 2.9vw, 3.2rem);
    }

    .wbv-page .wbv-network {
        width: min(100%, 740px);
        min-height: 0;
        aspect-ratio: 1.27 / 1;
        border-radius: 35px;
    }

        .wbv-page .wbv-network::before {
            inset: 13% 11% 16%;
            border-radius: 39px;
        }

        .wbv-page .wbv-network::after {
            inset: 25% 23% 28%;
            border-radius: 32px;
        }

    .wbv-page .wbv-network-core {
        top: 45%;
        width: 300px;
        padding: 1.55rem 1.05rem;
        border-radius: 27px;
    }

        .wbv-page .wbv-network-core > span {
            margin-bottom: 0.72rem;
            font-size: 0.61rem;
        }

        .wbv-page .wbv-network-core h2 {
            max-width: 270px;
            margin-inline: auto;
            font-size: 1.36rem;
            line-height: 1.18;
        }

        .wbv-page .wbv-network-core p {
            max-width: 260px;
            margin-inline: auto;
            font-size: 0.76rem;
            line-height: 1.48;
        }

    .wbv-page .wbv-network-node {
        min-height: 56px;
        gap: 0.56rem;
        padding: 0.58rem 0.64rem;
        border-radius: 16px;
        font-size: 0.72rem;
    }

        .wbv-page .wbv-network-node i {
            width: 34px;
            height: 34px;
            min-width: 34px;
            flex: 0 0 34px;
            border-radius: 12px;
        }

    .wbv-page .wbv-node-top {
        top: 1rem;
        min-width: 172px;
    }

    .wbv-page .wbv-node-left {
        left: 0.85rem;
        min-width: 150px;
    }

    .wbv-page .wbv-node-right {
        right: 0.85rem;
        min-width: 190px;
    }

    .wbv-page .wbv-node-bottom {
        bottom: 1rem;
        min-width: 178px;
    }

    .wbv-page .wbv-network-status {
        right: 0.85rem;
        bottom: 0.62rem;
        font-size: 0.58rem;
    }
}

/* =========================================================
   14-INCH LAPTOPS — 1200PX TO 1399PX
========================================================= */

@media (min-width: 1200px) and (max-width: 1399.98px) {

    .wbv-page .wbv-hero-grid {
        grid-template-columns: minmax(0, 1.02fr) minmax(560px, 0.98fr);
        gap: clamp(1.15rem, 1.8vw, 1.8rem);
    }

    .wbv-page .wbv-network {
        width: min(100%, 640px);
        min-height: 0;
        aspect-ratio: 1.22 / 1;
        border-radius: 32px;
    }

        .wbv-page .wbv-network::before {
            inset: 13% 10% 16%;
            border-radius: 35px;
        }

        .wbv-page .wbv-network::after {
            inset: 25% 22% 28%;
            border-radius: 29px;
        }

    .wbv-page .wbv-network-core {
        top: 45%;
        width: 260px;
        padding: 1.25rem 0.82rem;
        border-radius: 24px;
    }

        .wbv-page .wbv-network-core > span {
            margin-bottom: 0.62rem;
            padding: 0.34rem 0.56rem;
            font-size: 0.53rem;
        }

        .wbv-page .wbv-network-core h2 {
            max-width: 235px;
            margin-inline: auto;
            font-size: 1.10rem;
            line-height: 1.17;
        }

        .wbv-page .wbv-network-core p {
            max-width: 225px;
            margin: 0.56rem auto 0;
            font-size: 0.66rem;
            line-height: 1.42;
        }

    .wbv-page .wbv-network-node {
        min-height: 50px;
        gap: 0.46rem;
        padding: 0.50rem 0.52rem;
        border-radius: 15px;
        font-size: 0.64rem;
        line-height: 1.16;
    }

        .wbv-page .wbv-network-node i {
            width: 31px;
            height: 31px;
            min-width: 31px;
            flex: 0 0 31px;
            border-radius: 11px;
        }

    .wbv-page .wbv-node-top {
        top: 0.8rem;
        min-width: 152px;
    }

    .wbv-page .wbv-node-left {
        left: 0.55rem;
        min-width: 136px;
    }

    .wbv-page .wbv-node-right {
        right: 0.55rem;
        min-width: 172px;
    }

    .wbv-page .wbv-node-bottom {
        bottom: 0.8rem;
        min-width: 160px;
    }

    .wbv-page .wbv-network-status {
        right: 0.65rem;
        bottom: 0.48rem;
        font-size: 0.52rem;
    }
}

/* =========================================================
   TABLET — PRESERVE STACKED HERO RESPONSIVENESS
========================================================= */

@media (min-width: 768px) and (max-width: 1199.98px) {

    .wbv-page .wbv-network {
        width: min(100%, 780px);
        min-height: 520px;
        margin-inline: auto;
    }

        .wbv-page .wbv-network::before {
            inset: 13% 10% 16%;
        }

        .wbv-page .wbv-network::after {
            inset: 25% 22% 28%;
        }
}

/* =========================================================
   MOBILE — KEEP EXISTING STACKED CARD DESIGN
========================================================= */

@media (max-width: 767.98px) {

    .wbv-page .wbv-network {
        background: radial-gradient(circle at 88% 8%, rgba(73, 108, 255, 0.34), transparent 32%), radial-gradient(circle at 12% 92%, rgba(55, 205, 222, 0.12), transparent 30%), linear-gradient(145deg, rgba(255, 255, 255, 0.10), rgba(255, 255, 255, 0.03));
    }
}


/* =========================================================
   VENDOR PREMIUM TIMELINE FINAL V2
   SECTION CORRECTION ONLY — VENDOR REVIEW PATH
   Converts the five independent review cards into one
   connected enterprise-grade review timeline.
   All existing headings, descriptions, icons, Razor content,
   forms, routes, uploads, and other Vendor sections remain
   unchanged.
========================================================= */

.wbv-page .wbv-process-section {
    isolation: isolate;
}

.wbv-page .wbv-process-grid {
    position: relative;
    counter-reset: wbv-review-step;
    margin-top: clamp(2rem, 3vw, 3rem);
}

/* =========================================================
   DESKTOP TIMELINE — 1200PX AND ABOVE
========================================================= */

@media (min-width: 1200px) {

    .wbv-page .wbv-process-grid {
        display: grid;
        grid-template-columns: repeat(5, minmax(0, 1fr));
        gap: clamp(0.8rem, 1.25vw, 1.35rem);
        padding: 6.15rem clamp(1rem, 1.6vw, 1.6rem) 1.45rem;
        overflow: hidden;
        border: 1px solid rgba(151, 181, 255, 0.17);
        border-radius: 38px;
        background: radial-gradient(circle at 92% 6%, rgba(74, 115, 255, 0.22), transparent 30%), radial-gradient(circle at 7% 94%, rgba(69, 205, 224, 0.09), transparent 28%), linear-gradient(145deg, rgba(255, 255, 255, 0.075), rgba(255, 255, 255, 0.026));
        box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08), 0 30px 78px rgba(0, 0, 0, 0.22);
    }

        /* Main illuminated timeline rail */
        .wbv-page .wbv-process-grid::before {
            content: "";
            position: absolute;
            top: 3.65rem;
            left: 7%;
            right: 7%;
            z-index: 0;
            height: 3px;
            border-radius: 999px;
            background: linear-gradient( 90deg, rgba(85, 143, 255, 0.12), rgba(85, 143, 255, 0.90) 8%, rgba(66, 208, 224, 0.94) 50%, rgba(85, 143, 255, 0.90) 92%, rgba(85, 143, 255, 0.12) );
            box-shadow: 0 0 13px rgba(76, 139, 255, 0.48), 0 0 30px rgba(76, 139, 255, 0.18);
        }

        /* Soft moving-light effect without changing any markup */
        .wbv-page .wbv-process-grid::after {
            content: "";
            position: absolute;
            top: 2.5rem;
            left: 5%;
            z-index: 0;
            width: 10rem;
            height: 2.25rem;
            border-radius: 50%;
            background: rgba(82, 148, 255, 0.11);
            filter: blur(18px);
            pointer-events: none;
        }

        .wbv-page .wbv-process-grid article {
            position: relative;
            z-index: 1;
            display: flex;
            min-width: 0;
            min-height: 224px;
            flex-direction: column;
            align-items: flex-start;
            padding: 1.5rem 1.25rem 1.35rem;
            overflow: visible;
            border: 1px solid rgba(151, 181, 255, 0.16);
            border-radius: 25px;
            background: radial-gradient(circle at 92% 8%, rgba(73, 113, 235, 0.15), transparent 34%), linear-gradient(145deg, rgba(255, 255, 255, 0.075), rgba(255, 255, 255, 0.035));
            box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.055), 0 18px 42px rgba(0, 0, 0, 0.17);
            counter-increment: wbv-review-step;
            transition: transform 220ms ease, border-color 220ms ease, background 220ms ease, box-shadow 220ms ease;
        }

            .wbv-page .wbv-process-grid article:hover {
                transform: translateY(-7px);
                border-color: rgba(117, 164, 255, 0.42);
                background: radial-gradient(circle at 92% 8%, rgba(77, 128, 255, 0.23), transparent 36%), linear-gradient(145deg, rgba(255, 255, 255, 0.105), rgba(255, 255, 255, 0.045));
                box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.075), 0 24px 56px rgba(0, 0, 0, 0.23), 0 0 30px rgba(66, 126, 255, 0.09);
            }

            /* Numbered timeline milestone */
            .wbv-page .wbv-process-grid article::before {
                content: counter(wbv-review-step, decimal-leading-zero);
                position: absolute;
                top: -3.92rem;
                left: 50%;
                z-index: 4;
                display: grid;
                width: 48px;
                height: 48px;
                place-items: center;
                border: 1px solid rgba(170, 197, 255, 0.52);
                border-radius: 50%;
                color: #ffffff;
                background: radial-gradient(circle at 30% 20%, rgba(255, 255, 255, 0.28), transparent 32%), linear-gradient(145deg, #4f80ff, #183a7b);
                box-shadow: 0 0 0 8px rgba(68, 119, 238, 0.12), 0 0 26px rgba(76, 139, 255, 0.70);
                font-size: 0.65rem;
                font-weight: 900;
                letter-spacing: 0.04em;
                transform: translateX(-50%);
            }

            /* Connector from numbered milestone to its card */
            .wbv-page .wbv-process-grid article::after {
                content: "";
                position: absolute;
                top: -1.02rem;
                left: 50%;
                z-index: 2;
                width: 2px;
                height: 1.04rem;
                border-radius: 999px;
                background: linear-gradient( 180deg, rgba(88, 148, 255, 0.96), rgba(88, 148, 255, 0.20) );
                box-shadow: 0 0 12px rgba(75, 139, 255, 0.48);
                transform: translateX(-50%);
            }

        .wbv-page .wbv-process-grid i {
            position: relative;
            z-index: 1;
            width: 54px;
            height: 54px;
            min-width: 54px;
            margin: 0 0 1.15rem;
            border: 1px solid rgba(148, 181, 255, 0.30);
            border-radius: 17px;
            color: #edf3ff;
            background: radial-gradient(circle at 28% 18%, rgba(255, 255, 255, 0.26), transparent 34%), linear-gradient(145deg, rgba(62, 105, 218, 0.82), rgba(18, 46, 94, 0.96));
            box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.22), 0 13px 28px rgba(0, 0, 0, 0.20);
        }

        .wbv-page .wbv-process-grid h3 {
            margin: 0;
            font-size: clamp(1rem, 1vw, 1.16rem);
            line-height: 1.25;
        }

        .wbv-page .wbv-process-grid p {
            margin: 0.62rem 0 0;
            color: rgba(255, 255, 255, 0.68);
            font-size: clamp(0.84rem, 0.83vw, 0.96rem);
            line-height: 1.68;
        }

        /* Make the central qualification milestone the visual anchor */
        .wbv-page .wbv-process-grid article:nth-child(3) {
            border-color: rgba(77, 198, 221, 0.44);
            background: radial-gradient(circle at 90% 8%, rgba(69, 205, 224, 0.20), transparent 35%), linear-gradient(145deg, rgba(42, 92, 178, 0.58), rgba(19, 52, 108, 0.42));
            box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.09), 0 23px 52px rgba(22, 92, 157, 0.22);
        }

            .wbv-page .wbv-process-grid article:nth-child(3)::before {
                border-color: rgba(143, 238, 247, 0.62);
                background: radial-gradient(circle at 30% 20%, rgba(255, 255, 255, 0.30), transparent 32%), linear-gradient(145deg, #43b5d0, #2352b5);
                box-shadow: 0 0 0 8px rgba(67, 181, 208, 0.13), 0 0 30px rgba(67, 181, 208, 0.72);
            }
}

/* =========================================================
   LARGE DESKTOP SPACING — 1600PX AND ABOVE
========================================================= */

@media (min-width: 1600px) {

    .wbv-page .wbv-process-grid {
        gap: 1.35rem;
        padding-right: 1.6rem;
        padding-left: 1.6rem;
    }

        .wbv-page .wbv-process-grid article {
            min-height: 230px;
            padding: 1.6rem 1.35rem 1.45rem;
        }
}

/* =========================================================
   14-INCH LAPTOP REFINEMENT — 1200PX TO 1399PX
========================================================= */

@media (min-width: 1200px) and (max-width: 1399.98px) {

    .wbv-page .wbv-process-grid {
        gap: 0.72rem;
        padding: 5.8rem 0.8rem 1.1rem;
        border-radius: 32px;
    }

        .wbv-page .wbv-process-grid::before {
            top: 3.45rem;
            left: 6.5%;
            right: 6.5%;
        }

        .wbv-page .wbv-process-grid article {
            min-height: 218px;
            padding: 1.25rem 0.95rem 1.15rem;
            border-radius: 21px;
        }

            .wbv-page .wbv-process-grid article::before {
                top: -3.62rem;
                width: 44px;
                height: 44px;
                font-size: 0.60rem;
            }

            .wbv-page .wbv-process-grid article::after {
                top: -0.92rem;
                height: 0.94rem;
            }

        .wbv-page .wbv-process-grid i {
            width: 48px;
            height: 48px;
            min-width: 48px;
            margin-bottom: 1rem;
            border-radius: 15px;
        }

        .wbv-page .wbv-process-grid h3 {
            font-size: 0.98rem;
        }

        .wbv-page .wbv-process-grid p {
            font-size: 0.80rem;
            line-height: 1.60;
        }
}

/* =========================================================
   TABLET AND MOBILE — PREMIUM VERTICAL TIMELINE
========================================================= */

@media (max-width: 1199.98px) {

    .wbv-page .wbv-process-grid {
        display: grid;
        grid-template-columns: 1fr;
        gap: 1rem;
        padding: 1.4rem 1rem 1.4rem 5.4rem;
        overflow: hidden;
        border: 1px solid rgba(151, 181, 255, 0.16);
        border-radius: 32px;
        background: radial-gradient(circle at 92% 6%, rgba(74, 115, 255, 0.20), transparent 30%), radial-gradient(circle at 7% 94%, rgba(69, 205, 224, 0.08), transparent 28%), linear-gradient(145deg, rgba(255, 255, 255, 0.070), rgba(255, 255, 255, 0.025));
        box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.07), 0 26px 64px rgba(0, 0, 0, 0.20);
    }

        /* Vertical process rail */
        .wbv-page .wbv-process-grid::before {
            content: "";
            position: absolute;
            top: 2.4rem;
            bottom: 2.4rem;
            left: 2.75rem;
            z-index: 0;
            width: 3px;
            border-radius: 999px;
            background: linear-gradient( 180deg, rgba(85, 143, 255, 0.10), rgba(85, 143, 255, 0.90) 8%, rgba(66, 208, 224, 0.94) 50%, rgba(85, 143, 255, 0.90) 92%, rgba(85, 143, 255, 0.10) );
            box-shadow: 0 0 13px rgba(76, 139, 255, 0.44), 0 0 28px rgba(76, 139, 255, 0.16);
        }

        .wbv-page .wbv-process-grid::after {
            display: none;
        }

        .wbv-page .wbv-process-grid article {
            position: relative;
            z-index: 1;
            min-height: auto;
            padding: 1.25rem 1.15rem;
            border: 1px solid rgba(151, 181, 255, 0.15);
            border-radius: 23px;
            background: radial-gradient(circle at 92% 8%, rgba(73, 113, 235, 0.13), transparent 34%), linear-gradient(145deg, rgba(255, 255, 255, 0.070), rgba(255, 255, 255, 0.032));
            box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05), 0 16px 36px rgba(0, 0, 0, 0.16);
            counter-increment: wbv-review-step;
        }

            .wbv-page .wbv-process-grid article::before {
                content: counter(wbv-review-step, decimal-leading-zero);
                position: absolute;
                top: 50%;
                left: -4.05rem;
                z-index: 4;
                display: grid;
                width: 44px;
                height: 44px;
                place-items: center;
                border: 1px solid rgba(170, 197, 255, 0.52);
                border-radius: 50%;
                color: #ffffff;
                background: radial-gradient(circle at 30% 20%, rgba(255, 255, 255, 0.26), transparent 32%), linear-gradient(145deg, #4f80ff, #183a7b);
                box-shadow: 0 0 0 7px rgba(68, 119, 238, 0.11), 0 0 24px rgba(76, 139, 255, 0.62);
                font-size: 0.60rem;
                font-weight: 900;
                letter-spacing: 0.04em;
                transform: translateY(-50%);
            }

            .wbv-page .wbv-process-grid article::after {
                content: "";
                position: absolute;
                top: 50%;
                left: -1.65rem;
                z-index: 2;
                width: 1.65rem;
                height: 2px;
                border-radius: 999px;
                background: linear-gradient( 90deg, rgba(88, 148, 255, 0.96), rgba(88, 148, 255, 0.20) );
                box-shadow: 0 0 10px rgba(75, 139, 255, 0.42);
                transform: translateY(-50%);
            }

        .wbv-page .wbv-process-grid i {
            width: 50px;
            height: 50px;
            min-width: 50px;
            margin-bottom: 0.9rem;
            border: 1px solid rgba(148, 181, 255, 0.28);
            border-radius: 16px;
            color: #edf3ff;
            background: radial-gradient(circle at 28% 18%, rgba(255, 255, 255, 0.24), transparent 34%), linear-gradient(145deg, rgba(62, 105, 218, 0.82), rgba(18, 46, 94, 0.96));
            box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.20), 0 12px 26px rgba(0, 0, 0, 0.18);
        }

        .wbv-page .wbv-process-grid article:nth-child(3) {
            border-color: rgba(77, 198, 221, 0.40);
            background: radial-gradient(circle at 90% 8%, rgba(69, 205, 224, 0.17), transparent 35%), linear-gradient(145deg, rgba(42, 92, 178, 0.52), rgba(19, 52, 108, 0.38));
        }
}

/* =========================================================
   SMALL MOBILE REFINEMENT
========================================================= */

@media (max-width: 575.98px) {

    .wbv-page .wbv-process-grid {
        padding: 1rem 0.8rem 1rem 4.45rem;
        border-radius: 25px;
    }

        .wbv-page .wbv-process-grid::before {
            top: 2rem;
            bottom: 2rem;
            left: 2.18rem;
        }

        .wbv-page .wbv-process-grid article {
            padding: 1.05rem 0.95rem;
            border-radius: 20px;
        }

            .wbv-page .wbv-process-grid article::before {
                left: -3.55rem;
                width: 40px;
                height: 40px;
                font-size: 0.56rem;
            }

            .wbv-page .wbv-process-grid article::after {
                left: -1.45rem;
                width: 1.45rem;
            }

        .wbv-page .wbv-process-grid i {
            width: 46px;
            height: 46px;
            min-width: 46px;
            border-radius: 14px;
        }

        .wbv-page .wbv-process-grid h3 {
            font-size: 1rem;
        }

        .wbv-page .wbv-process-grid p {
            font-size: 0.88rem;
            line-height: 1.62;
        }
}


/* =========================================================
   VENDOR PREMIUM TIMELINE FINAL V3
   TARGETED CORRECTION ONLY
   Removes 01–05 numbering from the timeline milestones.
   Keeps elegant glowing process nodes, connector rail,
   icons, headings, descriptions, and all other styling.
========================================================= */

/* Desktop milestone dots */
@media (min-width: 1200px) {

    .wbv-page .wbv-process-grid article::before {
        content: "";
        width: 22px;
        height: 22px;
        top: -3.08rem;
        border: 2px solid rgba(181, 210, 255, 0.78);
        background: radial-gradient(circle at 35% 28%, #ffffff 0 14%, transparent 15%), linear-gradient(145deg, #5a91ff, #234c9e);
        box-shadow: 0 0 0 7px rgba(68, 119, 238, 0.11), 0 0 24px rgba(76, 139, 255, 0.68);
    }

    .wbv-page .wbv-process-grid article::after {
        top: -1.72rem;
        height: 1.74rem;
    }

    .wbv-page .wbv-process-grid article:nth-child(3)::before {
        border-color: rgba(157, 243, 249, 0.82);
        background: radial-gradient(circle at 35% 28%, #ffffff 0 14%, transparent 15%), linear-gradient(145deg, #45c3d7, #2854ba);
        box-shadow: 0 0 0 7px rgba(67, 181, 208, 0.12), 0 0 28px rgba(67, 181, 208, 0.72);
    }
}

/* Tablet and mobile milestone dots */
@media (max-width: 1199.98px) {

    .wbv-page .wbv-process-grid article::before {
        content: "";
        width: 20px;
        height: 20px;
        left: -3.32rem;
        border: 2px solid rgba(181, 210, 255, 0.78);
        background: radial-gradient(circle at 35% 28%, #ffffff 0 14%, transparent 15%), linear-gradient(145deg, #5a91ff, #234c9e);
        box-shadow: 0 0 0 6px rgba(68, 119, 238, 0.10), 0 0 22px rgba(76, 139, 255, 0.62);
    }

    .wbv-page .wbv-process-grid article::after {
        left: -2.30rem;
        width: 2.30rem;
    }

    .wbv-page .wbv-process-grid article:nth-child(3)::before {
        border-color: rgba(157, 243, 249, 0.82);
        background: radial-gradient(circle at 35% 28%, #ffffff 0 14%, transparent 15%), linear-gradient(145deg, #45c3d7, #2854ba);
        box-shadow: 0 0 0 6px rgba(67, 181, 208, 0.12), 0 0 26px rgba(67, 181, 208, 0.68);
    }
}

@media (max-width: 575.98px) {

    .wbv-page .wbv-process-grid article::before {
        left: -2.90rem;
        width: 18px;
        height: 18px;
    }

    .wbv-page .wbv-process-grid article::after {
        left: -2rem;
        width: 2rem;
    }
}


/* =========================================================
   VENDOR HERO — CLIENT-MATCHED FINAL
   ---------------------------------------------------------
   Scope:
   - First-section Vendor typography and right-side visual only
   - Matches the approved Client-page proportions
   - Separate desktop, 16-inch and 14-inch handling
   - Lower Vendor sections, premium timeline, registration
     form, validation and scripts remain unchanged
========================================================= */

.wbv-page .wbv-hero {
    padding: 2.5rem 0 1.45rem !important;
}

.wbv-page .wbv-hero-grid {
    position: relative;
    z-index: 2;
    display: grid;
    grid-template-columns: minmax(0, 1.02fr) minmax(0, 0.98fr) !important;
    align-items: start !important;
    gap: clamp(2.25rem, 3.8vw, 5rem) !important;
}

.wbv-page .wbv-hero-copy {
    min-width: 0;
    max-width: 900px;
    padding: 0 !important;
}

.wbv-page .wbv-kicker {
    margin-bottom: 1.2rem !important;
}

.wbv-page .wbv-hero-copy h1 {
    max-width: 860px !important;
    margin: 0;
    color: #ffffff;
    font-family: "Manrope", sans-serif;
    font-size: clamp(3rem, 4.45vw, 4.95rem) !important;
    font-weight: 800;
    letter-spacing: -0.055em !important;
    line-height: 1.01 !important;
    text-wrap: balance;
}

.wbv-page .wbv-hero-copy > p {
    max-width: 820px !important;
    margin-top: 1.25rem !important;
    color: rgba(231, 238, 250, 0.77);
    font-size: clamp(1rem, 1.06vw, 1.10rem) !important;
    line-height: 1.82 !important;
}

.wbv-page .wbv-actions {
    margin-top: 1.45rem !important;
}

/* Right visual wrapper */

.wbv-page .wbv-hero-visual {
    display: flex;
    min-width: 0;
    justify-content: flex-end;
}

/* Industries/Client-style rectangular system */

.wbv-page .wbv-industry-style-system {
    position: relative;
    isolation: isolate;
    width: min(100%, 760px);
    min-height: 520px;
    overflow: hidden;
    margin-left: auto;
    border: 1px solid rgba(255, 255, 255, 0.16);
    border-radius: 38px;
    background: radial-gradient( circle at 85% 10%, rgba(86, 126, 255, 0.40), transparent 32% ), radial-gradient( circle at 10% 92%, rgba(66, 201, 223, 0.12), transparent 33% ), linear-gradient( 145deg, rgba(30, 44, 70, 0.92), rgba(16, 29, 52, 0.90) 54%, rgba(40, 79, 165, 0.82) );
    box-shadow: 0 34px 92px rgba(0, 0, 0, 0.28), inset 0 1px 0 rgba(255, 255, 255, 0.06);
    backdrop-filter: blur(18px);
    -webkit-backdrop-filter: blur(18px);
}

    .wbv-page .wbv-industry-style-system::before {
        content: "";
        position: absolute;
        inset: 0;
        z-index: -2;
        background: linear-gradient( rgba(143, 171, 255, 0.04) 1px, transparent 1px ), linear-gradient( 90deg, rgba(143, 171, 255, 0.04) 1px, transparent 1px );
        background-size: 72px 72px;
        opacity: 0.82;
    }

    .wbv-page .wbv-industry-style-system::after {
        content: "";
        position: absolute;
        inset: 1px;
        z-index: -1;
        border-radius: inherit;
        background: linear-gradient( 115deg, transparent 8%, rgba(255, 255, 255, 0.030) 28%, transparent 48% ), radial-gradient( circle at 74% 38%, rgba(72, 116, 255, 0.12), transparent 34% );
        pointer-events: none;
    }

/* Atmospheric glow */

.wbv-page .wbv-system-glow {
    position: absolute;
    z-index: -1;
    display: block;
    border-radius: 50%;
    pointer-events: none;
    filter: blur(22px);
}

.wbv-page .wbv-system-glow-one {
    top: -70px;
    right: -65px;
    width: 340px;
    height: 340px;
    background: radial-gradient( circle, rgba(79, 124, 255, 0.34), transparent 68% );
}

.wbv-page .wbv-system-glow-two {
    bottom: -100px;
    left: -70px;
    width: 300px;
    height: 300px;
    background: radial-gradient( circle, rgba(66, 201, 223, 0.14), transparent 68% );
}

/* Rectangular architecture — no orbit rings */

.wbv-page .wbv-system-architecture {
    position: absolute;
    inset: 0;
    z-index: 1;
    pointer-events: none;
}

.wbv-page .wbv-architecture-frame {
    position: absolute;
    top: 50%;
    left: 50%;
    display: block;
    border: 1px solid rgba(141, 170, 255, 0.16);
    border-radius: 34px;
    transform: translate(-50%, -50%);
}

.wbv-page .wbv-architecture-frame-one {
    width: 88%;
    height: 78%;
}

.wbv-page .wbv-architecture-frame-two {
    width: 70%;
    height: 60%;
}

.wbv-page .wbv-architecture-frame-three {
    width: 54%;
    height: 45%;
}

.wbv-page .wbv-system-axis {
    position: absolute;
    top: 50%;
    left: 50%;
    display: block;
    border-radius: 999px;
    transform: translate(-50%, -50%);
    box-shadow: 0 0 12px rgba(73, 142, 255, 0.35), 0 0 22px rgba(73, 142, 255, 0.14);
}

.wbv-page .wbv-system-axis-horizontal {
    width: 84%;
    height: 3px;
    background: linear-gradient( 90deg, transparent 0%, rgba(91, 143, 255, 0.48) 7%, rgba(76, 145, 255, 0.95) 25%, rgba(76, 145, 255, 0.95) 75%, rgba(91, 143, 255, 0.48) 93%, transparent 100% );
}

.wbv-page .wbv-system-axis-vertical {
    width: 3px;
    height: 84%;
    background: linear-gradient( 180deg, transparent 0%, rgba(91, 143, 255, 0.48) 7%, rgba(76, 145, 255, 0.95) 25%, rgba(76, 145, 255, 0.95) 75%, rgba(91, 143, 255, 0.48) 93%, transparent 100% );
}

.wbv-page .wbv-system-pulse {
    position: absolute;
    z-index: 3;
    display: block;
    width: 10px;
    height: 10px;
    border: 2px solid rgba(208, 225, 255, 0.92);
    border-radius: 50%;
    background: #49a4ff;
    box-shadow: 0 0 0 5px rgba(73, 164, 255, 0.10), 0 0 18px rgba(73, 164, 255, 0.58);
}

.wbv-page .wbv-system-pulse-top {
    top: 18%;
    left: 50%;
    transform: translateX(-50%);
}

.wbv-page .wbv-system-pulse-right {
    top: 50%;
    right: 8%;
    transform: translateY(-50%);
}

.wbv-page .wbv-system-pulse-bottom {
    bottom: 18%;
    left: 50%;
    transform: translateX(-50%);
}

.wbv-page .wbv-system-pulse-left {
    top: 50%;
    left: 8%;
    transform: translateY(-50%);
}

/* Top-left system status */

.wbv-page .wbv-system-activity {
    position: absolute;
    top: 1.45rem;
    left: 1.45rem;
    z-index: 12;
    display: grid;
    gap: 0.34rem;
    min-width: 248px;
    padding: 0.92rem 1rem;
    border: 1px solid rgba(202, 217, 255, 0.18);
    border-radius: 17px;
    color: #ffffff;
    background: rgba(4, 15, 31, 0.90);
    box-shadow: 0 18px 40px rgba(0, 0, 0, 0.24), inset 0 1px 0 rgba(255, 255, 255, 0.045);
    backdrop-filter: blur(15px);
    -webkit-backdrop-filter: blur(15px);
}

    .wbv-page .wbv-system-activity small {
        color: rgba(209, 222, 250, 0.68);
        font-size: 0.66rem;
        font-weight: 850;
        letter-spacing: 0.075em;
        line-height: 1.2;
        text-transform: uppercase;
    }

    .wbv-page .wbv-system-activity strong {
        display: flex;
        align-items: center;
        gap: 0.55rem;
        color: #ffffff;
        font-size: 0.79rem;
        font-weight: 820;
    }

/* Central governance core */

.wbv-page .wbv-system-core {
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 7;
    display: flex;
    width: min(46%, 350px);
    min-height: 255px;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 1.8rem 1.35rem;
    border: 1px solid rgba(180, 204, 255, 0.12);
    border-radius: 28px;
    color: #ffffff;
    text-align: center;
    background: rgba(5, 14, 28, 0.92);
    box-shadow: 0 24px 60px rgba(0, 0, 0, 0.28);
    transform: translate(-50%, -50%);
}

    .wbv-page .wbv-system-core > span {
        display: inline-flex;
        margin-bottom: 0.75rem;
        padding: 0.42rem 0.75rem;
        border-radius: 999px;
        color: #dfe8ff;
        background: rgba(79, 124, 255, 0.22);
        font-size: 0.70rem;
        font-weight: 850;
        letter-spacing: 0.07em;
        text-transform: uppercase;
    }

    .wbv-page .wbv-system-core h2 {
        max-width: 290px;
        margin: 0;
        color: #ffffff;
        font-size: clamp(1.22rem, 1.46vw, 1.70rem);
        font-weight: 850;
        letter-spacing: -0.03em;
        line-height: 1.23;
        text-wrap: balance;
    }

    .wbv-page .wbv-system-core p {
        max-width: 290px;
        margin: 0.65rem 0 0;
        color: rgba(233, 240, 255, 0.70);
        font-size: 0.88rem;
        line-height: 1.55;
        text-align: center;
    }

/* Capability nodes */

.wbv-page .wbv-system-node {
    position: absolute;
    z-index: 9;
    display: flex;
    align-items: center;
    min-width: 150px;
    gap: 0.65rem;
    padding: 0.70rem 0.90rem;
    border: 1px solid rgba(255, 255, 255, 0.11);
    border-radius: 18px;
    color: #ffffff;
    background: rgba(5, 14, 28, 0.87);
    box-shadow: 0 16px 34px rgba(0, 0, 0, 0.20);
    font-size: 0.86rem;
    font-weight: 820;
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
}

    .wbv-page .wbv-system-node i {
        display: flex;
        width: 40px;
        height: 40px;
        flex: 0 0 40px;
        align-items: center;
        justify-content: center;
        border-radius: 13px;
        color: #dfe8ff;
        background: rgba(79, 124, 255, 0.22);
    }

/* Exact Client-page node alignment */

.wbv-page .wbv-system-node-priority {
    top: 1.45rem;
    left: 50%;
    min-width: 186px;
    transform: translateX(-50%);
}

.wbv-page .wbv-system-node-product {
    top: 50%;
    left: 1.15rem;
    min-width: 188px;
    transform: translateY(-50%);
}

.wbv-page .wbv-system-node-delivery {
    top: 50%;
    right: 1.15rem;
    min-width: 210px;
    transform: translateY(-50%);
}

.wbv-page .wbv-system-node-evolution {
    right: auto;
    bottom: 1.35rem;
    left: 50%;
    min-width: 214px;
    transform: translateX(-50%);
}

/* Bottom status */

.wbv-page .wbv-system-status {
    position: absolute;
    bottom: 1rem;
    z-index: 10;
    display: flex;
    align-items: center;
    gap: 0.45rem;
    color: rgba(233, 240, 255, 0.78);
    font-size: 0.70rem;
    font-weight: 760;
}

.wbv-page .wbv-system-status-left {
    left: 1rem;
}

.wbv-page .wbv-system-status-right {
    right: 1rem;
}

    .wbv-page .wbv-system-status-right i {
        color: #b6caff;
    }

.wbv-page .wbv-status-dot {
    display: inline-block;
    width: 8px;
    height: 8px;
    flex: 0 0 8px;
    border-radius: 50%;
    background: #42d995;
    box-shadow: 0 0 0 5px rgba(66, 217, 149, 0.10), 0 0 18px rgba(66, 217, 149, 0.58);
}

/* =========================================================
   LARGE DESKTOP / 21-INCH
========================================================= */

@media (min-width: 1600px) {
    .wbv-page .wbv-hero-grid {
        grid-template-columns: minmax(0, 1.03fr) minmax(720px, 0.97fr) !important;
        gap: clamp(3rem, 3.7vw, 4.8rem) !important;
    }

    .wbv-page .wbv-hero-copy h1 {
        font-size: clamp(3.4rem, 4.35vw, 5rem) !important;
    }

    .wbv-page .wbv-industry-style-system {
        width: min(100%, 790px);
        min-height: 540px;
    }

    .wbv-page .wbv-system-core {
        width: min(46%, 365px);
        min-height: 265px;
    }
}

/* =========================================================
   16-INCH LAPTOP
========================================================= */

@media (min-width: 1400px) and (max-width: 1599.98px) {
    .wbv-page .wbv-hero-grid {
        grid-template-columns: minmax(0, 1.01fr) minmax(620px, 0.99fr) !important;
        gap: clamp(2rem, 2.5vw, 3rem) !important;
    }

    .wbv-page .wbv-hero-copy h1 {
        max-width: 760px !important;
        font-size: clamp(3rem, 4vw, 4.35rem) !important;
    }

    .wbv-page .wbv-industry-style-system {
        width: min(100%, 700px);
        min-height: 500px;
    }

    .wbv-page .wbv-system-core {
        width: min(46%, 330px);
        min-height: 236px;
        padding: 1.45rem 1.10rem;
    }

        .wbv-page .wbv-system-core h2 {
            font-size: clamp(1.12rem, 1.26vw, 1.50rem);
        }

        .wbv-page .wbv-system-core p {
            font-size: 0.79rem;
        }

    .wbv-page .wbv-system-node {
        padding: 0.60rem 0.72rem;
        font-size: 0.78rem;
    }

        .wbv-page .wbv-system-node i {
            width: 36px;
            height: 36px;
            flex-basis: 36px;
        }

    .wbv-page .wbv-system-node-priority {
        top: 1.20rem;
        min-width: 170px;
    }

    .wbv-page .wbv-system-node-product {
        min-width: 165px;
    }

    .wbv-page .wbv-system-node-delivery {
        min-width: 190px;
    }

    .wbv-page .wbv-system-node-evolution {
        bottom: 1.15rem;
        min-width: 190px;
    }
}

/* =========================================================
   14-INCH LAPTOP
========================================================= */

@media (min-width: 1200px) and (max-width: 1399.98px) {
    .wbv-page .wbv-hero-grid {
        grid-template-columns: minmax(0, 1fr) minmax(560px, 0.96fr) !important;
        gap: 1.5rem !important;
    }

    .wbv-page .wbv-hero-copy h1 {
        max-width: 700px !important;
        font-size: clamp(2.8rem, 3.85vw, 4.10rem) !important;
    }

    .wbv-page .wbv-hero-copy > p {
        max-width: 700px !important;
        font-size: 0.99rem !important;
        line-height: 1.75 !important;
    }

    .wbv-page .wbv-industry-style-system {
        width: min(100%, 620px);
        min-height: 468px;
        border-radius: 34px;
    }

    .wbv-page .wbv-system-activity {
        top: 0.95rem;
        left: 0.95rem;
        min-width: 200px;
        padding: 0.70rem 0.80rem;
    }

        .wbv-page .wbv-system-activity small {
            font-size: 0.58rem;
        }

        .wbv-page .wbv-system-activity strong {
            font-size: 0.68rem;
        }

    .wbv-page .wbv-system-core {
        width: min(44%, 285px);
        min-height: 210px;
        padding: 1.25rem 0.95rem;
    }

        .wbv-page .wbv-system-core > span {
            margin-bottom: 0.66rem;
            padding: 0.36rem 0.60rem;
            font-size: 0.56rem;
        }

        .wbv-page .wbv-system-core h2 {
            max-width: 235px;
            font-size: clamp(1.02rem, 1.12vw, 1.26rem);
            line-height: 1.18;
        }

        .wbv-page .wbv-system-core p {
            max-width: 235px;
            margin-top: 0.58rem;
            font-size: 0.70rem;
            line-height: 1.45;
        }

    .wbv-page .wbv-system-node {
        gap: 0.50rem;
        padding: 0.50rem 0.58rem;
        border-radius: 16px;
        font-size: 0.64rem;
    }

        .wbv-page .wbv-system-node i {
            width: 33px;
            height: 33px;
            flex-basis: 33px;
            border-radius: 11px;
        }

    .wbv-page .wbv-system-node-priority {
        top: 0.95rem;
        min-width: 148px;
    }

    .wbv-page .wbv-system-node-product {
        left: 0.70rem;
        min-width: 142px;
    }

    .wbv-page .wbv-system-node-delivery {
        right: 0.70rem;
        min-width: 170px;
    }

    .wbv-page .wbv-system-node-evolution {
        bottom: 0.95rem;
        min-width: 160px;
    }

    .wbv-page .wbv-system-status {
        bottom: 0.70rem;
        font-size: 0.55rem;
    }

    .wbv-page .wbv-system-status-left {
        left: 0.70rem;
    }

    .wbv-page .wbv-system-status-right {
        right: 0.70rem;
    }
}

/* =========================================================
   TABLET AND MOBILE
========================================================= */

@media (max-width: 1199.98px) {
    .wbv-page .wbv-hero-grid {
        grid-template-columns: 1fr !important;
    }

    .wbv-page .wbv-hero-visual {
        justify-content: center;
    }

    .wbv-page .wbv-industry-style-system {
        width: min(100%, 760px);
        min-height: 540px;
        margin-inline: auto;
    }
}

@media (max-width: 767.98px) {
    .wbv-page .wbv-hero-copy h1 {
        font-size: clamp(2.45rem, 10vw, 3.8rem) !important;
    }

    .wbv-page .wbv-industry-style-system {
        display: grid;
        grid-template-columns: 1fr;
        min-height: auto;
        gap: 0.78rem;
        padding: 1rem;
        border-radius: 28px;
    }

    .wbv-page .wbv-system-architecture,
    .wbv-page .wbv-system-status {
        display: none;
    }

    .wbv-page .wbv-system-activity,
    .wbv-page .wbv-system-core,
    .wbv-page .wbv-system-node {
        position: relative;
        inset: auto;
        width: 100%;
        min-width: 0;
        transform: none;
    }

    .wbv-page .wbv-system-activity {
        order: 1;
    }

    .wbv-page .wbv-system-core {
        order: 2;
        min-height: 0;
        padding: 1.35rem 1.05rem;
    }

    .wbv-page .wbv-system-node-priority {
        order: 3;
    }

    .wbv-page .wbv-system-node-product {
        order: 4;
    }

    .wbv-page .wbv-system-node-delivery {
        order: 5;
    }

    .wbv-page .wbv-system-node-evolution {
        order: 6;
    }
}



/* =========================================================
   CURRENT VENDOR HERO — RIGHT VISUAL AOS FIX
   ---------------------------------------------------------
   The animation is applied to a clean inner wrapper so the
   complex architecture panel does not interfere with AOS.
   Only the first-section right visual is affected.
========================================================= */

.wbv-page .wbv-hero-visual-aos {
    display: flex;
    width: 100%;
    min-width: 0;
    justify-content: flex-end;
    will-change: transform, opacity;
}

    .wbv-page .wbv-hero-visual-aos .wbv-industry-style-system {
        width: min(100%, 760px);
        margin-left: auto;
    }

/* Large desktop */
@media (min-width: 1600px) {
    .wbv-page .wbv-hero-visual-aos .wbv-industry-style-system {
        width: min(100%, 790px);
    }
}

/* 16-inch laptop */
@media (min-width: 1400px) and (max-width: 1599.98px) {
    .wbv-page .wbv-hero-visual-aos .wbv-industry-style-system {
        width: min(100%, 700px);
    }
}

/* 14-inch laptop */
@media (min-width: 1200px) and (max-width: 1399.98px) {
    .wbv-page .wbv-hero-visual-aos .wbv-industry-style-system {
        width: min(100%, 620px);
    }
}

/* Tablet and mobile */
@media (max-width: 1199.98px) {
    .wbv-page .wbv-hero-visual-aos {
        justify-content: center;
    }

        .wbv-page .wbv-hero-visual-aos .wbv-industry-style-system {
            width: min(100%, 760px);
            margin-inline: auto;
        }
}

/* Keep content visible before AOS initializes. */
html:not(.aos-enabled) .wbv-page .wbv-hero-visual-aos {
    opacity: 1;
    transform: none;
}



/* =========================================================
   VENDOR V2 — MOBILE DENSITY & BUTTON REFINEMENT
   ---------------------------------------------------------
   Phone-only corrections:
   1. Compact hero action buttons
   2. Compact vendor qualification cards
   3. Compact form submission button
   4. Compact closing contact button

   Preserved:
   - Vendor.cshtml and all wording
   - Hero architecture and AOS animation
   - Registration form, uploads and Turnstile
   - Validation, routes and scripts
   - Tablet, laptop and desktop layouts
========================================================= */

@media (max-width: 767.98px) {

    /* =====================================================
       1. HERO BUTTONS — COMPACT AND CENTRED
    ===================================================== */

    .wbv-page .wbv-actions {
        display: flex !important;
        width: 100% !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 0.62rem !important;
        margin-top: 1.05rem !important;
    }

        .wbv-page .wbv-actions .btn {
            width: auto !important;
            max-width: calc(100% - 0.75rem) !important;
            min-height: 48px !important;
            margin: 0 auto !important;
            padding: 0.72rem 1.30rem !important;
            font-size: 0.78rem !important;
            line-height: 1.20 !important;
            white-space: normal !important;
        }

        .wbv-page .wbv-actions .wbv-btn-primary {
            min-width: min(100%, 285px) !important;
        }

        .wbv-page .wbv-actions .wbv-btn-outline {
            min-width: min(100%, 245px) !important;
        }

    /* =====================================================
       2. VENDOR QUALIFICATION CARDS — COMPACT 2 × 2 GRID
    ===================================================== */

    .wbv-page .wbv-signal-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 0.62rem !important;
        margin-top: 0.90rem !important;
    }

        .wbv-page .wbv-signal-grid article {
            display: grid !important;
            grid-template-columns: 42px minmax(0, 1fr) !important;
            min-height: 94px !important;
            align-items: center !important;
            gap: 0.64rem !important;
            padding: 0.72rem 0.76rem !important;
            border-radius: 17px !important;
            transform: none !important;
        }

            .wbv-page .wbv-signal-grid article > i {
                display: flex !important;
                width: 42px !important;
                height: 42px !important;
                min-width: 42px !important;
                flex: 0 0 42px !important;
                align-items: center !important;
                justify-content: center !important;
                border-radius: 13px !important;
                font-size: 0.92rem !important;
            }

            .wbv-page .wbv-signal-grid article > div {
                min-width: 0 !important;
            }

        .wbv-page .wbv-signal-grid h3 {
            margin: 0 0 0.18rem !important;
            font-size: 0.88rem !important;
            line-height: 1.20 !important;
            white-space: normal !important;
        }

        .wbv-page .wbv-signal-grid p {
            margin: 0 !important;
            font-size: 0.70rem !important;
            line-height: 1.34 !important;
        }

    /* =====================================================
       3. FORM SUBMISSION — COMPACT CENTRED BUTTON
    ===================================================== */

    .wbv-page .wbv-submit-panel {
        display: grid !important;
        grid-template-columns: 1fr !important;
        justify-items: center !important;
        gap: 0.90rem !important;
    }

        .wbv-page .wbv-submit-panel p {
            width: 100% !important;
            margin: 0 !important;
        }

        .wbv-page .wbv-submit-panel .wbv-btn-primary {
            width: auto !important;
            max-width: calc(100% - 0.75rem) !important;
            min-width: min(100%, 285px) !important;
            min-height: 48px !important;
            margin: 0 auto !important;
            padding: 0.72rem 1.30rem !important;
            font-size: 0.78rem !important;
            line-height: 1.20 !important;
            white-space: normal !important;
        }

    /* =====================================================
       4. CLOSING CONTACT BUTTON — COMPACT AND CENTRED
    ===================================================== */

    .wbv-page .wbv-closing-card {
        text-align: center !important;
    }

        .wbv-page .wbv-closing-card .wbv-btn-outline {
            width: auto !important;
            max-width: calc(100% - 0.75rem) !important;
            min-width: min(100%, 285px) !important;
            min-height: 48px !important;
            margin: 1rem auto 0 !important;
            padding: 0.72rem 1.30rem !important;
            font-size: 0.78rem !important;
            line-height: 1.20 !important;
            white-space: normal !important;
        }
}

/* Narrow phones: qualification cards return to one readable column. */
@media (max-width: 519.98px) {

    .wbv-page .wbv-signal-grid {
        grid-template-columns: 1fr !important;
        gap: 0.56rem !important;
    }

        .wbv-page .wbv-signal-grid article {
            min-height: 72px !important;
            padding: 0.62rem 0.68rem !important;
        }
}

/* Very narrow phones retain safe full-width touch areas. */
@media (max-width: 359.98px) {

    .wbv-page .wbv-actions .btn,
    .wbv-page .wbv-submit-panel .wbv-btn-primary,
    .wbv-page .wbv-closing-card .wbv-btn-outline {
        width: calc(100% - 0.5rem) !important;
        max-width: none !important;
        min-width: 0 !important;
    }
}