.isva {
    --isva-panel: #e9f1fd;
    --isva-line: #d3e0f5;
    --isva-ink: #16294d;
    --isva-soft: #44597f;
    --isva-accent: #2a6fdb;
    --isva-accent-deep: #1d56b5;
    --isva-agent: #1f8f50;
    --isva-card: #ffffff;
    font-family: inherit;
    color: var(--isva-ink);
    background: var(--isva-panel);
    border-radius: 18px;
    padding: 44px 48px;
    display: grid;
    grid-template-columns: minmax(0,1.08fr) minmax(0,.92fr);
    gap: 48px;
    align-items: center
}

    .isva *, .isva *:before, .isva *:after {
        box-sizing: border-box
    }

.isva-new {
    display: inline-block;
    font-size: 13px;
    font-weight: 600;
    line-height: 1;
    color: #fff;
    background: var(--isva-accent);
    border-radius: 999px;
    padding: 6px 11px
}

.isva-title {
    margin: 14px 0 0;
    font-size: clamp(26px,2.6vw,34px);
    line-height: 1.18;
    font-weight: 700;
    letter-spacing: -.01em;
    color: var(--isva-ink);
    max-width: 24ch
}

.isva-lede {
    margin: 14px 0 0;
    font-size: 17px;
    line-height: 1.6;
    color: var(--isva-soft);
    max-width: 36em
}

.isva-gains {
    list-style: none;
    margin: 26px 0 0;
    padding: 0;
    display: grid;
    gap: 18px
}

.isva-gain {
    display: grid;
    grid-template-columns: 40px minmax(0,1fr);
    gap: 14px;
    align-items: start
}

.isva-gain-icon {
    width: 40px;
    height: 40px;
    border-radius: 10px;
    background: var(--isva-card);
    display: grid;
    place-items: center;
    color: var(--isva-accent);
    border: 1px solid var(--isva-line)
}

    .isva-gain-icon svg {
        width: 21px;
        height: 21px
    }

.isva-gain h3 {
    margin: 0;
    font-weight: 700;
    font-size: 16.5px;
    line-height: 1.35;
    color: var(--isva-ink)
}

.isva-gain p {
    margin: 4px 0 0;
    font-size: 15.5px;
    line-height: 1.55;
    color: var(--isva-soft)
}

.isva-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 28px
}

.isva-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font: inherit;
    font-size: 15.5px;
    font-weight: 600;
    line-height: 1;
    padding: 13px 20px;
    border-radius: 8px;
    text-decoration: none;
    border: 1.5px solid transparent
}

.isva-btn-main {
    background: var(--isva-accent);
    color: #fff
}

    .isva-btn-main:hover {
        background: var(--isva-accent-deep);
        color: #fff
    }

.isva-btn:focus-visible {
    outline: 3px solid var(--isva-accent);
    outline-offset: 3px
}

.isva-note {
    margin: 14px 0 0;
    font-size: 14px;
    color: var(--isva-soft)
}

.isva-card {
    background: var(--isva-card);
    border-radius: 14px;
    padding: 22px 24px;
    border: 1px solid var(--isva-line)
}

.isva-card-label {
    font-size: 13px;
    font-weight: 600;
    color: var(--isva-soft);
    margin: 0 0 10px
}

.isva-queue {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    padding-bottom: 18px;
    border-bottom: 1px solid var(--isva-line)
}

.isva-member {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 14px;
    padding: 5px 12px 5px 5px;
    border-radius: 999px;
    background: #f2f6fd;
    border: 1px solid var(--isva-line)
}

.isva-avatar {
    width: 26px;
    height: 26px;
    border-radius: 50%;
    display: grid;
    place-items: center;
    font-size: 11.5px;
    font-weight: 700;
    color: #fff;
    background: #7b8db0
}

.isva-member-bot {
    background: #eef4ff;
    border-color: #9dbbea;
    color: var(--isva-accent-deep);
    font-weight: 600
}

    .isva-member-bot .isva-avatar {
        background: var(--isva-accent)
    }

.isva-avatar svg {
    width: 15px;
    height: 15px
}

.isva-steps {
    list-style: none;
    margin: 16px 0 0;
    padding: 0 0 16px;
    border-bottom: 1px solid var(--isva-line)
}

.isva-step {
    display: grid;
    grid-template-columns: 22px minmax(0,1fr);
    gap: 10px;
    align-items: center;
    font-size: 15px;
    padding: 5px 0;
    position: relative
}

    .isva-step svg {
        width: 18px;
        height: 18px;
        color: var(--isva-soft)
    }

.isva-step-bot svg {
    color: var(--isva-accent)
}

.isva-step-agent svg {
    color: var(--isva-agent)
}

.isva-step-bot {
    font-weight: 600;
    color: var(--isva-accent-deep)
}

.isva-data {
    margin-top: 16px
}

.isva-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 6px
}

    .isva-chips span {
        font-size: 13.5px;
        padding: 4px 10px;
        border-radius: 6px;
        background: #f2f6fd;
        border: 1px solid var(--isva-line);
        color: var(--isva-ink)
    }

@media(max-width:960px) {
    .isva {
        grid-template-columns: minmax(0,1fr);
        padding: 34px 28px;
        gap: 32px
    }
}

@media(max-width:560px) {
    .isva {
        padding: 28px 20px;
        border-radius: 14px
    }

    .isva-card {
        padding: 18px
    }

    .isva-btn {
        flex: 1 1 auto
    }
}


/* Respect the site's Bootstrap color-mode switch. */
html[data-bs-theme="dark"] .isva {
    --isva-panel: #171f2d;
    --isva-line: #35445b;
    --isva-ink: #f0f4fb;
    --isva-soft: #c0ccdd;
    --isva-accent: #78aaff;
    --isva-accent-deep: #a2c4ff;
    --isva-card: #202b3b;
    color: var(--isva-ink);
    border: 1px solid #35445b;
}
html[data-bs-theme="dark"] .isva-title,
html[data-bs-theme="dark"] .isva-gain h3,
html[data-bs-theme="dark"] .isva-chips span {
    color: var(--isva-ink);
}
html[data-bs-theme="dark"] .isva-lede,
html[data-bs-theme="dark"] .isva-gain p,
html[data-bs-theme="dark"] .isva-note,
html[data-bs-theme="dark"] .isva-card-label {
    color: var(--isva-soft);
}
html[data-bs-theme="dark"] .isva-gain-icon,
html[data-bs-theme="dark"] .isva-card {
    background: var(--isva-card);
    border-color: var(--isva-line);
}
html[data-bs-theme="dark"] .isva-member,
html[data-bs-theme="dark"] .isva-chips span {
    background: #182232;
    border-color: var(--isva-line);
}
html[data-bs-theme="dark"] .isva-member-bot {
    background: #243b5c;
    border-color: #527bb8;
    color: #dce9ff;
}
html[data-bs-theme="dark"] .isva-step-bot {
    color: #a2c4ff;
}
html[data-bs-theme="dark"] .isva-btn-main {
    background: #3978d4;
    color: #fff;
}
html[data-bs-theme="dark"] .isva-btn-main:hover {
    background: #2b66bd;
    color: #fff;
}
