.comparisons-heading {
    padding-top: 20px;
    padding-bottom: 48px;
}

@media (min-width: 576px) {
    .comparisons-heading {
        padding-top: 48px;
        padding-bottom: 32px;
    }
}

.comparisons-package-names-container {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    text-align: center;
    justify-items: space-evenly;
}

@media (min-width: 576px) {
    .comparisons-package-names-container {
        display: none;
    }
}


.noa-comparison-subheading {
    text-decoration-line: underline;
    text-decoration-style: solid;
    text-decoration-skip-ink: auto;
    text-decoration-thickness: auto;
    text-underline-offset: auto;
}

.noa-tooltip .tooltip-inner {
    padding: var(--noa-spacing-md);
    background: var(--noa-brand-secondary-200);
    color: var(--noa-secondry);
    text-align: left;
    font-family: var(--noa-body-font, Inter) !important;
    font-size: var(--noa-body-md-font-size, 16px) !important;
    font-style: normal;
    font-weight: 500;
    text-align: left;
    line-height: 135%; /* 21.6px */
    letter-spacing: -0.16px;
}

.noa-tooltip .tooltip-arrow::before {
    border-top-color: var(--noa-brand-secondary-200) !important;
}

.noa-tooltip.show {
    opacity: 1 !important;
}

.noa-badge {
    border-radius: 100px;
    border: none; 
    padding: var(--padding-sm, 12px);
    line-height: normal !important;
}

.noa-badge-outline {
    border: 2px solid var(--noa-neutrals-300, #D4D3CD);
    background:  var(--noa-light) !important;
}

.noa-comparisonItem:hover {
    background: var(--noa-brand-secondary-50, #F2E7FF);
}

.noa-comparisonItem:hover #noa-badge-check {
    background: var(--noa-brand-secondary-200);
}

.noa-comparisonItem:hover #noa-badge-close {
    background: var(--noa-light);
}

.noa-comparisonItem:hover #noa-badge-plus {
    border: 2px solid var(--noa-brand-secondary-200);
}

.comparisons-options-summary {
    display: grid;
    grid-template-columns: repeat(1,1fr);
    gap: var(--noa-spacing-xl);
    margin-block: var(--noa-spacing-xxl);
}

/* sm+ */
@media (min-width: 576px) {
    .comparisons-options-summary {
        grid-template-columns: repeat(4, 1fr);
        grid-template-rows: repeat(3, auto);
        gap: var(--noa-spacing-md);
    }
}

.comparisons-option {
    display: flex;
    flex-direction: column;
    gap: var(--noa-spacing-md);
}


@media (min-width: 576px) {
    .comparisons-option {
        display: grid;
        grid-template-rows: subgrid;
        grid-row: 1 / -1;
    }
}

.comparisons-option-name {
    margin: 0;
}

@media (min-width: 576px) {
    .comparisons-option-name {
        grid-row: 1/1
    }

    .comparisons-option-price {
        grid-row: 2/2;
    }

    .comparisons-option-cta {
        grid-row: 3/3;
    }
}