/* Benefits Section - Desktop */
@media (min-width: 48rem) {
    /* 768px */
    .comparison {
        padding: 4rem 1rem 2.813rem 1rem; /* 64px top, 45px bottom */
    }

    .comparison__title {
        font-size: 3rem; /* 48px */
        line-height: 3.75rem; /* 60px */
    }

    .comparison__wrapper {
        width: 1280px;
    }

    .comparison__pass-title {
        font-size: 2.5rem;
    }

    .comparison__panel {
        max-width: 1280px;
        width: 100%;
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        background-image: linear-gradient(135deg, rgba(230, 236, 240, 0.25) 3.24%, rgba(255, 255, 255, 0.02) 94.23%),
        linear-gradient(135deg, rgba(139, 124, 243, 0.20) 3.24%, rgba(255, 255, 255, 0.02) 94.23%),
        linear-gradient(135deg, rgba(41, 255, 198, 0.20) 3.24%, rgba(255, 255, 255, 0.02) 94.23%);
        background-repeat: no-repeat;
        background-size: 50% 100%; /* each column slice is 1/3 width */
        background-position: right top, left top; /* left, middle, right */
    }

    /* remove per-cell backgrounds on desktop so the slice shows through */
    .comparison__panel > .cell.comparison__header.col-b,
    .comparison__panel > .cell.col-b,
    .comparison__panel > .cell.comparison__header.col-c,
    .comparison__panel > .cell.col-c {
        background: none;
    }

    .comparison__panel > .cell.col-b,
    .comparison__panel > .cell.comparison__header.col-b {
        order: 0;
    }

    .comparison__panel > .cell.col-c,
    .comparison__panel > .cell.comparison__header.col-c {
        order: 0;
    }

    .hide-mobile {
        display: flex !important;
    }

    .cell:nth-last-child(-n+2)::after {
        content: none;
    }

    .comparison__pass-container {
        display: flex;
        flex-direction: row;
        align-items: stretch;
        justify-content: space-between;
        width: 1280px;
        max-width: 1280px;
        gap: 0;
    }

    .comparison__pass-item {
        width: 37.5rem;
    }

    .comparison__annotation-container {
        display: flex;
        flex-direction: row;
        gap: 1rem;
        align-items: center;
        margin-top: 2rem;
        max-width: 1280px;
    }

    .comparison__annotation-container p {
        flex: 3;
    }

    .comparison__annotation-header {
        flex: 1 !important;
    }

    .vertical_line {
        flex-shrink: 0;
    }
}
