/* Hero */
.jv-hero {
    position: relative;
    overflow: hidden;
    padding: 76px 0 96px;
    background:
        radial-gradient(900px 500px at 78% 22%, rgba(144, 208, 186, 0.2), transparent 70%),
        radial-gradient(700px 420px at 8% 10%, rgba(38, 55, 115, 0.06), transparent 70%),
        var(--jv-canvas);
}

.jv-hero__mesh {
    position: absolute;
    inset: 0;
    background-image:
        linear-gradient(to right, var(--jv-line) 1px, transparent 1px),
        linear-gradient(to bottom, var(--jv-line) 1px, transparent 1px);
    background-size: 64px 64px;
    opacity: 0.25;
    -webkit-mask-image: radial-gradient(ellipse 80% 60% at 60% 30%, #000 10%, transparent 72%);
    mask-image: radial-gradient(ellipse 80% 60% at 60% 30%, #000 10%, transparent 72%);
    pointer-events: none;
}

.jv-hero__blob {
    position: absolute;
    border-radius: 50%;
    filter: blur(80px);
    pointer-events: none;
}

.jv-hero__blob--one {
    top: -140px;
    right: -100px;
    width: 520px;
    height: 520px;
    background: rgba(144, 208, 186, 0.25);
}

.jv-hero__blob--two {
    bottom: -180px;
    left: -120px;
    width: 420px;
    height: 420px;
    background: rgba(38, 55, 115, 0.1);
}

html.dark .jv-hero__blob--two {
    background: rgba(144, 208, 186, 0.08);
}

.jv-hero__inner {
    position: relative;
    z-index: 2;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 0.96fr);
    align-items: center;
    gap: 40px;
}

.jv-hero__copy h1 {
    margin-top: 22px;
    max-width: 640px;
}

.jv-hero__lead {
    max-width: 560px;
    margin-top: 24px;
    font-size: 1.0625rem;
    line-height: 1.7;
    color: var(--jv-ink-mute);
}

.jv-hero__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 30px;
}

.jv-metrics {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 18px;
    max-width: 600px;
    margin: 38px 0 0;
    padding-top: 26px;
    border-top: 1px solid var(--jv-border);
}

.jv-metric {
    display: flex;
    flex-direction: column-reverse;
    gap: 4px;
}

.jv-metric__value {
    font-family: var(--jv-font-display);
    font-size: clamp(1.5rem, 2.3vw, 1.95rem);
    font-weight: 800;
    line-height: 1;
    letter-spacing: -0.04em;
}

.jv-metric__label {
    font-size: 0.6875rem;
    line-height: 1.35;
    color: var(--jv-ink-mute);
}

.jv-hero__visual {
    position: relative;
    min-width: 0;
}

.jv-console-wrap {
    position: relative;
    width: 100%;
    max-width: 620px;
    margin-left: auto;
}

.jv-console-glow {
    position: absolute;
    inset: 10% -8% -10% 4%;
    background: radial-gradient(ellipse at center, rgba(38, 55, 115, 0.26), transparent 68%);
    filter: blur(42px);
    pointer-events: none;
}

[data-parallax] {
    translate: var(--jv-px, 0px) var(--jv-py, 0px);
    transition: translate 180ms ease-out;
}

.jv-console {
    position: relative;
    overflow: hidden;
    border: 1px solid rgba(38, 55, 115, 0.14);
    border-radius: 18px;
    background: #fff;
    box-shadow:
        0 42px 80px -38px rgba(14, 24, 56, 0.55),
        0 2px 0 rgba(255, 255, 255, 0.7) inset;
    transform: perspective(1600px) rotateY(-4deg) rotateX(2deg);
    transform-origin: center right;
    will-change: transform;
}

.jv-console__bar {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 14px;
    border-bottom: 1px solid #e8ebf2;
    background: #f7f9fc;
}

.jv-console__dots {
    display: flex;
    gap: 5px;
}

.jv-console__dots i {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #d6dce8;
}

.jv-console__dots i:first-child {
    background: #f0a6a6;
}

.jv-console__dots i:nth-child(2) {
    background: #f2d29b;
}

.jv-console__dots i:nth-child(3) {
    background: #a9dbc9;
}

.jv-console__url {
    flex: 1;
    padding: 4px 10px;
    border: 1px solid #e8ebf2;
    border-radius: 5px;
    background: #fff;
    font-family: var(--jv-font-mono);
    font-size: 0.5rem;
    letter-spacing: 0.03em;
    color: #5b6378;
    text-align: center;
}

.jv-console__live {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-family: var(--jv-font-mono);
    font-size: 0.5rem;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #047857;
}

.jv-console__live i {
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: #059669;
    box-shadow: 0 0 0 3px rgba(5, 150, 105, 0.12);
}

.jv-console__body {
    display: flex;
    min-height: 356px;
}

.jv-console__rail {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 7px;
    width: 52px;
    padding: 12px 0;
    background: linear-gradient(180deg, #1f2e60, #17234a);
}

.jv-console__mark {
    display: grid;
    place-items: center;
    width: 26px;
    height: 26px;
    margin-bottom: 10px;
    border-radius: 7px;
    background: #90d0ba;
    color: #14203f;
    font-family: var(--jv-font-display);
    font-size: 0.75rem;
    font-weight: 800;
}

.jv-console__rail-item {
    display: grid;
    place-items: center;
    width: 28px;
    height: 28px;
    border-radius: 6px;
    color: rgba(255, 255, 255, 0.42);
}

.jv-console__rail-item svg {
    width: 14px;
    height: 14px;
}

.jv-console__rail-item.is-active {
    background: rgba(144, 208, 186, 0.18);
    color: #90d0ba;
}

.jv-console__main {
    flex: 1;
    min-width: 0;
    padding: 16px 18px;
    background: #fbfcfe;
}

.jv-console__head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 13px;
}

.jv-console__eyebrow {
    display: block;
    margin-bottom: 2px;
    font-family: var(--jv-font-mono);
    font-size: 0.4375rem;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: #5b6378;
}

.jv-console__head strong {
    font-family: var(--jv-font-display);
    font-size: 0.8125rem;
    font-weight: 800;
    letter-spacing: -0.02em;
    color: #1b2033;
}

.jv-console__date {
    font-family: var(--jv-font-mono);
    font-size: 0.5rem;
    color: #5b6378;
    white-space: nowrap;
}

.jv-console__kpis {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 7px;
    margin-bottom: 13px;
}

.jv-console__kpis > div {
    display: flex;
    flex-direction: column;
    padding: 8px 9px;
    border: 1px solid #e8ebf2;
    border-radius: 7px;
    background: #fff;
}

.jv-console__kpis span {
    font-size: 0.4375rem;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: #5b6378;
}

.jv-console__kpis strong {
    margin-top: 2px;
    font-family: var(--jv-font-display);
    font-size: 0.875rem;
    font-weight: 800;
    line-height: 1.1;
    color: #1b2033;
}

.jv-console__kpis em {
    font-family: var(--jv-font-mono);
    font-size: 0.4375rem;
    font-style: normal;
    font-weight: 600;
}

.jv-console__kpis .is-mint,
.jv-console__chart-head .is-mint {
    color: #047857;
}

.jv-console__kpis .is-warn {
    color: #b45309;
}

.jv-console__chart {
    padding: 9px 10px 6px;
    border: 1px solid #e8ebf2;
    border-radius: 8px;
    background: #fff;
}

.jv-console__chart-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: -2px;
    font-size: 0.5rem;
    font-weight: 600;
    color: #5b6378;
}

.jv-console__chart-head span:last-child {
    font-family: var(--jv-font-mono);
    font-size: 0.4375rem;
}

.jv-console__chart svg {
    width: 100%;
    height: auto;
}

.jv-console__axis {
    display: flex;
    justify-content: space-between;
    font-family: var(--jv-font-mono);
    font-size: 0.375rem;
    color: #5b6378;
}

.jv-console__rows {
    display: grid;
    gap: 6px;
    margin-top: 11px;
}

.jv-console__row {
    display: grid;
    grid-template-columns: 74px 1fr 40px;
    align-items: center;
    gap: 8px;
}

.jv-console__row-label {
    font-size: 0.4375rem;
    font-weight: 600;
    color: #5b6378;
}

.jv-console__meter {
    height: 4px;
    border-radius: 3px;
    background: #edf0f6;
    overflow: hidden;
}

.jv-console__meter i {
    display: block;
    width: var(--w);
    height: 100%;
    border-radius: 3px;
    background: linear-gradient(90deg, #263773, #90d0ba);
}

.jv-console__row-value {
    font-family: var(--jv-font-mono);
    font-size: 0.4375rem;
    font-weight: 600;
    color: #1b2033;
    text-align: right;
}

.jv-float {
    position: absolute;
    z-index: 4;
    display: flex;
    align-items: center;
    gap: 9px;
    padding: 9px 13px 9px 9px;
    border: 1px solid rgba(38, 55, 115, 0.12);
    border-radius: 10px;
    background: #fff;
    box-shadow: 0 16px 34px -18px rgba(14, 24, 56, 0.4);
    will-change: transform;
}

.jv-float span:last-child {
    display: flex;
    flex-direction: column;
    line-height: 1.2;
}

.jv-float strong {
    font-family: var(--jv-font-display);
    font-size: 0.6875rem;
    font-weight: 800;
    color: #1b2033;
}

.jv-float small {
    margin-top: 2px;
    font-size: 0.5rem;
    color: #5b6378;
}

.jv-float__icon {
    display: grid;
    place-items: center;
    width: 30px;
    height: 30px;
    border-radius: 7px;
}

.jv-float__icon svg {
    width: 15px;
    height: 15px;
}

.jv-float__icon.is-mint {
    background: #e9f8f2;
    color: #0f766e;
}

.jv-float__icon.is-navy {
    background: #eef1f9;
    color: #263773;
}

.jv-float--uptime {
    top: 14%;
    right: -4%;
}

.jv-float--team {
    bottom: 7%;
    left: -8%;
}

.jv-console-caption {
    display: block;
    margin-top: 13px;
    font-family: var(--jv-font-mono);
    font-size: 0.5625rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--jv-ink-mute);
    text-align: right;
}

.jv-scroll-cue {
    position: absolute;
    bottom: 18px;
    left: 50%;
    z-index: 3;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 7px;
    transform: translateX(-50%);
    font-family: var(--jv-font-mono);
    font-size: 0.5rem;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--jv-ink-mute);
}

.jv-scroll-cue i {
    display: block;
    width: 18px;
    height: 28px;
    padding: 5px 0;
    border: 1px solid var(--jv-border-strong);
    border-radius: 10px;
}

.jv-scroll-cue b {
    display: block;
    width: 3px;
    height: 6px;
    margin: 0 auto;
    border-radius: 2px;
    background: var(--jv-mint-strong);
    animation: jvScroll 1.8s ease-in-out infinite;
}

@keyframes jvScroll {
    0%, 100% { transform: translateY(0); opacity: 1; }
    50% { transform: translateY(8px); opacity: 0.3; }
}

/* Trust bar */
.jv-trust {
    padding: 20px 0;
    border-top: 1px solid var(--jv-border);
    border-bottom: 1px solid var(--jv-border);
    background: var(--jv-canvas-soft);
}

.jv-trust__inner {
    display: flex;
    align-items: center;
    gap: 30px;
}

.jv-trust__label {
    flex: none;
    font-family: var(--jv-font-mono);
    font-size: 0.5625rem;
    font-weight: 600;
    letter-spacing: 0.13em;
    text-transform: uppercase;
    color: var(--jv-ink-mute);
}

.jv-trust__window {
    flex: 1;
    min-width: 0;
    overflow: hidden;
    -webkit-mask-image: linear-gradient(90deg, transparent, #000 5%, #000 95%, transparent);
    mask-image: linear-gradient(90deg, transparent, #000 5%, #000 95%, transparent);
}

.jv-trust__track {
    display: flex;
    width: max-content;
    animation: jvMarquee 42s linear infinite;
}

.jv-trust__window:hover .jv-trust__track {
    animation-play-state: paused;
}

.jv-trust__item {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 0 26px;
    border-right: 1px solid var(--jv-border);
    font-family: var(--jv-font-display);
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--jv-ink-soft);
    white-space: nowrap;
}

.jv-trust__item svg {
    width: 14px;
    height: 14px;
    color: var(--jv-mint-strong);
}

@keyframes jvMarquee {
    from { transform: translateX(0); }
    to { transform: translateX(-50%); }
}

/* Products */
.jv-products-grid {
    display: grid;
    gap: 28px;
}

.jv-products-row {
    display: grid;
    gap: 18px;
}

.jv-products-row--top {
    grid-template-columns: minmax(0, 1.12fr) minmax(0, 0.88fr);
    align-items: stretch;
    gap: 22px;
}

.jv-product-stack--vertical {
    grid-template-columns: 1fr;
}

.jv-products-subhead {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.jv-products-subhead h3 {
    font-size: clamp(1.4rem, 2vw, 1.9rem);
}

.jv-product-grid-upcoming {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
}

.jv-product-card--upcoming {
    opacity: 0.98;
}

.jv-product-card--upcoming .jv-product-card__body {
    padding: 20px;
}

.jv-product-card--upcoming h3 {
    font-size: 1.08rem;
}

.jv-product-feature {
    position: relative;
    display: flex;
    flex-direction: column;
    padding: 34px;
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: var(--jv-radius-xl);
    background:
        radial-gradient(500px 300px at 100% 0%, rgba(144, 208, 186, 0.16), transparent 65%),
        linear-gradient(150deg, var(--jv-navy) 0%, var(--jv-navy-deep) 58%, #152048 100%);
    color: #fff;
    box-shadow: var(--jv-shadow-card);
    overflow: hidden;
}

.jv-product-feature::after {
    content: "";
    position: absolute;
    top: -60px;
    right: -40px;
    width: 220px;
    height: 220px;
    border: 1px solid rgba(144, 208, 186, 0.16);
    border-radius: 50%;
    pointer-events: none;
}

.jv-product-feature__top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
}

.jv-product-feature__label {
    font-family: var(--jv-font-mono);
    font-size: 0.625rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, 0.5);
}

.jv-product-feature .jv-badge--mint {
    background: rgba(144, 208, 186, 0.12);
    border-color: rgba(144, 208, 186, 0.35);
    color: var(--jv-mint);
}

.jv-product-feature__intro {
    margin-top: 22px;
}

.jv-product-feature__intro h3 {
    font-size: clamp(2rem, 3vw, 2.6rem);
    color: #fff;
}

.jv-product-feature__intro p {
    max-width: 470px;
    margin-top: 12px;
    font-size: 0.9375rem;
    line-height: 1.65;
    color: rgba(255, 255, 255, 0.66);
}

.jv-pipe {
    margin: 26px 0;
    padding: 18px;
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: var(--jv-radius-md);
    background: rgba(255, 255, 255, 0.04);
}

.jv-pipe__stages {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 8px;
    margin-bottom: 16px;
}

.jv-pipe__stage {
    position: relative;
    display: flex;
    align-items: center;
    gap: 7px;
    font-family: var(--jv-font-mono);
    font-size: 0.5rem;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, 0.4);
}

.jv-pipe__stage span {
    width: 9px;
    height: 9px;
    border: 1px solid rgba(255, 255, 255, 0.3);
    border-radius: 50%;
    flex: none;
}

.jv-pipe__stage.is-done span {
    border-color: var(--jv-mint);
    background: var(--jv-mint);
}

.jv-pipe__stage.is-active span {
    border-color: var(--jv-mint);
    box-shadow: 0 0 0 3px rgba(144, 208, 186, 0.18);
}

.jv-pipe__stage.is-active {
    color: var(--jv-mint);
}

.jv-pipe__stage.is-done {
    color: rgba(255, 255, 255, 0.68);
}

.jv-pipe__rows {
    display: grid;
    gap: 6px;
}

.jv-pipe__rows > div {
    display: grid;
    grid-template-columns: 8px 1fr auto;
    align-items: center;
    gap: 9px;
    padding: 7px 9px;
    border-radius: 5px;
    background: rgba(255, 255, 255, 0.05);
}

.jv-pipe__rows i {
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.35);
}

.jv-pipe__rows span {
    height: 4px;
    max-width: 220px;
    border-radius: 3px;
    background: rgba(255, 255, 255, 0.14);
}

.jv-pipe__rows b {
    padding: 2px 6px;
    border-radius: 4px;
    font-family: var(--jv-font-mono);
    font-size: 0.4375rem;
    font-weight: 600;
    letter-spacing: 0.03em;
}

.jv-pipe__rows b.is-mint {
    background: rgba(144, 208, 186, 0.15);
    color: var(--jv-mint);
}

.jv-pipe__rows b.is-outline {
    border: 1px solid rgba(255, 255, 255, 0.2);
    color: rgba(255, 255, 255, 0.65);
}

.jv-pipe__rows b.is-muted {
    color: rgba(255, 255, 255, 0.35);
}

.jv-product-feature .jv-check-list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    margin-bottom: 26px;
}

.jv-product-feature .jv-btn {
    align-self: flex-start;
    margin-top: auto;
}

.jv-product-stack {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
}

.jv-product-card {
    border: 1px solid var(--jv-border);
    border-radius: var(--jv-radius-lg);
    background: var(--jv-surface);
    box-shadow: var(--jv-shadow-sm);
    transition: transform 220ms var(--jv-ease), box-shadow 220ms ease, border-color 220ms ease;
}

.jv-product-card:hover {
    transform: translateY(-3px);
    border-color: var(--jv-border-strong);
    box-shadow: var(--jv-shadow-md);
}

.jv-product-card__body {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    height: 100%;
    padding: 22px;
}

.jv-product-card__icon {
    display: grid;
    flex: none;
    place-items: center;
    width: 42px;
    height: 42px;
    border: 1px solid var(--jv-border);
    border-radius: 10px;
    background: var(--jv-mint-soft);
    color: var(--jv-navy);
}

html.dark .jv-product-card__icon {
    color: var(--jv-mint);
}

.jv-product-card__icon svg {
    width: 20px;
    height: 20px;
}

.jv-product-card__category {
    font-family: var(--jv-font-mono);
    font-size: 0.5rem;
    font-weight: 600;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--jv-ink-mute);
}

.jv-product-card h3 {
    margin-top: 3px;
    font-size: 1.125rem;
}

.jv-product-card p {
    margin-top: 7px;
    font-size: 0.8125rem;
    line-height: 1.55;
    color: var(--jv-ink-mute);
}

.jv-product-card .jv-link {
    margin-top: 12px;
}

/* Problem */
.jv-problems {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 20px;
}

.jv-problem {
    position: relative;
    display: flex;
    flex-direction: column;
    padding: 28px;
    border: 1px solid var(--jv-border);
    border-radius: var(--jv-radius-lg);
    background: var(--jv-surface);
    box-shadow: var(--jv-shadow-sm);
}

.jv-problem .jv-mono {
    color: #0f766e;
}

html.dark .jv-problem .jv-mono {
    color: var(--jv-mint);
}

.jv-problem h3 {
    margin-top: 12px;
    font-size: 1.375rem;
}

.jv-problem__pain {
    margin-top: 10px;
    font-size: 0.875rem;
    color: var(--jv-ink-mute);
}

.jv-problem__arrow {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 22px 0 18px;
    color: var(--jv-navy);
}

html.dark .jv-problem__arrow {
    color: var(--jv-mint);
}

.jv-problem__arrow span {
    flex: 1;
    height: 1px;
    background: var(--jv-border);
}

.jv-problem__arrow svg {
    width: 18px;
    height: 18px;
}

.jv-problem__solution {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    margin-top: auto;
    padding-top: 16px;
    border-top: 1px solid var(--jv-border);
    font-size: 0.8125rem;
    font-weight: 500;
    line-height: 1.55;
    color: var(--jv-ink-soft);
}

.jv-problem__solution svg {
    flex: none;
    width: 14px;
    height: 14px;
    margin-top: 3px;
    color: var(--jv-success);
}

/* Solutions */
.jv-solutions {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
}

.jv-solution {
    display: flex;
    flex-direction: column;
    padding: 26px;
    border: 1px solid var(--jv-border);
    border-radius: var(--jv-radius-lg);
    background: var(--jv-surface);
    transition: transform 220ms var(--jv-ease), border-color 220ms ease, box-shadow 220ms ease;
}

.jv-solution:hover {
    transform: translateY(-4px);
    border-color: var(--jv-border-strong);
    box-shadow: var(--jv-shadow-md);
}

.jv-solution__top {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
}

.jv-solution__icon {
    display: grid;
    place-items: center;
    width: 42px;
    height: 42px;
    border: 1px solid var(--jv-border);
    border-radius: 10px;
    background: var(--jv-mint-soft);
    color: var(--jv-navy);
    transition: background-color 200ms ease, color 200ms ease;
}

html.dark .jv-solution__icon {
    color: var(--jv-mint);
}

.jv-solution:hover .jv-solution__icon {
    background: var(--jv-navy);
    color: var(--jv-mint);
}

.jv-solution__icon svg {
    width: 20px;
    height: 20px;
}

.jv-solution h3 {
    margin-top: 20px;
    font-size: 1.125rem;
    line-height: 1.25;
}

.jv-solution p {
    margin-top: 8px;
    font-size: 0.8125rem;
    line-height: 1.6;
    color: var(--jv-ink-mute);
}

.jv-solution .jv-link {
    margin-top: 18px;
}

/* Healthcare */
.jv-health {
    background:
        radial-gradient(700px 400px at 100% 0%, rgba(144, 208, 186, 0.12), transparent 70%),
        var(--jv-canvas-soft);
    border-top: 1px solid var(--jv-border);
    border-bottom: 1px solid var(--jv-border);
}

.jv-health__head {
    display: grid;
    grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.85fr);
    align-items: end;
    gap: 48px;
    margin-bottom: 42px;
}

.jv-health__head h2 {
    margin-top: 18px;
    max-width: 580px;
}

.jv-health__head > p {
    padding-bottom: 4px;
    font-size: 0.9375rem;
    color: var(--jv-ink-mute);
}

.jv-wf {
    position: relative;
    padding: 30px 32px 24px;
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: var(--jv-radius-xl);
    background:
        radial-gradient(600px 260px at 85% 0%, rgba(144, 208, 186, 0.14), transparent 70%),
        linear-gradient(150deg, #223266, #17234a 70%);
    color: #fff;
    overflow: hidden;
}

.jv-wf__label {
    display: inline-block;
    margin-bottom: 28px;
    font-family: var(--jv-font-mono);
    font-size: 0.5625rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, 0.45);
}

.jv-wf__track {
    position: absolute;
    top: 72px;
    left: 9%;
    right: 9%;
    height: 1px;
    background: linear-gradient(90deg, rgba(144, 208, 186, 0.5), rgba(144, 208, 186, 0.12));
}

.jv-wf__steps {
    position: relative;
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 16px;
}

.jv-wf__step {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 7px;
    text-align: center;
}

.jv-wf__node {
    position: relative;
    z-index: 1;
    display: grid;
    place-items: center;
    width: 34px;
    height: 34px;
    border: 1px solid rgba(144, 208, 186, 0.45);
    border-radius: 50%;
    background: #1d2b59;
    font-family: var(--jv-font-mono);
    font-size: 0.5rem;
    font-weight: 600;
    color: var(--jv-mint);
}

.jv-wf__step.is-active .jv-wf__node {
    border-color: var(--jv-mint);
    background: var(--jv-mint);
    color: var(--jv-navy-ink);
    box-shadow: 0 0 0 6px rgba(144, 208, 186, 0.14);
}

.jv-wf__title {
    margin-top: 3px;
    font-family: var(--jv-font-display);
    font-size: 0.8125rem;
    font-weight: 700;
}

.jv-wf__desc {
    max-width: 160px;
    font-size: 0.6875rem;
    line-height: 1.45;
    color: rgba(255, 255, 255, 0.5);
}

.jv-wf__connected {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    margin-top: 28px;
    padding-top: 18px;
    border-top: 1px solid rgba(255, 255, 255, 0.1);
}

.jv-wf__connected .jv-mono {
    margin-right: 6px;
    color: rgba(255, 255, 255, 0.42);
}

.jv-focus-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 16px;
    margin: 22px 0 30px;
}

.jv-focus {
    padding: 22px;
    border: 1px solid var(--jv-border);
    border-radius: var(--jv-radius-md);
    background: var(--jv-surface);
}

.jv-focus__icon {
    display: grid;
    place-items: center;
    width: 36px;
    height: 36px;
    border-radius: 8px;
    background: var(--jv-mint-soft);
    color: var(--jv-navy);
}

html.dark .jv-focus__icon {
    color: var(--jv-mint);
}

.jv-focus__icon svg {
    width: 18px;
    height: 18px;
}

.jv-focus h3 {
    margin-top: 14px;
    font-size: 0.9375rem;
    line-height: 1.3;
}

.jv-focus p {
    margin-top: 7px;
    font-size: 0.75rem;
    line-height: 1.55;
    color: var(--jv-ink-mute);
}

/* Why */
.jv-why {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
}

.jv-why__card {
    padding: 26px;
    border: 1px solid var(--jv-border);
    border-radius: var(--jv-radius-lg);
    background: var(--jv-surface);
    transition: border-color 200ms ease, box-shadow 200ms ease;
}

.jv-why__card:hover {
    border-color: var(--jv-border-strong);
    box-shadow: var(--jv-shadow-md);
}

.jv-why__top {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
}

.jv-why__icon {
    display: grid;
    place-items: center;
    width: 42px;
    height: 42px;
    border: 1px solid var(--jv-border);
    border-radius: 10px;
    background: var(--jv-mint-soft);
    color: var(--jv-navy);
}

html.dark .jv-why__icon {
    color: var(--jv-mint);
}

.jv-why__icon svg {
    width: 20px;
    height: 20px;
}

.jv-why__card h3 {
    margin-top: 18px;
    font-size: 1.0625rem;
}

.jv-why__card p {
    margin-top: 8px;
    font-size: 0.8125rem;
    line-height: 1.6;
    color: var(--jv-ink-mute);
}

/* Industries */
.jv-industry-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
}

.jv-industry-card {
    display: flex;
    flex-direction: column;
    padding: 28px;
    border: 1px solid var(--jv-border);
    border-radius: var(--jv-radius-lg);
    background: var(--jv-surface);
    transition: border-color 180ms ease, transform 220ms var(--jv-ease), box-shadow 220ms ease;
}

.jv-industry-card:hover {
    border-color: var(--jv-border-strong);
    transform: translateY(-3px);
    box-shadow: var(--jv-shadow-card);
}

.jv-industry-card:focus-visible {
    border-radius: var(--jv-radius-lg);
}

.jv-industry-card__top {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
}

.jv-industry-card__icon {
    display: grid;
    place-items: center;
    width: 44px;
    height: 44px;
    border: 1px solid var(--jv-border);
    border-radius: 11px;
    background: var(--jv-mint-soft);
    color: var(--jv-navy);
}

html.dark .jv-industry-card__icon {
    color: var(--jv-mint);
}

.jv-industry-card__icon svg {
    width: 21px;
    height: 21px;
}

.jv-industry-card__top .jv-mono {
    color: var(--jv-ink-mute);
}

.jv-industry-card h3 {
    margin-top: 22px;
    font-size: 1.125rem;
    line-height: 1.35;
    transition: color 160ms ease;
}

.jv-industry-card:hover h3 {
    color: var(--jv-navy);
}

html.dark .jv-industry-card:hover h3 {
    color: var(--jv-mint);
}

.jv-industry-card__desc {
    margin-top: 10px;
    font-size: 0.875rem;
    line-height: 1.6;
    color: var(--jv-ink-mute);
}

.jv-industry-card__pains {
    margin-top: 22px;
    padding: 18px;
    border: 1px solid var(--jv-border);
    border-radius: var(--jv-radius-md);
    background: var(--jv-canvas-soft);
}

.jv-industry-card__label {
    font-family: var(--jv-font-mono);
    font-size: 0.625rem;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--jv-ink-mute);
}

.jv-industry-card__pains ul {
    display: grid;
    gap: 10px;
    margin-top: 12px;
}

.jv-industry-card__pains li {
    position: relative;
    padding-left: 15px;
    font-size: 0.8125rem;
    line-height: 1.5;
    color: var(--jv-ink-soft);
}

.jv-industry-card__pains li::before {
    content: "";
    position: absolute;
    top: 0.52em;
    left: 0;
    width: 5px;
    height: 5px;
    border-radius: 1px;
    background: var(--jv-mint-strong);
}

.jv-industry-card > .jv-link {
    align-self: flex-start;
    margin-top: auto;
    padding-top: 22px;
}

/* Approach */
.jv-approach {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 18px;
}

.jv-approach__step {
    position: relative;
    padding: 22px 18px;
    border-top: 2px solid var(--jv-border);
}

.jv-approach__step:first-child {
    border-top-color: var(--jv-mint-strong);
}

.jv-approach__num {
    font-family: var(--jv-font-mono);
    font-size: 0.6875rem;
    font-weight: 600;
    letter-spacing: 0.06em;
    color: #0f766e;
}

html.dark .jv-approach__num {
    color: var(--jv-mint);
}

.jv-approach__step h3 {
    margin-top: 10px;
    font-size: 1rem;
}

.jv-approach__step p {
    margin-top: 7px;
    font-size: 0.75rem;
    line-height: 1.55;
    color: var(--jv-ink-mute);
}

.jv-approach__arrow {
    position: absolute;
    top: -10px;
    right: -14px;
    z-index: 1;
    display: grid;
    place-items: center;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: var(--jv-canvas);
    color: var(--jv-border-strong);
    transform: rotate(0deg);
}

.jv-approach__arrow svg {
    width: 12px;
    height: 12px;
}

/* Proof */
.jv-proof {
    display: grid;
    grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
    align-items: center;
    gap: 56px;
}

.jv-proof__copy h2 {
    margin-top: 16px;
    max-width: 460px;
}

.jv-proof__copy > p {
    margin-top: 18px;
    font-size: 0.9375rem;
    color: var(--jv-ink-mute);
}

.jv-proof__note {
    padding-left: 14px;
    border-left: 2px solid var(--jv-mint);
    font-size: 0.8125rem !important;
}

.jv-proof__grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1px;
    overflow: hidden;
    border: 1px solid var(--jv-border);
    border-radius: var(--jv-radius-lg);
    background: var(--jv-border);
}

.jv-proof__item {
    display: flex;
    flex-direction: column;
    gap: 7px;
    padding: 28px;
    background: var(--jv-surface);
}

.jv-proof__item strong {
    font-family: var(--jv-font-display);
    font-size: clamp(2rem, 3vw, 2.75rem);
    font-weight: 800;
    line-height: 1;
    letter-spacing: -0.045em;
}

.jv-proof__item span {
    font-size: 0.75rem;
    line-height: 1.45;
    color: var(--jv-ink-mute);
}

/* Security */
.jv-security {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr);
    align-items: center;
    gap: 48px;
    padding: 54px;
    border-radius: var(--jv-radius-2xl);
    background:
        radial-gradient(600px 320px at 100% 0%, rgba(144, 208, 186, 0.16), transparent 70%),
        linear-gradient(140deg, #223266, #111c3d);
    color: #fff;
    overflow: hidden;
}

.jv-security__glow {
    position: absolute;
    right: -80px;
    bottom: -120px;
    width: 340px;
    height: 340px;
    border: 1px solid rgba(144, 208, 186, 0.14);
    border-radius: 50%;
    pointer-events: none;
}

.jv-security__copy {
    position: relative;
    z-index: 1;
}

.jv-security h2 {
    margin-top: 16px;
    max-width: 480px;
    color: #fff;
}

.jv-security p {
    max-width: 500px;
    margin-top: 14px;
    font-size: 0.9375rem;
    color: rgba(255, 255, 255, 0.65);
}

.jv-security .jv-btn {
    margin-top: 26px;
}

.jv-security__badges {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

.jv-security__badge {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 15px;
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: var(--jv-radius-md);
    background: rgba(255, 255, 255, 0.05);
    font-family: var(--jv-font-display);
    font-size: 0.75rem;
    font-weight: 600;
    color: rgba(255, 255, 255, 0.85);
}

.jv-security__badge svg {
    flex: none;
    width: 18px;
    height: 18px;
    color: var(--jv-mint);
}

/* CTA */
.jv-cta-section {
    padding-top: 0;
}

.jv-cta {
    position: relative;
    padding: 64px 40px;
    border-radius: var(--jv-radius-2xl);
    background:
        radial-gradient(600px 320px at 50% -10%, rgba(144, 208, 186, 0.2), transparent 65%),
        linear-gradient(145deg, #263773, #17234a 70%);
    text-align: center;
    color: #fff;
    overflow: hidden;
}

.jv-cta__glow {
    position: absolute;
    top: -160px;
    left: 50%;
    width: 520px;
    height: 520px;
    border: 1px solid rgba(144, 208, 186, 0.12);
    border-radius: 50%;
    transform: translateX(-50%);
    pointer-events: none;
}

.jv-cta h2 {
    position: relative;
    z-index: 1;
    color: #fff;
    font-size: clamp(2.25rem, 4.4vw, 3.6rem);
}

.jv-cta > p {
    position: relative;
    z-index: 1;
    max-width: 500px;
    margin: 16px auto 0;
    font-size: 0.9375rem;
    color: rgba(255, 255, 255, 0.65);
}

.jv-cta__actions {
    position: relative;
    z-index: 1;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 12px;
    margin-top: 28px;
}

.jv-cta__note {
    position: relative;
    z-index: 1;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 12px 26px;
    margin-top: 26px;
    font-size: 0.75rem;
    color: rgba(255, 255, 255, 0.46);
}

.jv-cta__note span {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.jv-cta__note svg {
    width: 12px;
    height: 12px;
    color: var(--jv-mint);
}

.jv-status {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-family: var(--jv-font-mono);
    font-size: 0.5rem;
    font-weight: 600;
    letter-spacing: 0.08em;
    line-height: 1.2;
    text-transform: uppercase;
    white-space: nowrap;
    color: var(--jv-ink-mute);
}

.jv-status i {
    width: 5px;
    height: 5px;
    flex: none;
    border-radius: 50%;
    background: currentColor;
}

.jv-status--ready {
    color: #0f766e;
}

.jv-status--soon {
    color: #b45309;
}

.jv-status--progress {
    color: var(--jv-ink-mute);
}

html.dark .jv-status--ready {
    color: var(--jv-mint);
}

html.dark .jv-status--soon {
    color: #fbbf24;
}

.jv-product-feature__badges {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
}

.jv-product-feature__badges .jv-status {
    color: var(--jv-mint);
}

.jv-product-feature::before {
    content: "";
    position: absolute;
    inset: 0;
    background: radial-gradient(340px circle at var(--jv-mx, 82%) var(--jv-my, 18%), rgba(144, 208, 186, 0.18), transparent 64%);
    opacity: 0;
    pointer-events: none;
    transition: opacity 450ms ease;
}

@media (hover: hover) and (pointer: fine) {
    .jv-product-feature:hover::before {
        opacity: 1;
    }
}

.jv-pipe__stage,
.jv-pipe__stage span {
    transition: color 350ms ease, border-color 350ms ease, background-color 350ms ease, box-shadow 350ms ease, transform 350ms ease;
}

.jv-product-card {
    position: relative;
    overflow: hidden;
}

.jv-product-card::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    width: 100%;
    height: 2px;
    background: linear-gradient(90deg, var(--jv-mint-strong), var(--jv-mint), transparent);
    transform: scaleX(0);
    transform-origin: left;
    transition: transform 420ms var(--jv-ease);
}

.jv-product-card:hover::before,
.jv-product-card:focus-within::before {
    transform: scaleX(1);
}

.jv-product-card__meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 5px 10px;
}

.jv-product-card__icon {
    transition: transform 260ms var(--jv-ease), color 260ms ease, background-color 260ms ease, border-color 260ms ease;
}

.jv-product-card:hover .jv-product-card__icon,
.jv-product-card:focus-within .jv-product-card__icon {
    transform: translateY(-2px);
    border-color: var(--jv-navy);
    background: var(--jv-navy);
    color: var(--jv-mint);
}

html.dark .jv-product-card:hover .jv-product-card__icon,
html.dark .jv-product-card:focus-within .jv-product-card__icon {
    border-color: var(--jv-mint);
    background: var(--jv-mint);
    color: var(--jv-navy-ink);
}

.jv-product-card:hover .jv-link svg,
.jv-product-card:focus-within .jv-link svg {
    transform: translateX(3px);
}

.jv-wf__node,
.jv-wf__title,
.jv-wf__desc {
    transition: color 450ms ease, background-color 450ms ease, border-color 450ms ease, box-shadow 450ms ease, transform 450ms ease;
}

.jv-wf__step:not(.is-active) .jv-wf__title {
    color: rgba(255, 255, 255, 0.84);
}

.jv-wf__step:not(.is-active) .jv-wf__desc {
    color: rgba(255, 255, 255, 0.44);
}

.jv-wf__step.is-active .jv-wf__title {
    color: #fff;
}

.jv-wf__track::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 0;
    width: 7px;
    height: 7px;
    margin-top: -3.5px;
    border-radius: 50%;
    background: var(--jv-mint);
    box-shadow: 0 0 0 4px rgba(144, 208, 186, 0.16), 0 0 16px rgba(144, 208, 186, 0.7);
    opacity: 0;
}

.jv-approach__step::before {
    content: "";
    position: absolute;
    top: -2px;
    left: 0;
    width: 100%;
    height: 2px;
    background: linear-gradient(90deg, var(--jv-mint-strong), var(--jv-mint));
}

.js .jv-approach__step::before {
    width: 0;
    transition: width 700ms var(--jv-ease);
}

.js .jv-approach__step.is-visible::before {
    width: 100%;
}

.jv-approach__step:nth-child(2)::before {
    transition-delay: 80ms;
}

.jv-approach__step:nth-child(3)::before {
    transition-delay: 160ms;
}

.jv-approach__step:nth-child(4)::before {
    transition-delay: 240ms;
}

.jv-approach__step:nth-child(5)::before {
    transition-delay: 320ms;
}

.jv-btn {
    position: relative;
    overflow: hidden;
}

.jv-btn::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(105deg, transparent 35%, rgba(255, 255, 255, 0.34) 50%, transparent 65%);
    transform: translateX(-130%);
    pointer-events: none;
    transition: transform 650ms var(--jv-ease);
}

.jv-btn:hover::after,
.jv-btn:focus-visible::after {
    transform: translateX(130%);
}

@media (prefers-reduced-motion: no-preference) {
    .jv-hero__blob--one {
        animation: jvBlobOne 18s ease-in-out infinite alternate;
    }

    .jv-hero__blob--two {
        animation: jvBlobTwo 22s ease-in-out infinite alternate;
    }

    .jv-chart-line {
        stroke-dasharray: 1;
        stroke-dashoffset: 1;
        animation: jvChartDraw 1.8s 500ms var(--jv-ease) forwards;
    }

    .jv-chart-area {
        opacity: 0;
        animation: jvChartArea 900ms 1300ms ease forwards;
    }

    .jv-chart-point {
        transform-box: fill-box;
        transform-origin: center;
        animation: jvChartPoint 2.6s 2100ms ease-in-out infinite;
    }

    .jv-console__meter i {
        transform: scaleX(0);
        transform-origin: left;
        animation: jvMeterGrow 1s 700ms var(--jv-ease) forwards;
    }

    .jv-console__row:nth-child(2) .jv-console__meter i {
        animation-delay: 820ms;
    }

    .jv-console__row:nth-child(3) .jv-console__meter i {
        animation-delay: 940ms;
    }

    .jv-status--ready i {
        animation: jvStatusPulse 2.8s ease-out infinite;
    }

    .jv-pipe__stage.is-active span {
        background: var(--jv-mint);
        transform: scale(1.08);
    }

    .jv-wf__track::after {
        animation: jvWfTravel 11s linear infinite;
    }

    .jv-wf__step.is-active .jv-wf__node {
        transform: scale(1.08);
        animation: jvWfNode 2.2s ease-out infinite;
    }

    .jv-product-feature::after {
        animation: jvHalo 9s ease-in-out infinite;
    }
}

@keyframes jvBlobOne {
    from { transform: translate3d(0, 0, 0) scale(1); }
    to { transform: translate3d(-22px, 18px, 0) scale(1.06); }
}

@keyframes jvBlobTwo {
    from { transform: translate3d(0, 0, 0) scale(1); }
    to { transform: translate3d(20px, -16px, 0) scale(1.08); }
}

@keyframes jvChartDraw {
    to { stroke-dashoffset: 0; }
}

@keyframes jvChartArea {
    to { opacity: 1; }
}

@keyframes jvChartPoint {
    0%, 100% { transform: scale(1); }
    50% { transform: scale(1.35); }
}

@keyframes jvMeterGrow {
    to { transform: scaleX(1); }
}

@keyframes jvStatusPulse {
    0% { box-shadow: 0 0 0 0 currentColor; }
    70%, 100% { box-shadow: 0 0 0 5px transparent; }
}

@keyframes jvWfTravel {
    0% { left: 0; opacity: 0; }
    7%, 93% { opacity: 1; }
    100% { left: 100%; opacity: 0; }
}

@keyframes jvWfNode {
    0% { box-shadow: 0 0 0 4px rgba(144, 208, 186, 0.16); }
    70%, 100% { box-shadow: 0 0 0 11px rgba(144, 208, 186, 0); }
}

@keyframes jvHalo {
    0%, 100% { transform: scale(1); opacity: 0.8; }
    50% { transform: scale(1.12); opacity: 0.45; }
}

@media (prefers-reduced-motion: reduce) {
    [data-parallax] {
        translate: none;
    }

    .jv-trust__track {
        animation: none;
    }

    .jv-scroll-cue b,
    .jv-pill__pulse::after,
    .jv-hero__blob--one,
    .jv-hero__blob--two,
    .jv-chart-line,
    .jv-chart-area,
    .jv-chart-point,
    .jv-console__meter i,
    .jv-status--ready i,
    .jv-wf__track::after,
    .jv-wf__step.is-active .jv-wf__node,
    .jv-product-feature::after {
        animation: none;
    }

    .jv-chart-line,
    .jv-console__meter i {
        stroke-dashoffset: 0;
        transform: scaleX(1);
    }

    .jv-chart-area {
        opacity: 1;
    }

    .jv-approach__step::before {
        width: 100%;
        transition: none;
    }

    .jv-btn::after {
        display: none;
    }

    .jv-product-card::before {
        transition: none;
    }

    .jv-product-card__icon {
        transition: none;
    }

    .jv-pipe__stage,
    .jv-pipe__stage span,
    .jv-wf__node,
    .jv-wf__title,
    .jv-wf__desc {
        transition: none;
    }
}

@media (max-width: 1180px) {
    .jv-products-row--top {
        grid-template-columns: minmax(0, 1fr) minmax(0, 0.92fr);
    }

    .jv-product-grid-upcoming {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .jv-product-stack--vertical {
        grid-template-columns: 1fr;
    }

    .jv-hero__inner {
        grid-template-columns: minmax(0, 1fr) minmax(0, 0.9fr);
    }

    .jv-float--uptime {
        right: 0;
    }

    .jv-float--team {
        left: 0;
    }

    .jv-security {
        padding: 44px;
    }
}

@media (max-width: 1080px) {
    .jv-products-row--top {
        grid-template-columns: 1fr;
    }

    .jv-hero {
        padding: 58px 0 82px;
    }

    .jv-hero__inner {
        grid-template-columns: 1fr;
        gap: 56px;
    }

    .jv-hero__copy {
        max-width: 720px;
    }

    .jv-hero__visual {
        max-width: 620px;
    }

    .jv-console-wrap {
        margin: 0;
    }

    .jv-console {
        transform: none;
    }

    .jv-scroll-cue {
        display: none;
    }

    .jv-products {
        grid-template-columns: 1fr;
    }

    .jv-product-stack {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .jv-health__head {
        grid-template-columns: 1fr;
        gap: 18px;
    }

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

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

    .jv-approach {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 22px;
    }

    .jv-approach__arrow {
        display: none;
    }

    .jv-proof {
        grid-template-columns: 1fr;
        gap: 34px;
    }

    .jv-security {
        grid-template-columns: 1fr;
        gap: 32px;
    }
}

@media (max-width: 900px) {
    .jv-problems {
        grid-template-columns: 1fr;
    }

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

    .jv-industry-grid {
        grid-template-columns: 1fr;
    }

    .jv-wf__steps {
        grid-template-columns: repeat(5, minmax(120px, 1fr));
        overflow-x: auto;
        padding-bottom: 8px;
        scrollbar-width: thin;
    }

    .jv-wf {
        overflow-x: auto;
    }

    .jv-wf__track {
        display: none;
    }
}

@media (max-width: 720px) {
    .jv-hero {
        padding: 42px 0 64px;
    }

    .jv-hero__lead {
        margin-top: 18px;
        font-size: 0.9375rem;
    }

    .jv-hero__actions {
        margin-top: 24px;
    }

    .jv-hero__actions .jv-btn {
        flex: 1 1 auto;
    }

    .jv-metrics {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 20px 14px;
        margin-top: 30px;
        padding-top: 22px;
    }

    .jv-metric__label {
        font-size: 0.625rem;
    }

    .jv-console {
        border-radius: 14px;
    }

    .jv-console__body {
        min-height: 0;
    }

    .jv-console__rail {
        width: 42px;
    }

    .jv-console__main {
        padding: 12px;
    }

    .jv-console__rows {
        display: none;
    }

    .jv-console__kpis > div {
        padding: 6px 7px;
    }

    .jv-float {
        display: none;
    }

    .jv-console-caption {
        margin-top: 10px;
        text-align: center;
    }

    .jv-trust__inner {
        flex-direction: column;
        align-items: flex-start;
        gap: 10px;
    }

    .jv-trust__window {
        width: 100%;
    }

    .jv-trust__item {
        padding: 0 18px;
        font-size: 0.6875rem;
    }

    .jv-product-feature {
        padding: 24px;
    }

    .jv-product-feature .jv-check-list {
        grid-template-columns: 1fr;
    }

    .jv-product-stack {
        grid-template-columns: 1fr;
    }

    .jv-product-stack--vertical {
        grid-template-columns: 1fr;
    }

    .jv-product-grid-upcoming {
        grid-template-columns: 1fr;
    }

    .jv-solutions {
        grid-template-columns: 1fr;
    }

    .jv-solution {
        padding: 22px;
    }

    .jv-wf {
        padding: 22px 18px 18px;
    }

    .jv-wf__label {
        margin-bottom: 20px;
    }

    .jv-focus-grid {
        grid-template-columns: 1fr;
    }

    .jv-focus {
        padding: 18px;
    }

    .jv-why {
        grid-template-columns: 1fr;
    }

    .jv-industry-card {
        padding: 24px;
    }

    .jv-approach {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 18px 14px;
    }

    .jv-proof__grid {
        grid-template-columns: 1fr;
    }

    .jv-proof__item {
        padding: 20px;
    }

    .jv-security {
        padding: 30px 22px;
        border-radius: var(--jv-radius-xl);
    }

    .jv-security__badges {
        grid-template-columns: 1fr;
    }

    .jv-cta {
        padding: 46px 22px;
        border-radius: var(--jv-radius-xl);
    }

    .jv-cta__actions .jv-btn {
        width: 100%;
    }
}

@media (max-width: 480px) {
    .jv-hero__actions {
        flex-direction: column;
    }

    .jv-hero__actions .jv-btn {
        width: 100%;
    }

    .jv-pipe__stages {
        grid-template-columns: repeat(2, 1fr);
        gap: 10px;
    }

    .jv-approach {
        grid-template-columns: 1fr;
    }

    .jv-cta__note {
        flex-direction: column;
        align-items: center;
    }
}

/* ==========================================================================
   Products — refined (variation A)
   ========================================================================== */
#products {
    --jv-p-card: var(--jv-surface);
    --jv-p-card-hover: #fff;
    --jv-p-ring: rgba(38, 55, 115, 0.14);
    --jv-p-glow: rgba(144, 208, 186, 0.22);
    --jv-p-dash: rgba(38, 55, 115, 0.22);
    --jv-p-soft: linear-gradient(180deg, #f4f7fb 0%, #f9fbfd 100%);
    position: relative;
    background:
        radial-gradient(700px 360px at 0% 0%, rgba(144, 208, 186, 0.10), transparent 70%),
        radial-gradient(640px 320px at 100% 100%, rgba(38, 55, 115, 0.06), transparent 70%),
        var(--jv-canvas);
}

html.dark #products {
    --jv-p-card: linear-gradient(160deg, rgba(20, 31, 54, 0.92), rgba(15, 23, 42, 0.92));
    --jv-p-card-hover: #14203a;
    --jv-p-ring: rgba(144, 208, 186, 0.28);
    --jv-p-glow: rgba(144, 208, 186, 0.16);
    --jv-p-dash: rgba(144, 208, 186, 0.28);
    --jv-p-soft: linear-gradient(180deg, rgba(15, 23, 42, 0.6), rgba(11, 18, 32, 0.6));
    background:
        radial-gradient(700px 360px at 0% 0%, rgba(144, 208, 186, 0.07), transparent 70%),
        radial-gradient(640px 320px at 100% 100%, rgba(38, 55, 115, 0.25), transparent 70%),
        var(--jv-canvas);
}

/* Layout */
#products .jv-products-grid { gap: 40px; }
#products .jv-products-row--top { gap: 24px; }
#products .jv-product-stack--vertical { gap: 24px; grid-template-columns: minmax(0, 1fr); grid-template-rows: 1fr 1fr; }

/* Readable micro-type (was 7–8px) */
#products .jv-product-feature__label,
#products .jv-product-card__category {
    font-size: 0.6875rem;
    letter-spacing: 0.1em;
}
#products .jv-pipe__stage { font-size: 0.6875rem; }
#products .jv-pipe__rows b { font-size: 0.625rem; padding: 3px 8px; }
#products .jv-pipe__stage span { width: 11px; height: 11px; }

/* Featured card */
#products .jv-product-feature {
    padding: clamp(26px, 3vw, 40px);
    border-radius: var(--jv-radius-2xl);
    background:
        linear-gradient(rgba(144, 208, 186, 0.05) 1px, transparent 1px) 0 0 / 100% 36px,
        radial-gradient(520px 320px at 100% 0%, rgba(144, 208, 186, 0.22), transparent 65%),
        radial-gradient(420px 260px at 0% 100%, rgba(107, 191, 159, 0.10), transparent 70%),
        linear-gradient(150deg, var(--jv-navy) 0%, var(--jv-navy-deep) 58%, #131c42 100%);
    box-shadow: 0 30px 60px -28px rgba(26, 39, 84, 0.65), inset 0 1px 0 rgba(255, 255, 255, 0.08);
}
#products .jv-product-feature__intro h3 { letter-spacing: -0.02em; }
#products .jv-product-feature__intro p { color: rgba(255, 255, 255, 0.78); }
#products .jv-pipe {
    position: relative;
    border-color: rgba(144, 208, 186, 0.22);
    background: rgba(8, 14, 36, 0.35);
    -webkit-backdrop-filter:blur(6px);
    backdrop-filter:blur(6px);
}
#products .jv-pipe__stage.is-done { color: rgba(255, 255, 255, 0.82); }
#products .jv-pipe__stage { color: rgba(255, 255, 255, 0.55); }
#products .jv-pipe__rows b.is-muted { color: rgba(255, 255, 255, 0.55); }
#products .jv-pipe__rows b.is-outline { color: rgba(255, 255, 255, 0.8); }
#products .jv-product-feature .jv-check-list li { color: rgba(255, 255, 255, 0.88); }

/* Product cards */
#products .jv-product-card {
    background: var(--jv-p-card);
    border-radius: var(--jv-radius-xl);
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04), 0 10px 24px -16px rgba(38, 55, 115, 0.22);
    cursor: pointer;
}
#products .jv-product-card::after {
    content: "";
    position: absolute;
    inset: auto -40px -60px auto;
    width: 180px;
    height: 180px;
    border-radius: 50%;
    background: radial-gradient(circle, var(--jv-p-glow), transparent 68%);
    opacity: 0;
    transition: opacity 350ms ease;
    pointer-events: none;
}
#products .jv-product-card:hover,
#products .jv-product-card:focus-within {
    transform: translateY(-4px);
    border-color: var(--jv-p-ring);
    background: var(--jv-p-card-hover);
    box-shadow: 0 2px 4px rgba(15, 23, 42, 0.04), 0 26px 44px -22px rgba(38, 55, 115, 0.38);
}
#products .jv-product-card:hover::after,
#products .jv-product-card:focus-within::after { opacity: 1; }
#products .jv-product-card:focus-within { outline: 2px solid var(--jv-mint-strong); outline-offset: 3px; }

#products .jv-product-card__body { padding: 26px; gap: 18px; position: relative; z-index: 2; }
#products .jv-product-card__icon { width: 52px; height: 52px; border-radius: 14px; }
#products .jv-product-card__icon svg { width: 24px; height: 24px; }
#products .jv-product-card h3 { font-size: 1.3125rem; margin-top: 6px; letter-spacing: -0.01em; }
#products .jv-product-card p { font-size: 0.875rem; line-height: 1.6; color: var(--jv-ink-soft); }
#products .jv-product-card .jv-link { margin-top: 16px; }
/* whole card clickable */
#products .jv-product-card .jv-link::after { content: ""; position: absolute; inset: 0; z-index: 3; }

/* Upcoming */
#products .jv-products-row--bottom {
    grid-template-columns: minmax(180px, 0.32fr) minmax(0, 1fr);
    align-items: start;
    gap: 28px;
    padding: 28px;
    border: 1px dashed var(--jv-p-dash);
    border-radius: var(--jv-radius-2xl);
    background: var(--jv-p-soft);
}
#products .jv-product-grid-upcoming { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
#products .jv-product-card--upcoming { box-shadow: none; }
#products .jv-product-card--upcoming .jv-product-card__body { padding: 22px; }
#products .jv-product-card--upcoming h3 { font-size: 1.1875rem; }
#products .jv-products-subhead p { font-size: 0.875rem; color: var(--jv-ink-mute); }

@media (max-width: 1080px) {
    #products .jv-product-stack--vertical { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-rows: auto; }
    #products .jv-products-row--bottom { grid-template-columns: 1fr; gap: 18px; }
}
@media (max-width: 720px) {
    #products .jv-product-stack--vertical,
    #products .jv-product-grid-upcoming { grid-template-columns: 1fr; }
    #products .jv-products-row--bottom { padding: 18px; }
    #products .jv-product-card__body { padding: 20px; gap: 14px; }
}
@media (prefers-reduced-motion: reduce) {
    #products .jv-product-card,
    #products .jv-product-card::after { transition: none; }
    #products .jv-product-card:hover,
    #products .jv-product-card:focus-within { transform: none; }
}

/* Products — workflow motion for right-hand cards */
#products .jv-product-stack--vertical .jv-product-card { display: flex; flex-direction: column; }
#products .jv-product-stack--vertical .jv-product-card__body { flex: 1 1 auto; height: auto; padding-bottom: 14px; }
.jv-mini {
    position: relative;
    z-index: 2;
    margin: 0 26px 24px;
    padding: 14px 16px;
    border: 1px solid var(--jv-border);
    border-radius: var(--jv-radius-md);
    background: var(--jv-mint-soft);
}
html.dark .jv-mini { background: rgba(144, 208, 186, 0.06); }
.jv-mini__steps { display: grid; grid-template-columns: repeat(4, 1fr); gap: 6px; margin-top: 12px; }
.jv-mini__steps em {
    font: normal 600 0.625rem/1.2 var(--jv-font-mono);
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--jv-ink-mute);
    animation: jvStep 6s infinite;
}
.jv-mini__steps em:nth-child(2) { animation-delay: 1.5s; }
.jv-mini__steps em:nth-child(3) { animation-delay: 3s; }
.jv-mini__steps em:nth-child(4) { animation-delay: 4.5s; }
@keyframes jvStep { 0%, 24% { color: var(--jv-navy); } 25%, 100% { color: var(--jv-ink-mute); } }
html.dark .jv-mini__steps em { animation-name: jvStepDark; }
@keyframes jvStepDark { 0%, 24% { color: var(--jv-mint); } 25%, 100% { color: var(--jv-ink-mute); } }

/* Stock levels */
.jv-mini__bars { display: grid; gap: 9px; }
.jv-mini__bars div { display: grid; grid-template-columns: 82px 1fr; align-items: center; gap: 10px; }
.jv-mini__bars span { font: 600 0.6875rem var(--jv-font-mono); color: var(--jv-ink-soft); }
.jv-mini__bars i {
    position: relative; height: 7px; border-radius: 4px; background: var(--jv-border-strong); overflow: hidden;
}
.jv-mini__bars i::before {
    content: ""; position: absolute; inset: 0; border-radius: inherit;
    background: linear-gradient(90deg, var(--jv-mint-strong), var(--jv-mint));
    transform-origin: left; animation: jvStock 6s var(--d, 0s) infinite;
}
@keyframes jvStock {
    0% { transform: scaleX(.95); background: var(--jv-mint-strong); }
    55% { transform: scaleX(.18); filter: hue-rotate(0); }
    62% { transform: scaleX(.18); background: #f59e0b; }
    80% { transform: scaleX(.18); }
    100% { transform: scaleX(.95); }
}

/* Mail pipeline */
.jv-mini__track { display: flex; align-items: center; gap: 8px; }
.jv-mini__track b {
    padding: 4px 9px; border: 1px solid var(--jv-border-strong); border-radius: 6px;
    font: 600 0.6875rem var(--jv-font-mono); color: var(--jv-navy); background: var(--jv-surface);
}
html.dark .jv-mini__track b { color: var(--jv-mint); }
.jv-mini__line { position: relative; flex: 1; height: 2px; background: var(--jv-border-strong); border-radius: 2px; }
.jv-mini__line u {
    position: absolute; top: -3px; left: 0; width: 8px; height: 8px; border-radius: 2px;
    background: var(--jv-mint-strong); opacity: 0; animation: jvPacket 3s linear infinite;
}
.jv-mini__line u:nth-child(2) { animation-delay: 1s; }
.jv-mini__line u:nth-child(3) { animation-delay: 2s; }
.jv-mini__line s {
    position: absolute; top: -3px; left: 50%; width: 8px; height: 8px; border-radius: 50%;
    background: #f59e0b; opacity: 0; animation: jvBounce 6s ease-in infinite;
}
@keyframes jvPacket { 0% { left: 0; opacity: 0; } 12% { opacity: 1; } 88% { opacity: 1; } 100% { left: calc(100% - 8px); opacity: 0; } }
@keyframes jvBounce { 0%, 45% { opacity: 0; transform: translateY(0); } 55% { opacity: 1; } 80% { opacity: 1; transform: translateY(14px); } 100% { opacity: 0; transform: translateY(14px); } }

@media (max-width: 720px) { .jv-mini { margin: 0 20px 20px; } .jv-mini__bars div { grid-template-columns: 74px 1fr; } }
@media (prefers-reduced-motion: reduce) {
    .jv-mini *, .jv-mini__steps em { animation: none !important; }
    .jv-mini__bars i::before { transform: scaleX(.7); }
    .jv-mini__line u { opacity: 1; left: 40%; }
}

/* ==========================================================================
   Laboratory workflow — guided tour (list + live stage view)
   ========================================================================== */
.jv-wf {
    padding: 26px clamp(18px, 3vw, 36px) 24px;
    border-color: rgba(144, 208, 186, 0.18);
    background:
        radial-gradient(620px 280px at 90% 0%, rgba(144, 208, 186, 0.18), transparent 70%),
        linear-gradient(150deg, #223266, #17234a 70%);
}
.jv-wf__head { display: flex; align-items: center; justify-content: space-between; gap: 14px; margin-bottom: 22px; }
.jv-wf__label { margin: 0; font-size: 0.6875rem; color: rgba(255, 255, 255, 0.72); }
.jv-wf__track { display: none; }
.jv-wf__toggle {
    padding: 5px 12px; border: 1px solid rgba(144, 208, 186, 0.35); border-radius: var(--jv-radius-pill);
    background: rgba(144, 208, 186, 0.08); color: var(--jv-mint); cursor: pointer;
    font: 600 0.6875rem var(--jv-font-mono); letter-spacing: .06em; text-transform: uppercase;
}
.jv-wf__toggle:hover { background: rgba(144, 208, 186, 0.18); }
.jv-wf__toggle:focus-visible, .jv-wf2__item:focus-visible { outline: 2px solid var(--jv-mint); outline-offset: 2px; }

.jv-wf2 { display: grid; grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr); gap: 24px; align-items: stretch; }
.jv-wf2__list { display: grid; gap: 8px; margin: 0; padding: 0; list-style: none; }
.jv-wf2__item {
    position: relative; display: grid; grid-template-columns: auto 1fr; align-items: center; gap: 14px; width: 100%;
    padding: 14px 16px 16px; border: 1px solid rgba(255, 255, 255, 0.1); border-radius: var(--jv-radius-md);
    background: rgba(255, 255, 255, 0.03); color: #fff; text-align: left; cursor: pointer; overflow: hidden;
    transition: background-color 300ms ease, border-color 300ms ease, transform 300ms var(--jv-ease);
}
.jv-wf2__item:hover { background: rgba(255, 255, 255, 0.06); }
.jv-wf2__num {
    display: grid; place-items: center; width: 34px; height: 34px; border-radius: 50%;
    border: 1px solid rgba(255, 255, 255, 0.25); font: 600 0.6875rem var(--jv-font-mono); color: rgba(255, 255, 255, 0.7);
    transition: all 300ms ease;
}
.jv-wf2__text strong { display: block; font: 700 0.9375rem var(--jv-font-display); }
.jv-wf2__text small {
    display: block; max-height: 0; opacity: 0; overflow: hidden; font-size: 0.8125rem; line-height: 1.5;
    color: rgba(255, 255, 255, 0.78); transition: max-height 400ms var(--jv-ease), opacity 300ms ease, margin 300ms ease;
}
.jv-wf2__item.is-active { background: rgba(144, 208, 186, 0.12); border-color: rgba(144, 208, 186, 0.45); transform: translateX(6px); }
.jv-wf2__item.is-active .jv-wf2__num { background: var(--jv-mint); border-color: var(--jv-mint); color: var(--jv-navy-ink); box-shadow: 0 0 0 5px rgba(144, 208, 186, 0.16); }
.jv-wf2__item.is-active small { max-height: 60px; opacity: 1; margin-top: 4px; }
.jv-wf2__item.is-done .jv-wf2__num { border-color: var(--jv-mint-strong); color: var(--jv-mint); }
.jv-wf2__bar { position: absolute; left: 0; right: 0; bottom: 0; height: 3px; background: transparent; }
.jv-wf2__bar i { display: block; height: 100%; width: 0; background: linear-gradient(90deg, var(--jv-mint-strong), var(--jv-mint)); }
.is-live .jv-wf2__item.is-active .jv-wf2__bar i { animation: jvWf2Bar 5.5s linear forwards; }
.is-live.is-paused .jv-wf2__item.is-active .jv-wf2__bar i,
.is-live .jv-wf2:hover .jv-wf2__item.is-active .jv-wf2__bar i { animation-play-state: paused; }
@keyframes jvWf2Bar { from { width: 0; } to { width: 100%; } }
.jv-wf:not(.is-live) .jv-wf2__item.is-active .jv-wf2__bar i { width: 100%; }

/* Stage view */
.jv-wf2__view {
    position: relative; min-height: 340px; padding: 24px; border: 1px solid rgba(144, 208, 186, 0.22);
    border-radius: var(--jv-radius-xl); background: rgba(8, 14, 36, 0.45); overflow: hidden;
}
.jv-wf2__view::before {
    content: ""; position: absolute; inset: 0; pointer-events: none;
    background: linear-gradient(rgba(144, 208, 186, 0.05) 1px, transparent 1px) 0 0 / 100% 28px;
}
.jv-wf2__dots { position: absolute; top: 24px; right: 24px; display: flex; gap: 6px; }
.jv-wf2__dots i { width: 22px; height: 4px; border-radius: 2px; background: rgba(255, 255, 255, 0.16); transition: background-color 400ms ease; }
.jv-wf2__dots i.is-on { background: var(--jv-mint); }
.jv-wf2__panel { position: absolute; inset: 24px; display: flex; flex-direction: column; opacity: 0; visibility: hidden; transform: translateY(10px); transition: opacity 350ms ease, transform 450ms var(--jv-ease), visibility 0s 350ms; }
.jv-wf2__panel.is-active { position: relative; inset: auto; opacity: 1; visibility: visible; transform: none; transition-delay: 0s; }
.jv-wf2__ph { display: flex; align-items: center; gap: 16px; margin: 6px 0 26px; }
.jv-wf2__icon {
    display: grid; place-items: center; width: 60px; height: 60px; border-radius: 16px;
    background: var(--jv-mint); color: var(--jv-navy-ink); box-shadow: 0 0 34px rgba(144, 208, 186, 0.4);
}
.jv-wf2__icon svg { width: 28px; height: 28px; }
.jv-wf2__ph .jv-mono { color: rgba(255, 255, 255, 0.65); }
.jv-wf2__ph h3 { margin-top: 2px; font-size: 1.5rem; color: #fff; }
.jv-wf2__rows { display: grid; gap: 10px; margin: 0; padding: 0; list-style: none; }
.jv-wf2__rows li {
    display: grid; grid-template-columns: 112px 1fr auto; align-items: center; gap: 14px; padding: 12px 14px;
    border-radius: 10px; background: rgba(255, 255, 255, 0.05); border: 1px solid rgba(255, 255, 255, 0.07);
    opacity: 0; transform: translateX(-12px);
}
.jv-wf2__panel.is-active .jv-wf2__rows li { opacity: 1; transform: none; transition: opacity 400ms ease calc(var(--i) * 280ms + 150ms), transform 500ms var(--jv-ease) calc(var(--i) * 280ms + 150ms); }
.jv-wf2__k { font: 600 0.75rem var(--jv-font-mono); color: rgba(255, 255, 255, 0.82); }
.jv-wf2__ln { height: 4px; border-radius: 3px; background: rgba(255, 255, 255, 0.12); overflow: hidden; }
.jv-wf2__ln i { display: block; height: 100%; width: 0; background: var(--jv-mint); border-radius: inherit; }
.jv-wf2__panel.is-active .jv-wf2__ln i { width: 100%; transition: width 700ms var(--jv-ease) calc(var(--i) * 280ms + 300ms); }
.jv-wf2__v em {
    display: inline-block; padding: 4px 10px; border-radius: 6px; font: 600 0.6875rem var(--jv-font-mono); font-style: normal;
    background: rgba(144, 208, 186, 0.16); color: var(--jv-mint); opacity: 0.35; transition: opacity 400ms ease calc(var(--i) * 280ms + 900ms);
}
.jv-wf2__panel.is-active .jv-wf2__v em { opacity: 1; }
.jv-wf2__next { margin-top: auto; padding-top: 20px; font: 600 0.75rem var(--jv-font-mono); letter-spacing: .06em; text-transform: uppercase; color: rgba(255, 255, 255, 0.7); }

.jv-wf__connected { margin-top: 22px; }
.jv-wf__connected .jv-mono { color: rgba(255, 255, 255, 0.68); }

@media (max-width: 900px) {
    .jv-wf2 { grid-template-columns: 1fr; }
    .jv-wf2__item.is-active { transform: none; }
    .jv-wf2__view { min-height: 320px; }
}
@media (max-width: 560px) {
    .jv-wf2__rows li { grid-template-columns: 1fr auto; }
    .jv-wf2__ln { display: none; }
    .jv-wf2__dots { display: none; }
}
@media (prefers-reduced-motion: reduce) {
    .jv-wf2 *, .jv-wf2__panel { transition: none !important; animation: none !important; }
    .jv-wf2__panel.is-active .jv-wf2__ln i { width: 100%; }
}

/* ==========================================================================
   Hero — 3-slide carousel
   ========================================================================== */
.jv-hero__texts, .jv-hero__slides { display: grid; }
.jv-hero__text, .jv-hero__slide {
    grid-area: 1 / 1; min-width: 0; opacity: 0; visibility: hidden;
    transition: opacity 500ms ease, transform 600ms var(--jv-ease), visibility 0s 500ms;
}
.jv-hero__text { transform: translateY(14px); }
.jv-hero__slide { transform: translateX(26px) scale(.985); }
.jv-hero__text.is-active, .jv-hero__slide.is-active { opacity: 1; visibility: visible; transform: none; transition-delay: 0s; }
.jv-hero__text .jv-hero__lead { margin-top: 24px; }

/* replay chart / meter animations when a slide becomes active */
.jv-hero__slide:not(.is-active) :is(.jv-chart-line, .jv-chart-area, .jv-chart-point, .jv-console__meter i) { animation: none; }
.jv-hero__slide:not(.is-active) .jv-net :is(.jv-net__node, .jv-net__hub, .jv-net__lines line) { animation: none; }

/* Controls */
.jv-hero__ctrl { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; margin-top: 28px; }
.jv-hero__arrow {
    display: grid; place-items: center; width: 38px; height: 38px; border: 1px solid var(--jv-border-strong);
    border-radius: 50%; background: var(--jv-surface); color: var(--jv-navy); cursor: pointer;
    transition: background-color 180ms ease, border-color 180ms ease, transform 180ms var(--jv-ease);
}
html.dark .jv-hero__arrow { color: var(--jv-mint); }
.jv-hero__arrow:hover { border-color: var(--jv-mint-strong); transform: scale(1.06); }
.jv-hero__arrow svg { width: 18px; height: 18px; }
.jv-hero__tabs { display: flex; gap: 6px; padding: 4px; border: 1px solid var(--jv-border); border-radius: var(--jv-radius-pill); background: var(--jv-glass); -webkit-backdrop-filter:blur(8px); backdrop-filter:blur(8px); }
.jv-hero__tabs button {
    position: relative; padding: 8px 16px; border: 0; border-radius: var(--jv-radius-pill); background: transparent;
    font: 700 0.8125rem var(--jv-font-display); color: var(--jv-ink-mute); cursor: pointer; overflow: hidden;
    transition: color 200ms ease, background-color 200ms ease;
}
.jv-hero__tabs button:hover { color: var(--jv-ink); }
.jv-hero__tabs button.is-active { background: var(--jv-navy); color: #fff; }
html.dark .jv-hero__tabs button.is-active { background: var(--jv-mint); color: var(--jv-navy-ink); }
.jv-hero__tabs button span { position: relative; z-index: 1; }
.jv-hero__tabs button i { position: absolute; left: 0; bottom: 0; height: 3px; width: 0; background: var(--jv-mint); }
html.dark .jv-hero__tabs button i { background: var(--jv-navy); }
.jv-hero.is-live .jv-hero__tabs button.is-active i { animation: jvHeroBar 7s linear forwards; }
.jv-hero.is-live.is-paused .jv-hero__tabs button.is-active i,
.jv-hero.is-live .jv-hero__inner:hover .jv-hero__tabs button.is-active i { animation-play-state: paused; }
@keyframes jvHeroBar { from { width: 0; } to { width: 100%; } }
.jv-hero__pause {
    padding: 7px 14px; border: 1px solid var(--jv-border-strong); border-radius: var(--jv-radius-pill); background: transparent;
    font: 600 0.6875rem var(--jv-font-mono); letter-spacing: .06em; text-transform: uppercase; color: var(--jv-ink-mute); cursor: pointer;
}
.jv-hero__pause:hover { color: var(--jv-ink); border-color: var(--jv-mint-strong); }
.jv-hero__ctrl button:focus-visible { outline: 2px solid var(--jv-mint-strong); outline-offset: 2px; }

/* Slide 1 — network */
.jv-net { padding: 14px 16px 16px; background: linear-gradient(180deg, #fbfcfe, #f3f6fa); }
.jv-net__stage { position: relative; aspect-ratio: 16 / 11; }
.jv-net__lines { position: absolute; inset: 0; width: 100%; height: 100%; }
.jv-net__lines line {
    stroke: #263773; stroke-opacity: .28; stroke-width: 1.4; stroke-dasharray: 3 5; vector-effect: non-scaling-stroke;
    animation: jvNetFlow 1.4s linear infinite; animation-delay: calc(var(--i) * -.2s);
}
@keyframes jvNetFlow { to { stroke-dashoffset: -16; } }
.jv-net__hub {
    position: absolute; left: 50%; top: 50%; z-index: 2; display: grid; justify-items: center; gap: 2px; translate: -50% -50%;
    width: 86px; height: 86px; align-content: center; border-radius: 50%;
    background: linear-gradient(150deg, #263773, #17234a); color: #fff;
    box-shadow: 0 0 0 8px rgba(38, 55, 115, .08), 0 14px 30px -10px rgba(38, 55, 115, .6);
    animation: jvHubPulse 3.2s ease-out infinite;
}
.jv-net__hub b { font: 800 1.5rem var(--jv-font-display); line-height: 1; color: var(--jv-mint); }
.jv-net__hub small { font: 600 .625rem var(--jv-font-mono); letter-spacing: .05em; text-transform: uppercase; color: rgba(255,255,255,.85); }
@keyframes jvHubPulse { 0% { box-shadow: 0 0 0 0 rgba(144,208,186,.55), 0 14px 30px -10px rgba(38,55,115,.6); } 100% { box-shadow: 0 0 0 26px rgba(144,208,186,0), 0 14px 30px -10px rgba(38,55,115,.6); } }
.jv-net__node {
    position: absolute; z-index: 2; display: inline-flex; align-items: center; gap: 6px; translate: -50% -50%;
    padding: 6px 10px 6px 7px; border: 1px solid #dfe5ef; border-radius: 999px; background: #fff; white-space: nowrap;
    box-shadow: 0 8px 18px -10px rgba(38, 55, 115, .4); color: #1b2033;
    animation: jvNodeIn 600ms var(--jv-ease) both; animation-delay: calc(var(--i) * 90ms + 150ms);
}
.jv-net__node svg { width: 22px; height: 22px; padding: 4px; border-radius: 50%; background: #eef8f4; color: #263773; flex: none; }
.jv-net__node b { font: 700 .75rem var(--jv-font-display); }
.jv-net__node.is-featured { border-color: #6bbf9f; background: #263773; color: #fff; }
.jv-net__node.is-featured svg { background: #90d0ba; color: #0e1838; }
@keyframes jvNodeIn { from { opacity: 0; scale: .7; } to { opacity: 1; scale: 1; } }
.jv-net__tags { display: flex; flex-wrap: wrap; gap: 6px; padding-top: 12px; border-top: 1px solid #e8ebf2; }
.jv-net__tags span { padding: 4px 10px; border-radius: 6px; background: #eef8f4; font: 600 .6875rem var(--jv-font-mono); color: #047857; }

/* Slide 3 */
.jv-console__kpis--words strong { font-size: .75rem; }
.jv-console__kpis--words span { font-size: .5rem; }

@media (max-width: 1080px) { .jv-hero__slide { transform: translateY(16px); } }
@media (max-width: 560px) {
    .jv-hero__tabs button { padding: 7px 10px; font-size: .75rem; }
    .jv-net__node b { font-size: .625rem; }
    .jv-net__node svg { width: 18px; height: 18px; padding: 3px; }
    .jv-net__hub { width: 68px; height: 68px; }
    .jv-hero__pause { display: none; }
}
@media (prefers-reduced-motion: reduce) {
    .jv-hero__text, .jv-hero__slide { transition: none; }
    .jv-net *, .jv-net__hub { animation: none !important; }
    .jv-hero__tabs button.is-active i { width: 100%; }
}
.jv-hero:not(.is-live) .jv-hero__tabs button.is-active i { width: 100%; }

/* ==========================================================================
   Hero — polish pass
   ========================================================================== */
/* staggered text entrance */
.jv-hero__text h1, .jv-hero__text .jv-hero__lead { opacity: 0; transform: translateY(18px); }
.jv-hero__text.is-active h1 { opacity: 1; transform: none; transition: opacity 600ms ease 120ms, transform 800ms var(--jv-ease) 120ms; }
.jv-hero__text.is-active .jv-hero__lead { opacity: 1; transform: none; transition: opacity 600ms ease 280ms, transform 800ms var(--jv-ease) 280ms; }

/* animated gradient on key phrase */
.jv-hero__text .jv-grad {
    background-size: 220% 100%;
    animation: jvGradSlide 7s ease-in-out infinite alternate;
}
@keyframes jvGradSlide { from { background-position: 0% 50%; } to { background-position: 100% 50%; } }

/* ambient halo shifts per slide */
.jv-hero::before {
    content: ""; position: absolute; inset: 0; z-index: 0; pointer-events: none;
    background: radial-gradient(640px 420px at 78% 40%, rgba(144, 208, 186, .22), transparent 70%);
    transition: background 900ms ease, opacity 900ms ease;
}
.jv-hero[data-slide="1"]::before { background: radial-gradient(640px 420px at 78% 40%, rgba(107, 191, 159, .3), transparent 70%); }
.jv-hero[data-slide="2"]::before { background: radial-gradient(640px 420px at 78% 40%, rgba(38, 55, 115, .2), transparent 70%); }
html.dark .jv-hero[data-slide="2"]::before { background: radial-gradient(640px 420px at 78% 40%, rgba(99, 120, 220, .22), transparent 70%); }

/* console: shine sweep + floating badges when a slide enters */
.jv-hero__slide .jv-console::after {
    content: ""; position: absolute; inset: 0; pointer-events: none; z-index: 5;
    background: linear-gradient(105deg, transparent 35%, rgba(255, 255, 255, .55) 50%, transparent 65%);
    transform: translateX(-120%);
}
.jv-hero__slide.is-active .jv-console::after { animation: jvShine 1.4s ease 350ms 1 both; }
@keyframes jvShine { to { transform: translateX(120%); } }

.jv-hero__slide.is-active .jv-float { animation: jvFloatIn 700ms var(--jv-ease) 500ms both, jvBob 5s ease-in-out 1.2s infinite alternate; }
.jv-hero__slide.is-active .jv-float--team { animation-delay: 650ms, 1.6s; }
@keyframes jvFloatIn { from { opacity: 0; scale: .85; } to { opacity: 1; scale: 1; } }
@keyframes jvBob { from { transform: translateY(0); } to { transform: translateY(-7px); } }

/* network: data packets travelling hub -> industry */
.jv-net__packet {
    position: absolute; z-index: 1; width: 7px; height: 7px; margin: -3.5px 0 0 -3.5px; border-radius: 50%;
    background: #6bbf9f; box-shadow: 0 0 0 3px rgba(107, 191, 159, .22), 0 0 12px rgba(107, 191, 159, .9);
    left: 50%; top: 50%; opacity: 0;
    animation: jvPacketGo 3.6s cubic-bezier(.5, 0, .5, 1) infinite; animation-delay: calc(var(--i) * .5s + .8s);
}
@keyframes jvPacketGo {
    0% { left: 50%; top: 50%; opacity: 0; transform: scale(.6); }
    12% { opacity: 1; transform: scale(1); }
    62% { left: var(--x); top: var(--y); opacity: 1; }
    72%, 100% { left: var(--x); top: var(--y); opacity: 0; transform: scale(1.8); }
}
.jv-hero__slide:not(.is-active) .jv-net__packet { animation: none; }
.jv-net__node:hover { scale: 1.06; transition: scale 200ms var(--jv-ease); }
.jv-net__node.is-featured { box-shadow: 0 0 0 4px rgba(144, 208, 186, .25), 0 10px 22px -10px rgba(38, 55, 115, .6); }

/* controls feel */
.jv-hero__tabs button.is-active { box-shadow: 0 6px 14px -6px rgba(38, 55, 115, .55); }
.jv-hero__ctrl { margin-top: 32px; }

@media (prefers-reduced-motion: reduce) {
    .jv-hero__text h1, .jv-hero__text .jv-hero__lead { opacity: 1; transform: none; transition: none; }
    .jv-hero__text .jv-grad, .jv-hero__slide .jv-float, .jv-net__packet, .jv-hero__slide.is-active .jv-console::after { animation: none !important; }
}

/* ==========================================================================
   Hero — layout fixes from review
   ========================================================================== */
.jv-hero { padding: 52px 0 72px; }
.jv-hero__inner { grid-template-columns: minmax(0, 1fr) minmax(0, 1.08fr); gap: 36px; }
.jv-hero__copy .jv-hero__text h1 {
    max-width: 600px;
    font-size: clamp(2.5rem, 4.1vw, 3.75rem);
    line-height: 1.06;
    letter-spacing: -0.025em;
}
.jv-hero__text .jv-hero__lead { margin-top: 20px; font-size: 1.0625rem; }
.jv-hero__copy .jv-pill { margin-bottom: 4px; }

/* readable gradient (no pale mint end), static */
.jv-hero__text .jv-grad {
    background: linear-gradient(100deg, var(--jv-navy) 0%, #2f5c94 60%, #3d8a86 100%);
    -webkit-background-clip: text; background-clip: text; animation: none; background-size: 100% 100%;
}
html.dark .jv-hero__text .jv-grad {
    background: linear-gradient(100deg, var(--jv-mint) 0%, #8fb6e0 60%, #c7b8f0 100%);
    -webkit-background-clip: text; background-clip: text;
}

/* bigger visual, readable dashboard text */
.jv-console-wrap { max-width: 700px; }
.jv-console { transform: perspective(1800px) rotateY(-3deg) rotateX(1.5deg); }
.jv-console__kpis span, .jv-console__kpis em { font-size: 0.5625rem; }
.jv-console__kpis strong { font-size: 1rem; }
.jv-console__kpis--words strong { font-size: .8125rem; }
.jv-console__kpis--words span, .jv-console__kpis--words em { font-size: .5625rem; }
.jv-console__eyebrow, .jv-console__date, .jv-console__url, .jv-console__live { font-size: .625rem; }
.jv-console__head strong { font-size: 1rem; }
.jv-console__chart-head span, .jv-console__axis span { font-size: .625rem; }
.jv-console__row-label, .jv-console__row-value { font-size: .6875rem; }

/* floating badges sit outside the dashboard, never on top of its content */
.jv-hero__slide .jv-float--uptime { top: -4%; right: -3%; }
.jv-hero__slide .jv-float--team { bottom: -7%; left: -5%; }
.jv-hero__slide .jv-console-caption { margin-top: 38px; }

@media (max-width: 1180px) {
    .jv-hero__copy .jv-hero__text h1 { font-size: clamp(2.4rem, 4.6vw, 3.25rem); }
}
@media (max-width: 1080px) {
    .jv-hero__inner { grid-template-columns: 1fr; }
    .jv-console-wrap { margin: 0 auto; }
    .jv-hero__slide .jv-float--team { left: 0; }
    .jv-hero__slide .jv-float--uptime { right: 0; }
}

/* ==========================================================================
   Transparent header over hero (solid glass once scrolled)
   ========================================================================== */
.jv-header:not(.is-scrolled) {
    background: transparent;
    -webkit-backdrop-filter: none;
    -webkit-backdrop-filter:none;
    backdrop-filter:none;
    border-bottom-color: transparent;
    box-shadow: none;
}
/* keep a solid background while a menu is open */
.jv-header:not(.is-scrolled):has([aria-expanded="true"]) {
    background: var(--jv-glass);
    -webkit-backdrop-filter: blur(18px);
    -webkit-backdrop-filter:blur(18px);
    backdrop-filter:blur(18px);
}

/* hero slides up underneath the header */
.jv-hero {
    margin-top: calc(var(--jv-header-h) * -1);
    padding-top: calc(var(--jv-header-h) + 56px);
    background:
        radial-gradient(900px 520px at 82% 18%, rgba(144, 208, 186, 0.30), transparent 70%),
        radial-gradient(760px 480px at 6% 4%, rgba(38, 55, 115, 0.10), transparent 70%),
        radial-gradient(600px 360px at 50% 100%, rgba(144, 208, 186, 0.12), transparent 70%),
        linear-gradient(180deg, #f3f7fb 0%, var(--jv-canvas) 78%);
}
html.dark .jv-hero {
    background:
        radial-gradient(900px 520px at 82% 18%, rgba(144, 208, 186, 0.16), transparent 70%),
        radial-gradient(760px 480px at 6% 4%, rgba(99, 120, 220, 0.16), transparent 70%),
        radial-gradient(600px 360px at 50% 100%, rgba(144, 208, 186, 0.06), transparent 70%),
        linear-gradient(180deg, #0d1628 0%, var(--jv-canvas) 78%);
}
/* mesh grid reaches the top edge, fading out downward */
.jv-hero__mesh {
    opacity: 0.35;
    -webkit-mask-image: radial-gradient(ellipse 90% 75% at 62% 20%, #000 8%, transparent 72%);
    mask-image: radial-gradient(ellipse 90% 75% at 62% 20%, #000 8%, transparent 72%);
}
@media (max-width: 720px) {
    .jv-hero { padding-top: calc(var(--jv-header-h) + 36px); }
}

/* ==========================================================================
   Security (light) + CTA (dark, overlaps footer)
   ========================================================================== */
.jv-security {
    gap: 56px; padding: clamp(28px, 4vw, 56px);
    border: 1px solid var(--jv-border);
    background:
        radial-gradient(520px 300px at 100% 0%, rgba(144, 208, 186, 0.28), transparent 70%),
        radial-gradient(420px 260px at 0% 100%, rgba(38, 55, 115, 0.07), transparent 70%),
        linear-gradient(140deg, var(--jv-mint-soft), var(--jv-canvas-soft));
    color: var(--jv-ink);
    box-shadow: var(--jv-shadow-md);
}
.jv-security__glow { border-color: rgba(38, 55, 115, 0.1); right: -90px; bottom: -130px; width: 380px; height: 380px; }
.jv-security__glow::after { content: ""; position: absolute; inset: 44px; border: 1px solid rgba(38, 55, 115, 0.08); border-radius: 50%; }
.jv-security h2 { color: var(--jv-ink); }
.jv-security p { color: var(--jv-ink-soft); font-size: 1rem; }
.jv-security__badges { gap: 14px; }
.jv-security__badge {
    align-items: flex-start; gap: 14px; padding: 18px;
    border: 1px solid var(--jv-border); border-radius: var(--jv-radius-lg);
    background: var(--jv-surface); color: var(--jv-ink);
    box-shadow: 0 10px 24px -18px rgba(38, 55, 115, .35);
    transition: transform 240ms var(--jv-ease), box-shadow 240ms ease, border-color 240ms ease;
}
.jv-security__badge:hover { transform: translateY(-3px); border-color: var(--jv-mint-strong); box-shadow: 0 18px 34px -18px rgba(38, 55, 115, .4); }
.jv-security__icon {
    display: grid; place-items: center; flex: none; width: 40px; height: 40px; border-radius: 12px;
    background: var(--jv-navy); color: var(--jv-mint);
}
html.dark .jv-security__icon { background: var(--jv-mint); color: var(--jv-navy-ink); }
.jv-security__badge svg { width: 20px; height: 20px; color: inherit; }
.jv-security__text strong { display: block; font: 700 0.9375rem/1.25 var(--jv-font-display); color: var(--jv-ink); }
.jv-security__text small { display: block; margin-top: 4px; font-size: 0.8125rem; line-height: 1.4; color: var(--jv-ink-mute); }

/* CTA — split layout, overlaps footer */
.jv-cta-section { position: relative; z-index: 2; padding-bottom: 0; }
.jv-cta {
    display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr); align-items: center; gap: 48px;
    margin-bottom: -88px; padding: clamp(32px, 5vw, 64px); text-align: left;
    background:
        radial-gradient(560px 320px at 100% 0%, rgba(144, 208, 186, 0.28), transparent 65%),
        radial-gradient(420px 260px at 0% 100%, rgba(107, 191, 159, 0.12), transparent 70%),
        linear-gradient(145deg, #2a3d80, #17234a 70%);
    box-shadow: 0 40px 70px -30px rgba(14, 24, 56, .65), inset 0 1px 0 rgba(255, 255, 255, .08);
}
.jv-cta__glow { top: -180px; left: auto; right: -120px; transform: none; width: 480px; height: 480px; }
.jv-cta__main { position: relative; z-index: 1; }
.jv-cta__main h2 { margin-top: 14px; font-size: clamp(2rem, 3.6vw, 3.1rem); line-height: 1.08; }
.jv-cta__main p { max-width: 520px; margin: 16px 0 0; font-size: 1rem; color: rgba(255, 255, 255, .78); }
.jv-cta__note { justify-content: flex-start; margin: 24px 0 0; padding: 0; list-style: none; font-size: .8125rem; color: rgba(255, 255, 255, .72); }
.jv-cta__note li { display: inline-flex; align-items: center; gap: 7px; }
.jv-cta__note svg { width: 14px; height: 14px; }
.jv-cta__panel {
    position: relative; z-index: 1; display: grid; gap: 12px; padding: 24px;
    border: 1px solid rgba(144, 208, 186, .28); border-radius: var(--jv-radius-xl);
    background: rgba(8, 14, 36, .38); -webkit-backdrop-filter:blur(8px); backdrop-filter:blur(8px);
}
.jv-cta__panel .jv-btn { justify-content: center; width: 100%; }
.jv-cta__contact { display: grid; gap: 4px; margin-top: 8px; padding-top: 16px; border-top: 1px solid rgba(255, 255, 255, .14); }
.jv-cta__contact a { display: flex; align-items: center; gap: 10px; padding: 8px 4px; font: 600 .875rem var(--jv-font-display); color: rgba(255, 255, 255, .88); transition: color 180ms ease; }
.jv-cta__contact a:hover { color: var(--jv-mint); }
.jv-cta__contact svg { width: 18px; height: 18px; color: var(--jv-mint); flex: none; }
.jv-footer { padding-top: 88px; }

@media (max-width: 900px) {
    .jv-cta { grid-template-columns: 1fr; gap: 28px; margin-bottom: -64px; }
    .jv-footer { padding-top: 64px; }
}

/* CTA separated from footer (no overlap) */
.jv-cta-section { padding-bottom: clamp(56px, 7vw, 96px); }
.jv-cta { margin-bottom: 0; }
.jv-footer { padding-top: 0; }
@media (max-width: 900px) {
    .jv-cta { margin-bottom: 0; }
    .jv-footer { padding-top: 0; }
}

/* Pixel blocks — final section only */
.jv-cta-section { padding-top: 64px; overflow: visible; }
.jv-pxfield {
    position: absolute; inset: 0; z-index: 0; pointer-events: none;
    -webkit-mask-image: linear-gradient(180deg, transparent 0%, #000 22%, #000 100%);
    mask-image: linear-gradient(180deg, transparent 0%, #000 22%, #000 100%);
}
.jv-cta-section > .jv-wrap { position: relative; z-index: 1; }

/* ==========================================================================
   Problem cards — before/after visuals
   ========================================================================== */
.jv-problems { gap: 24px; }
.jv-problem {
    padding: 14px 14px 24px; border-radius: var(--jv-radius-xl); overflow: hidden;
    transition: transform 260ms var(--jv-ease), box-shadow 260ms ease, border-color 260ms ease;
}
.jv-problem::before {
    content: ""; position: absolute; top: 0; left: 0; right: 0; height: 3px; z-index: 2;
    background: linear-gradient(90deg, #f59e0b, var(--jv-mint-strong)); transform: scaleX(0); transform-origin: left;
    transition: transform 500ms var(--jv-ease);
}
.jv-problem:hover { transform: translateY(-4px); border-color: var(--jv-border-strong); box-shadow: var(--jv-shadow-lg); }
.jv-problem:hover::before { transform: scaleX(1); }
.jv-problem > :not(.jv-pv) { margin-left: 14px; margin-right: 14px; }

.jv-pv {
    position: relative; display: flex; align-items: center; justify-content: center; gap: 12px;
    height: 168px; margin-bottom: 22px; padding: 14px 14px 36px; border-radius: var(--jv-radius-lg);
    background:
        linear-gradient(rgba(38, 55, 115, .05) 1px, transparent 1px) 0 0 / 100% 18px,
        linear-gradient(90deg, rgba(38, 55, 115, .05) 1px, transparent 1px) 0 0 / 18px 100%,
        var(--jv-canvas-soft);
    border: 1px solid var(--jv-border); overflow: hidden;
}
html.dark .jv-pv {
    background:
        linear-gradient(rgba(144, 208, 186, .06) 1px, transparent 1px) 0 0 / 100% 18px,
        linear-gradient(90deg, rgba(144, 208, 186, .06) 1px, transparent 1px) 0 0 / 18px 100%,
        rgba(8, 14, 36, .4);
}
.jv-pv__cap { position: absolute; left: 14px; bottom: 10px; display: grid; font: 600 .6875rem var(--jv-font-mono); letter-spacing: .06em; text-transform: uppercase; }
.jv-pv__cap u { grid-area: 1 / 1; text-decoration: none; }
.jv-pv__cap u:first-child { color: #b45309; animation: jvPvA 7s ease-in-out infinite; }
.jv-pv__cap u:last-child { color: #047857; animation: jvPvB 7s ease-in-out infinite; }
html.dark .jv-pv__cap u:first-child { color: #fbbf24; }
html.dark .jv-pv__cap u:last-child { color: var(--jv-mint); }
@keyframes jvPvA { 0%, 38% { opacity: 1; } 50%, 90% { opacity: 0; } 100% { opacity: 1; } }
@keyframes jvPvB { 0%, 38% { opacity: 0; } 50%, 90% { opacity: 1; } 100% { opacity: 0; } }

/* intake */
.jv-pv__sheet { display: grid; gap: 7px; width: 76px; padding: 12px 10px; border-radius: 6px; background: #fff; box-shadow: 0 8px 18px -10px rgba(38, 55, 115, .5); transform: rotate(-4deg); animation: jvWobble 3.2s ease-in-out infinite; }
.jv-pv__sheet i { display: block; height: 4px; border-radius: 3px; background: #f3b95f; }
.jv-pv__sheet i:nth-child(2) { width: 70%; } .jv-pv__sheet i:nth-child(3) { width: 90%; } .jv-pv__sheet i:nth-child(4) { width: 55%; }
@keyframes jvWobble { 0%, 100% { transform: rotate(-4deg); } 50% { transform: rotate(-1deg) translateY(-2px); } }
.jv-pv__flow { width: 34px; height: 12px; color: var(--jv-ink-mute); }
.jv-pv__form { display: grid; gap: 8px; width: 118px; }
.jv-pv__form > div { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 7px 9px; border-radius: 7px; background: var(--jv-surface); border: 1px solid var(--jv-border); }
.jv-pv__form b { height: 4px; width: 56%; border-radius: 3px; background: var(--jv-border-strong); }
.jv-pv__form em { position: relative; width: 16px; height: 16px; border-radius: 50%; flex: none; }
.jv-pv__form em::before, .jv-pv__form em::after { position: absolute; inset: 0; display: grid; place-items: center; border-radius: 50%; font: 800 .625rem/1 var(--jv-font-mono); font-style: normal; }
.jv-pv__form em::before { content: "!"; background: #fef3c7; color: #b45309; animation: jvPvA 7s ease-in-out infinite; }
.jv-pv__form em::after { content: "✓"; background: #d1fae5; color: #047857; animation: jvPvB 7s ease-in-out infinite; }
.jv-pv__form > div:nth-child(2) em::before, .jv-pv__form > div:nth-child(2) em::after { animation-delay: .25s; }
.jv-pv__form > div:nth-child(3) em::before, .jv-pv__form > div:nth-child(3) em::after { animation-delay: .5s; }

/* svg visuals */
.jv-pv__svg { width: 100%; max-width: 300px; height: 100%; }
.jv-pv__nodes rect { fill: var(--jv-surface); stroke: var(--jv-border-strong); stroke-width: 1.2; }
.jv-pv__nodes text { fill: var(--jv-ink-soft); }
.jv-pv--silo .jv-pv__bad { animation: jvPvA 7s ease-in-out infinite; }
.jv-pv--silo .jv-pv__good, .jv-pv--ops .jv-pv__good { animation: jvPvB 7s ease-in-out infinite; }
.jv-pv__dash { animation: jvDashMove 1.2s linear infinite; }
@keyframes jvDashMove { to { stroke-dashoffset: -28; } }
.jv-pv--ops .jv-pv__bad { fill: #cbd5e1; filter: blur(1.6px); animation: jvPvA 7s ease-in-out infinite; }
html.dark .jv-pv--ops .jv-pv__bad { fill: #475569; }
.jv-pv--ops .jv-pv__bad text { filter: none; }
.jv-pv--ops .jv-pv__good rect { fill: #90d0ba; transform-box: fill-box; transform-origin: bottom; animation: jvBarUp 7s ease-in-out infinite; animation-delay: calc(var(--i) * 90ms); }
@keyframes jvBarUp { 0%, 38% { transform: scaleY(.1); } 56%, 90% { transform: scaleY(1); } 100% { transform: scaleY(.1); } }
html.dark .jv-pv--silo .jv-pv__good circle { fill: #0e1838; }
html.dark .jv-pv--ops polyline { stroke: #c7e8dc; }

/* head, divider, solution */
.jv-problem__head { display: flex; align-items: baseline; gap: 12px; }
.jv-problem__head h3 { margin: 0; font-size: 1.375rem; }
.jv-problem__head .jv-mono { padding: 3px 8px; border-radius: 6px; background: var(--jv-mint-soft); }
.jv-problem__pain { margin-top: 12px; font-size: .9375rem; line-height: 1.65; color: var(--jv-ink-soft); }
.jv-problem__fix { margin-top: auto; padding-top: 22px; }
.jv-problem__arrow { display: flex; align-items: center; gap: 10px; margin: 0 0 14px; }
.jv-problem__arrow span { flex: 1; height: 1px; background: linear-gradient(90deg, var(--jv-border-strong), transparent); }
.jv-problem__arrow span:last-child { background: linear-gradient(270deg, var(--jv-border-strong), transparent); }
.jv-problem__arrow b { padding: 4px 12px; border-radius: var(--jv-radius-pill); background: var(--jv-navy); color: #fff; font: 700 .6875rem var(--jv-font-mono); letter-spacing: .06em; text-transform: uppercase; }
html.dark .jv-problem__arrow b { background: var(--jv-mint); color: var(--jv-navy-ink); }
.jv-problem .jv-problem__solution {
    margin-top: 0; padding: 14px 16px; border: 1px solid rgba(107, 191, 159, .4); border-radius: var(--jv-radius-md);
    background: var(--jv-mint-soft); font-size: .875rem; line-height: 1.6; color: var(--jv-ink);
}
.jv-problem__solution svg { width: 16px; height: 16px; margin-top: 4px; color: #047857; }
html.dark .jv-problem__solution svg { color: var(--jv-mint); }

@media (max-width: 1080px) { .jv-pv { height: 150px; } }
@media (prefers-reduced-motion: reduce) {
    .jv-pv *, .jv-pv::before { animation: none !important; }
    .jv-pv__cap u:first-child, .jv-pv--silo .jv-pv__bad, .jv-pv--ops .jv-pv__bad, .jv-pv__form em::before { opacity: 0; }
    .jv-pv--ops .jv-pv__good rect { transform: none; }
}

/* hero titles: only the first slide is an <h1>; others are paragraphs styled identically */
.jv-hero__text p.jv-hero__title {
    margin: 22px 0 0; max-width: 600px;
    font-family: var(--jv-font-display); font-weight: 800; color: var(--jv-ink); text-wrap: balance;
    font-size: clamp(2.5rem, 4.1vw, 3.75rem); line-height: 1.06; letter-spacing: -0.025em;
    opacity: 0; transform: translateY(18px);
}
.jv-hero__text.is-active p.jv-hero__title { opacity: 1; transform: none; transition: opacity 600ms ease 120ms, transform 800ms var(--jv-ease) 120ms; }
@media (max-width: 1180px) { .jv-hero__text p.jv-hero__title { font-size: clamp(2.4rem, 4.6vw, 3.25rem); } }
@media (prefers-reduced-motion: reduce) { .jv-hero__text p.jv-hero__title { opacity: 1; transform: none; transition: none; } }

/* Mobile hero controls: tabs on one clean row */
@media (max-width:520px){
    .jv-hero__arrow{display:none}
    .jv-hero__tabs{flex:1 1 100%;justify-content:space-between}
    .jv-hero__tabs button{flex:1;padding-inline:8px;font-size:.78rem}
}
