:root {
    /* success (pros) */
    --pros-color: #10b981;
    --pros-bg: #10b9811a;

    /* danger (cons) */
    --cons-color: #fd768a;
    --cons-bg: #fd768a1a;

    /* common */
    --border-radius: 10px;
    --gap: 25px;
}

.pros-cons-block {
    display: grid;
    gap: var(--gap);
    margin: 30px 0 15px;
}
.pros-cons-block.pros-cons-block--single{
    grid-template-columns: 1fr;
}
.pros-cons-block__header {
    display: flex;
    align-items: center;
    gap: 15px;
    margin-bottom: 25px;
    padding-bottom: 15px;
}

.pros-block__header {
    border-bottom: 1px solid color-mix(in srgb, var(--pros-color) 20%, transparent);
}

.cons-block__header {
    border-bottom: 1px solid color-mix(in srgb, var(--cons-color) 20%, transparent);
}

.pros-cons-block__image {
    padding: 10px;
    border-radius: var(--border-radius);
}

.pros-column__image {
    background: var(--pros-bg);
}

.cons-column__image {
    background: var(--cons-bg);
}

.pros-cons-block__img {
    width: 24px;
    min-width: 24px;
    height: 24px;
}

.pros-cons-block__title {
    font-size: 24px;
    font-weight: 500;
    margin: 0;
}

.pros-cons-block__description p {
    margin: 0;
}


.new-page .pros-cons-block__item {
    padding: 15px 15px 15px 30px;
    border-radius: var(--border-radius);
    margin-bottom: 15px;
}

.new-page .pros-cons-block__item::before {
    top: 23px;
}

.new-page ul .pros-block__item::before {
    background-color: var(--pros-color);
}

.new-page ul .cons-block__item::before {
    background-color: var(--cons-color);
}

.pros-block__item:hover {
    background-color: #10b9810d;
    background-color: oklab(69.5873% -.142158 .044878 / .05);
}

.cons-block__item:hover {
    background-color: #fd768a0d;
    background-color: oklab(72.99% .160906 .0368927 / .05);
}

@media screen and (min-width: 992px) {
    .pros-cons-block {
        grid-template-columns: 1fr 1fr;
        gap: 60px;
    }
}