/*
 * Sagitech VMS V2 DEV
 * Isolated styles for the redesigned VMS landing page.
 */

.vms2-page {
    /* Sagitech desktop palette sampled from the VMS UI:
       #1e2936 navigation/sidebar, #263140 workspace, #2d3a4a panels, #50647f active headers.
       Orange remains the website conversion accent. */
    --vms2-navy: #1e2936;
    --vms2-navy-2: #263140;
    --vms2-blue: #334a62;
    --vms2-blue-hover: #263140;
    --vms2-cyan: #50647f;
    --vms2-text: #263140;
    --vms2-muted: #687789;
    --vms2-soft: #f5f6f8;
    --vms2-soft-blue: #eef1f4;
    --vms2-line: #d9dfe6;
    --vms2-white: #ffffff;
    --vms2-green: #15965a;
    --vms2-green-soft: #e8f8f0;
    --vms2-orange: #f43c0a;
    --vms2-orange-hover: #d93608;
    --vms2-orange-soft: #fff1ec;
    --vms2-red: #a94b4b;
    --vms2-red-soft: #fff0f0;
    --vms2-shadow: 0 16px 45px rgba(30, 41, 54, 0.12);
    --vms2-shadow-sm: 0 8px 24px rgba(30, 41, 54, 0.09);

    color: var(--vms2-text);
    background: #fff;
    font-size: 16px;
    line-height: 1.55;
}

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

/*
 * The global theme adds spacing to Font Awesome icons.
 * VMS V2 controls spacing with flex/grid gap instead.
 */
.vms2-page i,
.vms2-page svg {
    margin-right: 0 !important;
}

.vms2-page h1,
.vms2-page h2,
.vms2-page h3,
.vms2-page h4,
.vms2-page p {
    margin-top: 0;
}

.vms2-page a {
    text-decoration: none;
}

.vms2-container {
    width: min(1320px, calc(100% - 48px));
    margin: 0 auto;
}

.vms2-section {
    padding: 78px 0;
}

.vms2-section-soft {
    background: var(--vms2-soft);
    border-top: 1px solid #edf2f7;
    border-bottom: 1px solid #edf2f7;
}

.vms2-section-head {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 40px;
    margin-bottom: 34px;
}

.vms2-section-head > div:first-child {
    max-width: 760px;
}

.vms2-section-head > p {
    max-width: 480px;
    margin-bottom: 3px;
    color: var(--vms2-muted);
}

.vms2-section-head h2,
.vms2-project-final h2,
.vms2-partner-card h2 {
    margin-bottom: 0;
    color: var(--vms2-navy);
    font-size: clamp(28px, 3vw, 40px);
    line-height: 1.15;
    font-weight: 800;
    letter-spacing: -0.02em;
}

.vms2-section-head-compact {
    display: block;
    margin-bottom: 24px;
}

.vms2-kicker {
    display: inline-block;
    margin-bottom: 8px;
    color: var(--vms2-blue);
    font-size: 13px;
    line-height: 1;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.08em;
}

.vms2-kicker-light {
    color: #c8d0da;
}

/* Hero */
.vms2-hero {
    position: relative;
    overflow: hidden;
    padding: 72px 0 64px;
    background:
        radial-gradient(circle at 78% 12%, rgba(80, 100, 127, 0.12), transparent 30%),
        linear-gradient(135deg, #ffffff 0%, #f3f5f7 58%, #eef1f4 100%);
    border-bottom: 1px solid var(--vms2-line);
}

.vms2-hero::before,
.vms2-hero::after {
    content: '';
    position: absolute;
    pointer-events: none;
    border: 1px solid rgba(80, 100, 127, 0.10);
    transform: rotate(28deg);
}

.vms2-hero::before {
    width: 420px;
    height: 420px;
    right: -180px;
    top: -220px;
}

.vms2-hero::after {
    width: 280px;
    height: 280px;
    left: -160px;
    bottom: -170px;
}

.vms2-hero-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(520px, 1.05fr);
    align-items: center;
    gap: 46px;
}

.vms2-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 18px;
    color: var(--vms2-blue);
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    font-size: 14px;
}

.vms2-eyebrow i {
    display: grid;
    place-items: center;
    width: 32px;
    height: 32px;
    border-radius: 9px;
    color: #fff;
    background: var(--vms2-blue);
}

.vms2-hero h1 {
    max-width: 720px;
    margin-bottom: 20px;
    color: var(--vms2-navy);
    font-size: clamp(38px, 4.1vw, 58px);
    line-height: 1.04;
    letter-spacing: -0.035em;
    font-weight: 850;
}

.vms2-hero-lead {
    max-width: 680px;
    margin-bottom: 30px;
    color: #4c5b6b;
    font-size: clamp(18px, 1.8vw, 23px);
    line-height: 1.45;
}

.vms2-hero-actions,
.vms2-project-final-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
}

.vms2-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    min-height: 48px;
    padding: 12px 20px;
    border: 1px solid transparent;
    border-radius: 8px;
    font: inherit;
    font-weight: 750;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, background-color .18s ease, border-color .18s ease;
}

.vms2-btn:hover {
    transform: translateY(-1px);
}

.vms2-btn-primary {
    color: #fff !important;
    background: linear-gradient(to bottom, #fc550e 0%, var(--vms2-orange) 100%);
    border-color: var(--vms2-orange);
    box-shadow: 0 8px 22px rgba(244, 60, 10, 0.20);
}

.vms2-btn-primary:hover {
    background: linear-gradient(to bottom, #f17743 0%, var(--vms2-orange-hover) 100%);
    border-color: var(--vms2-orange-hover);
}

.vms2-btn-secondary,
.vms2-btn-outline {
    color: var(--vms2-navy) !important;
    background: rgba(255, 255, 255, 0.85);
    border-color: #9ca8b5;
}

.vms2-btn-secondary:hover,
.vms2-btn-outline:hover {
    background: #fff;
    border-color: var(--vms2-blue);
}

.vms2-btn-light {
    color: var(--vms2-navy) !important;
    background: #fff;
    border-color: #fff;
}

.vms2-btn-whatsapp {
    color: #08783f !important;
    background: #fff;
    border-color: #32c77a;
}

.vms2-secondary-contact {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: center;
    margin-top: 18px;
    color: var(--vms2-muted);
    font-size: 14px;
}

.vms2-secondary-contact a {
    color: var(--vms2-blue);
    font-weight: 700;
}

.vms2-secondary-contact a .fa-whatsapp {
    color: #1ba766;
}

.vms2-contact-separator {
    color: #a5b2c2;
}

.vms2-hero-visual {
    position: relative;
}

.vms2-product-frame {
    position: relative;
    overflow: hidden;
    padding: 8px;
    background: #1e2936;
    border: 1px solid #415168;
    border-radius: 10px;
    box-shadow: 0 20px 45px rgba(30, 41, 54, .24);
    transform: none;
}

.vms2-product-frame::before {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(135deg, rgba(255,255,255,.08), transparent 28%);
    pointer-events: none;
}

.vms2-product-frame img {
    display: block;
    width: 100%;
    height: auto;
    border-radius: 6px;
}

/* Trust strip */
.vms2-trust-strip {
    background: #fff;
    border-bottom: 1px solid var(--vms2-line);
}

.vms2-trust-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
}

.vms2-trust-grid > div {
    display: grid;
    grid-template-columns: 34px auto;
    grid-template-rows: auto auto;
    align-items: center;
    column-gap: 12px;
    padding: 22px 24px;
    border-right: 1px solid var(--vms2-line);
}

.vms2-trust-grid > div:last-child {
    border-right: 0;
}

.vms2-trust-grid i {
    grid-row: 1 / span 2;
    color: var(--vms2-blue);
    font-size: 23px;
}

.vms2-trust-grid strong {
    color: var(--vms2-navy);
    font-size: 15px;
}

.vms2-trust-grid span {
    color: var(--vms2-muted);
    font-size: 12px;
}

/* Generic cards */
.vms2-feature-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
}

.vms2-feature-card,
.vms2-audience-grid article,
.vms2-enterprise-grid article,
.vms2-edition-card,
.vms2-usecase-grid article {
    background: #fff;
    border: 1px solid var(--vms2-line);
    border-radius: 14px;
    box-shadow: var(--vms2-shadow-sm);
}

.vms2-feature-card {
    padding: 25px;
}

.vms2-feature-card > i,
.vms2-audience-grid article > i,
.vms2-enterprise-grid article > i,
.vms2-usecase-grid article > i {
    display: grid;
    place-items: center;
    width: 46px;
    height: 46px;
    margin-bottom: 17px;
    color: var(--vms2-blue);
    background: var(--vms2-soft-blue);
    border-radius: 11px;
    font-size: 22px;
}

.vms2-feature-card h3,
.vms2-audience-grid h3,
.vms2-enterprise-grid h3,
.vms2-usecase-grid h3 {
    margin-bottom: 8px;
    color: var(--vms2-navy);
    font-size: 18px;
    line-height: 1.25;
}

.vms2-feature-card p,
.vms2-audience-grid p,
.vms2-enterprise-grid p,
.vms2-usecase-grid p {
    margin-bottom: 0;
    color: var(--vms2-muted);
}

/* Overview */
.vms2-overview-grid {
    display: grid;
    grid-template-columns: minmax(0, .85fr) minmax(480px, 1.15fr);
    gap: 60px;
    align-items: center;
}

.vms2-overview-copy h2 {
    margin-bottom: 18px;
    color: var(--vms2-navy);
    font-size: clamp(28px, 3vw, 42px);
    line-height: 1.15;
}

.vms2-overview-copy p {
    margin-bottom: 22px;
    color: var(--vms2-muted);
    font-size: 17px;
}

.vms2-video-wrap {
    position: relative;
    overflow: hidden;
    aspect-ratio: 16 / 9;
    background: #263140;
    border-radius: 16px;
    box-shadow: var(--vms2-shadow);
}

.vms2-video-wrap iframe {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
}

.vms2-text-link,
.vms2-text-button {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: var(--vms2-blue) !important;
    background: none;
    border: 0;
    padding: 0;
    font: inherit;
    font-weight: 800;
    cursor: pointer;
}

/* Audience and enterprise */
.vms2-audience-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 18px;
}

.vms2-audience-grid article {
    padding: 30px;
}

.vms2-enterprise-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
}

.vms2-enterprise-grid article {
    padding: 23px;
}

.vms2-project-cta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    margin-top: 18px;
    padding: 18px 22px;
    background: #eaf3ff;
    border: 1px solid #d2e4fb;
    border-radius: 12px;
}

.vms2-project-cta strong,
.vms2-project-cta span {
    display: block;
}

.vms2-project-cta strong {
    color: var(--vms2-navy);
}

.vms2-project-cta span {
    color: var(--vms2-muted);
    font-size: 14px;
}

/* Editions */
.vms2-edition-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
    margin-bottom: 34px;
}

.vms2-edition-card {
    position: relative;
    min-height: 310px;
    padding: 28px 24px 24px;
}

.vms2-edition-card.is-featured {
    border-color: #71aaf4;
    box-shadow: 0 18px 40px rgba(30, 41, 54, .14);
}

.vms2-edition-badge {
    position: absolute;
    top: 0;
    left: 20px;
    right: 20px;
    transform: translateY(-50%);
    padding: 6px 10px;
    color: #fff;
    background: var(--vms2-blue);
    border-radius: 999px;
    text-align: center;
    font-size: 11px;
    font-weight: 800;
}

.vms2-edition-icon {
    display: grid;
    place-items: center;
    width: 48px;
    height: 48px;
    margin-bottom: 16px;
    color: var(--vms2-blue);
    background: var(--vms2-soft-blue);
    border-radius: 12px;
    font-size: 21px;
}

.vms2-edition-card h3 {
    margin-bottom: 8px;
    color: var(--vms2-navy);
    font-size: 22px;
}

.vms2-edition-card p {
    min-height: 50px;
    color: var(--vms2-muted);
}

.vms2-edition-card ul {
    display: grid;
    gap: 8px;
    margin: 18px 0 0;
    padding-left: 18px;
    color: #556474;
}

.vms2-summary-comparison {
    overflow: hidden;
    border: 1px solid var(--vms2-line);
    border-radius: 14px;
    background: #fff;
    box-shadow: var(--vms2-shadow-sm);
}

.vms2-comparison-title-row {
    padding: 22px 24px 8px;
}

.vms2-comparison-title-row h3 {
    margin-bottom: 2px;
    color: var(--vms2-navy);
}

.vms2-comparison-title-row p {
    margin-bottom: 0;
    color: var(--vms2-muted);
}

.vms2-table-scroll {
    width: 100%;
    overflow-x: auto;
}

.vms2-table {
    width: 100%;
    border-collapse: collapse;
    min-width: 760px;
}

.vms2-table th,
.vms2-table td {
    padding: 13px 15px;
    border-bottom: 1px solid var(--vms2-line);
    border-right: 1px solid var(--vms2-line);
    text-align: center;
    vertical-align: middle;
    font-size: 14px;
}

.vms2-table th:last-child,
.vms2-table td:last-child {
    border-right: 0;
}

.vms2-table th:first-child,
.vms2-table td:first-child {
    text-align: left;
}

.vms2-table thead th {
    color: var(--vms2-navy);
    background: #eef4fb;
    font-weight: 800;
}

.vms2-table thead th:nth-child(3) {
    background: #dcecff;
}

.vms2-table tbody tr:hover td {
    background: #fbfdff;
}

.vms2-highlight-row td {
    background: #f5faff;
}

.vms2-status {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    min-width: 88px;
    padding: 5px 9px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 800;
    white-space: nowrap;
}

.vms2-status.is-included {
    color: #0f7a47;
    background: var(--vms2-green-soft);
}

.vms2-status.is-optional {
    color: #50647f;
    background: #edf5ff;
}

.vms2-status.is-request {
    color: var(--vms2-orange);
    background: var(--vms2-orange-soft);
}

.vms2-status.is-none {
    min-width: auto;
    padding: 0;
    color: #a1adba;
    background: transparent;
}

.vms2-compare-toggle {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1px;
    width: 100%;
    padding: 16px;
    color: var(--vms2-blue);
    background: #fff;
    border: 0;
    font: inherit;
    font-weight: 800;
    cursor: pointer;
}

.vms2-compare-toggle i {
    transition: transform .2s ease;
}

.vms2-full-comparison {
    margin-top: 28px;
}

.vms2-comparison-intro {
    margin-bottom: 20px;
}

.vms2-comparison-intro h3 {
    margin-bottom: 8px;
    color: var(--vms2-navy);
    font-size: 26px;
}

.vms2-comparison-intro p {
    max-width: 920px;
    color: var(--vms2-muted);
}

.vms2-module-group {
    overflow: hidden;
    margin-bottom: 18px;
    background: #fff;
    border: 1px solid var(--vms2-line);
    border-radius: 13px;
}

.vms2-module-group-head {
    padding: 19px 20px;
    border-bottom: 1px solid var(--vms2-line);
}

.vms2-module-group-head h4 {
    margin-bottom: 4px;
    color: var(--vms2-navy);
    font-size: 18px;
}

.vms2-module-group-head p {
    margin-bottom: 0;
    color: var(--vms2-muted);
    font-size: 13px;
}

.vms2-module-group.is-included .vms2-module-group-head {
    background: #edf8f3;
}

.vms2-module-group.is-neural .vms2-module-group-head {
    background: #eef4ff;
}

.vms2-module-group.is-special .vms2-module-group-head {
    background: #f7f4ff;
}

.vms2-module-group.is-legacy .vms2-module-group-head {
    background: #fff6f1;
}

.vms2-module-table td:first-child a {
    color: var(--vms2-navy);
    font-weight: 700;
}

.vms2-module-table td:first-child a i {
    margin-left: 6px;
    color: #7e92ab;
    font-size: 11px;
}

.vms2-legacy-note {
    display: flex;
    gap: 14px;
    padding: 18px 20px;
    color: #764444;
    background: var(--vms2-red-soft);
    border: 1px solid #f0caca;
    border-radius: 12px;
}

.vms2-legacy-note > i {
    margin-top: 3px;
}

.vms2-legacy-note strong {
    color: #863f3f;
}

.vms2-legacy-note p {
    margin: 3px 0 0;
}

/* Use cases */
.vms2-usecase-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
}

.vms2-usecase-grid article {
    padding: 24px;
}

.vms2-center-link {
    margin-top: 25px;
    text-align: center;
}

/* FAQ + partner */
.vms2-faq-partner-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.25fr) minmax(340px, .75fr);
    gap: 34px;
    align-items: start;
}

.vms2-faq {
    border-top: 1px solid var(--vms2-line);
}

.vms2-faq details {
    border-bottom: 1px solid var(--vms2-line);
}

.vms2-faq summary {
    position: relative;
    padding: 18px 38px 18px 0;
    color: var(--vms2-navy);
    font-weight: 750;
    cursor: pointer;
    list-style: none;
}

.vms2-faq summary::-webkit-details-marker {
    display: none;
}

.vms2-faq summary::after {
    content: '+';
    position: absolute;
    right: 4px;
    top: 15px;
    color: var(--vms2-blue);
    font-size: 24px;
    font-weight: 400;
}

.vms2-faq details[open] summary::after {
    content: '−';
}

.vms2-faq details p {
    padding: 0 38px 18px 0;
    margin: 0;
    color: var(--vms2-muted);
}

.vms2-partner-card {
    position: sticky;
    top: 95px;
    padding: 34px;
    color: #e5e9ee;
    background:
        radial-gradient(circle at 100% 0%, rgba(80,100,127,.30), transparent 38%),
        linear-gradient(145deg, #2d3a4a, #1e2936);
    border-radius: 16px;
    box-shadow: var(--vms2-shadow);
}

.vms2-partner-card h2 {
    margin-bottom: 13px;
    color: #fff;
    font-size: 30px;
}

.vms2-partner-card p {
    color: #d4dbe3;
}

.vms2-partner-icon {
    display: grid;
    place-items: center;
    width: 54px;
    height: 54px;
    margin-bottom: 22px;
    color: #fff;
    background: var(--vms2-blue);
    border-radius: 14px;
    font-size: 24px;
}

.vms2-partner-card ul {
    display: grid;
    gap: 10px;
    margin: 22px 0 27px;
    padding: 0;
    list-style: none;
}

.vms2-partner-card li {
    display: flex;
    gap: 10px;
    align-items: flex-start;
}

.vms2-partner-card li i {
    margin-top: 5px;
    color: #9eacbc;
}

/* Final CTA */
.vms2-project-final {
    padding: 52px 0;
    background: linear-gradient(135deg, #f3f5f7, #ffffff);
    border-top: 1px solid var(--vms2-line);
    border-bottom: 1px solid var(--vms2-line);
}

.vms2-project-final-inner {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 40px;
}

.vms2-project-final h2 {
    margin-bottom: 8px;
    font-size: 34px;
}

.vms2-project-final p {
    max-width: 760px;
    margin-bottom: 0;
    color: var(--vms2-muted);
}

.vms2-project-final-actions {
    flex-shrink: 0;
}

/* Compatibility */
.vms2-compatibility {
    padding: 26px 0;
    background: #fff;
}

.vms2-compatibility .vms2-container {
    display: flex;
    align-items: center;
    gap: 28px;
}

.vms2-compatibility-title {
    flex-shrink: 0;
    color: var(--vms2-muted);
    font-size: 13px;
    font-weight: 750;
}

.vms2-compatibility-list {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.vms2-compatibility-list a,
.vms2-compatibility-list span {
    display: inline-flex;
    align-items: center;
    min-height: 34px;
    padding: 7px 12px;
    color: #506071;
    background: #f7f9fc;
    border: 1px solid var(--vms2-line);
    border-radius: 999px;
    font-size: 12px;
    font-weight: 750;
}

.vms2-compatibility-list a:hover {
    color: var(--vms2-blue);
    border-color: #a9cbf8;
}

@media (max-width: 1120px) {
    .vms2-hero-grid {
        grid-template-columns: 1fr 1fr;
        gap: 34px;
    }

    .vms2-feature-grid,
    .vms2-enterprise-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .vms2-edition-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .vms2-usecase-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .vms2-trust-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .vms2-trust-grid > div:nth-child(2) {
        border-right: 0;
    }

    .vms2-trust-grid > div:nth-child(-n+2) {
        border-bottom: 1px solid var(--vms2-line);
    }
}

@media (max-width: 900px) {
    .vms2-container {
        width: min(100% - 32px, 1240px);
    }

    .vms2-section {
        padding: 58px 0;
    }

    .vms2-hero-grid,
    .vms2-overview-grid,
    .vms2-faq-partner-grid {
        grid-template-columns: 1fr;
    }

    .vms2-hero {
        padding-top: 48px;
    }

    .vms2-hero-visual {
        max-width: 760px;
        margin: 0 auto;
    }

    .vms2-section-head,
    .vms2-project-final-inner,
    .vms2-compatibility .vms2-container {
        display: block;
    }

    .vms2-section-head > p {
        max-width: none;
        margin-top: 14px;
    }

    .vms2-audience-grid {
        grid-template-columns: 1fr;
    }

    .vms2-project-final-actions {
        margin-top: 22px;
    }

    .vms2-compatibility-list {
        margin-top: 14px;
    }

    .vms2-partner-card {
        position: static;
    }
}

@media (max-width: 680px) {
    .vms2-container {
        width: min(100% - 24px, 1240px);
    }

    .vms2-hero h1 {
        font-size: 38px;
    }

    .vms2-hero-lead {
        font-size: 18px;
    }

    .vms2-hero-actions,
    .vms2-project-final-actions {
        display: grid;
        grid-template-columns: 1fr;
    }

    .vms2-btn {
        width: 100%;
    }

    .vms2-feature-grid,
    .vms2-enterprise-grid,
    .vms2-edition-grid,
    .vms2-usecase-grid,
    .vms2-trust-grid {
        grid-template-columns: 1fr;
    }

    .vms2-trust-grid > div,
    .vms2-trust-grid > div:nth-child(2) {
        border-right: 0;
        border-bottom: 1px solid var(--vms2-line);
    }

    .vms2-trust-grid > div:last-child {
        border-bottom: 0;
    }

    .vms2-project-cta {
        display: block;
    }

    .vms2-project-cta .vms2-text-button {
        margin-top: 14px;
    }

    .vms2-edition-card {
        min-height: 0;
    }

    .vms2-table {
        min-width: 690px;
    }
}

/* ========================================================================== */
/* Sagitech VMS V2 — visual refinement                                        */
/* Match existing Sagitech website + Sagitech VMS desktop UI                  */
/* ========================================================================== */

.vms2-page {
    --vms2-navy: #1e2936;
    --vms2-workspace: #263140;
    --vms2-panel: #2d3a4a;
    --vms2-blue: #334a62;
    --vms2-blue-light: #50647f;

    --vms2-text: #263140;
    --vms2-muted: #667584;

    --vms2-bg: #ffffff;
    --vms2-bg-soft: #f5f5f5;
    --vms2-bg-soft-2: #f1f1f187;

    --vms2-line: #d8dde2;

    --vms2-orange: #f43c0a;
    --vms2-orange-top: #fc550e;
    --vms2-orange-hover: #df3508;

    --vms2-shadow-small:
        0 2px 8px rgba(30, 41, 54, 0.10);

    --vms2-shadow:
        0 8px 24px rgba(30, 41, 54, 0.12);

    background: #ffffff;
    color: var(--vms2-text);
}


/* -------------------------------------------------------------------------- */
/* Main layout                                                                */
/* -------------------------------------------------------------------------- */

.vms2-container {
    width: min(1280px, calc(100% - 60px));
    margin: 0 auto;
}

.vms2-section {
    padding: 68px 0;
}

.vms2-section-soft {
    background: var(--vms2-bg-soft-2);
    border-top: 1px solid #eeeeee;
    border-bottom: 1px solid #eeeeee;
}


/* -------------------------------------------------------------------------- */
/* Titles                                                                     */
/* -------------------------------------------------------------------------- */

.vms2-section-head {
    margin-bottom: 32px;
}

.vms2-section-head h2,
.vms2-overview-copy h2,
.vms2-project-final h2 {
    color: #334a62;

    background-image:
        linear-gradient(
            45deg,
            #334a62,
            #1e2936
        );

    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;

    font-family: "Roboto", sans-serif;
    font-weight: 900;
    letter-spacing: 0.1px;
}

.vms2-section-head h2 {
    font-size: 32px;
    line-height: 1.2;
}

.vms2-kicker {
    margin-bottom: 9px;

    color: #687789;

    font-size: 12px;
    font-weight: 500;

    letter-spacing: 1.4px;
    text-transform: uppercase;
}


/* -------------------------------------------------------------------------- */
/* Hero                                                                       */
/* -------------------------------------------------------------------------- */

.vms2-hero {
    padding: 72px 0 68px;

    background:
        linear-gradient(
            180deg,
            #ffffff 0%,
            #fafafa 100%
        );

    border-bottom:
        1px solid #eeeeee;
}


/* Remove decorative SaaS polygons */

.vms2-hero::before,
.vms2-hero::after {
    display: none;
}


/* Layout */

.vms2-hero-grid {
    grid-template-columns:
        minmax(430px, 0.82fr)
        minmax(560px, 1.18fr);

    gap: 70px;
}


/* Small title */

.vms2-eyebrow {
    margin-bottom: 24px;

    color: #687789;

    font-size: 13px;
    font-weight: 500;

    letter-spacing: 1.3px;
}

.vms2-eyebrow i {
    display: none;
}


/* Main title */

.vms2-hero h1 {
    max-width: 610px;

    margin-bottom: 22px;

    color: #334a62;

    background-image:
        linear-gradient(
            45deg,
            #334a62,
            #1e2936
        );

    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;

    font-family: "Roboto", sans-serif;

    font-size:
        clamp(
            42px,
            3.4vw,
            54px
        );

    line-height: 1.08;

    font-weight: 900;

    letter-spacing: -0.5px;
}


/* Description */

.vms2-hero-lead {
    max-width: 610px;

    margin-bottom: 30px;

    color: #343f4b;

    font-size: 19px;
    line-height: 1.6;

    font-weight: 400;
}


/* Buttons */

.vms2-hero-actions {
    gap: 14px;
}


/* Main orange CTA */

.vms2-btn-primary {
    background:
        linear-gradient(
            to bottom,
            #fc550e 0%,
            #f43c0a 100%
        );

    border:
        1px solid #f43c0a;

    color: #ffffff !important;

    box-shadow:
        0 4px 12px
        rgba(244, 60, 10, 0.20);
}

.vms2-btn-primary:hover {
    background:
        linear-gradient(
            to bottom,
            #f17743 0%,
            #f43c0a 100%
        );

    border-color:
        #f43c0a;
}


/* Secondary buttons */

.vms2-btn-secondary,
.vms2-btn-outline {
    background: #ffffff;

    border:
        2px solid #334a62;

    color:
        #334a62 !important;

    box-shadow: none;
}

.vms2-btn-secondary:hover,
.vms2-btn-outline:hover {
    background:
        #334a62;

    color:
        #ffffff !important;
}


/* All buttons closer to existing site */

.vms2-btn {
    min-height: 46px;

    padding:
        10px 22px;

    border-radius: 6px;

    font-size: 14px;
    font-weight: 600;

    transition:
        background-color .15s ease,
        color .15s ease,
        border-color .15s ease,
        transform .15s ease;
}

.vms2-btn:hover {
    transform:
        translateY(-1px);
}


/* Contact under buttons */

.vms2-secondary-contact {
    margin-top: 20px;

    color:
        #717171;

    font-size:
        13px;
}

.vms2-secondary-contact a {
    color:
        #334a62;

    font-weight:
        600;
}


/* -------------------------------------------------------------------------- */
/* Product screenshot                                                         */
/* -------------------------------------------------------------------------- */

.vms2-product-frame {
    overflow: visible;

    padding: 0;

    background: transparent;

    border: none;

    border-radius: 0;

    box-shadow: none;
}

.vms2-product-frame::before {
    display: none;
}

.vms2-product-frame img {
    width: 100%;

    border-radius: 2px;

    box-shadow:
        0 8px 28px
        rgba(
            0,
            0,
            0,
            0.22
        );
}


/* -------------------------------------------------------------------------- */
/* Trust strip                                                                */
/* -------------------------------------------------------------------------- */

.vms2-trust-strip {
    background: #ffffff;

    border-top:
        1px solid #eeeeee;

    border-bottom:
        1px solid #eeeeee;
}

.vms2-trust-grid > div {
    padding:
        20px 28px;
}

.vms2-trust-grid i {
    color:
        #334a62;
}

.vms2-trust-grid strong {
    color:
        #334a62;

    font-size:
        14px;
}


/* -------------------------------------------------------------------------- */
/* Cards                                                                      */
/* -------------------------------------------------------------------------- */

.vms2-feature-card,
.vms2-audience-grid article,
.vms2-enterprise-grid article,
.vms2-edition-card,
.vms2-usecase-grid article {
    background:
        #ffffff;

    border:
        1px solid #e1e4e7;

    border-radius:
        6px;

    box-shadow:
        0 2px 7px
        rgba(
            30,
            41,
            54,
            0.08
        );

    transition:
        box-shadow .2s ease,
        transform .2s ease;
}


.vms2-feature-card:hover,
.vms2-audience-grid article:hover,
.vms2-enterprise-grid article:hover,
.vms2-usecase-grid article:hover {
    transform:
        translateY(-2px);

    box-shadow:
        0 6px 14px
        rgba(
            30,
            41,
            54,
            0.12
        );
}


/* Icons */

.vms2-feature-card > i,
.vms2-audience-grid article > i,
.vms2-enterprise-grid article > i,
.vms2-usecase-grid article > i {
    width:
        44px;

    height:
        44px;

    margin-bottom:
        16px;

    color:
        #334a62;

    background:
        #f1f1f1;

    border-radius:
        5px;
}


/* Card titles */

.vms2-feature-card h3,
.vms2-audience-grid h3,
.vms2-enterprise-grid h3,
.vms2-usecase-grid h3 {
    color:
        #334a62;

    font-weight:
        800;
}


/* -------------------------------------------------------------------------- */
/* Video overview                                                             */
/* -------------------------------------------------------------------------- */

.vms2-video-wrap {
    border-radius:
        6px;

    background:
        #1e2936;

    box-shadow:
        0 4px 16px
        rgba(
            0,
            0,
            0,
            0.18
        );
}


/* -------------------------------------------------------------------------- */
/* Enterprise CTA                                                             */
/* -------------------------------------------------------------------------- */

.vms2-project-cta {
    background:
        #f5f5f5;

    border:
        1px solid #dedede;

    border-left:
        5px solid #334a62;

    border-radius:
        5px;
}


/* -------------------------------------------------------------------------- */
/* Editions                                                                   */
/* -------------------------------------------------------------------------- */

.vms2-edition-grid {
    gap:
        20px;
}


/* Edition card */

.vms2-edition-card {
    padding:
        30px 24px 24px;

    min-height:
        300px;
}


/* Professional */

.vms2-edition-card.is-featured {
    border:
        2px solid #334a62;

    box-shadow:
        0 5px 16px
        rgba(
            51,
            74,
            98,
            0.17
        );
}


/* Badge */

.vms2-edition-badge {
    left:
        18px;

    right:
        18px;

    color:
        #ffffff;

    background:
        linear-gradient(
            to bottom,
            #fc550e,
            #f43c0a
        );

    border-radius:
        4px;

    font-size:
        11px;

    text-transform:
        uppercase;
}


/* Icons */

.vms2-edition-icon {
    color:
        #334a62;

    background:
        #f1f1f1;

    border-radius:
        5px;
}


/* -------------------------------------------------------------------------- */
/* Edition comparison                                                         */
/* -------------------------------------------------------------------------- */

.vms2-summary-comparison {
    border-radius:
        5px;

    border:
        1px solid #dedede;

    box-shadow:
        0 2px 7px
        rgba(
            0,
            0,
            0,
            0.07
        );
}


/* Header */

.vms2-table thead th {
    background:
        #f1f1f1;

    color:
        #334a62;
}


/* Professional column */

.vms2-table thead th:nth-child(3) {
    color:
        #ffffff;

    background:
        #50647f;
}


/* No blue hover */

.vms2-table tbody tr:hover td {
    background:
        #f7f7f7;
}


/* Highlight analytics row */

.vms2-highlight-row td {
    background:
        #f5f5f5;
}


/* -------------------------------------------------------------------------- */
/* Status labels                                                              */
/* -------------------------------------------------------------------------- */

.vms2-status {
    min-width:
        82px;

    border-radius:
        4px;
}


/* Included: Sagitech blue-gray instead of green */

.vms2-status.is-included {
    color:
        #ffffff;

    background:
        #50647f;
}


/* Optional */

.vms2-status.is-optional {
    color:
        #334a62;

    background:
        #eef0f2;
}


/* On request */

.vms2-status.is-request {
    color:
        #ffffff;

    background:
        #f43c0a;
}


/* -------------------------------------------------------------------------- */
/* Full module comparison                                                     */
/* -------------------------------------------------------------------------- */

.vms2-module-group {
    border-radius:
        5px;
}


/* Included modules */

.vms2-module-group.is-included
.vms2-module-group-head {
    background:
        #e9edf1;

    border-left:
        5px solid #50647f;
}


/* Advanced */

.vms2-module-group.is-advanced
.vms2-module-group-head {
    background:
        #f5f5f5;

    border-left:
        5px solid #334a62;
}


/* Neural */

.vms2-module-group.is-neural
.vms2-module-group-head {
    background:
        #edf0f3;

    border-left:
        5px solid #263140;
}


/* Additional */

.vms2-module-group.is-optional
.vms2-module-group-head {
    background:
        #f7f7f7;

    border-left:
        5px solid #687789;
}


/* FR / LPR */

.vms2-module-group.is-special
.vms2-module-group-head {
    background:
        #f7f7f7;

    border-left:
        5px solid #f43c0a;
}


/* Legacy */

.vms2-module-group.is-legacy
.vms2-module-group-head {
    background:
        #fafafa;

    border-left:
        5px solid #9a9a9a;
}


/* Legacy warning */

.vms2-legacy-note {
    color:
        #4f4f4f;

    background:
        #f5f5f5;

    border:
        1px solid #dddddd;

    border-left:
        5px solid #f43c0a;

    border-radius:
        5px;
}

.vms2-legacy-note strong {
    color:
        #334a62;
}


/* -------------------------------------------------------------------------- */
/* Compare button                                                             */
/* -------------------------------------------------------------------------- */

.vms2-compare-toggle {
    color:
        #334a62;

    background:
        #ffffff;

    border-top:
        1px solid #dedede;

    text-transform:
        uppercase;

    font-size:
        13px;

    font-weight:
        700;
}

.vms2-compare-toggle:hover {
    background:
        #f5f5f5;
}


/* -------------------------------------------------------------------------- */
/* Partner card                                                               */
/* -------------------------------------------------------------------------- */

.vms2-partner-card {
    padding:
        32px;

    background:
        linear-gradient(
            145deg,
            #334a62 0%,
            #1e2936 100%
        );

    border-radius:
        6px;

    box-shadow:
        0 5px 18px
        rgba(
            0,
            0,
            0,
            0.18
        );
}

.vms2-partner-icon {
    color:
        #ffffff;

    background:
        #50647f;

    border-radius:
        5px;
}


/* Orange button inside partner */

.vms2-partner-card
.vms2-btn-light {
    color:
        #ffffff !important;

    background:
        linear-gradient(
            to bottom,
            #fc550e,
            #f43c0a
        );

    border-color:
        #f43c0a;
}


/* -------------------------------------------------------------------------- */
/* FAQ                                                                        */
/* -------------------------------------------------------------------------- */

.vms2-faq summary {
    color:
        #334a62;

    font-weight:
        600;
}

.vms2-faq summary::after {
    color:
        #f43c0a;
}


/* -------------------------------------------------------------------------- */
/* Bottom CTA                                                                 */
/* -------------------------------------------------------------------------- */

.vms2-project-final {
    background:
        #f1f1f187;

    border-top:
        1px solid #e3e3e3;

    border-bottom:
        1px solid #e3e3e3;
}


/* -------------------------------------------------------------------------- */
/* Compatibility                                                              */
/* -------------------------------------------------------------------------- */

.vms2-compatibility-list a,
.vms2-compatibility-list span {
    color:
        #334a62;

    background:
        #ffffff;

    border:
        1px solid #cfd5db;

    border-radius:
        4px;
}


/* -------------------------------------------------------------------------- */
/* Responsive                                                                 */
/* -------------------------------------------------------------------------- */

@media (max-width: 1100px) {

    .vms2-hero-grid {
        grid-template-columns:
            1fr 1fr;

        gap:
            40px;
    }

    .vms2-hero h1 {
        font-size:
            42px;
    }
}


@media (max-width: 900px) {

    .vms2-container {
        width:
            calc(100% - 36px);
    }

    .vms2-hero-grid {
        grid-template-columns:
            1fr;
    }

    .vms2-hero-copy {
        max-width:
            720px;
    }

    .vms2-hero-visual {
        max-width:
            780px;

        width:
            100%;
    }
}


@media (max-width: 680px) {

    .vms2-container {
        width:
            calc(100% - 24px);
    }

    .vms2-hero {
        padding:
            46px 0;
    }

    .vms2-hero h1 {
        font-size:
            36px;
    }

    .vms2-hero-lead {
        font-size:
            17px;
    }

    .vms2-section {
        padding:
            50px 0;
    }

    .vms2-section-head h2 {
        font-size:
            28px;
    }
}

/* ========================================================================== */
/* Sagitech VMS V2 — compact desktop layout                                   */
/* ========================================================================== */


/* -------------------------------------------------------------------------- */
/* General                                                                    */
/* -------------------------------------------------------------------------- */

.vms2-container {
    width: min(1280px, calc(100% - 48px));
}

.vms2-section {
    padding: 48px 0;
}

.vms2-section-head {
    gap: 30px;
    margin-bottom: 24px;
}

.vms2-section-head h2 {
    font-size: 28px;
}

.vms2-section-head > p {
    font-size: 15px;
    line-height: 1.5;
}


/* -------------------------------------------------------------------------- */
/* Hero                                                                       */
/* -------------------------------------------------------------------------- */

.vms2-hero {
    padding: 42px 0 38px;
}

.vms2-hero-grid {
    grid-template-columns:
        minmax(400px, 0.9fr)
        minmax(500px, 1.1fr);

    gap: 52px;
}

.vms2-eyebrow {
    margin-bottom: 14px;
    font-size: 12px;
}

.vms2-hero h1 {
    max-width: 570px;

    margin-bottom: 18px;

    font-size: clamp(36px, 3vw, 46px);
    line-height: 1.08;
}

.vms2-hero-lead {
    max-width: 590px;

    margin-bottom: 22px;

    font-size: 17px;
    line-height: 1.5;
}

.vms2-hero-actions {
    gap: 10px;
}

.vms2-btn {
    min-height: 42px;

    padding: 9px 18px;

    font-size: 13px;
}

.vms2-secondary-contact {
    margin-top: 14px;

    font-size: 12px;
}


/* -------------------------------------------------------------------------- */
/* Hero image                                                                 */
/* -------------------------------------------------------------------------- */

.vms2-hero-visual {
    display: flex;
    align-items: center;
    justify-content: center;
}

.vms2-product-frame {
    width: 100%;
    max-width: 570px;
    margin: 0 auto;
}

.vms2-product-frame img {
    display: block;

    width: 100%;
    max-height: 455px;

    object-fit: contain;

    box-shadow:
        0 7px 22px
        rgba(0, 0, 0, 0.16);
}


/* -------------------------------------------------------------------------- */
/* Trust strip                                                                */
/* -------------------------------------------------------------------------- */

.vms2-trust-grid > div {
    grid-template-columns: 26px 1fr;
    grid-template-rows: auto auto;

    column-gap: 10px;

    padding: 13px 18px;
}

.vms2-trust-grid i {
    font-size: 18px;
}

.vms2-trust-grid strong {
    font-size: 13px;
    line-height: 1.2;
}

.vms2-trust-grid span {
    font-size: 11px;
    line-height: 1.25;
}


/* -------------------------------------------------------------------------- */
/* Why Teams Choose Sagitech                                                  */
/* -------------------------------------------------------------------------- */

.vms2-feature-grid {
    grid-template-columns: repeat(6, 1fr);

    gap: 12px;
}

.vms2-feature-card {
    min-height: 155px;

    padding: 18px 16px;
}

.vms2-feature-card > i {
    width: 34px;
    height: 34px;

    margin-bottom: 11px;

    font-size: 17px;
}

.vms2-feature-card h3 {
    margin-bottom: 6px;

    font-size: 14px;
    line-height: 1.25;
}

.vms2-feature-card p {
    font-size: 12px;
    line-height: 1.45;
}


/* -------------------------------------------------------------------------- */
/* Overview                                                                   */
/* -------------------------------------------------------------------------- */

.vms2-overview-grid {
    grid-template-columns:
        minmax(0, 0.85fr)
        minmax(420px, 1.15fr);

    gap: 42px;
}

.vms2-overview-copy h2 {
    font-size: 30px;
}

.vms2-overview-copy p {
    font-size: 15px;
}

.vms2-video-wrap {
    border-radius: 5px;
}


/* -------------------------------------------------------------------------- */
/* Audience                                                                   */
/* -------------------------------------------------------------------------- */

.vms2-audience-grid {
    gap: 14px;
}

.vms2-audience-grid article {
    padding: 22px;
}

.vms2-audience-grid article > i {
    width: 38px;
    height: 38px;

    margin-bottom: 12px;

    font-size: 18px;
}

.vms2-audience-grid h3 {
    font-size: 16px;
}

.vms2-audience-grid p {
    font-size: 13px;
}


/* -------------------------------------------------------------------------- */
/* Enterprise                                                                 */
/* -------------------------------------------------------------------------- */

.vms2-enterprise-grid {
    gap: 12px;
}

.vms2-enterprise-grid article {
    padding: 18px;
}

.vms2-enterprise-grid article > i {
    width: 36px;
    height: 36px;

    margin-bottom: 10px;

    font-size: 17px;
}

.vms2-enterprise-grid h3 {
    font-size: 15px;
}

.vms2-enterprise-grid p {
    font-size: 12px;
}


/* -------------------------------------------------------------------------- */
/* Editions                                                                   */
/* -------------------------------------------------------------------------- */

.vms2-edition-grid {
    gap: 14px;
    margin-bottom: 26px;
}

.vms2-edition-card {
    min-height: 250px;

    padding: 22px 20px 18px;
}

.vms2-edition-icon {
    width: 40px;
    height: 40px;

    margin-bottom: 12px;

    font-size: 18px;
}

.vms2-edition-card h3 {
    font-size: 19px;
}

.vms2-edition-card p {
    min-height: 42px;

    font-size: 13px;
}

.vms2-edition-card ul {
    gap: 6px;

    margin-top: 12px;

    font-size: 13px;
}


/* -------------------------------------------------------------------------- */
/* Comparison                                                                 */
/* -------------------------------------------------------------------------- */

.vms2-comparison-title-row {
    padding: 16px 18px 6px;
}

.vms2-comparison-title-row h3 {
    font-size: 18px;
}

.vms2-comparison-title-row p {
    font-size: 12px;
}

.vms2-table th,
.vms2-table td {
    padding: 9px 11px;

    font-size: 12px;
}

.vms2-status {
    min-width: 72px;

    padding: 4px 7px;

    font-size: 10px;
}

.vms2-compare-toggle {
    padding: 12px;

    font-size: 12px;
}


/* -------------------------------------------------------------------------- */
/* Use cases                                                                  */
/* -------------------------------------------------------------------------- */

.vms2-usecase-grid {
    gap: 12px;
}

.vms2-usecase-grid article {
    padding: 18px;
}

.vms2-usecase-grid article > i {
    width: 36px;
    height: 36px;

    margin-bottom: 10px;

    font-size: 17px;
}

.vms2-usecase-grid h3 {
    font-size: 15px;
}

.vms2-usecase-grid p {
    font-size: 12px;
}


/* -------------------------------------------------------------------------- */
/* FAQ + Partner                                                              */
/* -------------------------------------------------------------------------- */

.vms2-faq-partner-grid {
    gap: 28px;
}

.vms2-faq summary {
    padding: 13px 34px 13px 0;

    font-size: 14px;
}

.vms2-faq summary::after {
    top: 9px;
}

.vms2-faq details p {
    padding-bottom: 14px;

    font-size: 13px;
}

.vms2-partner-card {
    padding: 26px;
}

.vms2-partner-card h2 {
    font-size: 26px;
}

.vms2-partner-card p,
.vms2-partner-card li {
    font-size: 13px;
}


/* -------------------------------------------------------------------------- */
/* Bottom CTA                                                                 */
/* -------------------------------------------------------------------------- */

.vms2-project-final {
    padding: 38px 0;
}

.vms2-project-final h2 {
    font-size: 28px;
}

.vms2-project-final p {
    font-size: 14px;
}


/* ========================================================================== */
/* Breakpoints                                                                */
/* ========================================================================== */

@media (max-width: 1250px) {

    .vms2-feature-grid {
        grid-template-columns: repeat(3, 1fr);
    }

    .vms2-feature-card {
        min-height: 150px;
    }
}


@media (max-width: 1050px) {

    .vms2-hero-grid {
        grid-template-columns: 1fr 1fr;
        gap: 32px;
    }

    .vms2-hero h1 {
        font-size: 38px;
    }

    .vms2-product-frame {
        max-width: 500px;
    }
}


@media (max-width: 900px) {

    .vms2-hero-grid {
        grid-template-columns: 1fr;
    }

    .vms2-feature-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .vms2-product-frame {
        max-width: 650px;
    }
}


@media (max-width: 600px) {

    .vms2-feature-grid {
        grid-template-columns: 1fr;
    }
}

/* ========================================================================== */
/* Trust strip V2                                                             */
/* ========================================================================== */

.vms2-trust-item {
    display: flex !important;
    align-items: center !important;

    gap: 12px;

    padding: 15px 22px !important;
}

.vms2-trust-item > i {
    display: flex;

    align-items: center;
    justify-content: center;

    flex: 0 0 auto;

    width: 34px;
    height: 34px;

    color: #334a62;

    background: #f1f1f1;

    border-radius: 5px;

    font-size: 16px;

    grid-row: auto !important;
}

.vms2-trust-content {
    display: flex;

    flex-direction: column;

    min-width: 0;
}

.vms2-trust-content strong {
    color: #334a62;

    font-size: 13px;

    font-weight: 700;

    line-height: 1.25;

    white-space: nowrap;
}

.vms2-trust-content span {
    margin-top: 2px;

    color: #717171;

    font-size: 11px;

    line-height: 1.3;
}


/* ========================================================================== */
/* Open standards                                                             */
/* ========================================================================== */

.vms2-compatibility {
    padding: 28px 0;

    background: #ffffff;

    border-top: 1px solid #e5e5e5;
}

.vms2-compatibility .vms2-container {
    display: grid;

    grid-template-columns:
        minmax(250px, 1fr)
        auto
        auto;

    gap: 28px;

    align-items: center;
}

.vms2-compatibility-copy {
    display: flex;

    flex-direction: column;

    gap: 4px;
}

.vms2-compatibility-title {
    color: #334a62;

    font-size: 13px;

    font-weight: 800;

    text-transform: uppercase;

    letter-spacing: .5px;
}

.vms2-compatibility-subtitle {
    max-width: 390px;

    color: #717171;

    font-size: 12px;

    line-height: 1.4;
}

.vms2-compatibility-list {
    display: flex;

    flex-wrap: wrap;

    gap: 8px;
}

.vms2-compatibility-list span {
    display: inline-flex;

    align-items: center;

    min-height: 32px;

    padding: 6px 12px;

    color: #334a62;

    background: #f5f5f5;

    border: 1px solid #d8dde2;

    border-radius: 4px;

    font-size: 11px;

    font-weight: 700;
}

.vms2-compatibility-link {
    display: inline-flex;

    align-items: center;

    gap: 8px;

    color: #334a62 !important;

    font-size: 12px;

    font-weight: 800;

    white-space: nowrap;
}

.vms2-compatibility-link:hover {
    color: #f43c0a !important;
}


/* Responsive */

@media (max-width: 1050px) {

    .vms2-compatibility .vms2-container {
        grid-template-columns: 1fr;
        gap: 16px;
    }
}


@media (max-width: 700px) {

    .vms2-trust-content strong {
        white-space: normal;
    }
}

/* ========================================================================== */
/* Compare all features arrow                                                 */
/* ========================================================================== */

.vms2-compare-toggle::after {
    content: "▼";

    display: inline-block;

    margin-left: 8px;

    color: #334a62;

    font-size: 10px;
    line-height: 1;

    vertical-align: middle;
}


/* Expanded */

.vms2-compare-toggle[aria-expanded="true"]::after {
    content: "▲";
}

/* ========================================================================== */
/* Responsive video block                                                     */
/* ========================================================================== */

.vms2-overview-grid {
    min-width: 0;
}

.vms2-overview-grid > * {
    min-width: 0;
}

.vms2-video-wrap {
    position: relative;

    width: 100%;
    max-width: 100%;

    aspect-ratio: 16 / 9;

    overflow: hidden;

    background: #1e2936;

    border-radius: 5px;

    box-shadow:
        0 4px 16px
        rgba(0, 0, 0, 0.18);
}

.vms2-video-wrap iframe {
    position: absolute;

    inset: 0;

    display: block;

    width: 100%;
    height: 100%;

    max-width: 100%;

    border: 0;
}


/* Tablet */

@media (max-width: 900px) {

    .vms2-overview-grid {
        grid-template-columns: 1fr;

        gap: 28px;
    }

    .vms2-video-wrap {
        width: 100%;

        max-width: 760px;

        margin: 0 auto;
    }
}


/* Mobile */

@media (max-width: 600px) {

    .vms2-overview-grid {
        gap: 22px;
    }

    .vms2-video-wrap {
        width: 100%;

        max-width: none;

        border-radius: 4px;
    }
}

/* ========================================================================== */
/* Hero stacking                                                              */
/* ========================================================================== */

.vms2-hero {
    position: relative;
    z-index: 0;
}

.vms2-hero-grid {
    position: relative;
    z-index: auto;
}
/* ========================================================================== */
/* Unified analytics comparison table                                         */
/* ========================================================================== */

.vms2-module-comparison {
    overflow: hidden;

    background: #ffffff;

    border:
        1px solid
        var(--vms2-line);

    border-radius: 5px;
}


/* -------------------------------------------------------------------------- */
/* Fixed column layout                                                        */
/* -------------------------------------------------------------------------- */

.vms2-module-table-unified {
    width: 100%;

    min-width: 850px;

    table-layout: fixed;

    border-collapse: collapse;
}


/* Module name */

.vms2-module-table-unified
.vms2-col-module {
    width: 44%;
}


/* Editions */

.vms2-module-table-unified
.vms2-col-edition {
    width: 14%;
}


/* -------------------------------------------------------------------------- */
/* Header                                                                     */
/* -------------------------------------------------------------------------- */

.vms2-module-table-unified thead th {
    position: sticky;

    top: 0;

    z-index: 2;

    padding:
        11px 12px;

    color:
        #334a62;

    background:
        #f1f1f1;

    border-bottom:
        1px solid
        #cfd5db;

    font-size:
        12px;

    font-weight:
        800;

    text-align:
        center;
}


.vms2-module-table-unified
thead th:first-child {
    text-align: left;
}


/* Professional */

.vms2-module-table-unified
thead th:nth-child(3) {
    color: #ffffff;

    background:
        #50647f;
}


/* -------------------------------------------------------------------------- */
/* Normal rows                                                                */
/* -------------------------------------------------------------------------- */

.vms2-module-table-unified
.vms2-module-row td {
    padding:
        9px 12px;

    border-bottom:
        1px solid
        #e2e5e8;

    border-right:
        1px solid
        #e2e5e8;

    text-align:
        center;

    vertical-align:
        middle;

    font-size:
        12px;
}


.vms2-module-table-unified
.vms2-module-row td:last-child {
    border-right: 0;
}


.vms2-module-table-unified
.vms2-module-row
.vms2-module-name {
    text-align: left;
}


/* Module links */

.vms2-module-table-unified
.vms2-module-name a {
    color:
        #263140;

    font-weight:
        600;

    line-height:
        1.35;
}


.vms2-module-table-unified
.vms2-module-name a:hover {
    color:
        #f43c0a;
}


.vms2-module-table-unified
.vms2-module-name a i,
.vms2-module-table-unified
.vms2-module-name a svg {
    margin-left:
        5px;

    color:
        #85919e;

    font-size:
        9px;
}


/* Zebra effect */

.vms2-module-table-unified
.vms2-module-row:nth-child(even) td {
    background:
        #fafafa;
}


.vms2-module-table-unified
.vms2-module-row:hover td {
    background:
        #f3f5f7;
}


/* -------------------------------------------------------------------------- */
/* Section rows                                                               */
/* -------------------------------------------------------------------------- */

.vms2-module-section-row td {
    padding: 0 !important;

    border-right: 0 !important;

    border-bottom:
        1px solid
        #d6dbe0 !important;

    text-align:
        left !important;
}


.vms2-module-section-content {
    display: flex;

    align-items: baseline;

    gap: 14px;

    width: 100%;

    padding:
        10px 14px;

    border-left:
        4px solid
        #50647f;
}


.vms2-module-section-content strong {
    flex-shrink: 0;

    color:
        #263140;

    font-size:
        13px;

    font-weight:
        800;
}


.vms2-module-section-content span {
    color:
        #687789;

    font-size:
        11px;

    line-height:
        1.4;
}


/* -------------------------------------------------------------------------- */
/* Section colors                                                             */
/* -------------------------------------------------------------------------- */

.vms2-module-section-row.is-included
.vms2-module-section-content {
    background:
        #e9edf1;

    border-left-color:
        #50647f;
}


.vms2-module-section-row.is-advanced
.vms2-module-section-content {
    background:
        #f4f5f6;

    border-left-color:
        #334a62;
}


.vms2-module-section-row.is-neural
.vms2-module-section-content {
    background:
        #edf0f3;

    border-left-color:
        #263140;
}


.vms2-module-section-row.is-optional
.vms2-module-section-content {
    background:
        #f6f6f6;

    border-left-color:
        #687789;
}


.vms2-module-section-row.is-special
.vms2-module-section-content {
    background:
        #fff4ef;

    border-left-color:
        #f43c0a;
}


.vms2-module-section-row.is-legacy
.vms2-module-section-content {
    background:
        #f3f3f3;

    border-left-color:
        #999999;
}


/* -------------------------------------------------------------------------- */
/* Status pills                                                               */
/* -------------------------------------------------------------------------- */

.vms2-module-table-unified
.vms2-status {
    min-width:
        70px;

    padding:
        4px 7px;

    font-size:
        10px;
}


/* -------------------------------------------------------------------------- */
/* Mobile/tablet horizontal scroll                                            */
/* -------------------------------------------------------------------------- */

@media (max-width: 900px) {

    .vms2-module-table-unified {
        min-width:
            780px;
    }

    .vms2-module-section-content {
        align-items:
            flex-start;

        flex-direction:
            column;

        gap:
            2px;
    }
}

/* ========================================================================== */
/* Key Features & Capabilities                                                */
/* ========================================================================== */

.vms2-capabilities-section {
    background:
        linear-gradient(
            145deg,
            #263647 0%,
            #1e2936 100%
        );
}


.vms2-capabilities-section
.vms2-section-head h2 {
    background: none;

    color: #334a62;

    -webkit-text-fill-color: #334a62;
}


.vms2-capabilities-section
.vms2-kicker {
    color: #aeb9c5;
}


.vms2-capabilities-section
.vms2-section-head > p {
    color: #c9d0d7;
}


/* Grid */

.vms2-capabilities-grid {
    display: grid;

    grid-template-columns:
        repeat(4, minmax(0, 1fr));

    gap: 1px;

    overflow: hidden;

    background:
        rgba(255, 255, 255, .12);

    border:
        1px solid
        rgba(255, 255, 255, .12);

    border-radius: 6px;
}


/* Card */

.vms2-capability-card {
    position: relative;

    min-width: 0;

    padding:
        22px 20px;

    background:
        rgba(30, 41, 54, .92);

    transition:
        background .2s ease;
}


.vms2-capability-card:hover {
    background:
        #334a62;
}


/* Icon */

.vms2-capability-icon {
    display: flex;

    align-items: center;
    justify-content: center;

    width: 36px;
    height: 36px;

    margin-bottom: 13px;

    color: #ffffff;

    background:
        #50647f;

    border-radius: 5px;

    font-size: 16px;
}


/* Title */

.vms2-capability-card h3 {
    margin-bottom: 9px;

    color: #ffffff;

    font-size: 14px;
    line-height: 1.3;

    font-weight: 700;
}


/* Description */

.vms2-capability-description p {
    margin:
        0 0 5px;

    color:
        #c5cdd5;

    font-size: 11px;
    line-height: 1.45;
}


.vms2-capability-description
p:last-child {
    margin-bottom: 0;
}


/* Responsive */

@media (max-width: 1100px) {

    .vms2-capabilities-grid {
        grid-template-columns:
            repeat(3, 1fr);
    }
}


@media (max-width: 800px) {

    .vms2-capabilities-grid {
        grid-template-columns:
            repeat(2, 1fr);
    }
}


@media (max-width: 520px) {

    .vms2-capabilities-grid {
        grid-template-columns:
            1fr;
    }
}

/* ========================================================================== */
/* Technical specifications + Calculator                                      */
/* ========================================================================== */

.vms2-spec-layout {
    display: grid;

    grid-template-columns:
        minmax(0, 1.6fr)
        minmax(300px, .4fr);

    gap: 22px;

    align-items: start;
}


/* Specification table */

.vms2-spec-table-wrap {
    overflow: hidden;

    background: #ffffff;

    border:
        1px solid
        #d8dde2;

    border-radius: 5px;
}


.vms2-spec-table {
    width: 100%;

    border-collapse:
        collapse;
}


.vms2-spec-table th,
.vms2-spec-table td {
    padding:
        10px 14px;

    border-bottom:
        1px solid
        #e2e5e8;

    vertical-align:
        top;

    font-size:
        12px;

    line-height:
        1.45;
}


.vms2-spec-table tr:last-child
th,
.vms2-spec-table tr:last-child
td {
    border-bottom: 0;
}


.vms2-spec-table th {
    width: 34%;

    color:
        #334a62;

    background:
        #f3f4f5;

    border-right:
        1px solid
        #e2e5e8;

    text-align: left;

    font-weight: 700;
}


.vms2-spec-table td {
    color:
        #4d5965;

    background:
        #ffffff;
}


.vms2-spec-table
tr:nth-child(even) td {
    background:
        #fafafa;
}


/* Calculator */

.vms2-calculator-card {
    position: sticky;

    top: 90px;

    padding: 27px;

    color: #ffffff;

    background:
        linear-gradient(
            145deg,
            #334a62,
            #1e2936
        );

    border-radius: 6px;

    box-shadow:
        0 5px 16px
        rgba(30, 41, 54, .15);
}


.vms2-calculator-icon {
    display: flex;

    align-items: center;
    justify-content: center;

    width: 46px;
    height: 46px;

    margin-bottom:
        18px;

    color: #ffffff;

    background:
        #50647f;

    border-radius:
        5px;

    font-size:
        20px;
}


.vms2-calculator-card h3 {
    margin-bottom: 10px;

    color: #ffffff;

    font-size: 20px;
    line-height: 1.25;
}


.vms2-calculator-card p {
    margin-bottom: 22px;

    color: #d2d9e0;

    font-size: 13px;
    line-height: 1.5;
}


.vms2-calculator-button {
    width: 100%;
}


/* Responsive */

@media (max-width: 900px) {

    .vms2-spec-layout {
        grid-template-columns:
            1fr;
    }

    .vms2-calculator-card {
        position: static;
    }
}


@media (max-width: 600px) {

    .vms2-spec-table th,
    .vms2-spec-table td {
        padding:
            9px 10px;
    }

    .vms2-spec-table th {
        width: 40%;
    }
}

/* ========================================================================== */
/* Key Features & Capabilities                                                */
/* ========================================================================== */

.vms2-capabilities-section {
    background:
        #ffffff;

    border-top:
        1px solid #e6e8eb;

    border-bottom:
        1px solid #e6e8eb;
}


/* -------------------------------------------------------------------------- */
/* Header                                                                     */
/* -------------------------------------------------------------------------- */

.vms2-capabilities-section
.vms2-section-head {
    margin-bottom:
        28px;
}


.vms2-capabilities-section
.vms2-section-head > p {
    max-width:
        470px;

    color:
        #687789;

    font-size:
        14px;

    line-height:
        1.55;
}


/* -------------------------------------------------------------------------- */
/* Grid                                                                       */
/* -------------------------------------------------------------------------- */

.vms2-capabilities-grid {
    display:
        grid;

    grid-template-columns:
        repeat(2, minmax(0, 1fr));

    border-top:
        1px solid #dfe3e7;

    border-left:
        1px solid #dfe3e7;
}


/* -------------------------------------------------------------------------- */
/* Feature                                                                    */
/* -------------------------------------------------------------------------- */

.vms2-capability-item {
    display:
        grid;

    grid-template-columns:
        46px minmax(0, 1fr);

    gap:
        16px;

    min-width:
        0;

    padding:
        22px 24px;

    background:
        #ffffff;

    border-right:
        1px solid #dfe3e7;

    border-bottom:
        1px solid #dfe3e7;

    transition:
        border-color .15s ease;
}


/*
 * No background change on hover.
 * This prevents neighbouring cards from visually merging.
 */

.vms2-capability-item:hover {
    background:
        #ffffff;
}


/* -------------------------------------------------------------------------- */
/* Icon                                                                       */
/* -------------------------------------------------------------------------- */

.vms2-capability-icon {
    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

    width:
        42px;

    height:
        42px;

    color:
        #ffffff;

    background:
        #50647f;

    border-radius:
        5px;

    font-size:
        17px;

    transition:
        background-color .15s ease;
}


/*
 * Important:
 * global site styles currently add margin to Font Awesome icons.
 */

.vms2-capability-icon i,
.vms2-capability-icon svg {
    margin:
        0 !important;

    margin-right:
        0 !important;

    margin-left:
        0 !important;
}


/*
 * Only icon changes on hover.
 */

.vms2-capability-item:hover
.vms2-capability-icon {
    background:
        #334a62;
}


/* -------------------------------------------------------------------------- */
/* Content                                                                    */
/* -------------------------------------------------------------------------- */

.vms2-capability-content {
    min-width:
        0;
}


.vms2-capability-content h3 {
    margin:
        0 0 8px;

    color:
        #263140;

    font-size:
        14px;

    line-height:
        1.3;

    font-weight:
        800;
}


.vms2-capability-content p {
    margin:
        0 0 7px;

    color:
        #5f6c79;

    font-size:
        12px;

    line-height:
        1.5;
}


.vms2-capability-content
p:last-child {
    margin-bottom:
        0;
}


/* -------------------------------------------------------------------------- */
/* Subtle alternating rows                                                    */
/* -------------------------------------------------------------------------- */

.vms2-capability-item:nth-child(4n + 3),
.vms2-capability-item:nth-child(4n + 4) {
    background:
        #fafafa;
}


.vms2-capability-item:nth-child(4n + 3):hover,
.vms2-capability-item:nth-child(4n + 4):hover {
    background:
        #fafafa;
}


/* -------------------------------------------------------------------------- */
/* Responsive                                                                 */
/* -------------------------------------------------------------------------- */

@media (max-width: 850px) {

    .vms2-capabilities-grid {
        grid-template-columns:
            1fr;
    }


    .vms2-capability-item:nth-child(odd),
    .vms2-capability-item:nth-child(even) {
        background:
            #ffffff;
    }


    .vms2-capability-item:nth-child(even) {
        background:
            #fafafa;
    }
}


@media (max-width: 560px) {

    .vms2-capability-item {
        grid-template-columns:
            38px minmax(0, 1fr);

        gap:
            12px;

        padding:
            18px 15px;
    }


    .vms2-capability-icon {
        width:
            36px;

        height:
            36px;

        font-size:
            15px;
    }


    .vms2-capability-content h3 {
        font-size:
            13px;
    }


    .vms2-capability-content p {
        font-size:
            11px;
    }
}


/* ========================================================================== */
/* Edition analytics badges — final                                           */
/* ========================================================================== */

.vms2-edition-card.has-badge {
    position: relative;
}

.vms2-edition-badge {
    position: absolute;

    top: 0;
    left: 18px;
    right: 18px;

    transform:
        translateY(-50%);

    padding:
        5px 10px;

    border-radius:
        4px;

    font-size:
        10px;

    line-height:
        1.3;

    font-weight:
        700;

    letter-spacing:
        .25px;

    text-align:
        center;

    text-transform:
        uppercase;

    box-shadow:
        none;
}


/* Professional / Enterprise */

.vms2-edition-badge.is-basic {
    color:
        #334a62;

    background:
        #eef1f4;

    border:
        1px solid #cbd2d9;
}

.vms2-edition-card.has-basic-analytics {
    border-color:
        #d5dae0;
}


/* Complete */

.vms2-edition-badge.is-advanced {
    color:
        #ffffff;

    background:
        linear-gradient(
            to bottom,
            #fc550e,
            #f43c0a
        );

    border:
        1px solid #f43c0a;

    box-shadow:
        0 2px 6px
        rgba(
            244,
            60,
            10,
            .18
        );
}

.vms2-edition-card.has-advanced-analytics {
    border-color:
        #d7dce1;

    box-shadow:
        0 3px 10px
        rgba(
            30,
            41,
            54,
            .10
        );
}

.vms2-edition-icon i,
.vms2-edition-icon svg {
    margin:
        0 !important;

    margin-right:
        0 !important;

    margin-left:
        0 !important;
}


/* ========================================================================== */
/* Module comparison section headers — final                                  */
/* ========================================================================== */

/*
 * Keep the category description below the title rather than on the same line.
 * This makes the full comparison read as one continuous technical table.
 */

.vms2-module-section-content {
    display:
        block;

    width:
        100%;

    padding:
        9px 14px 10px;

    border-left:
        4px solid #50647f;
}

.vms2-module-section-content strong {
    display:
        block;

    color:
        #263140;

    font-size:
        13px;

    line-height:
        1.3;

    font-weight:
        800;
}

.vms2-module-section-content span {
    display:
        block;

    margin-top:
        3px;

    color:
        #687789;

    font-size:
        10px;

    line-height:
        1.35;
}

@media (max-width: 900px) {

    .vms2-module-section-content {
        display:
            block;

        gap:
            0;
    }
}


/* ========================================================================== */
/* Unified Edition + Analytics comparison — final                             */
/* ========================================================================== */

/*
 * Edition Comparison and Analytics & Module Comparison are rendered inside
 * one physical table. The shared colgroup guarantees identical column widths
 * for summary rows and every analytics/module row.
 */

.vms2-unified-comparison {
    overflow:
        hidden;

    background:
        #ffffff;

    border:
        1px solid #dedede;

    border-radius:
        5px;

    box-shadow:
        0 2px 7px
        rgba(
            0,
            0,
            0,
            .07
        );
}


.vms2-unified-comparison
.vms2-comparison-title-row {
    padding:
        16px 18px 10px;

    border-bottom:
        1px solid #dedede;
}


.vms2-comparison-table-unified {
    width:
        100%;

    min-width:
        900px;

    table-layout:
        fixed;

    border-collapse:
        collapse;
}


.vms2-comparison-table-unified
.vms2-col-module {
    width:
        44%;
}


.vms2-comparison-table-unified
.vms2-col-edition {
    width:
        14%;
}


/* Header */

.vms2-comparison-table-unified
thead th {
    padding:
        11px 12px;

    color:
        #334a62;

    background:
        #f1f1f1;

    border-bottom:
        1px solid #cfd5db;

    border-right:
        1px solid #d8dde2;

    font-size:
        12px;

    font-weight:
        800;

    text-align:
        center;
}


.vms2-comparison-table-unified
thead th:first-child {
    text-align:
        left;
}


.vms2-comparison-table-unified
thead th:nth-child(3) {
    color:
        #ffffff;

    background:
        #50647f;
}


.vms2-comparison-table-unified
thead th:last-child {
    border-right:
        0;
}


/* Shared cells */

.vms2-comparison-table-unified
tbody td {
    padding:
        9px 12px;

    border-bottom:
        1px solid #e2e5e8;

    border-right:
        1px solid #e2e5e8;

    text-align:
        center;

    vertical-align:
        middle;

    font-size:
        12px;
}


.vms2-comparison-table-unified
tbody td:first-child {
    text-align:
        left;
}


.vms2-comparison-table-unified
tbody td:last-child {
    border-right:
        0;
}


.vms2-comparison-table-unified
tbody tr:hover > td {
    background:
        #f7f7f7;
}


.vms2-comparison-summary-body
tr:last-child td {
    border-bottom:
        1px solid #c6cdd4;
}


/* Expanded tbody */

.vms2-comparison-details-body[hidden] {
    display:
        none !important;
}


/* Category rows remain part of the same table */

.vms2-comparison-table-unified
.vms2-module-section-row td {
    padding:
        0 !important;

    border-right:
        0 !important;

    border-bottom:
        1px solid #d6dbe0 !important;
}


.vms2-comparison-table-unified
.vms2-module-section-row:hover td {
    background:
        inherit;
}


/* Descriptions on a separate line */

.vms2-comparison-table-unified
.vms2-module-section-content {
    display:
        block;

    width:
        100%;

    padding:
        9px 14px 10px;

    border-left:
        4px solid #50647f;
}


.vms2-comparison-table-unified
.vms2-module-section-content strong {
    display:
        block;

    color:
        #263140;

    font-size:
        13px;

    line-height:
        1.3;

    font-weight:
        800;
}


.vms2-comparison-table-unified
.vms2-module-section-content span {
    display:
        block;

    margin-top:
        3px;

    color:
        #687789;

    font-size:
        10px;

    line-height:
        1.35;
}


/* Category colors */

.vms2-comparison-table-unified
.vms2-module-section-row.is-included
.vms2-module-section-content {
    background:
        #e9edf1;

    border-left-color:
        #50647f;
}


.vms2-comparison-table-unified
.vms2-module-section-row.is-advanced
.vms2-module-section-content {
    background:
        #f4f5f6;

    border-left-color:
        #334a62;
}


.vms2-comparison-table-unified
.vms2-module-section-row.is-neural
.vms2-module-section-content {
    background:
        #edf0f3;

    border-left-color:
        #263140;
}


.vms2-comparison-table-unified
.vms2-module-section-row.is-optional
.vms2-module-section-content {
    background:
        #f6f6f6;

    border-left-color:
        #687789;
}


.vms2-comparison-table-unified
.vms2-module-section-row.is-special
.vms2-module-section-content {
    background:
        #fff4ef;

    border-left-color:
        #f43c0a;
}


.vms2-comparison-table-unified
.vms2-module-section-row.is-legacy
.vms2-module-section-content {
    background:
        #f3f3f3;

    border-left-color:
        #999999;
}


/* Module names */

.vms2-comparison-table-unified
.vms2-module-name a {
    color:
        #263140;

    font-weight:
        600;

    line-height:
        1.35;
}


.vms2-comparison-table-unified
.vms2-module-name a:hover {
    color:
        #f43c0a;
}


.vms2-comparison-table-unified
.vms2-module-name a i,
.vms2-comparison-table-unified
.vms2-module-name a svg {
    margin-left:
        5px;

    margin-right:
        0 !important;

    color:
        #85919e;

    font-size:
        9px;
}


/* Status icons */

.vms2-comparison-table-unified
.vms2-status i,
.vms2-comparison-table-unified
.vms2-status svg {
    margin:
        0 !important;

    margin-right:
        0 !important;
}


/* Special price */

.vms2-status.is-special-price {
    min-width:
        92px;

    color:
        #b73511;

    background:
        #fff0e9;

    border:
        1px solid #f3c0af;
}


/* Keep the toggle visually attached to the same table */

.vms2-unified-comparison
.vms2-compare-toggle {
    margin:
        0;

    border-top:
        0;

    border-radius:
        0;

    box-shadow:
        inset 0 1px 0 #dedede;
}


/* Responsive */

@media (max-width: 900px) {

    .vms2-comparison-table-unified {
        min-width:
            820px;
    }

    .vms2-status.is-special-price {
        min-width:
            86px;
    }
}


/* ========================================================================
   VMS V3 — Stage 1 structure/layout brief
   ======================================================================== */

.vms3-stage1 {
    --vms3-nav-height: 52px;
}

.vms3-stage1 [id^="vms3-"] {
    scroll-margin-top: 76px;
}

/* Headings: intro text goes below the heading, never in a right-hand column. */
.vms3-stage1 .vms2-section-head {
    display: block;
}

.vms3-stage1 .vms2-section-head > p {
    max-width: 820px;
    margin: 14px 0 0;
}

/* Local page navigation replaces the old trust strip. */
.vms3-local-nav {
    position: sticky;
    top: 0;
    z-index: 45;
    background: rgba(255, 255, 255, 0.98);
    border-top: 1px solid #e3e7eb;
    border-bottom: 1px solid #d9dee4;
    backdrop-filter: blur(8px);
}

body.admin-bar .vms3-local-nav {
    top: 32px;
}

.vms3-local-nav-inner {
    min-height: var(--vms3-nav-height);
    display: flex;
    align-items: center;
    gap: 24px;
    overflow-x: auto;
    scrollbar-width: none;
}

.vms3-local-nav-inner::-webkit-scrollbar {
    display: none;
}

.vms3-local-nav a {
    flex: 0 0 auto;
    position: relative;
    padding: 16px 0 14px;
    color: #334a62;
    font-size: 14px;
    font-weight: 600;
    text-decoration: none;
    white-space: nowrap;
}

.vms3-local-nav a::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: -1px;
    height: 2px;
    background: #fc550e;
    transform: scaleX(0);
    transform-origin: center;
    transition: transform 0.18s ease;
}

.vms3-local-nav a:hover::after,
.vms3-local-nav a:focus-visible::after {
    transform: scaleX(1);
}

/* Structural solution placeholders for beta only. */
.vms3-placeholder-grid {
    display: grid;
    gap: 18px;
}

.vms3-placeholder-grid-6 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.vms3-placeholder-card {
    min-height: 168px;
    padding: 24px;
    border: 1px solid #dfe4e9;
    border-radius: 5px;
    background: #fff;
}

.vms3-placeholder-icon,
.vms3-placeholder-title,
.vms3-placeholder-line {
    display: block;
    border-radius: 3px;
    background: #eef1f4;
}

.vms3-placeholder-icon {
    width: 36px;
    height: 36px;
    margin-bottom: 22px;
}

.vms3-placeholder-title {
    width: 58%;
    height: 16px;
    margin-bottom: 18px;
}

.vms3-placeholder-line {
    width: 100%;
    height: 9px;
    margin-top: 9px;
}

.vms3-placeholder-line.is-short {
    width: 72%;
}

/* ========================================================================
   Video Analytics & Automation
   ======================================================================== */

.vms3-analytics-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
    margin-top: 30px;
}

.vms3-analytics-card {
    min-width: 0;
    padding: 26px 28px 27px;
    background: #ffffff;
    border: 1px solid #dce2e7;
    border-radius: 6px;
}

.vms3-analytics-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    margin-bottom: 17px;
    color: #334a62;
    background: #eef1f4;
    border-radius: 5px;
    font-size: 19px;
}

.vms3-analytics-icon i,
.vms3-analytics-icon svg {
    margin: 0 !important;
    margin-right: 0 !important;
}

.vms3-analytics-grid h3 {
    margin: 0 0 16px;
    color: #1e2936;
    font-size: 19px;
    line-height: 1.3;
    font-weight: 800;
}

.vms3-analytics-modules {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 7px 18px;
    margin: 0 0 20px;
    padding: 0;
    list-style: none;
}

.vms3-analytics-modules li {
    position: relative;
    min-width: 0;
    padding-left: 14px;
    color: #667584;
    font-size: 12px;
    line-height: 1.45;
}

.vms3-analytics-modules li::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0.62em;
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background: #50647f;
}

.vms3-analytics-description {
    max-width: 600px;
    margin: 0;
    color: #4f5f6f;
    font-size: 14px;
    line-height: 1.55;
}

.vms3-analytics-link {
    margin-top: 24px;
}

@media (max-width: 720px) {
    .vms3-analytics-grid {
        grid-template-columns: 1fr;
    }

    .vms3-analytics-card {
        padding: 22px;
    }
}

@media (max-width: 480px) {
    .vms3-analytics-modules {
        grid-template-columns: 1fr;
    }
}

/* Stable comparison button: expanding rows no longer moves the control. */
.vms3-compare-toggle-stable {
    margin: 18px 0 16px;
}

/* Integrations. */
.vms3-integrations-section .vms2-section-head {
    margin-bottom: 30px;
}

.vms3-integration-stats {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    border: 1px solid #dce2e7;
    background: #fff;
}

.vms3-integration-stats > div {
    min-height: 112px;
    padding: 22px 24px;
    border-right: 1px solid #dce2e7;
}

.vms3-integration-stats > div:last-child {
    border-right: 0;
}

.vms3-integration-stats strong,
.vms3-integration-stats span {
    display: block;
}

.vms3-integration-stats strong {
    margin-bottom: 7px;
    color: #1e2936;
    font-size: 23px;
    line-height: 1.2;
}

.vms3-integration-stats span {
    color: #657587;
    font-size: 14px;
}

.vms3-compatibility-list {
    justify-content: flex-start;
    margin-top: 22px;
}

.vms3-compatibility-link {
    display: inline-flex;
    margin-top: 18px;
}

/* Resources. */
.vms3-resources-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
    margin-top: 28px;
}

.vms3-resource-card {
    min-height: 112px;
    display: grid;
    grid-template-columns: auto 1fr auto;
    align-items: center;
    gap: 14px;
    padding: 22px;
    border: 1px solid #dce2e7;
    border-radius: 5px;
    background: #fff;
    color: #273849;
    font: inherit;
    font-weight: 600;
    text-align: left;
    text-decoration: none;
    cursor: pointer;
}

.vms3-resource-card > i:first-child {
    color: #334a62;
    font-size: 21px;
}

.vms3-resource-card > i:last-child {
    color: #8a98a7;
    font-size: 13px;
}

.vms3-resource-card:hover,
.vms3-resource-card:focus-visible {
    border-color: #bfc8d1;
}

.vms3-resource-card-button {
    width: 100%;
}

.vms3-resource-card-button[aria-expanded="true"] > i:last-child {
    transform: rotate(180deg);
}

.vms3-specifications-panel {
    margin-top: 22px;
    padding-top: 26px;
    border-top: 1px solid #dce2e7;
}

.vms3-specifications-panel[hidden] {
    display: none !important;
}

.vms3-specifications-panel-head {
    margin-bottom: 20px;
}

.vms3-specifications-panel-head h3 {
    margin: 0 0 8px;
    color: #1e2936;
    font-size: 24px;
}

.vms3-specifications-panel-head p {
    max-width: 760px;
    margin: 0;
    color: #657587;
}

/* FAQ is now its own block; no partner sidebar. */
#vms3-faq .vms2-faq {
    max-width: 960px;
}

/* Unified final conversion block. */
.vms3-final-conversion {
    padding: 72px 0;
    background: #1e2936;
}

.vms3-final-head {
    margin-bottom: 28px;
}

.vms3-final-head .vms2-kicker {
    color: #b8c4cf;
}

.vms3-final-head h2 {
    max-width: 760px;
    margin: 8px 0 0;
    color: #fff;
    font-size: clamp(30px, 4vw, 46px);
    line-height: 1.12;
}

.vms3-final-grid {
    display: grid;
    grid-template-columns: 1.25fr 0.75fr;
    border: 1px solid rgba(255,255,255,0.16);
}

.vms3-final-path {
    min-height: 245px;
    padding: 34px;
}

.vms3-final-path + .vms3-final-path {
    border-left: 1px solid rgba(255,255,255,0.16);
}

.vms3-final-path-icon {
    margin-bottom: 24px;
    color: #fc550e;
    font-size: 23px;
}

.vms3-final-path h3 {
    max-width: 520px;
    margin: 0 0 24px;
    color: #fff;
    font-size: 24px;
    line-height: 1.3;
}

.vms3-final-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.vms3-final-secondary {
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
    margin-top: 20px;
    color: #b8c4cf;
    font-size: 14px;
}

.vms3-final-secondary a {
    color: #dce4eb;
    text-decoration: none;
}

.vms3-final-secondary a:hover {
    color: #fff;
}

.vms3-final-path .vms2-btn-outline {
    border-color: rgba(255,255,255,0.55);
    color: #fff;
}

.vms3-final-path .vms2-btn-outline:hover {
    border-color: #fff;
    background: #fff;
    color: #1e2936;
}

/* Keep cards restrained: no new hover fills or oversized sales-banner treatment. */
.vms3-stage1 .vms2-audience-grid article:hover,
.vms3-stage1 .vms2-enterprise-grid article:hover,
.vms3-stage1 .vms2-capability-item:hover {
    background: inherit;
}

@media (max-width: 1024px) {
    .vms3-placeholder-grid-6 {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .vms3-analytics-grid,
    .vms3-integration-stats,
    .vms3-resources-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .vms3-integration-stats > div {
        border-bottom: 1px solid #dce2e7;
    }

    .vms3-final-grid {
        grid-template-columns: 1fr;
    }

    .vms3-final-path + .vms3-final-path {
        border-left: 0;
        border-top: 1px solid rgba(255,255,255,0.16);
    }
}

@media (max-width: 782px) {
    body.admin-bar .vms3-local-nav {
        top: 46px;
    }
}

@media (max-width: 720px) {
    .vms3-local-nav-inner {
        gap: 18px;
    }

    .vms3-placeholder-grid-6,
    .vms3-analytics-grid,
    .vms3-integration-stats,
    .vms3-resources-grid {
        grid-template-columns: 1fr;
    }

    .vms3-integration-stats > div {
        border-right: 0;
    }

    .vms3-final-conversion {
        padding: 54px 0;
    }

    .vms3-final-path {
        padding: 28px 22px;
    }
}

/* Local page navigation */

.vms3-local-nav {
    position: relative;
    z-index: 45;

    width: 100%;

    background: rgba(255, 255, 255, 0.98);

    border-top:
        1px solid
        #e3e7eb;

    border-bottom:
        1px solid
        #d9dee4;

    backdrop-filter:
        blur(8px);

    -webkit-backdrop-filter:
        blur(8px);
}


.vms3-local-nav.is-fixed {
    position: fixed;

    top: 0;
    left: 0;
    right: 0;

    width: 100%;

    z-index: 9999;

    box-shadow:
        0 4px 14px
        rgba(30, 41, 54, 0.08);
}


/*
 * Placeholder prevents the page from jumping
 * when the navigation becomes fixed.
 */
.vms3-local-nav-placeholder {
    display: block;

    width: 100%;
    height: 0;
}


/* WordPress admin bar */
body.admin-bar
.vms3-local-nav.is-fixed {
    top: 32px;
}


@media (max-width: 782px) {

    body.admin-bar
    .vms3-local-nav.is-fixed {
        top: 46px;
    }

}


.vms3-local-nav-inner {
    min-height:
        var(--vms3-nav-height);

    display: flex;
    align-items: center;

    gap: 24px;

    overflow-x: auto;
    overflow-y: hidden;

    scrollbar-width: none;
}


.vms3-local-nav-inner::-webkit-scrollbar {
    display: none;
}


.vms3-local-nav a {
    position: relative;

    flex: 0 0 auto;

    padding:
        16px 0
        14px;

    color:
        #334a62;

    font-size:
        14px;

    font-weight:
        600;

    text-decoration:
        none;

    white-space:
        nowrap;
}
/* ==========================================================================
   VMS V2 — Hero + Overview + Solutions content pass
   2026-09-24
   ========================================================================== */

/* Unified eyebrow system */
.vms3-stage1 .vms2-kicker,
.vms3-stage1 .vms2-eyebrow {
    color: #667584;
    font-size: 12px;
    line-height: 1.25;
    font-weight: 700;
    letter-spacing: 1.35px;
    text-transform: uppercase;
}

.vms3-stage1 .vms2-kicker {
    display: block;
    margin-bottom: 9px;
}

.vms3-hero-eyebrow {
    margin-bottom: 14px;
    color: #50647f !important;
    font-size: 13px !important;
    font-weight: 800 !important;
    letter-spacing: 1.5px !important;
}

.vms3-hero-eyebrow span {
    display: inline-block;
}

/* ========================================================================
   Overview
   ======================================================================== */

.vms3-overview-section {
    position: relative;
}

.vms3-overview-head {
    max-width: 900px;
    margin-bottom: 20px;
}

.vms3-overview-head h2 {
    margin: 0;
    color: #334a62;
    font-family: "Roboto", sans-serif;
    font-size: 30px;
    line-height: 1.2;
    font-weight: 900;
}

.vms3-overview-intro {
    max-width: 1080px;
    margin-bottom: 24px;
}

.vms3-overview-intro p,
.vms3-overview-more p {
    color: #4f5f6f;
    font-size: 15px;
    line-height: 1.68;
}

.vms3-overview-intro p {
    margin: 0 0 13px;
}

.vms3-overview-intro p:last-child,
.vms3-overview-more p:last-child {
    margin-bottom: 0;
}

/*
 * Reserved media area:
 * an evergreen overview video can later be inserted directly above
 * .vms3-overview-slider without changing the screenshot strip.
 */
.vms3-overview-media {
    margin-top: 22px;
}

.vms3-overview-slider {
    position: relative;
}

.vms3-overview-slider-toolbar {
    display: flex;
    justify-content: flex-end;
    min-height: 36px;
    margin-bottom: 10px;
}

.vms3-overview-slider-controls {
    display: flex;
    gap: 8px;
}

.vms3-overview-slider-arrow {
    display: grid;
    place-items: center;
    width: 34px;
    height: 34px;
    padding: 0;
    color: #334a62;
    background: #ffffff;
    border: 1px solid #cfd6dc;
    border-radius: 4px;
    cursor: pointer;
    transition:
        border-color .15s ease,
        color .15s ease,
        background-color .15s ease,
        opacity .15s ease;
}

.vms3-overview-slider-arrow:hover:not(:disabled),
.vms3-overview-slider-arrow:focus-visible:not(:disabled) {
    color: #ffffff;
    background: #334a62;
    border-color: #334a62;
}

.vms3-overview-slider-arrow:disabled {
    opacity: .35;
    cursor: default;
}

.vms3-overview-slider-arrow i,
.vms3-overview-slider-arrow svg {
    margin: 0 !important;
    margin-right: 0 !important;
    font-size: 12px;
}

.vms3-overview-slider-track {
    display: flex;
    gap: 14px;
    width: 100%;
    overflow-x: auto;
    overflow-y: hidden;
    padding: 1px 1px 10px;
    scroll-behavior: smooth;
    scroll-snap-type: x mandatory;
    scrollbar-width: thin;
    scrollbar-color: #bdc6cf transparent;
}

.vms3-overview-slider-track::-webkit-scrollbar {
    height: 5px;
}

.vms3-overview-slider-track::-webkit-scrollbar-track {
    background: transparent;
}

.vms3-overview-slider-track::-webkit-scrollbar-thumb {
    background: #bdc6cf;
    border-radius: 999px;
}

.vms3-overview-card {
    overflow: hidden;
    flex: 0 0 clamp(230px, 27vw, 310px);
    scroll-snap-align: start;
    display: block;
    padding: 0;
    color: #263140;
    background: #ffffff;
    border: 1px solid #dce1e6;
    border-radius: 5px;
    text-align: left;
    cursor: pointer;
    box-shadow: 0 1px 4px rgba(30, 41, 54, 0.06);
    transition:
        border-color .15s ease,
        box-shadow .15s ease,
        transform .15s ease;
}

.vms3-overview-card:hover,
.vms3-overview-card:focus-visible {
    border-color: #aeb8c2;
    box-shadow: 0 4px 12px rgba(30, 41, 54, 0.10);
    transform: translateY(-1px);
}

.vms3-overview-card-media {
    position: relative;
    display: block;
    overflow: hidden;
    aspect-ratio: 16 / 9;
    background: #e9edf1;
    border-bottom: 1px solid #dce1e6;
}

.vms3-overview-card-media img {
    display: block;
    width: 100%;
    height: 100%;
    padding: 3px;
    object-fit: contain;
    background: #263140;
}

.vms3-overview-card-placeholder {
    display: grid;
    place-items: center;
    width: 100%;
    height: 100%;
    color: #728195;
    background: linear-gradient(135deg, #f2f4f6 0%, #e4e8ec 100%);
    font-size: 30px;
}

.vms3-overview-card-placeholder i,
.vms3-overview-card-placeholder svg {
    margin: 0 !important;
    margin-right: 0 !important;
}

.vms3-overview-card-zoom {
    position: absolute;
    right: 8px;
    bottom: 8px;
    display: grid;
    place-items: center;
    width: 30px;
    height: 30px;
    color: #ffffff;
    background: rgba(30, 41, 54, .82);
    border-radius: 4px;
    opacity: 0;
    transition: opacity .15s ease;
}

.vms3-overview-card-zoom i,
.vms3-overview-card-zoom svg {
    margin: 0 !important;
    margin-right: 0 !important;
    font-size: 12px;
}

.vms3-overview-card:hover .vms3-overview-card-zoom,
.vms3-overview-card:focus-visible .vms3-overview-card-zoom {
    opacity: 1;
}


.vms3-overview-more-toggle {
    margin-top: 22px;
    gap: 9px;
}

.vms3-overview-more-toggle i,
.vms3-overview-more-toggle svg {
    margin-right: 0 !important;
    font-size: 11px;
    transition: transform .18s ease;
}

.vms3-overview-more-toggle[aria-expanded="true"] i,
.vms3-overview-more-toggle[aria-expanded="true"] svg {
    transform: rotate(180deg);
}

.vms3-overview-more {
    max-width: 1080px;
    margin-top: 20px;
    padding-top: 20px;
    border-top: 1px solid #dce1e6;
}

.vms3-overview-more[hidden] {
    display: none !important;
}

.vms3-overview-more p {
    margin: 0 0 13px;
}

/* Full-screen screenshot lightbox */
.vms3-overview-modal {
    position: fixed;
    inset: 0;
    z-index: 10050;
    display: grid;
    place-items: center;
    padding: 12px;
}

.vms3-overview-modal[hidden] {
    display: none !important;
}

.vms3-overview-modal-backdrop {
    position: absolute;
    inset: 0;
    background: rgba(14, 20, 27, .92);
}

.vms3-overview-modal-dialog {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-rows: auto minmax(0, 1fr) auto;
    width: calc(100vw - 24px);
    height: calc(100vh - 24px);
    max-width: 1680px;
    overflow: hidden;
    background: #ffffff;
    border-radius: 6px;
    box-shadow: 0 24px 70px rgba(0, 0, 0, .40);
}

.vms3-overview-modal-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    min-height: 58px;
    padding: 12px 14px 12px 20px;
    border-bottom: 1px solid #dce1e6;
}

.vms3-overview-modal-dialog h3 {
    margin: 0;
    color: #263140;
    font-size: 20px;
    line-height: 1.3;
}

.vms3-overview-modal-close {
    flex: 0 0 auto;
    display: grid;
    place-items: center;
    width: 36px;
    height: 36px;
    padding: 0;
    color: #334a62;
    background: #f2f4f6;
    border: 1px solid #dce1e6;
    border-radius: 4px;
    cursor: pointer;
}

.vms3-overview-modal-close i,
.vms3-overview-modal-close svg {
    margin: 0 !important;
    margin-right: 0 !important;
}

.vms3-overview-modal-media {
    position: relative;
    overflow: hidden;
    display: grid;
    place-items: center;
    min-height: 0;
    background: #1e2936;
}

.vms3-overview-modal-media img {
    display: block;
    width: 100%;
    height: 100%;
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
}

.vms3-overview-modal-placeholder {
    display: grid;
    place-items: center;
    width: 100%;
    height: 100%;
    min-height: 300px;
    color: #aeb9c5;
    font-size: 46px;
}

.vms3-overview-modal-placeholder i,
.vms3-overview-modal-placeholder svg {
    margin: 0 !important;
    margin-right: 0 !important;
}

.vms3-overview-modal-nav {
    position: absolute;
    z-index: 3;
    top: 50%;
    display: grid;
    place-items: center;
    width: 44px;
    height: 52px;
    padding: 0;
    transform: translateY(-50%);
    color: #ffffff;
    background: rgba(17, 25, 34, .72);
    border: 1px solid rgba(255, 255, 255, .25);
    border-radius: 4px;
    cursor: pointer;
}

.vms3-overview-modal-nav.is-prev {
    left: 14px;
}

.vms3-overview-modal-nav.is-next {
    right: 14px;
}

.vms3-overview-modal-nav:hover,
.vms3-overview-modal-nav:focus-visible {
    background: rgba(17, 25, 34, .92);
}

.vms3-overview-modal-nav i,
.vms3-overview-modal-nav svg {
    margin: 0 !important;
    margin-right: 0 !important;
}

.vms3-overview-modal-description {
    max-width: none;
    margin: 0;
    padding: 14px 20px 16px;
    color: #556575;
    background: #ffffff;
    border-top: 1px solid #dce1e6;
    font-size: 14px;
    line-height: 1.55;
}

body.vms2-modal-open {
    overflow: hidden;
}

@media (max-width: 720px) {
    .vms3-overview-slider-toolbar {
        margin-bottom: 8px;
    }

    .vms3-overview-card {
        flex-basis: min(78vw, 285px);
    }

    .vms3-overview-modal {
        padding: 0;
    }

    .vms3-overview-modal-dialog {
        width: 100vw;
        height: 100vh;
        border-radius: 0;
    }

    .vms3-overview-modal-head {
        min-height: 54px;
        padding-left: 14px;
    }

    .vms3-overview-modal-dialog h3 {
        font-size: 17px;
    }

    .vms3-overview-modal-nav {
        width: 38px;
        height: 46px;
    }

    .vms3-overview-modal-nav.is-prev {
        left: 8px;
    }

    .vms3-overview-modal-nav.is-next {
        right: 8px;
    }

    .vms3-overview-modal-description {
        padding: 12px 14px 14px;
        font-size: 13px;
    }
}

/* Solutions */
.vms3-solutions-section .vms2-section-head {
    max-width: 960px;
}

.vms3-solutions-section .vms2-section-head > p {
    max-width: 920px;
}

.vms3-solutions-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1px;
    margin-top: 28px;
    background: #dce2e7;
    border: 1px solid #dce2e7;
}

.vms3-solution-card {
    min-height: 220px;
    padding: 26px 24px;
    background: #fff;
}

.vms3-solution-card > i,
.vms3-solution-card > svg {
    margin: 0 0 19px !important;
    color: #50647f;
    font-size: 22px;
}

.vms3-solution-card h3 {
    margin: 0 0 9px;
    color: #263140;
    font-size: 18px;
    line-height: 1.3;
    font-weight: 800;
}

.vms3-solution-card p {
    margin: 0;
    color: #657587;
    font-size: 14px;
    line-height: 1.58;
}

.vms3-industry-bridge {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 30px;
    margin-top: 26px;
    padding-top: 22px;
    border-top: 1px solid #dce2e7;
}

.vms3-industry-bridge strong {
    display: block;
    margin-bottom: 5px;
    color: #263140;
    font-size: 17px;
}

.vms3-industry-bridge p {
    max-width: 820px;
    margin: 0;
    color: #657587;
    font-size: 14px;
    line-height: 1.55;
}

.vms3-industry-bridge .vms2-text-link {
    flex: 0 0 auto;
}

/* Keep audience and large-scale intros below headings */
#vms3-advantages .vms2-section-head > p,
#vms3-enterprise .vms2-section-head > p {
    max-width: 920px;
}

/* Responsive */
@media (max-width: 900px) {
    .vms3-overview-screenshots,
    .vms3-solutions-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .vms3-industry-bridge {
        display: block;
    }

    .vms3-industry-bridge .vms2-text-link {
        margin-top: 16px;
    }
}

@media (max-width: 620px) {
    .vms3-overview-screenshots,
    .vms3-solutions-grid {
        grid-template-columns: 1fr;
    }

    .vms3-overview-modal {
        padding: 12px;
    }

    .vms3-overview-modal-dialog {
        max-height: calc(100vh - 24px);
        padding: 18px;
    }

    .vms3-overview-modal-dialog h3 {
        font-size: 20px;
    }

    .vms3-overview-modal-media {
        min-height: 180px;
    }

    .vms3-solution-card {
        min-height: 0;
    }
}

/* ========================================================================
   VMS V2 — Navigation, Integrations, Resources refinements
   2026-09-24
   ======================================================================== */

/* The top partner CTA is now a normal link to /partnership; no CSS needed. */

/* Final partner CTA: keep sufficient contrast in both states. */
.vms3-final-path .vms2-btn-outline {
    background: transparent !important;
    border-color: rgba(255, 255, 255, 0.62) !important;
    color: #ffffff !important;
}

.vms3-final-path .vms2-btn-outline:hover,
.vms3-final-path .vms2-btn-outline:focus-visible {
    background: #ffffff !important;
    border-color: #ffffff !important;
    color: #1e2936 !important;
}

.vms3-final-path .vms2-btn-outline:hover i,
.vms3-final-path .vms2-btn-outline:hover svg,
.vms3-final-path .vms2-btn-outline:focus-visible i,
.vms3-final-path .vms2-btn-outline:focus-visible svg {
    color: #1e2936 !important;
}

/* Compatibility & Integrations: benefits first, technologies second. */
.vms3-integrations-section .vms2-section-head > p {
    max-width: 900px;
}

.vms3-integration-stats {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
    border: 0;
    background: transparent;
}

.vms3-integration-stat {
    min-height: 132px;
    padding: 24px;
    background: #ffffff;
    border: 1px solid #dce2e7;
    border-radius: 6px;
}

.vms3-integration-stats > div,
.vms3-integration-stats > article {
    border-right: 1px solid #dce2e7;
}

.vms3-integration-stats > article:last-child {
    border-right: 1px solid #dce2e7;
}

.vms3-integration-stat strong,
.vms3-integration-stat span {
    display: block;
}

.vms3-integration-stat strong {
    margin-bottom: 9px;
    color: #1e2936;
    font-size: 23px;
    line-height: 1.2;
    font-weight: 850;
}

.vms3-integration-stat span {
    color: #657587;
    font-size: 14px;
    line-height: 1.45;
}

.vms3-integration-groups {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
    margin-top: 22px;
}

.vms3-integration-group {
    padding: 20px 22px;
    background: #f1f3f5;
    border: 1px solid #dce2e7;
    border-radius: 6px;
}

.vms3-integration-group h3 {
    margin: 0 0 13px;
    color: #334a62;
    font-size: 14px;
    line-height: 1.35;
    font-weight: 800;
}

.vms3-integration-group .vms3-compatibility-list {
    margin-top: 0;
}

.vms3-integration-group .vms2-compatibility-list span {
    background: #ffffff;
}

.vms3-compatibility-link {
    display: inline-flex;
    margin-top: 20px;
}

/* Resources: icon -> heading -> description -> one action. */
#vms3-resources .vms2-section-head > p {
    max-width: 880px;
}

.vms3-resources-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 16px;
    margin-top: 28px;
}

.vms3-resource-card {
    min-height: 270px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0;
    padding: 26px 24px;
    background: #ffffff;
    border: 1px solid #dce2e7;
    border-radius: 6px;
    color: #273849;
    font: inherit;
    font-weight: 400;
    text-align: left;
    text-decoration: none;
    cursor: default;
}

.vms3-resource-icon {
    display: grid;
    place-items: center;
    width: 42px;
    height: 42px;
    margin-bottom: 19px;
    color: #334a62;
    background: #eef1f4;
    border-radius: 5px;
    font-size: 19px;
}

.vms3-resource-card h3 {
    margin: 0 0 10px;
    color: #1e2936;
    font-size: 18px;
    line-height: 1.3;
    font-weight: 800;
}

.vms3-resource-card p {
    margin: 0 0 20px;
    color: #657587;
    font-size: 14px;
    line-height: 1.55;
}

.vms3-resource-link {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-top: auto;
    padding: 0;
    color: #334a62 !important;
    background: transparent;
    border: 0;
    font: inherit;
    font-size: 14px;
    font-weight: 800;
    text-align: left;
    text-decoration: none;
    cursor: pointer;
}

.vms3-resource-link:hover,
.vms3-resource-link:focus-visible {
    color: #1e2936 !important;
}

.vms3-resource-link-button {
    width: auto;
}

/* Keep icon spacing deterministic against legacy/global styles. */
.vms2-page i,
.vms2-page svg {
    margin-right: 0 !important;
}

/* Mobile local navigation: show all 8 items as a compact 4 x 2 grid. */
@media (max-width: 720px) {
    .vms3-local-nav-inner {
        width: 100%;
        min-height: 0;
        display: grid;
        grid-template-columns: repeat(4, minmax(0, 1fr));
        align-items: stretch;
        gap: 0;
        padding: 4px 8px;
        overflow: visible;
    }

    .vms3-local-nav a {
        min-width: 0;
        min-height: 40px;
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 7px 4px;
        font-size: 11px;
        line-height: 1.18;
        text-align: center;
        white-space: normal;
        overflow-wrap: anywhere;
    }

    .vms3-local-nav a::after {
        left: 8px;
        right: 8px;
        bottom: 2px;
    }

    .vms3-stage1 [id^="vms3-"] {
        scroll-margin-top: 112px;
    }

    .vms3-integration-stats,
    .vms3-resources-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .vms3-integration-groups {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 480px) {
    .vms3-local-nav a {
        font-size: 10.5px;
    }

    .vms3-integration-stats,
    .vms3-resources-grid {
        grid-template-columns: 1fr;
    }

    .vms3-resource-card {
        min-height: 0;
    }
}

/* ==========================================================================
   VMS V2 — Overview image quality + compact Features groups + Industry CTA
   2026-09-24
   ========================================================================== */

/*
 * Overview lightbox:
 * never upscale a screenshot beyond its intrinsic pixel dimensions.
 *
 * The previous width:100% / height:100% rule enlarged smaller PNG files to
 * fill the modal, which made interface text and thin UI lines look blurred.
 */
.vms3-overview-modal-media {
    padding: 10px;
}

.vms3-overview-modal-media img {
    display: block;

    width: auto !important;
    height: auto !important;

    max-width: 100% !important;
    max-height: 100% !important;

    margin: auto;

    object-fit: contain;
    image-rendering: auto;
}

/*
 * Keep the navigation buttons above any unused dark space around a native-size
 * screenshot.
 */
.vms3-overview-modal-nav {
    z-index: 4;
}


/* --------------------------------------------------------------------------
   Industry Applications bridge
   -------------------------------------------------------------------------- */

.vms3-industry-bridge {
    display: grid;

    grid-template-columns:
        54px
        minmax(0, 1fr)
        auto;

    align-items: center;

    gap: 22px;

    margin-top: 32px;

    padding: 24px 26px;

    background: #f4f6f8;

    border:
        1px solid #d9dfe5;

    border-left:
        4px solid #50647f;

    border-radius: 6px;
}


.vms3-industry-bridge-icon {
    display: flex;

    align-items: center;
    justify-content: center;

    width: 48px;
    height: 48px;

    color: #ffffff;

    background: #334a62;

    border-radius: 5px;

    font-size: 20px;
}


.vms3-industry-bridge-icon i,
.vms3-industry-bridge-icon svg {
    margin: 0 !important;
}


.vms3-industry-bridge-copy {
    min-width: 0;
}


.vms3-industry-bridge-kicker {
    display: block;

    margin-bottom: 5px;

    color: #687789;

    font-size: 10px;
    line-height: 1.2;

    font-weight: 800;

    letter-spacing: 1.15px;

    text-transform: uppercase;
}


.vms3-industry-bridge strong {
    display: block;

    margin-bottom: 6px;

    color: #263140;

    font-size: 18px;
    line-height: 1.3;
}


.vms3-industry-bridge p {
    max-width: 760px;

    margin: 0;

    color: #5f6e7d;

    font-size: 13px;
    line-height: 1.55;
}


.vms3-industry-tags {
    display: flex;
    flex-wrap: wrap;

    gap: 6px;

    margin-top: 12px;
}


.vms3-industry-tags span {
    display: inline-flex;

    align-items: center;

    min-height: 27px;

    padding: 4px 9px;

    color: #536477;

    background: #ffffff;

    border:
        1px solid #d7dde3;

    border-radius: 4px;

    font-size: 10px;
    line-height: 1.2;

    font-weight: 700;
}


.vms3-industry-bridge-link {
    flex: 0 0 auto;

    white-space: nowrap;
}


/* --------------------------------------------------------------------------
   Features & Capabilities — category navigation
   -------------------------------------------------------------------------- */

.vms2-capabilities-section {
    background: #ffffff;
}


.vms2-capabilities-section
.vms2-section-head {
    margin-bottom: 24px;
}


.vms3-capability-tabs {
    display: grid;

    grid-template-columns:
        repeat(4, minmax(0, 1fr));

    gap: 1px;

    overflow: hidden;

    margin-bottom: 18px;

    background: #d9dfe5;

    border:
        1px solid #d9dfe5;

    border-radius: 6px;
}


.vms3-capability-tab {
    display: flex;

    align-items: center;
    justify-content: flex-start;

    gap: 10px;

    min-width: 0;
    min-height: 54px;

    padding: 12px 15px;

    color: #526274;

    background: #f5f6f8;

    border: 0;

    font: inherit;

    font-size: 12px;
    line-height: 1.3;

    font-weight: 750;

    text-align: left;

    cursor: pointer;

    transition:
        color .15s ease,
        background-color .15s ease;
}


.vms3-capability-tab i,
.vms3-capability-tab svg {
    flex: 0 0 auto;

    margin: 0 !important;

    color: #687789;

    font-size: 15px;
}


.vms3-capability-tab:hover,
.vms3-capability-tab:focus-visible {
    color: #263140;

    background: #ffffff;
}


.vms3-capability-tab.is-active {
    color: #ffffff;

    background: #334a62;
}


.vms3-capability-tab.is-active i,
.vms3-capability-tab.is-active svg {
    color: #ffffff;
}


.vms3-capability-panels {
    border:
        1px solid #dfe3e7;

    border-radius: 6px;

    background: #ffffff;
}


.vms3-capability-panel[hidden] {
    display: none !important;
}


.vms3-capability-panel-head {
    display: grid;

    grid-template-columns:
        minmax(180px, .34fr)
        minmax(0, .66fr);

    gap: 28px;

    align-items: start;

    padding: 20px 22px 18px;

    background: #f7f8f9;

    border-bottom:
        1px solid #dfe3e7;
}


.vms3-capability-panel-head h3 {
    margin: 0;

    color: #263140;

    font-size: 17px;
    line-height: 1.3;

    font-weight: 800;
}


.vms3-capability-panel-head p {
    margin: 0;

    color: #657587;

    font-size: 12px;
    line-height: 1.55;
}


.vms3-capability-panel-grid {
    display: grid;

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


.vms3-capability-panel-grid
.vms2-capability-item {
    min-height: 142px;

    border: 0;

    border-right:
        1px solid #dfe3e7;

    border-bottom:
        1px solid #dfe3e7;

    background: #ffffff !important;
}


.vms3-capability-panel-grid
.vms2-capability-item:nth-child(2n) {
    border-right: 0;
}


.vms3-capability-panel-grid
.vms2-capability-item:nth-last-child(-n + 2) {
    border-bottom: 0;
}


.vms3-capability-panel-grid
.vms2-capability-content h4 {
    margin:
        0 0 7px;

    color: #263140;

    font-size: 14px;
    line-height: 1.3;

    font-weight: 800;
}


.vms3-capability-panel-grid
.vms2-capability-content p {
    margin:
        0 0 5px;

    color: #5f6c79;

    font-size: 11px;
    line-height: 1.45;
}


.vms3-capability-panel-grid
.vms2-capability-content p:last-child {
    margin-bottom: 0;
}


/* --------------------------------------------------------------------------
   Responsive
   -------------------------------------------------------------------------- */

@media (max-width: 900px) {

    .vms3-industry-bridge {
        grid-template-columns:
            48px
            minmax(0, 1fr);

        gap: 16px;
    }


    .vms3-industry-bridge-link {
        grid-column:
            1 / -1;

        justify-self:
            start;
    }


    .vms3-capability-tabs {
        display: flex;

        overflow-x: auto;
        overflow-y: hidden;

        scrollbar-width: thin;
    }


    .vms3-capability-tab {
        flex:
            0 0 220px;
    }
}


@media (max-width: 680px) {

    .vms3-overview-modal-media {
        padding: 6px;
    }


    .vms3-industry-bridge {
        grid-template-columns:
            1fr;

        padding:
            20px 18px;
    }


    .vms3-industry-bridge-icon {
        width: 42px;
        height: 42px;
    }


    .vms3-industry-bridge-link {
        width: 100%;
    }


    .vms3-capability-panel-head {
        grid-template-columns:
            1fr;

        gap: 6px;

        padding:
            17px 16px;
    }


    .vms3-capability-panel-grid {
        grid-template-columns:
            1fr;
    }


    .vms3-capability-panel-grid
    .vms2-capability-item,
    .vms3-capability-panel-grid
    .vms2-capability-item:nth-child(2n),
    .vms3-capability-panel-grid
    .vms2-capability-item:nth-last-child(-n + 2) {
        min-height: 0;

        border-right: 0;

        border-bottom:
            1px solid #dfe3e7;
    }


    .vms3-capability-panel-grid
    .vms2-capability-item:last-child {
        border-bottom: 0;
    }
}


/* ==========================================================================
   VMS V2 — Analytics chips + screenshot chrome crop + modal description
   2026-09-24
   ========================================================================== */


/* --------------------------------------------------------------------------
   Overview screenshots — hide the desktop window title bar
   -------------------------------------------------------------------------- */

/*
 * The source screenshots contain a small desktop-window chrome/title area.
 * A slightly wider viewport crops only the top edge while keeping the bottom
 * of the application UI aligned, so the screenshot reads as a full-screen app.
 */
.vms3-overview-card-media {
    aspect-ratio: 1.83 / 1;
}


.vms3-overview-card-media img {
    position: absolute;

    left: 0;
    right: 0;
    bottom: 0;

    width: 100%;
    height: auto;
    min-height: 100%;

    padding: 0;

    object-fit: cover;
    object-position: center bottom;

    background: #263140;
}


/*
 * Full-size preview:
 * keep native-size quality, but visually remove the same small title-bar area.
 * No scale() is used here, so this does not reintroduce screenshot blur.
 */
.vms3-overview-modal-media img {
    clip-path:
        inset(
            3% 0 0 0
        );

    transform:
        translateY(-1.5%);
}


/* --------------------------------------------------------------------------
   Full-size screenshot description — make it noticeable
   -------------------------------------------------------------------------- */

.vms3-overview-modal-description {
    padding:
        17px 24px
        19px;

    color:
        #34475a;

    font-size:
        16px;

    line-height:
        1.6;

    font-weight:
        500;
}


@media (min-width: 1200px) {

    .vms3-overview-modal-description {
        font-size:
            17px;
    }
}


@media (max-width: 720px) {

    .vms3-overview-modal-description {
        padding:
            14px 16px
            16px;

        font-size:
            14px;

        line-height:
            1.55;
    }
}


/* --------------------------------------------------------------------------
   Video Analytics and Automation — integration-style module chips
   -------------------------------------------------------------------------- */

#vms3-analytics
.vms2-section-head {
    margin-bottom:
        28px;
}


.vms3-analytics-grid {
    display:
        grid;

    grid-template-columns:
        repeat(2, minmax(0, 1fr));

    gap:
        14px;

    margin-top:
        0;
}


.vms3-analytics-card {
    min-width:
        0;

    padding:
        22px 24px
        24px;

    background:
        #ffffff;

    border:
        1px solid #dce2e7;

    border-radius:
        6px;

    box-shadow:
        none;
}


.vms3-analytics-card-head {
    display:
        flex;

    align-items:
        center;

    gap:
        12px;

    margin-bottom:
        12px;
}


.vms3-analytics-icon {
    flex:
        0 0 auto;

    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

    width:
        38px;

    height:
        38px;

    margin:
        0;

    color:
        #ffffff;

    background:
        #50647f;

    border-radius:
        5px;

    font-size:
        16px;
}


.vms3-analytics-grid h3 {
    margin:
        0;

    color:
        #263140;

    font-size:
        17px;

    line-height:
        1.3;

    font-weight:
        800;
}


.vms3-analytics-description {
    max-width:
        none;

    margin:
        0 0 16px;

    color:
        #5d6d7d;

    font-size:
        13px;

    line-height:
        1.55;
}


/*
 * Same visual language as Compatibility & Integrations:
 * small neutral bordered technology/module labels instead of bullet lists.
 */
.vms3-analytics-modules {
    display:
        flex;

    flex-wrap:
        wrap;

    gap:
        7px;

    margin:
        0;

    padding:
        0;

    list-style:
        none;
}


.vms3-analytics-modules li {
    position:
        static;

    display:
        inline-flex;

    align-items:
        center;

    min-height:
        30px;

    padding:
        6px 10px;

    color:
        #506071;

    background:
        #f7f9fb;

    border:
        1px solid #d7dde3;

    border-radius:
        4px;

    font-size:
        11px;

    line-height:
        1.3;

    font-weight:
        700;
}


.vms3-analytics-modules li::before {
    display:
        none;
}


.vms3-analytics-link {
    margin-top:
        20px;
}


@media (max-width: 820px) {

    .vms3-analytics-grid {
        grid-template-columns:
            1fr;
    }
}


@media (max-width: 520px) {

    .vms3-analytics-card {
        padding:
            20px 18px;
    }

    .vms3-analytics-modules {
        gap:
            6px;
    }

    .vms3-analytics-modules li {
        font-size:
            10.5px;
    }
}


/* ==========================================================================
   VMS V2 — Unified card headings
   2026-09-24
   ========================================================================== */

/*
 * One visual rule across the product page:
 * icon on the left, title on the right, supporting copy below.
 *
 * Analytics already used this pattern. Solutions, audiences, enterprise
 * architecture, editions and resources now use the same composition.
 */


/* --------------------------------------------------------------------------
   Common heading row
   -------------------------------------------------------------------------- */

.vms3-card-head,
.vms3-edition-head,
.vms3-resource-head,
.vms3-analytics-card-head {
    display: flex;

    align-items: center;

    gap: 12px;

    min-width: 0;

    margin-bottom: 12px;
}


.vms3-card-head h3,
.vms3-edition-head h3,
.vms3-resource-head h3,
.vms3-analytics-card-head h3 {
    min-width: 0;

    margin: 0;

    color: #263140;

    line-height: 1.3;

    font-weight: 800;
}


/* --------------------------------------------------------------------------
   Common icon treatment
   -------------------------------------------------------------------------- */

.vms3-card-icon,
.vms2-edition-icon,
.vms3-resource-icon,
.vms3-analytics-icon {
    flex: 0 0 38px;

    display: flex;

    align-items: center;
    justify-content: center;

    width: 38px;
    height: 38px;

    margin: 0;

    color: #ffffff;

    background: #50647f;

    border-radius: 5px;

    font-size: 16px;
}


.vms3-card-icon i,
.vms3-card-icon svg,
.vms2-edition-icon i,
.vms2-edition-icon svg,
.vms3-resource-icon i,
.vms3-resource-icon svg,
.vms3-analytics-icon i,
.vms3-analytics-icon svg {
    margin: 0 !important;

    color: inherit;
}


/* --------------------------------------------------------------------------
   Solutions
   -------------------------------------------------------------------------- */

.vms3-solution-card {
    min-height: 190px;

    padding: 22px 22px;
}


.vms3-solution-card > i,
.vms3-solution-card > svg {
    display: none;
}


.vms3-solution-card .vms3-card-head {
    margin-bottom: 12px;
}


.vms3-solution-card h3 {
    margin: 0;

    font-size: 17px;
}


.vms3-solution-card p {
    font-size: 13px;

    line-height: 1.55;
}


/* --------------------------------------------------------------------------
   For Professional Projects
   -------------------------------------------------------------------------- */

.vms2-audience-grid article {
    padding: 22px;
}


.vms2-audience-grid article > i,
.vms2-audience-grid article > svg {
    display: none;
}


.vms2-audience-grid .vms3-card-head {
    margin-bottom: 12px;
}


.vms2-audience-grid h3 {
    margin: 0;

    font-size: 17px;

    line-height: 1.3;
}


.vms2-audience-grid p {
    font-size: 13px;

    line-height: 1.55;
}


/* --------------------------------------------------------------------------
   Enterprise Architecture
   -------------------------------------------------------------------------- */

.vms2-enterprise-grid article {
    padding: 20px;
}


.vms2-enterprise-grid article > i,
.vms2-enterprise-grid article > svg {
    display: none;
}


.vms2-enterprise-grid .vms3-card-head {
    margin-bottom: 11px;
}


.vms2-enterprise-grid h3 {
    margin: 0;

    font-size: 16px;

    line-height: 1.3;
}


.vms2-enterprise-grid p {
    font-size: 12px;

    line-height: 1.5;
}


/* --------------------------------------------------------------------------
   Editions
   -------------------------------------------------------------------------- */

.vms2-edition-card {
    min-height: 226px;

    padding: 22px 20px 18px;
}


.vms3-edition-head {
    margin-bottom: 12px;
}


.vms3-edition-head .vms2-edition-icon {
    margin: 0;
}


.vms3-edition-head h3 {
    font-size: 19px;
}


.vms2-edition-card p {
    min-height: 38px;

    margin-bottom: 0;

    font-size: 13px;

    line-height: 1.45;
}


.vms2-edition-card ul {
    margin-top: 11px;
}


/* Cards with top badges need a little more breathing room before the row. */

.vms2-edition-card.has-badge {
    padding-top: 25px;
}


/* --------------------------------------------------------------------------
   Resources
   -------------------------------------------------------------------------- */

.vms3-resource-card {
    min-height: 244px;

    padding: 24px 22px;
}


.vms3-resource-head {
    margin-bottom: 13px;
}


.vms3-resource-head .vms3-resource-icon {
    margin: 0;
}


.vms3-resource-head h3 {
    margin: 0;

    font-size: 17px;
}


.vms3-resource-card p {
    margin-bottom: 18px;

    font-size: 13px;

    line-height: 1.55;
}


/* --------------------------------------------------------------------------
   Analytics — keep the same baseline as the other cards
   -------------------------------------------------------------------------- */

.vms3-analytics-card-head {
    margin-bottom: 12px;
}


.vms3-analytics-icon {
    width: 38px;
    height: 38px;

    flex-basis: 38px;
}


.vms3-analytics-card-head h3 {
    font-size: 17px;
}


/* --------------------------------------------------------------------------
   Features & Capabilities already uses icon-left / text-right.
   Align its icon geometry with the rest of the page.
   -------------------------------------------------------------------------- */

.vms3-capability-panel-grid
.vms2-capability-item {
    grid-template-columns:
        38px minmax(0, 1fr);

    gap: 13px;
}


.vms3-capability-panel-grid
.vms2-capability-icon {
    width: 38px;

    height: 38px;

    font-size: 16px;

    border-radius: 5px;
}


/* --------------------------------------------------------------------------
   Responsive
   -------------------------------------------------------------------------- */

@media (max-width: 720px) {

    .vms3-solution-card,
    .vms2-audience-grid article,
    .vms2-enterprise-grid article {
        min-height: 0;
    }


    .vms2-edition-card,
    .vms3-resource-card {
        min-height: 0;
    }
}


@media (max-width: 480px) {

    .vms3-card-head,
    .vms3-edition-head,
    .vms3-resource-head,
    .vms3-analytics-card-head {
        align-items: flex-start;

        gap: 10px;
    }


    .vms3-card-icon,
    .vms2-edition-icon,
    .vms3-resource-icon,
    .vms3-analytics-icon {
        flex-basis: 36px;

        width: 36px;
        height: 36px;

        font-size: 15px;
    }
}


/* ==========================================================================
   VMS V2 — Hero / Overview / Features refinement
   2026-09-24
   ========================================================================== */


/* --------------------------------------------------------------------------
   Hero — stronger brand separation and a larger application preview
   -------------------------------------------------------------------------- */

.vms2-hero {
    background:
        radial-gradient(
            circle at 82% 18%,
            rgba(80, 100, 127, .18),
            transparent 30%
        ),
        linear-gradient(
            135deg,
            #e7edf2 0%,
            #f3f6f8 52%,
            #e4ebf1 100%
        );

    border-bottom:
        1px solid #d7dfe6;
}


@media (min-width: 1101px) {

    .vms2-hero-grid {
        grid-template-columns:
            minmax(390px, .76fr)
            minmax(620px, 1.24fr);

        gap:
            50px;
    }


    .vms2-hero-visual {
        width:
            106%;

        margin-left:
            -3%;
    }
}


/*
 * Treat the source Hero screenshot like a full-screen application:
 * the frame uses a slightly wider aspect ratio and anchors the image to the
 * bottom, which trims the thin desktop title bar at the top.
 */
.vms2-product-frame {
    overflow:
        hidden;

    aspect-ratio:
        1.84 / 1;
}


.vms2-product-frame img {
    width:
        100%;

    height:
        100%;

    object-fit:
        cover;

    object-position:
        center bottom;

    border-radius:
        2px;
}


/* --------------------------------------------------------------------------
   Section descriptions — use the available content width
   -------------------------------------------------------------------------- */

.vms3-stage1
.vms2-section-head > p {
    width:
        100%;

    max-width:
        none;

    text-align:
        justify;

    text-justify:
        inter-word;
}


.vms3-overview-intro {
    width:
        100%;

    max-width:
        none;

    margin-bottom:
        0;
}


.vms3-overview-intro p {
    text-align:
        justify;

    text-justify:
        inter-word;
}


/* --------------------------------------------------------------------------
   Overview — cleaner screenshot strip
   -------------------------------------------------------------------------- */

.vms3-overview-section {
    padding-top:
        66px;

    padding-bottom:
        66px;
}


.vms3-overview-head {
    max-width:
        none;

    margin-bottom:
        18px;
}


.vms3-overview-media {
    margin-top:
        14px;
}


/* The navigation arrows above the screenshots are intentionally removed. */
.vms3-overview-slider-toolbar {
    display:
        none !important;
}


.vms3-overview-slider-track {
    gap:
        14px;

    padding:
        1px;

    scrollbar-width:
        none;

    -ms-overflow-style:
        none;
}


.vms3-overview-slider-track::-webkit-scrollbar {
    display:
        none;

    width:
        0;

    height:
        0;
}


.vms3-overview-card {
    flex:
        0 0
        calc(
            (100% - 42px) / 4
        );
}


/*
 * Keep the same crop treatment as the full-screen preview:
 * title chrome disappears, useful application content remains.
 */
.vms3-overview-card-media {
    aspect-ratio:
        1.84 / 1;
}


.vms3-overview-card-media img {
    object-position:
        center bottom;
}


/* The old Learn more / Show less control is no longer part of Overview. */
.vms3-overview-more-toggle,
.vms3-overview-more {
    display:
        none !important;
}


@media (max-width: 980px) {

    .vms3-overview-card {
        flex-basis:
            calc(
                (100% - 14px) / 2
            );
    }
}


@media (max-width: 620px) {

    .vms3-overview-card {
        flex-basis:
            min(
                84vw,
                320px
            );
    }


    .vms3-overview-intro p,
    .vms3-stage1
    .vms2-section-head > p {
        text-align:
            left;
    }
}


/* --------------------------------------------------------------------------
   Features & Capabilities — branded section background
   -------------------------------------------------------------------------- */

.vms2-capabilities-section {
    position:
        relative;

    overflow:
        hidden;

    background:
        radial-gradient(
            circle at 90% 0%,
            rgba(80, 100, 127, .62),
            transparent 30%
        ),
        #263140;

    border-top:
        1px solid #334255;

    border-bottom:
        1px solid #334255;
}


.vms2-capabilities-section::before {
    content:
        "";

    position:
        absolute;

    inset:
        0;

    pointer-events:
        none;

    background:
        linear-gradient(
            115deg,
            rgba(255, 255, 255, .025),
            transparent 32%
        );
}


.vms2-capabilities-section
.vms2-container {
    position:
        relative;

    z-index:
        1;
}


.vms2-capabilities-section
.vms2-kicker {
    color:
        #b9c6d4;
}


.vms2-capabilities-section
.vms2-section-head h2 {
    color:
        #ffffff;

    background-image:
        none;

    -webkit-text-fill-color:
        #ffffff;
}


.vms2-capabilities-section
.vms2-section-head > p {
    color:
        #d8e0e8;
}


/* Six groups: 3 x 2 on desktop so labels stay readable. */

.vms3-capability-tabs {
    grid-template-columns:
        repeat(3, minmax(0, 1fr));

    margin-bottom:
        16px;

    border-color:
        rgba(255, 255, 255, .14);

    background:
        rgba(255, 255, 255, .14);
}


.vms3-capability-tab {
    min-height:
        58px;

    background:
        #f1f3f5;
}


.vms3-capability-tab.is-active {
    background:
        #50647f;
}


/* Group description is directly under the group title. */

.vms3-capability-panel-head {
    display:
        block;

    padding:
        20px 22px 18px;

    background:
        #eef1f4;
}


.vms3-capability-panel-head h3 {
    margin:
        0 0 7px;

    font-size:
        18px;
}


.vms3-capability-panel-head p {
    width:
        100%;

    max-width:
        none;

    margin:
        0;

    color:
        #5d6d7d;

    font-size:
        13px;

    line-height:
        1.55;

    text-align:
        justify;

    text-justify:
        inter-word;
}


/*
 * Panels contain a variable number of features.
 * A one-pixel grid background gives every card the same divider treatment
 * without relying on odd/even selectors.
 */
.vms3-capability-panel-grid {
    display:
        grid;

    grid-template-columns:
        repeat(2, minmax(0, 1fr));

    gap:
        1px;

    background:
        #dfe3e7;
}


.vms3-capability-panel-grid
.vms2-capability-item,
.vms3-capability-panel-grid
.vms2-capability-item:nth-child(2n),
.vms3-capability-panel-grid
.vms2-capability-item:nth-last-child(-n + 2) {
    min-height:
        150px;

    padding:
        20px;

    border:
        0;

    background:
        #ffffff !important;
}


.vms3-capability-panel-grid
.vms2-capability-content h4 {
    font-size:
        14px;
}


.vms3-capability-panel-grid
.vms2-capability-content p {
    margin:
        0;

    font-size:
        11.5px;

    line-height:
        1.5;
}


@media (max-width: 900px) {

    .vms3-capability-tabs {
        display:
            grid;

        grid-template-columns:
            repeat(2, minmax(0, 1fr));

        overflow:
            visible;
    }


    .vms3-capability-tab {
        flex:
            none;
    }
}


@media (max-width: 680px) {

    .vms3-capability-tabs {
        grid-template-columns:
            1fr;
    }


    .vms3-capability-panel-head p {
        text-align:
            left;
    }


    .vms3-capability-panel-grid {
        grid-template-columns:
            1fr;
    }


    .vms3-capability-panel-grid
    .vms2-capability-item,
    .vms3-capability-panel-grid
    .vms2-capability-item:nth-child(2n),
    .vms3-capability-panel-grid
    .vms2-capability-item:nth-last-child(-n + 2) {
        min-height:
            0;
    }
}


/* --------------------------------------------------------------------------
   Local navigation anchor alignment
   -------------------------------------------------------------------------- */

/*
 * JS performs the exact offset calculation for clicks. Keep CSS fallback
 * aligned with the fixed local-navigation height for direct hash navigation.
 */
.vms3-stage1
[id^="vms3-"] {
    scroll-margin-top:
        calc(
            var(--vms3-nav-height) + 24px
        );
}


@media (max-width: 720px) {

    .vms3-stage1
    [id^="vms3-"] {
        scroll-margin-top:
            106px;
    }
}


/* ==========================================================================
   VMS V2 — Features redesign + full-width section descriptions
   2026-09-24
   ========================================================================== */


/* --------------------------------------------------------------------------
   Page descriptions
   -------------------------------------------------------------------------- */

/*
 * Main section descriptions should use the same available content width as the
 * section itself. Earlier V3 rules limited these blocks to 820–1080px, which
 * visually stopped the text before the right edge of the page.
 */
.vms3-stage1 .vms2-section-head,
.vms3-stage1 .vms2-section-head > div:first-child,
.vms3-stage1 .vms3-overview-head {
    width: 100%;
    max-width: none;
}


.vms3-stage1 .vms2-section-head > p,
.vms3-stage1 .vms3-overview-intro,
.vms3-stage1 .vms3-capability-panel-head > p,
.vms3-stage1 .vms3-specifications-panel-head > p {
    width: 100%;
    max-width: none;
}


.vms3-stage1 .vms2-section-head > p,
.vms3-stage1 .vms3-overview-intro p,
.vms3-stage1 .vms3-capability-panel-head > p,
.vms3-stage1 .vms3-specifications-panel-head > p,
.vms3-stage1 .vms3-industry-bridge-copy > p {
    text-align: justify;
    text-justify: inter-word;
    hyphens: auto;
}


.vms3-stage1 .vms2-section-head > p {
    margin:
        14px 0 0;
}


.vms3-stage1 .vms3-industry-bridge-copy {
    flex:
        1 1 auto;

    min-width:
        0;
}


.vms3-stage1 .vms3-industry-bridge-copy > p {
    width:
        100%;

    max-width:
        none;
}


/* --------------------------------------------------------------------------
   Features & Capabilities — distinctive technical section
   -------------------------------------------------------------------------- */

.vms2-capabilities-section {
    position:
        relative;

    overflow:
        hidden;

    isolation:
        isolate;

    background:
        radial-gradient(
            circle at 88% 10%,
            rgba(103, 132, 165, .28) 0,
            rgba(103, 132, 165, 0) 34%
        ),
        radial-gradient(
            circle at 8% 92%,
            rgba(80, 100, 127, .22) 0,
            rgba(80, 100, 127, 0) 38%
        ),
        linear-gradient(
            135deg,
            #1d2936 0%,
            #27394b 52%,
            #1e2936 100%
        );

    border-top:
        1px solid #35485b;

    border-bottom:
        1px solid #17222d;
}


.vms2-capabilities-section::before {
    content:
        "";

    position:
        absolute;

    inset:
        0;

    z-index:
        0;

    pointer-events:
        none;

    opacity:
        .28;

    background-image:
        linear-gradient(
            rgba(255, 255, 255, .035) 1px,
            transparent 1px
        ),
        linear-gradient(
            90deg,
            rgba(255, 255, 255, .035) 1px,
            transparent 1px
        );

    background-size:
        42px 42px;

    mask-image:
        linear-gradient(
            to bottom,
            rgba(0, 0, 0, .85),
            rgba(0, 0, 0, .15)
        );
}


.vms2-capabilities-section::after {
    content:
        "";

    position:
        absolute;

    left:
        0;

    right:
        0;

    top:
        0;

    height:
        1px;

    z-index:
        0;

    pointer-events:
        none;

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(255, 255, 255, .28),
            transparent
        );
}


.vms2-capabilities-section > .vms2-container {
    position:
        relative;

    z-index:
        1;
}


/* Section heading */

.vms2-capabilities-section
.vms3-features-head {
    margin-bottom:
        24px;
}


.vms2-capabilities-section
.vms3-features-head
.vms2-kicker {
    color:
        #b8c6d5;
}


.vms2-capabilities-section
.vms3-features-head h2 {
    color:
        #ffffff;

    background-image:
        none;

    -webkit-text-fill-color:
        #ffffff;
}


.vms2-capabilities-section
.vms3-features-head > p {
    color:
        #d7e0e9;

    font-size:
        14px;

    line-height:
        1.65;
}


/* Main Features surface */

.vms3-capability-layout {
    padding:
        12px;

    background:
        rgba(11, 18, 25, .22);

    border:
        1px solid rgba(255, 255, 255, .12);

    border-radius:
        10px;

    box-shadow:
        0 18px 42px rgba(8, 15, 22, .18);
}


/* Group navigation */

.vms3-capability-tabs {
    display:
        grid;

    grid-template-columns:
        repeat(3, minmax(0, 1fr));

    gap:
        10px;

    margin:
        0 0 12px;

    padding:
        0;

    overflow:
        visible;

    background:
        transparent;

    border:
        0;
}


.vms3-capability-tab {
    position:
        relative;

    display:
        flex;

    align-items:
        center;

    gap:
        11px;

    min-width:
        0;

    min-height:
        56px;

    padding:
        10px 13px;

    color:
        #d8e2ec;

    background:
        rgba(255, 255, 255, .055);

    border:
        1px solid rgba(255, 255, 255, .12);

    border-radius:
        6px;

    font:
        inherit;

    text-align:
        left;

    cursor:
        pointer;

    transition:
        background-color .16s ease,
        border-color .16s ease,
        transform .16s ease,
        box-shadow .16s ease;
}


.vms3-capability-tab:hover {
    background:
        rgba(255, 255, 255, .09);

    border-color:
        rgba(255, 255, 255, .22);
}


.vms3-capability-tab.is-active {
    color:
        #ffffff;

    background:
        rgba(80, 100, 127, .88);

    border-color:
        rgba(154, 174, 196, .72);

    box-shadow:
        inset 3px 0 0 #f43c0a,
        0 6px 16px rgba(8, 15, 22, .14);
}


.vms3-capability-tab-icon {
    flex:
        0 0 32px;

    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

    width:
        32px;

    height:
        32px;

    color:
        #eef4fa;

    background:
        rgba(255, 255, 255, .09);

    border:
        1px solid rgba(255, 255, 255, .10);

    border-radius:
        5px;

    font-size:
        14px;
}


.vms3-capability-tab.is-active
.vms3-capability-tab-icon {
    color:
        #ffffff;

    background:
        rgba(30, 41, 54, .42);

    border-color:
        rgba(255, 255, 255, .14);
}


.vms3-capability-tab-title {
    min-width:
        0;

    color:
        inherit;

    font-size:
        12.5px;

    line-height:
        1.3;

    font-weight:
        750;
}


/* Active group */

.vms3-capability-panels {
    min-width:
        0;
}


.vms3-capability-panel {
    overflow:
        hidden;

    background:
        rgba(15, 24, 33, .30);

    border:
        1px solid rgba(255, 255, 255, .12);

    border-radius:
        8px;
}


.vms3-capability-panel-head {
    display:
        block;

    padding:
        20px 22px 18px;

    background:
        rgba(255, 255, 255, .045);

    border-bottom:
        1px solid rgba(255, 255, 255, .10);
}


.vms3-capability-panel-title {
    display:
        flex;

    align-items:
        center;

    gap:
        12px;

    margin-bottom:
        9px;
}


.vms3-capability-panel-icon {
    flex:
        0 0 38px;

    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

    width:
        38px;

    height:
        38px;

    color:
        #ffffff;

    background:
        #50647f;

    border:
        1px solid rgba(255, 255, 255, .12);

    border-radius:
        5px;

    font-size:
        16px;
}


.vms3-capability-panel-head h3 {
    margin:
        0;

    color:
        #ffffff;

    font-size:
        19px;

    line-height:
        1.3;

    font-weight:
        800;
}


.vms3-capability-panel-head > p {
    margin:
        0;

    color:
        #c9d4df;

    font-size:
        13px;

    line-height:
        1.62;
}


/* Features within the selected group */

.vms3-capability-panel-grid {
    display:
        grid;

    grid-template-columns:
        repeat(2, minmax(0, 1fr));

    gap:
        10px;

    padding:
        12px;

    background:
        transparent;
}


.vms3-capability-panel-grid
.vms2-capability-item,
.vms3-capability-panel-grid
.vms2-capability-item:nth-child(2n),
.vms3-capability-panel-grid
.vms2-capability-item:nth-last-child(-n + 2) {
    display:
        grid;

    grid-template-columns:
        38px minmax(0, 1fr);

    align-items:
        start;

    gap:
        13px;

    min-height:
        118px;

    padding:
        18px;

    color:
        #ffffff;

    background:
        rgba(255, 255, 255, .065) !important;

    border:
        1px solid rgba(255, 255, 255, .11);

    border-radius:
        6px;

    transition:
        background-color .16s ease,
        border-color .16s ease,
        transform .16s ease;
}


.vms3-capability-panel-grid
.vms2-capability-item:hover {
    background:
        rgba(255, 255, 255, .095) !important;

    border-color:
        rgba(171, 194, 218, .30);

    transform:
        translateY(-1px);
}


.vms3-capability-panel-grid
.vms2-capability-icon {
    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

    width:
        38px;

    height:
        38px;

    margin:
        0;

    color:
        #ffffff;

    background:
        #50647f;

    border:
        1px solid rgba(255, 255, 255, .10);

    border-radius:
        5px;

    font-size:
        16px;
}


.vms3-capability-panel-grid
.vms2-capability-content h4 {
    margin:
        1px 0 7px;

    color:
        #ffffff;

    font-size:
        14px;

    line-height:
        1.35;

    font-weight:
        800;
}


.vms3-capability-panel-grid
.vms2-capability-content p {
    margin:
        0;

    color:
        #c5d0db;

    font-size:
        11.5px;

    line-height:
        1.55;

    text-align:
        left;
}


/* --------------------------------------------------------------------------
   Responsive
   -------------------------------------------------------------------------- */

@media (max-width: 900px) {

    .vms3-capability-tabs {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }


    .vms3-capability-panel-grid {
        grid-template-columns:
            1fr;
    }
}


@media (max-width: 620px) {

    .vms3-capability-layout {
        padding:
            8px;
    }


    .vms3-capability-tabs {
        grid-template-columns:
            1fr;

        gap:
            7px;
    }


    .vms3-capability-tab {
        min-height:
            50px;
    }


    .vms3-capability-panel-head {
        padding:
            17px 16px 15px;
    }


    .vms3-capability-panel-title {
        align-items:
            flex-start;
    }


    .vms3-capability-panel-grid {
        gap:
            8px;

        padding:
            8px;
    }


    .vms3-capability-panel-grid
    .vms2-capability-item,
    .vms3-capability-panel-grid
    .vms2-capability-item:nth-child(2n),
    .vms3-capability-panel-grid
    .vms2-capability-item:nth-last-child(-n + 2) {
        min-height:
            0;

        padding:
            15px;
    }
}


/* ==========================================================================
   VMS V2 — Features Explorer V2
   Cohesive dark technical layout: navigation rail + active capability panel
   ========================================================================== */


/* --------------------------------------------------------------------------
   Section background
   -------------------------------------------------------------------------- */

.vms2-page #vms3-features.vms2-capabilities-section {
    position: relative;

    overflow: hidden;

    padding-top: 58px;
    padding-bottom: 62px;

    background:
        radial-gradient(
            circle at 82% 8%,
            rgba(104, 135, 170, .26) 0,
            rgba(104, 135, 170, 0) 31%
        ),
        radial-gradient(
            circle at 14% 100%,
            rgba(65, 92, 120, .24) 0,
            rgba(65, 92, 120, 0) 34%
        ),
        linear-gradient(
            135deg,
            #1c2835 0%,
            #253749 52%,
            #1d2936 100%
        ) !important;

    border-top: 1px solid #33495e;
    border-bottom: 1px solid #17222d;
}


.vms2-page #vms3-features.vms2-capabilities-section::before {
    content: "";

    position: absolute;
    inset: 0;

    z-index: 0;

    pointer-events: none;

    background:
        linear-gradient(
            115deg,
            transparent 0%,
            transparent 39%,
            rgba(255, 255, 255, .025) 39.2%,
            transparent 39.5%,
            transparent 100%
        ),
        linear-gradient(
            rgba(255, 255, 255, .022) 1px,
            transparent 1px
        );

    background-size:
        auto,
        100% 38px;

    opacity: .72;
}


.vms2-page #vms3-features > .vms2-container {
    position: relative;

    z-index: 1;
}


/* --------------------------------------------------------------------------
   Section heading
   -------------------------------------------------------------------------- */

.vms2-page #vms3-features .vms3-features-head {
    display: block;

    width: 100%;

    margin-bottom: 28px;
}


.vms2-page #vms3-features .vms3-features-head > div:first-child {
    width: 100%;
    max-width: none;
}


.vms2-page #vms3-features .vms3-features-head .vms2-kicker {
    color: #aebdcb;
}


.vms2-page #vms3-features .vms3-features-head h2 {
    margin-bottom: 0;

    color: #ffffff !important;

    background: none !important;

    -webkit-text-fill-color: #ffffff !important;
}


.vms2-page #vms3-features .vms3-features-head > p {
    width: 100%;
    max-width: none !important;

    margin: 13px 0 0;

    color: #d1dbe4;

    font-size: 14px;
    line-height: 1.65;

    text-align: justify;
    text-justify: inter-word;
}


/* --------------------------------------------------------------------------
   Explorer shell
   -------------------------------------------------------------------------- */

.vms2-page #vms3-features .vms3-capability-layout {
    display: grid;

    grid-template-columns:
        270px minmax(0, 1fr);

    gap: 0;

    padding: 0;

    overflow: hidden;

    background:
        rgba(15, 23, 31, .44) !important;

    border:
        1px solid rgba(176, 196, 216, .18);

    border-radius: 8px;

    box-shadow:
        0 22px 48px rgba(7, 13, 19, .22);
}


/* --------------------------------------------------------------------------
   Left navigation rail
   -------------------------------------------------------------------------- */

.vms2-page #vms3-features .vms3-capability-tabs {
    display: flex;

    flex-direction: column;

    gap: 0;

    min-width: 0;

    margin: 0;
    padding: 8px;

    overflow: visible;

    background:
        rgba(11, 18, 25, .34) !important;

    border: 0;
    border-right:
        1px solid rgba(176, 196, 216, .13);
}


.vms2-page #vms3-features .vms3-capability-tab {
    position: relative;

    display: grid;

    grid-template-columns:
        34px minmax(0, 1fr);

    align-items: center;

    gap: 10px;

    width: 100%;

    min-height: 54px;

    padding: 9px 11px;

    color: #cbd7e2;

    background:
        transparent !important;

    border:
        1px solid transparent !important;

    border-radius: 5px;

    text-align: left;

    cursor: pointer;

    transition:
        color .16s ease,
        background-color .16s ease,
        border-color .16s ease;
}


.vms2-page #vms3-features .vms3-capability-tab + .vms3-capability-tab {
    margin-top: 3px;
}


.vms2-page #vms3-features .vms3-capability-tab::before {
    content: "";

    position: absolute;

    left: 0;
    top: 10px;
    bottom: 10px;

    width: 3px;

    background: transparent;

    border-radius: 0 3px 3px 0;
}


.vms2-page #vms3-features .vms3-capability-tab:hover,
.vms2-page #vms3-features .vms3-capability-tab:focus-visible {
    color: #ffffff;

    background:
        rgba(255, 255, 255, .055) !important;

    border-color:
        rgba(255, 255, 255, .07) !important;
}


.vms2-page #vms3-features .vms3-capability-tab.is-active {
    color: #ffffff;

    background:
        linear-gradient(
            90deg,
            rgba(80, 100, 127, .52),
            rgba(80, 100, 127, .20)
        ) !important;

    border-color:
        rgba(139, 162, 187, .20) !important;

    box-shadow: none !important;
}


.vms2-page #vms3-features .vms3-capability-tab.is-active::before {
    background:
        #f43c0a;
}


.vms2-page #vms3-features .vms3-capability-tab-icon {
    display: flex;

    align-items: center;
    justify-content: center;

    width: 32px;
    height: 32px;

    flex: 0 0 32px;

    margin: 0;

    color: #dce6ef;

    background:
        rgba(255, 255, 255, .055) !important;

    border:
        1px solid rgba(255, 255, 255, .08);

    border-radius: 5px;

    font-size: 13px;
}


.vms2-page #vms3-features .vms3-capability-tab.is-active .vms3-capability-tab-icon {
    color: #ffffff;

    background:
        #50647f !important;

    border-color:
        #647b96;
}


.vms2-page #vms3-features .vms3-capability-tab-title {
    min-width: 0;

    color: inherit;

    font-size: 12px;
    line-height: 1.3;

    font-weight: 700;
}


/* --------------------------------------------------------------------------
   Active group content
   -------------------------------------------------------------------------- */

.vms2-page #vms3-features .vms3-capability-panels {
    min-width: 0;

    background:
        transparent !important;
}


.vms2-page #vms3-features .vms3-capability-panel {
    min-height: 100%;

    overflow: hidden;

    background:
        transparent !important;

    border: 0 !important;
    border-radius: 0;

    box-shadow: none !important;
}


.vms2-page #vms3-features .vms3-capability-panel[hidden] {
    display: none !important;
}


/* Group title + description */

.vms2-page #vms3-features .vms3-capability-panel-head {
    display: block;

    padding:
        24px 26px 20px;

    background:
        linear-gradient(
            180deg,
            rgba(255, 255, 255, .045),
            rgba(255, 255, 255, .015)
        ) !important;

    border: 0;
    border-bottom:
        1px solid rgba(176, 196, 216, .12);
}


.vms2-page #vms3-features .vms3-capability-panel-title {
    position: relative;

    display: block;

    margin: 0 0 9px;
    padding-left: 13px;
}


.vms2-page #vms3-features .vms3-capability-panel-title::before {
    content: "";

    position: absolute;

    left: 0;
    top: 3px;
    bottom: 3px;

    width: 3px;

    background: #f43c0a;

    border-radius: 2px;
}


.vms2-page #vms3-features .vms3-capability-panel-title h3 {
    margin: 0;

    color: #ffffff;

    font-size: 20px;
    line-height: 1.25;

    font-weight: 800;
}


.vms2-page #vms3-features .vms3-capability-panel-head > p {
    width: 100%;
    max-width: none !important;

    margin: 0;

    color: #c7d2dd;

    font-size: 13px;
    line-height: 1.62;

    text-align: justify;
    text-justify: inter-word;
}


/* --------------------------------------------------------------------------
   Feature cards
   -------------------------------------------------------------------------- */

.vms2-page #vms3-features .vms3-capability-panel-grid {
    display: grid;

    grid-template-columns:
        repeat(2, minmax(0, 1fr));

    gap: 1px;

    padding: 1px 0 0;

    background:
        rgba(176, 196, 216, .10) !important;
}


.vms2-page #vms3-features .vms3-capability-panel-grid .vms2-capability-item,
.vms2-page #vms3-features .vms3-capability-panel-grid .vms2-capability-item:nth-child(2n),
.vms2-page #vms3-features .vms3-capability-panel-grid .vms2-capability-item:nth-last-child(-n + 2) {
    position: relative;

    display: grid;

    grid-template-columns:
        38px minmax(0, 1fr);

    align-items: start;

    gap: 13px;

    min-height: 112px;

    padding: 18px 20px;

    color: #ffffff;

    background:
        #253545 !important;

    border: 0 !important;

    border-radius: 0 !important;

    box-shadow: none !important;

    transition:
        background-color .16s ease;
}


.vms2-page #vms3-features .vms3-capability-panel-grid .vms2-capability-item:hover {
    background:
        #2b3e50 !important;

    transform: none !important;
}


.vms2-page #vms3-features .vms3-capability-panel-grid .vms2-capability-icon {
    display: flex;

    align-items: center;
    justify-content: center;

    width: 38px;
    height: 38px;

    margin: 0;

    color: #ffffff;

    background:
        #50647f !important;

    border:
        1px solid #607692;

    border-radius: 5px;

    font-size: 15px;
}


.vms2-page #vms3-features .vms3-capability-panel-grid .vms2-capability-content {
    min-width: 0;
}


.vms2-page #vms3-features .vms3-capability-panel-grid .vms2-capability-content h4 {
    margin: 1px 0 7px;

    color: #ffffff;

    font-size: 14px;
    line-height: 1.32;

    font-weight: 800;
}


.vms2-page #vms3-features .vms3-capability-panel-grid .vms2-capability-content p {
    margin: 0;

    color: #bfcbd6;

    font-size: 11.5px;
    line-height: 1.52;

    text-align: left;
}


/*
 * If a group has an odd number of cards, the final card spans the width.
 * This removes the empty "dead" cell that made the previous design look like
 * an unfinished table.
 */
.vms2-page #vms3-features .vms3-capability-panel-grid.is-count-5
.vms2-capability-item:last-child {
    grid-column: 1 / -1;
}


.vms2-page #vms3-features .vms3-capability-panel-grid.is-count-5
.vms2-capability-item:last-child
.vms2-capability-content p {
    max-width: 780px;
}


/* --------------------------------------------------------------------------
   Responsive
   -------------------------------------------------------------------------- */

@media (max-width: 980px) {

    .vms2-page #vms3-features .vms3-capability-layout {
        grid-template-columns:
            220px minmax(0, 1fr);
    }


    .vms2-page #vms3-features .vms3-capability-tab {
        grid-template-columns:
            30px minmax(0, 1fr);

        min-height:
            50px;

        padding:
            8px 9px;
    }


    .vms2-page #vms3-features .vms3-capability-tab-icon {
        width:
            30px;

        height:
            30px;

        flex-basis:
            30px;
    }
}


@media (max-width: 760px) {

    .vms2-page #vms3-features.vms2-capabilities-section {
        padding-top:
            48px;

        padding-bottom:
            50px;
    }


    .vms2-page #vms3-features .vms3-capability-layout {
        display:
            block;
    }


    .vms2-page #vms3-features .vms3-capability-tabs {
        display:
            flex;

        flex-direction:
            row;

        gap:
            7px;

        padding:
            8px;

        overflow-x:
            auto;

        overflow-y:
            hidden;

        border-right:
            0;

        border-bottom:
            1px solid rgba(176, 196, 216, .13);

        scrollbar-width:
            none;

        scroll-snap-type:
            x proximity;
    }


    .vms2-page #vms3-features .vms3-capability-tabs::-webkit-scrollbar {
        display:
            none;
    }


    .vms2-page #vms3-features .vms3-capability-tab {
        flex:
            0 0 225px;

        width:
            225px;

        scroll-snap-align:
            start;
    }


    .vms2-page #vms3-features .vms3-capability-panel-grid {
        grid-template-columns:
            1fr;
    }


    .vms2-page #vms3-features .vms3-capability-panel-grid.is-count-5
    .vms2-capability-item:last-child {
        grid-column:
            auto;
    }
}


@media (max-width: 520px) {

    .vms2-page #vms3-features .vms3-features-head > p,
    .vms2-page #vms3-features .vms3-capability-panel-head > p {
        text-align:
            left;
    }


    .vms2-page #vms3-features .vms3-capability-panel-head {
        padding:
            20px 17px 17px;
    }


    .vms2-page #vms3-features .vms3-capability-panel-title h3 {
        font-size:
            18px;
    }


    .vms2-page #vms3-features .vms3-capability-panel-grid .vms2-capability-item,
    .vms2-page #vms3-features .vms3-capability-panel-grid .vms2-capability-item:nth-child(2n),
    .vms2-page #vms3-features .vms3-capability-panel-grid .vms2-capability-item:nth-last-child(-n + 2) {
        min-height:
            0;

        padding:
            16px 17px;
    }
}

/* ==========================================================================
   VMS V2 — Unified justified descriptions
   2026-09-25
   ========================================================================== */

.vms2-page .vms2-hero-lead,
.vms2-page .vms3-overview-intro p,
.vms2-page .vms3-overview-modal-description,
.vms2-page .vms2-section-head > p,
.vms2-page .vms3-solution-card > p,
.vms2-page .vms3-industry-bridge-copy > p,
.vms2-page .vms2-audience-grid article > p,
.vms2-page .vms2-enterprise-grid article > p,
.vms2-page .vms3-analytics-description,
.vms2-page .vms3-capability-panel-head > p,
.vms2-page .vms2-capability-content > p,
.vms2-page .vms2-edition-card > p,
.vms2-page .vms2-comparison-title-row p,
.vms2-page .vms2-module-section-content span,
.vms2-page .vms3-resource-card > p,
.vms2-page .vms3-specifications-panel-head > p,
.vms2-page .vms2-faq details > p,
.vms2-page .vms3-final-path > p {
    text-align: justify !important;
    text-justify: inter-word;
    hyphens: auto;
}


/* ==========================================================================
   VMS V2 — Stage 1 feedback fixes
   Hero atmosphere / Features fixed geometry / modal close target
   2026-09-25
   ========================================================================== */


/* --------------------------------------------------------------------------
   Hero — calmer technical background with more visual depth
   -------------------------------------------------------------------------- */

.vms2-page .vms2-hero {
    position: relative;

    isolation: isolate;

    background:
        linear-gradient(
            rgba(51, 74, 98, .028) 1px,
            transparent 1px
        ),
        linear-gradient(
            90deg,
            rgba(51, 74, 98, .028) 1px,
            transparent 1px
        ),
        radial-gradient(
            circle at 79% 44%,
            rgba(80, 100, 127, .22) 0,
            rgba(80, 100, 127, .10) 24%,
            rgba(80, 100, 127, 0) 47%
        ),
        linear-gradient(
            118deg,
            #eaf0f4 0%,
            #f7f9fa 45%,
            #dce6ee 100%
        ) !important;

    background-size:
        44px 44px,
        44px 44px,
        auto,
        auto;

    border-bottom:
        1px solid #cfd9e1;
}


.vms2-page .vms2-hero::before {
    content: "";

    display: block;

    position: absolute;

    top: 0;
    right: 0;
    bottom: 0;

    width: 58%;

    z-index: 0;

    pointer-events: none;

    border: 0;

    transform: none;

    opacity: .62;

    background:
        repeating-linear-gradient(
            135deg,
            rgba(51, 74, 98, .045) 0,
            rgba(51, 74, 98, .045) 1px,
            transparent 1px,
            transparent 34px
        );

    -webkit-mask-image:
        linear-gradient(
            to left,
            #000 0%,
            rgba(0, 0, 0, .72) 56%,
            transparent 100%
        );

    mask-image:
        linear-gradient(
            to left,
            #000 0%,
            rgba(0, 0, 0, .72) 56%,
            transparent 100%
        );
}


.vms2-page .vms2-hero::after {
    display: none !important;
}


.vms2-page .vms2-hero-grid {
    position: relative;

    z-index: 1;
}


/*
 * Crop the Windows/application title chrome more decisively in Hero.
 * The source image stays unchanged; the frame shows the useful lower area.
 */
.vms2-page .vms2-product-frame {
    aspect-ratio: 1.92 / 1;

    overflow: hidden;

    background: #1e2936;

    box-shadow:
        0 14px 34px rgba(30, 41, 54, .20);
}


.vms2-page .vms2-product-frame img {
    display: block;

    width: 100%;
    height: 100%;

    object-fit: cover;
    object-position: center bottom;

    border-radius: 0;
}


/* --------------------------------------------------------------------------
   Screenshot modal — make every point of the close button clickable
   -------------------------------------------------------------------------- */

.vms2-page .vms3-overview-modal-close {
    width: 40px;
    height: 40px;
}


.vms2-page .vms3-overview-modal-close i,
.vms2-page .vms3-overview-modal-close svg,
.vms2-page .vms3-overview-modal-close svg *,
.vms2-page .vms3-overview-modal-close path {
    pointer-events: none !important;
}


/* --------------------------------------------------------------------------
   Features — fixed desktop height, flat right side, no red accent bars
   -------------------------------------------------------------------------- */

.vms2-page #vms3-features .vms3-capability-layout {
    overflow: hidden;

    background:
        rgba(11, 18, 25, .24) !important;

    border: 0 !important;
    border-radius: 0 !important;

    box-shadow:
        none !important;
}


.vms2-page #vms3-features .vms3-capability-tabs {
    border-radius: 0 !important;
}


.vms2-page #vms3-features .vms3-capability-tab {
    border-radius: 0 !important;
}


/* Active group remains visible through the blue-gray fill only. */
.vms2-page #vms3-features .vms3-capability-tab::before,
.vms2-page #vms3-features .vms3-capability-tab.is-active::before {
    display: none !important;

    content: none !important;
}


.vms2-page #vms3-features .vms3-capability-tab.is-active {
    background:
        linear-gradient(
            90deg,
            rgba(80, 100, 127, .62),
            rgba(80, 100, 127, .28)
        ) !important;

    border-color:
        rgba(139, 162, 187, .18) !important;

    box-shadow:
        none !important;
}


.vms2-page #vms3-features .vms3-capability-panels {
    min-width: 0;

    overflow: hidden;

    background:
        transparent !important;

    border: 0 !important;
    border-radius: 0 !important;

    box-shadow:
        none !important;
}


.vms2-page #vms3-features .vms3-capability-panel {
    overflow: hidden;

    background:
        transparent !important;

    border: 0 !important;
    border-radius: 0 !important;

    box-shadow:
        none !important;
}


.vms2-page #vms3-features .vms3-capability-panel-head {
    border-left: 0 !important;
    border-right: 0 !important;
    border-radius: 0 !important;
}


.vms2-page #vms3-features .vms3-capability-panel-title {
    padding-left: 0 !important;
}


.vms2-page #vms3-features .vms3-capability-panel-title::before {
    display: none !important;

    content: none !important;
}


/*
 * Keep the right side at one stable desktop height.
 * Six-item groups fit in three rows; shorter groups keep quiet empty space
 * instead of changing the section height during tab switching.
 */
@media (min-width: 981px) {

    .vms2-page #vms3-features .vms3-capability-panels {
        height: 470px;
    }


    .vms2-page #vms3-features .vms3-capability-panel {
        height: 100%;
    }


    .vms2-page #vms3-features .vms3-capability-panel-grid {
        align-content: start;
    }
}


/* Let tablet/mobile grow naturally because text wraps to more lines. */
@media (max-width: 980px) {

    .vms2-page #vms3-features .vms3-capability-panels,
    .vms2-page #vms3-features .vms3-capability-panel {
        height: auto;
    }
}

@media (min-width: 981px) {

    .vms2-page #vms3-features .vms3-capability-layout {
        height: 470px;
        min-height: 470px;
        max-height: 470px;

        align-items: stretch;
    }


    .vms2-page #vms3-features .vms3-capability-panels {
        height: 100% !important;
        min-height: 0;
        max-height: 100%;

        overflow: hidden;
    }


    .vms2-page #vms3-features .vms3-capability-panel {
        display: grid;

        grid-template-rows:
            auto
            minmax(0, 1fr);

        height: 100% !important;
        min-height: 0;
        max-height: 100%;

        overflow: hidden;
    }


    .vms2-page #vms3-features .vms3-capability-panel-grid {
        display: grid;

        grid-template-columns:
            repeat(2, minmax(0, 1fr));

        grid-template-rows:
            repeat(3, minmax(0, 1fr));

        height: 100%;
        min-height: 0;

        align-content: stretch;
    }
}


/* ==========================================================================
   VMS V2 — Advantages hierarchy + final CTA heading alignment
   2026-09-25
   ========================================================================== */


/* --------------------------------------------------------------------------
   Advantages — one section, two clearly subordinate groups
   -------------------------------------------------------------------------- */

.vms3-stage1 .vms3-advantages-section {
    background:
        linear-gradient(
            180deg,
            #f5f6f8 0%,
            #f8f9fa 100%
        );

    border-top:
        1px solid #edf0f2;

    border-bottom:
        1px solid #edf0f2;
}


.vms3-stage1 .vms3-advantages-head {
    margin-bottom:
        26px;
}


.vms3-stage1 .vms3-advantages-head .vms2-kicker {
    color:
        #687789;
}


.vms3-stage1 .vms3-advantages-head > p {
    width:
        100%;

    max-width:
        none !important;

    text-align:
        justify !important;

    text-justify:
        inter-word;
}


.vms3-stage1 .vms3-advantages-group {
    position:
        relative;
}


.vms3-stage1 .vms3-advantages-professional {
    margin-bottom:
        34px;
}


/*
 * Enterprise Architecture is now an internal subsection of Advantages,
 * not another page-level section.
 */
.vms3-stage1 .vms3-advantages-enterprise {
    margin-top:
        30px;

    padding-top:
        30px;

    border-top:
        1px solid #d8dee4;
}


.vms3-stage1 .vms3-advantages-subhead {
    margin-bottom:
        20px;
}


.vms3-stage1 .vms3-advantages-subhead .vms2-kicker {
    margin-bottom:
        7px;

    color:
        #778697;

    font-size:
        11px;

    letter-spacing:
        1.15px;
}


.vms3-stage1 .vms3-advantages-subhead > h3 {
    margin:
        0;

    color:
        #263140;

    font-size:
        22px;

    line-height:
        1.3;

    font-weight:
        800;
}


.vms3-stage1 .vms3-advantages-subhead > p {
    width:
        100%;

    max-width:
        none !important;

    margin:
        10px 0 0;

    color:
        #657587;

    font-size:
        13px;

    line-height:
        1.6;

    text-align:
        justify !important;

    text-justify:
        inter-word;
}


/*
 * Both rows of advantage cards share one visual language so they read as
 * parts of the same section.
 */
.vms3-stage1 .vms3-advantages-section .vms2-audience-grid,
.vms3-stage1 .vms3-advantages-section .vms2-enterprise-grid {
    gap:
        14px;
}


.vms3-stage1 .vms3-advantages-section .vms2-audience-grid article,
.vms3-stage1 .vms3-advantages-section .vms2-enterprise-grid article {
    background:
        #ffffff;

    border:
        1px solid #dde2e7;

    border-radius:
        5px;

    box-shadow:
        0 2px 7px rgba(30, 41, 54, .06);
}


.vms3-stage1 .vms3-advantages-section .vms2-audience-grid article {
    padding:
        22px;
}


.vms3-stage1 .vms3-advantages-section .vms2-enterprise-grid article {
    padding:
        20px;
}


.vms3-stage1 .vms3-advantages-section .vms2-audience-grid article:hover,
.vms3-stage1 .vms3-advantages-section .vms2-enterprise-grid article:hover {
    background:
        #ffffff;

    transform:
        none;

    box-shadow:
        0 2px 7px rgba(30, 41, 54, .06);
}


.vms3-stage1 .vms3-advantages-section .vms2-audience-grid article > p,
.vms3-stage1 .vms3-advantages-section .vms2-enterprise-grid article > p {
    text-align:
        justify !important;

    text-justify:
        inter-word;
}


/* --------------------------------------------------------------------------
   Final conversion block — white icons, title directly to the right
   -------------------------------------------------------------------------- */

.vms3-stage1 .vms3-final-path-head {
    display:
        flex;

    align-items:
        flex-start;

    gap:
        14px;

    margin-bottom:
        24px;
}


.vms3-stage1 .vms3-final-path-icon {
    flex:
        0 0 30px;

    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

    width:
        30px;

    height:
        30px;

    margin:
        0;

    color:
        #ffffff !important;

    background:
        transparent;

    border:
        0;

    border-radius:
        0;

    font-size:
        20px;

    line-height:
        1;
}


.vms3-stage1 .vms3-final-path-icon i,
.vms3-stage1 .vms3-final-path-icon svg,
.vms3-stage1 .vms3-final-path-icon path {
    color:
        #ffffff !important;

    fill:
        currentColor;
}


.vms3-stage1 .vms3-final-path-head > h3 {
    flex:
        1 1 auto;

    max-width:
        520px;

    margin:
        0;

    color:
        #ffffff;

    font-size:
        24px;

    line-height:
        1.3;

    font-weight:
        800;
}


/* Contact icons remain neutral white/light rather than introducing
   additional orange or green accents into the dark final block. */
.vms3-stage1 .vms3-final-secondary a,
.vms3-stage1 .vms3-final-secondary a i,
.vms3-stage1 .vms3-final-secondary a svg {
    color:
        #dce4eb !important;
}


.vms3-stage1 .vms3-final-secondary a:hover,
.vms3-stage1 .vms3-final-secondary a:hover i,
.vms3-stage1 .vms3-final-secondary a:hover svg {
    color:
        #ffffff !important;
}


/* --------------------------------------------------------------------------
   Responsive
   -------------------------------------------------------------------------- */

@media (max-width: 900px) {

    .vms3-stage1 .vms3-advantages-professional {
        margin-bottom:
            28px;
    }


    .vms3-stage1 .vms3-advantages-enterprise {
        margin-top:
            26px;

        padding-top:
            26px;
    }
}


@media (max-width: 720px) {

    .vms3-stage1 .vms3-final-path-head {
        gap:
            11px;

        margin-bottom:
            20px;
    }


    .vms3-stage1 .vms3-final-path-icon {
        flex-basis:
            26px;

        width:
            26px;

        height:
            26px;

        font-size:
            18px;
    }


    .vms3-stage1 .vms3-final-path-head > h3 {
        font-size:
            21px;
    }


    .vms3-stage1 .vms3-final-actions,
    .vms3-stage1 .vms3-final-secondary,
    .vms3-stage1 #vms3-partner-path > .vms2-btn {
        margin-left:
            0;
    }
}


/* ==========================================================================
   VMS V2 — Features outer border
   2026-09-25
   ========================================================================== */

/* Match the outer table border to the background of the left navigation rail. */
.vms2-page #vms3-features .vms3-capability-layout {
    border:
        1px solid rgba(11, 18, 25, .34) !important;
}

.vms3-stage1 #vms3-analytics {
    background: #ffffff !important;

    border-top: 1px solid #edf0f2;
    border-bottom: 1px solid #edf0f2;
}


/* ==========================================================================
   VMS V2 — Advantages unified compound panel
   2026-09-25
   ========================================================================== */

/*
 * The audience advantages and enterprise-architecture advantages are one
 * visual component. Instead of two groups of floating cards, both now live
 * inside a single bordered panel with internal table-like separators.
 */

.vms3-stage1 .vms3-advantages-head {
    margin-bottom:
        20px;
}


.vms3-stage1 .vms3-advantages-body {
    overflow:
        hidden;

    background:
        #ffffff;

    border:
        1px solid #d8dee4;

    border-radius:
        5px;

    box-shadow:
        0 2px 8px rgba(30, 41, 54, .055);
}


/* --------------------------------------------------------------------------
   First row — professional audiences
   -------------------------------------------------------------------------- */

.vms3-stage1 .vms3-advantages-professional {
    margin:
        0 !important;

    padding:
        0;
}


.vms3-stage1 .vms3-advantages-body .vms2-audience-grid {
    gap:
        0 !important;

    grid-template-columns:
        repeat(3, minmax(0, 1fr));

    background:
        #ffffff;
}


.vms3-stage1 .vms3-advantages-body .vms2-audience-grid article {
    min-height:
        154px;

    padding:
        22px;

    background:
        #ffffff !important;

    border:
        0 !important;

    border-right:
        1px solid #dfe4e8 !important;

    border-radius:
        0 !important;

    box-shadow:
        none !important;

    transform:
        none !important;
}


.vms3-stage1 .vms3-advantages-body .vms2-audience-grid article:last-child {
    border-right:
        0 !important;
}


/* --------------------------------------------------------------------------
   Enterprise Architecture — internal band, not a second standalone section
   -------------------------------------------------------------------------- */

.vms3-stage1 .vms3-advantages-enterprise {
    margin:
        0 !important;

    padding:
        0 !important;

    border:
        0 !important;
}


.vms3-stage1 .vms3-advantages-subhead {
    margin:
        0 !important;

    padding:
        20px 22px 18px;

    background:
        #f4f6f8;

    border-top:
        1px solid #d8dee4;

    border-bottom:
        1px solid #d8dee4;
}


.vms3-stage1 .vms3-advantages-subhead .vms2-kicker {
    margin-bottom:
        5px;

    color:
        #718195;

    font-size:
        10px;

    letter-spacing:
        1.1px;
}


.vms3-stage1 .vms3-advantages-subhead > h3 {
    font-size:
        20px;

    line-height:
        1.28;
}


.vms3-stage1 .vms3-advantages-subhead > p {
    margin-top:
        7px;

    font-size:
        12.5px;

    line-height:
        1.55;
}


/* --------------------------------------------------------------------------
   Enterprise advantage cells
   -------------------------------------------------------------------------- */

.vms3-stage1 .vms3-advantages-body .vms2-enterprise-grid {
    gap:
        0 !important;

    grid-template-columns:
        repeat(3, minmax(0, 1fr));

    background:
        #ffffff;
}


.vms3-stage1 .vms3-advantages-body .vms2-enterprise-grid article {
    min-height:
        128px;

    padding:
        19px 20px;

    background:
        #ffffff !important;

    border:
        0 !important;

    border-right:
        1px solid #dfe4e8 !important;

    border-bottom:
        1px solid #dfe4e8 !important;

    border-radius:
        0 !important;

    box-shadow:
        none !important;

    transform:
        none !important;
}


.vms3-stage1 .vms3-advantages-body .vms2-enterprise-grid article:nth-child(3n) {
    border-right:
        0 !important;
}


.vms3-stage1 .vms3-advantages-body .vms2-enterprise-grid article:nth-last-child(-n + 3) {
    border-bottom:
        0 !important;
}


/* Keep all copy aligned consistently inside the compound panel. */
.vms3-stage1 .vms3-advantages-body
.vms2-audience-grid article > p,
.vms3-stage1 .vms3-advantages-body
.vms2-enterprise-grid article > p {
    text-align:
        justify !important;

    text-justify:
        inter-word;
}


/* Slightly quieter card icons so the outer panel, not each card, is dominant. */
.vms3-stage1 .vms3-advantages-body .vms3-card-icon {
    background:
        #536a85;
}


/* --------------------------------------------------------------------------
   Responsive
   -------------------------------------------------------------------------- */

@media (max-width: 980px) {

    .vms3-stage1 .vms3-advantages-body .vms2-audience-grid {
        grid-template-columns:
            1fr;
    }


    .vms3-stage1 .vms3-advantages-body .vms2-audience-grid article,
    .vms3-stage1 .vms3-advantages-body .vms2-audience-grid article:last-child {
        min-height:
            0;

        border-right:
            0 !important;

        border-bottom:
            1px solid #dfe4e8 !important;
    }


    .vms3-stage1 .vms3-advantages-body .vms2-enterprise-grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }


    .vms3-stage1 .vms3-advantages-body .vms2-enterprise-grid article,
    .vms3-stage1 .vms3-advantages-body .vms2-enterprise-grid article:nth-child(3n),
    .vms3-stage1 .vms3-advantages-body .vms2-enterprise-grid article:nth-last-child(-n + 3) {
        border-right:
            1px solid #dfe4e8 !important;

        border-bottom:
            1px solid #dfe4e8 !important;
    }


    .vms3-stage1 .vms3-advantages-body .vms2-enterprise-grid article:nth-child(2n) {
        border-right:
            0 !important;
    }


    .vms3-stage1 .vms3-advantages-body .vms2-enterprise-grid article:nth-last-child(-n + 2) {
        border-bottom:
            0 !important;
    }
}


@media (max-width: 620px) {

    .vms3-stage1 .vms3-advantages-body .vms2-enterprise-grid {
        grid-template-columns:
            1fr;
    }


    .vms3-stage1 .vms3-advantages-body .vms2-enterprise-grid article,
    .vms3-stage1 .vms3-advantages-body .vms2-enterprise-grid article:nth-child(2n),
    .vms3-stage1 .vms3-advantages-body .vms2-enterprise-grid article:nth-child(3n),
    .vms3-stage1 .vms3-advantages-body .vms2-enterprise-grid article:nth-last-child(-n + 2) {
        min-height:
            0;

        border-right:
            0 !important;

        border-bottom:
            1px solid #dfe4e8 !important;
    }


    .vms3-stage1 .vms3-advantages-body .vms2-enterprise-grid article:last-child {
        border-bottom:
            0 !important;
    }


    .vms3-stage1 .vms3-advantages-subhead {
        padding:
            18px;
    }
}


/* ==========================================================================
   VMS V2 — Advantages cell spacing normalization
   2026-09-25
   ========================================================================== */

/*
 * Both Advantages grids are parts of the same compound panel, so use the same
 * internal spacing and typography in every cell.
 */
.vms3-stage1 .vms3-advantages-body .vms2-audience-grid article,
.vms3-stage1 .vms3-advantages-body .vms2-enterprise-grid article {
    padding:
        22px !important;
}


.vms3-stage1 .vms3-advantages-body
.vms2-audience-grid .vms3-card-head,
.vms3-stage1 .vms3-advantages-body
.vms2-enterprise-grid .vms3-card-head {
    margin-bottom:
        12px !important;
}


.vms3-stage1 .vms3-advantages-body
.vms2-audience-grid h3,
.vms3-stage1 .vms3-advantages-body
.vms2-enterprise-grid h3 {
    margin:
        0;

    font-size:
        17px !important;

    line-height:
        1.3 !important;
}


.vms3-stage1 .vms3-advantages-body
.vms2-audience-grid p,
.vms3-stage1 .vms3-advantages-body
.vms2-enterprise-grid p {
    font-size:
        13px !important;

    line-height:
        1.55 !important;
}


/* ==========================================================================
   VMS V2 — Advantages document layout
   Main intro + two internal sections in one visual document
   2026-09-25
   ========================================================================== */

.vms3-stage1 .vms3-advantages-section {
    background:
        linear-gradient(
            180deg,
            #f5f6f8 0%,
            #f7f8f9 100%
        ) !important;

    border-top:
        1px solid #edf0f2;

    border-bottom:
        1px solid #e2e6ea;
}


/* --------------------------------------------------------------------------
   Main Advantages heading
   -------------------------------------------------------------------------- */

.vms3-stage1 .vms3-advantages-intro {
    margin-bottom:
        26px;
}


.vms3-stage1 .vms3-advantages-intro .vms2-kicker {
    margin-bottom:
        9px;
}


.vms3-stage1 .vms3-advantages-intro > h2 {
    margin:
        0;

    color:
        #334a62;

    background-image:
        linear-gradient(
            45deg,
            #334a62,
            #1e2936
        );

    background-clip:
        text;

    -webkit-background-clip:
        text;

    -webkit-text-fill-color:
        transparent;

    font-family:
        "Roboto",
        sans-serif;

    font-size:
        30px;

    line-height:
        1.2;

    font-weight:
        900;

    letter-spacing:
        -.15px;
}


.vms3-stage1 .vms3-advantages-intro > p {
    width:
        100%;

    max-width:
        none !important;

    margin:
        13px 0 0;

    color:
        #5f6f80;

    font-size:
        14px;

    line-height:
        1.62;

    text-align:
        justify !important;

    text-justify:
        inter-word;
}


/* --------------------------------------------------------------------------
   One document container
   -------------------------------------------------------------------------- */

.vms3-stage1 .vms3-advantages-document {
    overflow:
        hidden;

    background:
        #ffffff;

    border:
        1px solid #d7dde3;

    border-radius:
        5px;

    box-shadow:
        0 2px 8px rgba(30, 41, 54, .055);
}


.vms3-stage1 .vms3-advantages-document-section {
    margin:
        0 !important;

    padding:
        0 !important;

    border:
        0 !important;
}


/* --------------------------------------------------------------------------
   Internal document section headings
   -------------------------------------------------------------------------- */

.vms3-stage1 .vms3-advantages-group-head {
    margin:
        0;

    padding:
        20px 22px 18px;

    background:
        #f4f6f8;
}


.vms3-stage1 .vms3-advantages-document-section:first-child
.vms3-advantages-group-head {
    border-bottom:
        1px solid #dbe1e6;
}


.vms3-stage1 .vms3-advantages-document-section + .vms3-advantages-document-section
.vms3-advantages-group-head {
    border-top:
        1px solid #cfd7df;

    border-bottom:
        1px solid #dbe1e6;
}


.vms3-stage1 .vms3-advantages-group-head > h3 {
    margin:
        0;

    color:
        #263140;

    font-size:
        21px;

    line-height:
        1.3;

    font-weight:
        800;
}


.vms3-stage1 .vms3-advantages-group-head > p {
    width:
        100%;

    max-width:
        none !important;

    margin:
        8px 0 0;

    color:
        #667687;

    font-size:
        13px;

    line-height:
        1.55;

    text-align:
        justify !important;

    text-justify:
        inter-word;
}


/* --------------------------------------------------------------------------
   Both feature grids use the exact same cell system
   -------------------------------------------------------------------------- */

.vms3-stage1 .vms3-advantages-document .vms2-audience-grid,
.vms3-stage1 .vms3-advantages-document .vms2-enterprise-grid {
    display:
        grid;

    grid-template-columns:
        repeat(3, minmax(0, 1fr));

    gap:
        0 !important;

    margin:
        0;

    background:
        #ffffff;
}


.vms3-stage1 .vms3-advantages-document .vms2-audience-grid article,
.vms3-stage1 .vms3-advantages-document .vms2-enterprise-grid article {
    min-height:
        142px;

    padding:
        22px !important;

    background:
        #ffffff !important;

    border:
        0 !important;

    border-right:
        1px solid #dfe4e8 !important;

    border-bottom:
        1px solid #dfe4e8 !important;

    border-radius:
        0 !important;

    box-shadow:
        none !important;

    transform:
        none !important;
}


/* Three-column edge handling */
.vms3-stage1 .vms3-advantages-document
.vms2-audience-grid article:nth-child(3n),
.vms3-stage1 .vms3-advantages-document
.vms2-enterprise-grid article:nth-child(3n) {
    border-right:
        0 !important;
}


/* Group 1 has only one row. */
.vms3-stage1 .vms3-advantages-document
.vms2-audience-grid article {
    border-bottom:
        0 !important;
}


/* Group 2: no bottom border on the final row. */
.vms3-stage1 .vms3-advantages-document
.vms2-enterprise-grid article:nth-last-child(-n + 3) {
    border-bottom:
        0 !important;
}


/* --------------------------------------------------------------------------
   Card headings
   -------------------------------------------------------------------------- */

.vms3-stage1 .vms3-advantages-document .vms3-card-head {
    display:
        flex;

    align-items:
        center;

    gap:
        12px;

    min-width:
        0;

    margin-bottom:
        12px !important;
}


.vms3-stage1 .vms3-advantages-document .vms3-card-icon {
    flex:
        0 0 38px;

    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

    width:
        38px;

    height:
        38px;

    margin:
        0;

    color:
        #ffffff;

    background:
        #536a85;

    border-radius:
        5px;

    font-size:
        16px;
}


.vms3-stage1 .vms3-advantages-document .vms3-card-head > h4 {
    min-width:
        0;

    margin:
        0;

    color:
        #263140;

    font-size:
        16px;

    line-height:
        1.3;

    font-weight:
        800;
}


.vms3-stage1 .vms3-advantages-document
.vms2-audience-grid article > p,
.vms3-stage1 .vms3-advantages-document
.vms2-enterprise-grid article > p {
    margin:
        0;

    color:
        #657587;

    font-size:
        12.5px !important;

    line-height:
        1.55 !important;

    text-align:
        justify !important;

    text-justify:
        inter-word;
}


/* No floating-card hover inside the document. */
.vms3-stage1 .vms3-advantages-document
.vms2-audience-grid article:hover,
.vms3-stage1 .vms3-advantages-document
.vms2-enterprise-grid article:hover {
    background:
        #ffffff !important;

    transform:
        none !important;

    box-shadow:
        none !important;
}


/* --------------------------------------------------------------------------
   Responsive
   -------------------------------------------------------------------------- */

@media (max-width: 980px) {

    .vms3-stage1 .vms3-advantages-document .vms2-audience-grid,
    .vms3-stage1 .vms3-advantages-document .vms2-enterprise-grid {
        grid-template-columns:
            1fr;
    }


    .vms3-stage1 .vms3-advantages-document
    .vms2-audience-grid article,
    .vms3-stage1 .vms3-advantages-document
    .vms2-enterprise-grid article,
    .vms3-stage1 .vms3-advantages-document
    .vms2-audience-grid article:nth-child(3n),
    .vms3-stage1 .vms3-advantages-document
    .vms2-enterprise-grid article:nth-child(3n),
    .vms3-stage1 .vms3-advantages-document
    .vms2-enterprise-grid article:nth-last-child(-n + 3) {
        min-height:
            0;

        border-right:
            0 !important;

        border-bottom:
            1px solid #dfe4e8 !important;
    }


    .vms3-stage1 .vms3-advantages-document
    .vms2-audience-grid article:last-child,
    .vms3-stage1 .vms3-advantages-document
    .vms2-enterprise-grid article:last-child {
        border-bottom:
            0 !important;
    }
}


@media (max-width: 620px) {

    .vms3-stage1 .vms3-advantages-intro > h2 {
        font-size:
            26px;
    }


    .vms3-stage1 .vms3-advantages-group-head {
        padding:
            18px;
    }


    .vms3-stage1 .vms3-advantages-document
    .vms2-audience-grid article,
    .vms3-stage1 .vms3-advantages-document
    .vms2-enterprise-grid article {
        padding:
            18px !important;
    }
}


/* ==========================================================================
   VMS V2 — Features: remove empty bottom "chin"
   Keep the reserved fixed height, but paint the empty area like feature cells
   while preserving separators between cells.
   2026-09-25
   ========================================================================== */

.vms2-page #vms3-features {
    --vms3-feature-cell-bg: #253545;
    --vms3-feature-cell-line: rgba(176, 196, 216, .10);
}


/*
 * The grid itself uses the same background as the feature cells.
 * Therefore any reserved empty row no longer looks like a separate dark block.
 */
.vms2-page #vms3-features .vms3-capability-panel-grid {
    gap:
        0 !important;

    padding:
        0 !important;

    background:
        var(--vms3-feature-cell-bg) !important;
}


/*
 * Draw the table separators on the cells themselves instead of using the
 * lighter grid-gap background.
 */
.vms2-page #vms3-features .vms3-capability-panel-grid
.vms2-capability-item,
.vms2-page #vms3-features .vms3-capability-panel-grid
.vms2-capability-item:nth-child(2n),
.vms2-page #vms3-features .vms3-capability-panel-grid
.vms2-capability-item:nth-last-child(-n + 2) {
    background:
        var(--vms3-feature-cell-bg) !important;

    border:
        0 !important;

    border-right:
        1px solid var(--vms3-feature-cell-line) !important;

    border-bottom:
        1px solid var(--vms3-feature-cell-line) !important;
}


/* No separator on the outside edge of the second column. */
.vms2-page #vms3-features .vms3-capability-panel-grid
.vms2-capability-item:nth-child(2n) {
    border-right:
        0 !important;
}


/* 4 cards = two filled rows + one reserved empty row. Blend row 2 into chin. */
.vms2-page #vms3-features .vms3-capability-panel-grid.is-count-4
.vms2-capability-item:nth-child(n + 3) {
    border-bottom:
        0 !important;
}


/* 5 cards = last card spans the full final row. */
.vms2-page #vms3-features .vms3-capability-panel-grid.is-count-5
.vms2-capability-item:last-child {
    border-right:
        0 !important;

    border-bottom:
        0 !important;
}


/* 6 cards = normal three-row table; final row has no outside bottom line. */
.vms2-page #vms3-features .vms3-capability-panel-grid.is-count-6
.vms2-capability-item:nth-child(n + 5) {
    border-bottom:
        0 !important;
}


/* ==========================================================================
   VMS V2 — Features: restore bottom separator for the last populated row
   2026-09-25
   ========================================================================== */

/*
 * 4 items:
 * the third reserved row is empty, so keep a separator under row 2.
 * This gives the table a visible bottom line for the populated area while
 * leaving the empty reserved area in the same background color.
 */
.vms2-page #vms3-features
.vms3-capability-panel-grid.is-count-4
.vms2-capability-item:nth-child(n + 3) {
    border-bottom:
        1px solid var(--vms3-feature-cell-line) !important;
}


/*
 * 5 or 6 items:
 * the content reaches the final reserved row, so do NOT draw another internal
 * bottom line there — the common outer border of the whole table remains the
 * final edge and we avoid a doubled bottom border.
 */
.vms2-page #vms3-features
.vms3-capability-panel-grid.is-count-5
.vms2-capability-item:last-child,
.vms2-page #vms3-features
.vms3-capability-panel-grid.is-count-6
.vms2-capability-item:nth-child(n + 5) {
    border-bottom:
        0 !important;
}


/* ==========================================================================
   VMS V2 — Final CTA balanced two-column layout
   Descriptions + equal cards for EN / ES
   2026-09-25
   ========================================================================== */

.vms3-stage1 .vms3-final-grid {
    grid-template-columns:
        repeat(2, minmax(0, 1fr));
}


.vms3-stage1 .vms3-final-path {
    display:
        grid;

    grid-template-rows:
        auto
        minmax(74px, auto)
        1fr;

    min-width:
        0;

    min-height:
        292px;

    padding:
        32px 34px;
}


/*
 * Keep the title area equally tall in both cards.
 * This prevents Spanish line wrapping from pushing only one description down.
 */
.vms3-stage1 .vms3-final-path-head {
    min-height:
        64px;

    margin-bottom:
        12px;

    align-items:
        flex-start;
}


.vms3-stage1 .vms3-final-path-head > h3 {
    max-width:
        none;

    font-size:
        clamp(20px, 1.55vw, 24px);

    line-height:
        1.28;

    overflow-wrap:
        normal;

    word-break:
        normal;

    hyphens:
        none;
}


.vms3-stage1 .vms3-final-path-description {
    width:
        100%;

    max-width:
        570px;

    margin:
        0;

    color:
        #b8c4cf;

    font-size:
        14px;

    line-height:
        1.6;

    text-align:
        left !important;

    text-wrap:
        pretty;

    overflow-wrap:
        normal;

    word-break:
        normal;

    hyphens:
        none;
}


/*
 * All buttons / contact links sit in the bottom part of the card,
 * so the two columns remain visually aligned even when EN / ES copy differs.
 */
.vms3-stage1 .vms3-final-path-cta {
    align-self:
        end;

    padding-top:
        22px;
}


.vms3-stage1 .vms3-final-actions,
.vms3-stage1 .vms3-final-secondary,
.vms3-stage1 #vms3-partner-path > .vms2-btn {
    margin-left:
        0 !important;
}


.vms3-stage1 .vms3-final-actions {
    margin-top:
        0;
}


.vms3-stage1 .vms3-final-secondary {
    margin-top:
        18px;
}


.vms3-stage1 #vms3-partner-path .vms3-final-path-cta {
    display:
        flex;

    align-items:
        flex-end;
}


.vms3-stage1 #vms3-partner-path .vms2-btn {
    margin:
        0 !important;
}


/* Keep both cells exactly symmetrical. */
.vms3-stage1 .vms3-final-path + .vms3-final-path {
    border-left:
        1px solid rgba(255, 255, 255, .16);
}


@media (max-width: 900px) {

    .vms3-stage1 .vms3-final-grid {
        grid-template-columns:
            1fr;
    }


    .vms3-stage1 .vms3-final-path {
        min-height:
            0;

        grid-template-rows:
            auto
            auto
            auto;
    }


    .vms3-stage1 .vms3-final-path-head {
        min-height:
            0;
    }


    .vms3-stage1 .vms3-final-path + .vms3-final-path {
        border-left:
            0;

        border-top:
            1px solid rgba(255, 255, 255, .16);
    }


    .vms3-stage1 .vms3-final-path-description {
        max-width:
            none;
    }


    .vms3-stage1 .vms3-final-path-cta {
        align-self:
            auto;
    }
}


@media (max-width: 620px) {

    .vms3-stage1 .vms3-final-path {
        padding:
            26px 22px;
    }


    .vms3-stage1 .vms3-final-path-head {
        min-height:
            0;

        margin-bottom:
            10px;
    }


    .vms3-stage1 .vms3-final-path-head > h3 {
        font-size:
            20px;
    }


    .vms3-stage1 .vms3-final-path-description {
        font-size:
            13.5px;

        line-height:
            1.55;
    }


    .vms3-stage1 .vms3-final-path-cta {
        padding-top:
            18px;
    }
}


/* ==========================================================================
   VMS V2 — Final CTA alignment refinement
   Keep title, description and primary actions aligned across both cards.
   2026-09-25
   ========================================================================== */

@media (min-width: 901px) {

    .vms3-stage1 .vms3-final-path {
        display: grid;

        grid-template-rows:
            72px
            68px
            auto;

        min-height: 304px;

        padding:
            30px 34px 28px;
    }


    /*
     * Same title area in both cards.
     * One-line EN titles no longer pull the rest of the left card upward.
     */
    .vms3-stage1 .vms3-final-path-head {
        min-height: 0;

        margin: 0;

        align-items: flex-start;
    }


    .vms3-stage1 .vms3-final-path-head > h3 {
        margin: 0;

        font-size:
            clamp(20px, 1.35vw, 22px);

        line-height:
            1.28;

        font-weight:
            800;
    }


    /*
     * Reserve the same description block height for EN and ES.
     * This keeps the CTA row on one horizontal line even when one
     * description wraps to two or three lines.
     */
    .vms3-stage1 .vms3-final-path-description {
        align-self: start;

        min-height: 68px;

        margin: 0;

        font-size: 14px;

        line-height: 1.55;
    }


    /*
     * Important: do not bottom-align the whole CTA group.
     * The left card has contact details, the right one does not,
     * so bottom alignment previously pushed the partner button lower.
     */
    .vms3-stage1 .vms3-final-path-cta {
        align-self: start;

        padding-top: 18px;
    }


    .vms3-stage1 .vms3-final-actions,
    .vms3-stage1 #vms3-partner-path .vms3-final-path-cta {
        min-height: 42px;
    }


    .vms3-stage1 .vms3-final-secondary {
        margin-top: 16px;
    }


    .vms3-stage1 #vms3-partner-path .vms3-final-path-cta {
        display: flex;

        align-items: flex-start;
    }
}


/* Slightly tighter on mid-width desktop so Spanish remains clean. */
@media (min-width: 901px) and (max-width: 1180px) {

    .vms3-stage1 .vms3-final-path {
        grid-template-rows:
            78px
            74px
            auto;
    }


    .vms3-stage1 .vms3-final-path-head > h3 {
        font-size: 20px;
    }


    .vms3-stage1 .vms3-final-path-description {
        font-size: 13.5px;
    }
}


/* ==========================================================================
   VMS V2 — Final CTA compact spacing
   Reduce excessive vertical gaps while preserving EN/ES alignment.
   2026-09-25
   ========================================================================== */

@media (min-width: 901px) {

    .vms3-stage1 .vms3-final-path {
        grid-template-rows:
            48px
            54px
            auto;

        min-height:
            0;

        padding:
            24px 30px 22px;
    }


    .vms3-stage1 .vms3-final-path-head {
        min-height:
            0;

        margin:
            0;
    }


    .vms3-stage1 .vms3-final-path-head > h3 {
        font-size:
            21px;

        line-height:
            1.25;
    }


    .vms3-stage1 .vms3-final-path-description {
        min-height:
            54px;

        margin:
            0;

        font-size:
            13.5px;

        line-height:
            1.5;
    }


    .vms3-stage1 .vms3-final-path-cta {
        padding-top:
            12px;
    }


    .vms3-stage1 .vms3-final-secondary {
        margin-top:
            12px;
    }


    .vms3-stage1 .vms3-final-actions {
        gap:
            10px;
    }
}


/* Mid-width desktop: allow a little more title room without making the cards tall. */
@media (min-width: 901px) and (max-width: 1180px) {

    .vms3-stage1 .vms3-final-path {
        grid-template-rows:
            56px
            62px
            auto;
    }


    .vms3-stage1 .vms3-final-path-description {
        min-height:
            62px;
    }
}


/* ==========================================================================
   VMS V2 — Final CTA description balance
   Force the short project copy into two natural lines on desktop so the
   left card does not look visually empty compared with the partner card.
   2026-09-25
   ========================================================================== */

@media (min-width: 901px) {

    .vms3-stage1 .vms3-final-path {
        grid-template-rows:
            48px
            48px
            auto;
    }


    .vms3-stage1 .vms3-final-path-description {
        min-height:
            48px;
    }


    /*
     * The project description is much shorter in EN.
     * Constrain only this paragraph so it wraps naturally into two lines,
     * matching the visual density of the partner column.
     */
    .vms3-stage1 .vms3-final-path:first-child
    .vms3-final-path-description {
        max-width:
            455px;
    }


    .vms3-stage1 #vms3-partner-path
    .vms3-final-path-description {
        max-width:
            570px;
    }


    .vms3-stage1 .vms3-final-path-cta {
        padding-top:
            8px;
    }
}


@media (min-width: 901px) and (max-width: 1180px) {

    .vms3-stage1 .vms3-final-path {
        grid-template-rows:
            56px
            58px
            auto;
    }


    .vms3-stage1 .vms3-final-path-description {
        min-height:
            58px;
    }


    .vms3-stage1 .vms3-final-path:first-child
    .vms3-final-path-description,
    .vms3-stage1 #vms3-partner-path
    .vms3-final-path-description {
        max-width:
            none;
    }
}

/* ==========================================================================
   VMS V2 — Technical Specifications grouped table
   Append this block to the current vms-v2.css.
   ========================================================================== */

.vms3-spec-table thead th {
    color: #ffffff;
    background: #334a62;
    border-right: 1px solid rgba(255, 255, 255, .14);
    font-size: 11px;
    line-height: 1.3;
    text-transform: uppercase;
    letter-spacing: .65px;
}

.vms3-spec-table thead th:last-child {
    border-right: 0;
}

.vms3-spec-table thead th:first-child {
    width: 32%;
}

.vms3-spec-table .vms3-spec-group-row > th {
    width: auto;
    padding: 10px 14px;
    color: #334a62;
    background: #e9eef3;
    border-right: 0;
    border-top: 1px solid #d3dbe3;
    border-bottom: 1px solid #d3dbe3;
    font-size: 11px;
    line-height: 1.3;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .7px;
}

.vms3-spec-table .vms3-spec-group:first-of-type
.vms3-spec-group-row > th {
    border-top: 0;
}

.vms3-spec-table .vms3-spec-group tr:not(.vms3-spec-group-row) > th {
    width: 32%;
    background: #f5f7f8;
}

.vms3-spec-table .vms3-spec-group tr:not(.vms3-spec-group-row) > td {
    background: #ffffff;
}

.vms3-spec-table .vms3-spec-group tr:not(.vms3-spec-group-row):nth-child(odd) > td {
    background: #fafbfc;
}

.vms3-spec-table .vms3-spec-group:last-child tr:last-child > th,
.vms3-spec-table .vms3-spec-group:last-child tr:last-child > td {
    border-bottom: 0;
}

@media (max-width: 720px) {
    .vms3-spec-table thead th:first-child,
    .vms3-spec-table .vms3-spec-group tr:not(.vms3-spec-group-row) > th {
        width: 40%;
    }

    .vms3-spec-table th,
    .vms3-spec-table td {
        padding: 9px 10px;
        font-size: 11px;
        line-height: 1.42;
    }

    .vms3-spec-table .vms3-spec-group-row > th {
        padding: 9px 10px;
        font-size: 10px;
    }
}

.vms2-page .vms2-product-frame {
    position: relative;

    overflow: hidden;

    aspect-ratio:
        1.92 / 1;

    background:
        #1e2936;

    box-shadow:
        0 14px 34px
        rgba(30, 41, 54, .20);
}


.vms2-page .vms2-product-frame img {
    display: block;

    width:
        100% !important;

    height:
        auto !important;

    max-width:
        100% !important;

    max-height:
        none !important;

    margin:
        -2.8% 0 0 !important;

    object-fit:
        initial !important;

    object-position:
        initial !important;

    border-radius:
        0;

    image-rendering:
        auto;

    -ms-interpolation-mode:
        bicubic;
}


/*
 * Modal close control
 *
 * Keep the head and the close button above every visual layer. Font Awesome
 * SVG/path nodes do not accept pointer input themselves, so the button remains
 * the hit target. JS also handles this in capture phase.
 */
.vms2-page .vms3-overview-modal-head {
    position:
        relative;

    z-index:
        10;
}


.vms2-page .vms3-overview-modal-close {
    position:
        relative;

    z-index:
        20;

    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

    width:
        40px;

    height:
        40px;

    min-width:
        40px;

    min-height:
        40px;

    padding:
        0;

    line-height:
        1;

    cursor:
        pointer;

    touch-action:
        manipulation;
}


.vms2-page .vms3-overview-modal-close i,
.vms2-page .vms3-overview-modal-close svg,
.vms2-page .vms3-overview-modal-close svg *,
.vms2-page .vms3-overview-modal-close path {
    pointer-events:
        none !important;
}