
.section-pricing-table.plan-1 .plan-2, .section-pricing-table.plan-1 .plan-3 {

    display: none
}

.section-pricing-table.plan-2 .plan-1, .section-pricing-table.plan-2 .plan-3 {

    display: none
}

.section-pricing-table.plan-3 .plan-1, .section-pricing-table.plan-3 .plan-2 {

    display: none
}

.section-pricing-table-inner {

    position: relative
}

.section-pricing-table-mobile-menu {

    position: sticky;

    top: 0;

    margin-bottom: 4.8rem;

    display: grid;

    grid-template-columns: repeat(3, minmax(0, 1fr));

    gap: 1.6rem;

    border-bottom-width: 1px;

    border-bottom-color: rgb(var(--color-blue) / 0.2);

    --tw-bg-opacity: 1;

    background-color: rgb(var(--color-ivory) / var(--tw-bg-opacity));

    padding-top: 0.8rem;

    padding-bottom: 0.8rem;

    --tw-text-opacity: 1;

    color: rgb(var(--color-blue) / var(--tw-text-opacity))
}

.section-pricing-table-mobile-menu a {

    font-family: var(--font-family-din-pro);

    font-size: var(--font-toggle-m-size);

    line-height: var(--font-toggle-m-line-height, normal);

    letter-spacing: var(--font-toggle-m-letter-spacing, 0);

    font-weight: var(--font-toggle-m-weight, 400)
}

.section-pricing-table-mobile-menu a {

    display: block;

    border-radius: 0.8rem;

    padding-top: 1.6rem;

    padding-bottom: 1.6rem;

    text-align: center
}

.section-pricing-table.plan-1 .section-pricing-table-mobile-menu a[data-plan="plan-1"],
.section-pricing-table.plan-2 .section-pricing-table-mobile-menu a[data-plan="plan-2"],
.section-pricing-table.plan-3 .section-pricing-table-mobile-menu a[data-plan="plan-3"] {

    background-image: linear-gradient(298.79deg, #2DB5D2 -23.47%, #00FA6C 92.01%, #2DB5D2 214.83%);
}

.section-pricing-table-title {

    font-family: var(--font-family-nb-international-pro);

    font-size: var(--font-headline-3-m-size);

    line-height: var(--font-headline-3-m-line-height, normal);

    letter-spacing: var(--font-headline-3-m-letter-spacing, 0);

    font-weight: var(--font-headline-3-m-weight, 400)
}

.section-pricing-table-title {

    margin-bottom: 6.4rem
}

.section-pricing-table strong {

    font-family: var(--font-family-din-pro);

    font-size: var(--font-body-2-m-size);

    line-height: var(--font-body-2-m-line-height, normal);

    letter-spacing: var(--font-body-2-m-letter-spacing, 0);

    font-weight: var(--font-body-2-m-weight, 400)
}

.section-pricing-table strong {

    display: flex;

    align-items: center;

    gap: 0.8rem
}

.section-pricing-table-grid {

    display: grid;

    grid-template-columns: repeat(10, minmax(0, 1fr));

    -moz-column-gap: 1.6rem;

         column-gap: 1.6rem
}

.section-pricing-table-grid > div {

    border-bottom-width: 1px;

    border-bottom-color: rgb(var(--color-blue) / 0.2);

    padding-top: 1.2rem;

    padding-bottom: 1.2rem
}

.section-pricing-table strong span {

    font-family: var(--font-family-nb-international-pro);

    font-size: var(--font-overline-m-size);

    line-height: var(--font-overline-m-line-height, normal);

    letter-spacing: var(--font-overline-m-letter-spacing, 0);

    font-weight: var(--font-overline-m-weight, 400)
}

.section-pricing-table strong span {

    display: inline-block;

    white-space: nowrap;

    border-radius: 0.4rem;

    --tw-bg-opacity: 1;

    background-color: rgb(var(--color-dark-green-01) / var(--tw-bg-opacity));

    padding-top: 0.1rem;

    padding-bottom: 0.1rem;

    padding-left: 0.4rem;

    padding-right: 0.4rem;

    --tw-text-opacity: 1;

    color: rgb(var(--color-green) / var(--tw-text-opacity))
}

.section-pricing-table-feature {

    grid-column: span 7 / span 7;

    display: flex;

    align-items: center;

    justify-content: space-between;

    -moz-column-gap: 1.6rem;

         column-gap: 1.6rem
}

.section-pricing-table-column-title {

    font-family: var(--font-family-nb-international-pro);

    font-size: var(--font-body-2-m-size);

    line-height: var(--font-body-2-m-line-height, normal);

    letter-spacing: var(--font-body-2-m-letter-spacing, 0);

    font-weight: var(--font-body-2-m-weight, 400)
}

.section-pricing-table-column-title {

    grid-column: span 7 / span 7
}

.section-pricing-table-plan-value,
.section-pricing-table-plan-title {

    grid-column: span 3 / span 3;

    background-color: rgb(var(--color-white) / 0.4);

    text-align: center
}

.section-pricing-table-plan-value a {

    text-decoration-line: underline
}

.section-pricing-table-plan-value svg {

    margin-left: auto;

    margin-right: auto;

    display: block
}

.section-pricing-table-grid > .section-pricing-table-column-title {

    display: none;

    border-bottom-width: 0px
}

.section-pricing-table-grid > .section-pricing-table-plan-title {

    font-family: var(--font-family-nb-international-pro);

    font-size: var(--font-body-2-m-size);

    line-height: var(--font-body-2-m-line-height, normal);

    letter-spacing: var(--font-body-2-m-letter-spacing, 0);

    font-weight: var(--font-body-2-m-weight, 400)
}

.section-pricing-table-grid > .section-pricing-table-plan-title {

    display: none;

    border-bottom-width: 0px;

    background-color: transparent
}

.section-pricing-table-grid div:nth-child(6),
.section-pricing-table-grid div:nth-child(7),
.section-pricing-table-grid div:nth-child(8) {

    border-top-left-radius: 0.8rem;

    border-top-right-radius: 0.8rem
}

.section-pricing-table-plan-value:nth-last-child(1),
.section-pricing-table-plan-value:nth-last-child(2),
.section-pricing-table-plan-value:nth-last-child(3),
.section-pricing-table-feature:nth-last-child(4) {

    border-bottom-right-radius: 0.8rem;

    border-bottom-left-radius: 0.8rem;

    border-bottom-width: 0px
}

@media (min-width: 640px) {

    .container {

        max-width: 640px
    }

    .\!container {

        max-width: 640px !important
    }
}

@media (min-width: 768px) {

    .container {

        max-width: 768px
    }

    .\!container {

        max-width: 768px !important
    }
}

@media (min-width: 1024px) {

    .container {

        max-width: 1024px
    }

    .\!container {

        max-width: 1024px !important
    }

    .gap-grid {

        gap: 2.4rem
    }

    .section-pricing-table.plan-1 .plan-2, .section-pricing-table.plan-1 .plan-3 {

        display: block
    }

    .section-pricing-table.plan-2 .plan-1, .section-pricing-table.plan-2 .plan-3 {

        display: block
    }

    .section-pricing-table.plan-3 .plan-1, .section-pricing-table.plan-3 .plan-2 {

        display: block
    }

    .section-pricing-table-mobile-menu {

        display: none
    }

    .section-pricing-table-mobile-menu a {

        font-size: var(--font-toggle-size);

        line-height: var(--font-toggle-line-height, normal);

        letter-spacing: var(--font-toggle-letter-spacing, 0);

        font-weight: var(--font-toggle-weight, 400)
    }

    .section-pricing-table-title {

        font-size: var(--font-headline-3-size);

        line-height: var(--font-headline-3-line-height, normal);

        letter-spacing: var(--font-headline-3-letter-spacing, 0);

        font-weight: var(--font-headline-3-weight, 400)
    }

    .section-pricing-table-title {

        margin-bottom: 9.6rem
    }

    .section-pricing-table strong {

        font-size: var(--font-body-2-size);

        line-height: var(--font-body-2-line-height, normal);

        letter-spacing: var(--font-body-2-letter-spacing, 0);

        font-weight: var(--font-body-2-weight, 400)
    }

    .section-pricing-table-grid {

        -moz-column-gap: 2.4rem;

             column-gap: 2.4rem
    }

    .section-pricing-table strong span {

        font-size: var(--font-overline-size);

        line-height: var(--font-overline-line-height, normal);

        letter-spacing: var(--font-overline-letter-spacing, 0);

        font-weight: var(--font-overline-weight, 400)
    }

    .section-pricing-table-feature {

        grid-column: span 4 / span 4
    }

    .section-pricing-table-column-title {

        font-size: var(--font-body-2-size);

        line-height: var(--font-body-2-line-height, normal);

        letter-spacing: var(--font-body-2-letter-spacing, 0);

        font-weight: var(--font-body-2-weight, 400)
    }

    .section-pricing-table-column-title {

        grid-column: span 4 / span 4
    }

    .section-pricing-table-plan-value,
.section-pricing-table-plan-title {

        grid-column: span 2 / span 2
    }

    .section-pricing-table-grid > .section-pricing-table-column-title {

        display: block
    }

    .section-pricing-table-grid > .section-pricing-table-plan-title {

        font-size: var(--font-body-2-size);

        line-height: var(--font-body-2-line-height, normal);

        letter-spacing: var(--font-body-2-letter-spacing, 0);

        font-weight: var(--font-body-2-weight, 400)
    }

    .section-pricing-table-grid > .section-pricing-table-plan-title {

        display: block
    }
}

@media (min-width: 1280px) {

    .container {

        max-width: 1280px
    }

    .\!container {

        max-width: 1280px !important
    }
}

@media (min-width: 1536px) {

    .container {

        max-width: 1536px
    }

    .\!container {

        max-width: 1536px !important
    }
}

@media (min-width: 1800px) {

    .container {

        max-width: 1800px
    }

    .\!container {

        max-width: 1800px !important
    }
}


