.section-comparison-v2 {
    margin-bottom: var(--zds-space-48);
}

.section-comparison-v2 .zds-container {
    padding-inline: 0;
}

.comparison-v2-badge {
    margin-bottom: var(--zds-space-6);
}

.section-comparison-v2 .comparison-v2-title {
    font-family: var(--zds-font-family-heading);
    font-style: normal;
    font-weight: var(--zds-font-weight-bold);
    font-size: var(--zds-heading-size-sm) !important;
    line-height: var(--zds-heading-line-height) !important;
    color: #F5F7F6;
}

.comparison-v2-table {
    margin-top: 80px;
}

.comparison-v2-row,
.comparison-v2-section-footer {
    display: grid;
    grid-template-columns: 320px 448px 448px;
    gap: var(--zds-space-8);
}

.comparison-v2-head {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: flex-end;
    align-self: stretch;
    gap: var(--zds-space-8);
}

.comparison-v2-head-cell {
    flex: none;
    font-weight: 600;
}

.comparison-v2-head-cell--label {
    width: 320px;
}

.comparison-v2-head-cell--agent,
.comparison-v2-head-cell--manual {
    width: 448px;
}

.comparison-v2-head-cell--agent,
.comparison-v2-head-cell--manual {
    font-family: var(--zds-font-family-heading);
    font-style: normal;
    font-weight: var(--zds-font-weight-bold);
    font-size: var(--zds-heading-size-xs);
    line-height: var(--zds-heading-line-height);
}

.comparison-v2-head-cell--agent {
    color: var(--zds-color-mint-bright);
}

.comparison-v2-head-cell--manual {
    color: #F5F7F6;
}

.comparison-v2-head-cell--agent,
.comparison-v2-head-cell--manual {
    text-align: center;
}


.comparison-v2-section-label {
    box-sizing: border-box;
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    padding: 11px 0;
    margin-bottom: var(--zds-space-6);
    border-bottom: 2px solid rgba(255, 255, 255, 0.101961);
    font-family: var(--zds-font-family-base);
    font-style: normal;
    font-weight: var(--zds-font-weight-bold);
    font-size: 14px;
    line-height: 18px;
    text-transform: uppercase;
    color: var(--zds-color-mint-bright);
}

.comparison-v2-row {
    align-items: center;
}

@media screen and (min-width: 1321px) {
    .comparison-v2-row:has(.comparison-v2-row-value--agent.comparison-v2-row-value--has-icon) {
        padding-top: 20px;
        padding-bottom: 20px;
    }

    .comparison-v2-row-value--agent.comparison-v2-row-value--has-icon,
    .comparison-v2-row-value--manual.comparison-v2-row-value--has-icon {
        height: 78px;
    }

    .comparison-v2-row:has(.comparison-v2-row-value--agent.comparison-v2-row-value--has-icon) .comparison-v2-row-info {
        justify-content: center;
    }
}

.comparison-v2-row + .comparison-v2-row {
    margin-top: var(--zds-space-6);
}

.comparison-v2-row-info {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    align-self: stretch;
    padding: var(--zds-space-4) 0;
    gap: var(--zds-space-2);
}

.comparison-v2-row-value-header {
    display: none;
}

.comparison-v2-row-label {
    font-family: var(--zds-font-family-base);
    font-style: normal;
    font-weight: var(--zds-font-weight-semibold);
    font-size: var(--zds-body-size-small);
    line-height: var(--zds-body-line-height);
    color: #F5F7F6;
}

.comparison-v2-row-description {
    font-family: var(--zds-font-family-base);
    font-style: normal;
    font-weight: var(--zds-font-weight-light);
    font-size: var(--zds-body-size-mobile-base);
    line-height: var(--zds-body-line-height);
    color: #CEC9B5;
}

.comparison-v2-row-value {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    text-align: center;
}

.comparison-v2-row-value--agent,
.comparison-v2-row-value--manual {
    box-sizing: border-box;
    flex-direction: column;
    align-items: flex-start;
    justify-content: space-between;
    text-align: left;
    padding: var(--zds-space-4);
    padding-bottom: 14px;
    width: 448px;
    border-radius: var(--zds-radius-sm);
}

.comparison-v2-row-value--agent {
    background: rgba(73, 245, 165, 0.0784314);
    border: 1px solid rgba(73, 245, 165, 0.2);
}

.comparison-v2-row-value--has-icon {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--zds-space-6);
}

.comparison-v2-row-value--has-icon .comparison-v2-row-value-header,
.comparison-v2-row-value--has-icon .comparison-v2-row-value-text {
    flex-basis: 100%;
}

.comparison-v2-row-value--has-icon .comparison-v2-row-value-label {
    flex: 1;
    min-width: 0;
}

.comparison-v2-row-value--manual {
    background: rgba(255, 255, 255, 0.0392157);
    border: 1px solid rgba(255, 255, 255, 0.101961);
}

.comparison-v2-row-value-label {
    font-family: var(--zds-font-family-base);
    font-style: normal;
    font-weight: var(--zds-font-weight-regular);
    font-size: 14px;
    line-height: 1;
    color: var(--zds-color-cream);
}

.comparison-v2-row-value--manual.comparison-v2-row-value--has-icon .comparison-v2-row-value-label {
    font-size: 15px;
    line-height: 125%;
}

.comparison-v2-row-value--agent.comparison-v2-row-value--has-icon .comparison-v2-row-value-label {
    line-height: 125%;
}

.comparison-v2-row-value-text {
    align-self: stretch;
    font-family: var(--zds-font-family-heading);
    font-style: normal;
    font-weight: var(--zds-font-weight-bold);
    font-size: 24px;
    line-height: 1;
    text-align: right;
    color: var(--zds-color-cream);
}

.comparison-v2-section-footer {
    margin-top: var(--zds-space-6);
}

.comparison-v2-section + .comparison-v2-section {
    margin-top: var(--zds-space-20);
}

.comparison-v2-summary {
    font-family: var(--zds-font-family-base);
    font-style: normal;
    font-weight: var(--zds-font-weight-bold);
    font-size: var(--zds-body-size-small);
    line-height: 20px;
    text-align: center;
}

.comparison-v2-summary--agent {
    box-sizing: border-box;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    padding: 12px var(--zds-space-4);
    width: 448px;
    background: var(--zds-color-deep-green);
    border: 1px solid var(--zds-color-mint-bright);
    border-radius: var(--zds-radius-sm);
    color: var(--zds-color-mint-bright);
}

.comparison-v2-check-icon {
    box-sizing: border-box;
    position: relative;
    flex: none;
    width: 32px;
    height: 32px;
    background: rgba(73, 245, 165, 0.101961);
    border: 1px solid rgba(73, 245, 165, 0.4);
    border-radius: 9999px;
}

.comparison-v2-check-icon::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 15px;
    height: 11px;
    background-color: var(--zds-color-mint-bright);
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg width='15' height='11' viewBox='0 0 15 11' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M13.8983 0.960782L4.89828 9.96078C4.84604 10.0131 4.784 10.0546 4.71572 10.0829C4.64743 10.1112 4.57423 10.1258 4.50031 10.1258C4.42639 10.1258 4.3532 10.1112 4.28491 10.0829C4.21662 10.0546 4.15458 10.0131 4.10234 9.96078L0.164844 6.02328C0.0592961 5.91773 0 5.77458 0 5.62531C0 5.47605 0.0592961 5.33289 0.164844 5.22734C0.270392 5.1218 0.413546 5.0625 0.562813 5.0625C0.71208 5.0625 0.855234 5.1218 0.960781 5.22734L4.50031 8.76758L13.1023 0.164844C13.2079 0.0592959 13.351 -1.11213e-09 13.5003 0C13.6496 1.11213e-09 13.7927 0.0592959 13.8983 0.164844C14.0038 0.270392 14.0631 0.413546 14.0631 0.562813C14.0631 0.71208 14.0038 0.855234 13.8983 0.960782Z' fill='white'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg width='15' height='11' viewBox='0 0 15 11' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M13.8983 0.960782L4.89828 9.96078C4.84604 10.0131 4.784 10.0546 4.71572 10.0829C4.64743 10.1112 4.57423 10.1258 4.50031 10.1258C4.42639 10.1258 4.3532 10.1112 4.28491 10.0829C4.21662 10.0546 4.15458 10.0131 4.10234 9.96078L0.164844 6.02328C0.0592961 5.91773 0 5.77458 0 5.62531C0 5.47605 0.0592961 5.33289 0.164844 5.22734C0.270392 5.1218 0.413546 5.0625 0.562813 5.0625C0.71208 5.0625 0.855234 5.1218 0.960781 5.22734L4.50031 8.76758L13.1023 0.164844C13.2079 0.0592959 13.351 -1.11213e-09 13.5003 0C13.6496 1.11213e-09 13.7927 0.0592959 13.8983 0.164844C14.0038 0.270392 14.0631 0.413546 14.0631 0.562813C14.0631 0.71208 14.0038 0.855234 13.8983 0.960782Z' fill='white'/%3E%3C/svg%3E");
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: center;
    mask-position: center;
    -webkit-mask-size: contain;
    mask-size: contain;
}

.comparison-v2-minus-icon {
    box-sizing: border-box;
    position: relative;
    flex: none;
    width: 32px;
    height: 32px;
    background: rgba(255, 255, 255, 0.0392157);
    border: 1px solid rgba(255, 255, 255, 0.101961);
    border-radius: 9999px;
}

.comparison-v2-minus-icon::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 15px;
    height: 1.25px;
    background-color: #CEC9B5;
}

.comparison-v2-summary--manual {
    box-sizing: border-box;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    padding: 12px var(--zds-space-4);
    width: 448px;
    background: var(--zds-color-deep-green);
    border: 1px solid var(--zds-color-on-light-link);
    border-radius: var(--zds-radius-sm);
    color: var(--zds-color-on-light-text-brand);
}

@media screen and (min-width: 1321px) {
    .comparison-v2-summary--agent,
    .comparison-v2-summary--manual {
        height: 52px;
    }
}

@media screen and (max-width: 1320px) {
    .section-comparison-v2 .zds-container {
        padding-inline: var(--zds-space-5);
    }

    .comparison-v2-head {
        display: none;
    }

    .comparison-v2-section-footer {
        grid-template-columns: 1fr 1fr;
        gap: 12px;
        margin-top: 28px;
    }

    .comparison-v2-section-footer-cell {
        display: none;
    }

    .comparison-v2-row {
        grid-template-columns: 1fr 1fr;
        grid-template-areas: "info info" "agent manual";
        gap: 10px 12px;
        align-items: start;
    }

    .comparison-v2-row + .comparison-v2-row {
        margin-top: var(--zds-space-5);
    }

    .comparison-v2-row-info {
        grid-area: info;
    }

    .comparison-v2-row-value--agent {
        grid-area: agent;
    }

    .comparison-v2-row-value--manual {
        grid-area: manual;
    }

    .comparison-v2-row-value--agent,
    .comparison-v2-row-value--manual {
        flex-direction: column;
        align-items: flex-start;
        gap: var(--zds-space-0);
        width: auto;
        padding: var(--zds-space-3);
        padding-bottom: 10px;
    }

    .comparison-v2-row-value-header {
        display: block;
        align-self: stretch;
        font-family: var(--zds-font-family-base);
        font-style: normal;
        font-weight: var(--zds-font-weight-semibold);
        font-size: var(--zds-body-size-mobile-small);
        line-height: 17px;
        margin-bottom: 9px;
    }

    .comparison-v2-row-value--agent .comparison-v2-row-value-header {
        color: var(--zds-color-mint-bright);
        margin-bottom: 9px;
    }

    .comparison-v2-row-value--has-icon {
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: space-between;
        align-items: flex-start;
        row-gap: var(--zds-space-2);
        column-gap: var(--zds-space-1);
    }

    .comparison-v2-row-value--has-icon .comparison-v2-row-value-header {
        flex: 1;
        align-self: auto;
    }

    .comparison-v2-row-value--has-icon .comparison-v2-row-value-label,
    .comparison-v2-row-value--has-icon .comparison-v2-row-value-text {
        flex-basis: 100%;
    }

    .comparison-v2-check-icon {
        width: 20px;
        height: 20px;
    }

    .comparison-v2-check-icon::after {
        width: 9.375px;
        height: 6.75px;
    }

    .comparison-v2-minus-icon {
        width: 20px;
        height: 20px;
    }

    .comparison-v2-minus-icon::after {
        width: 9.375px;
        height: 0.8px;
    }

    .comparison-v2-row-value--manual .comparison-v2-row-value-header {
        color: #F5F7F6;
    }

    .comparison-v2-row-value {
        justify-content: flex-start;
        text-align: left;
    }

    .comparison-v2-summary {
        text-align: left;
    }

    .comparison-v2-summary--agent,
    .comparison-v2-summary--manual {
        width: auto;
        padding: var(--zds-space-3);
    }

    .comparison-v2-summary--agent,
    .comparison-v2-summary--manual {
        text-align: center;
    }

    .comparison-v2-row-value-label {
        line-height: 17px;
    }

    .comparison-v2-row-value-label:not(.comparison-v2-row-value--has-icon .comparison-v2-row-value-label) {
        margin-bottom: 12px;
    }

    .comparison-v2-row-info {
        padding: 0;
        gap: var(--zds-space-1);
    }
}

@media screen and (max-width: 768px) {
    .section-comparison-v2 {
        margin-bottom: var(--zds-space-32);
    }

    .section-comparison-v2 .zds-container {
        padding-inline: var(--zds-space-5);
        padding-top: var(--zds-space-6);
    }

    .comparison-v2-section {
        padding-top: var(--zds-space-8);
        padding-bottom: var(--zds-space-5);
    }

    .comparison-v2-table {
        margin-top: 0;
    }

    .comparison-v2-section + .comparison-v2-section {
        margin-top: 0;
    }

    .section-comparison-v2 .comparison-v2-title {
        margin-bottom: var(--zds-space-8);
        font-size: var(--zds-heading-size-mobile-sm) !important;
        line-height: 125% !important;
    }

    .comparison-v2-section-label {
        padding-top: 0;
        padding-bottom: var(--zds-space-2);
        margin-bottom: var(--zds-space-5);
        font-size: 13px;
        line-height: 16px;
    }

    .comparison-v2-row-label {
        font-size: var(--zds-body-size-mobile-base);
        line-height: var(--zds-body-line-height-mobile);
    }

    .comparison-v2-row-value--agent.comparison-v2-row-value--has-icon .comparison-v2-row-value-header,
    .comparison-v2-row-value--manual.comparison-v2-row-value--has-icon .comparison-v2-row-value-header {
        margin-bottom: 0;
    }

    .comparison-v2-row-value-label {
        font-weight: var(--zds-font-weight-light);
        font-size: var(--zds-body-size-mobile-small);
    }

    .comparison-v2-row-value--manual.comparison-v2-row-value--has-icon .comparison-v2-row-value-label {
        font-size: var(--zds-body-size-mobile-small);
    }

    .comparison-v2-row-value-text {
        font-size: 18px;
        line-height: 1;
    }

    .comparison-v2-summary {
        font-weight: var(--zds-font-weight-semibold);
        font-size: var(--zds-body-size-mobile-small);
        line-height: var(--zds-body-line-height-mobile);
    }
}
