.nvf-pricing,
.nvf-pricing * {
    box-sizing: border-box;
}

.nvf-pricing {
    --nvf-pricing-accent: #c62455;
    --nvf-pricing-active: #c62455;
    --nvf-pricing-active-text: #fff;
    --nvf-pricing-badge-bg: #171717;
    --nvf-pricing-badge-text: #fff;
    --nvf-pricing-frequency-width: 27%;
    --nvf-pricing-intro-width: 38%;
    --nvf-pricing-line: #c9c6c0;
    --nvf-pricing-line-width: 1px;
    --nvf-pricing-number: #918e88;
    --nvf-pricing-package-width: 43%;
    --nvf-pricing-package: #171717;
    --nvf-pricing-price: #171717;
    --nvf-pricing-text: #171717;
    --nvf-pricing-value: #56534f;
    background: #f4f1eb;
    color: var(--nvf-pricing-text);
    font-family: inherit;
    overflow: clip;
    width: 100%;
}

.nvf-pricing__inner {
    margin: 0 auto;
    width: 100%;
}

.nvf-pricing__layout {
    align-items: start;
    display: grid;
    grid-template-columns: minmax(0, var(--nvf-pricing-intro-width)) minmax(0, 1fr);
}

.nvf-pricing-layout--stacked .nvf-pricing__layout {
    display: block;
}

.nvf-pricing-layout--stacked .nvf-pricing__intro {
    max-width: 850px;
}

.nvf-pricing__intro {
    min-width: 0;
    position: relative;
}

.nvf-pricing__label {
    align-items: center;
    color: var(--nvf-pricing-accent);
    display: flex;
    font-size: 12px;
    font-weight: 700;
    gap: 10px;
    letter-spacing: .11em;
    line-height: 1.25;
    text-transform: uppercase;
}

.nvf-pricing__label-dot {
    background: currentColor;
    border-radius: 50%;
    display: block;
    flex: 0 0 auto;
    height: 6px;
    width: 6px;
}

.nvf-pricing__heading {
    color: var(--nvf-pricing-text);
    font-family: inherit;
    font-size: clamp(44px, 4.8vw, 82px);
    font-weight: 600;
    letter-spacing: -.055em;
    line-height: .96;
    margin: 0;
    max-width: 9.5ch;
    text-wrap: balance;
}

.nvf-pricing-layout--stacked .nvf-pricing__heading {
    max-width: 13ch;
}

.nvf-pricing__description {
    color: #66635f;
    font-size: 16px;
    line-height: 1.62;
    max-width: 42ch;
}

.nvf-pricing__description > :first-child,
.nvf-pricing__footnote > :first-child {
    margin-top: 0;
}

.nvf-pricing__description > :last-child,
.nvf-pricing__footnote > :last-child {
    margin-bottom: 0;
}

.nvf-pricing__plans {
    border-bottom: var(--nvf-pricing-line-width) solid var(--nvf-pricing-line);
    border-top: var(--nvf-pricing-line-width) solid var(--nvf-pricing-line);
    list-style: none;
    margin: 0;
    min-width: 0;
    overflow: hidden;
    padding: 0;
}

.nvf-pricing__plan {
    list-style: none;
    margin: 0;
    overflow: hidden;
    padding: 0;
    position: relative;
}

.nvf-pricing__plan + .nvf-pricing__plan {
    border-top: var(--nvf-pricing-line-width) solid var(--nvf-pricing-line);
}

.nvf-pricing__plan::before {
    background: var(--nvf-pricing-active);
    content: "";
    inset: 0;
    pointer-events: none;
    position: absolute;
    transform: translate3d(0, 101%, 0);
    transition: transform .55s cubic-bezier(.22, 1, .36, 1);
    z-index: 0;
}

.nvf-pricing-hover--line .nvf-pricing__plan::before {
    inset: auto auto 0 0;
    height: 4px;
    transform: scaleX(0);
    transform-origin: left;
    width: 100%;
}

.nvf-pricing-hover--minimal .nvf-pricing__plan::before {
    display: none;
}

.nvf-pricing__plan--featured::before,
.nvf-pricing-hover--fill .nvf-pricing__plan:hover::before,
.nvf-pricing-hover--fill .nvf-pricing__plan:focus-within::before {
    transform: translate3d(0, 0, 0);
}

.nvf-pricing-hover--line .nvf-pricing__plan--featured::before,
.nvf-pricing-hover--line .nvf-pricing__plan:hover::before,
.nvf-pricing-hover--line .nvf-pricing__plan:focus-within::before {
    transform: scaleX(1);
}

.nvf-pricing__plan-link {
    color: inherit;
    display: block;
    text-decoration: none;
}

.nvf-pricing__plan-inner {
    align-items: center;
    display: grid;
    gap: 22px;
    grid-template-columns: 34px minmax(0, var(--nvf-pricing-package-width)) minmax(115px, var(--nvf-pricing-frequency-width)) minmax(105px, 1fr) 42px;
    isolation: isolate;
    margin: 0;
    position: relative;
    transition: color .35s ease;
    z-index: 1;
}

.nvf-pricing__number {
    color: var(--nvf-pricing-number);
    font-size: 10px;
    font-weight: 600;
    letter-spacing: .09em;
    line-height: 1;
    transition: color .35s ease, transform .55s cubic-bezier(.22, 1, .36, 1);
}

.nvf-pricing__identity {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 10px 14px;
    min-width: 0;
}

.nvf-pricing__package {
    color: var(--nvf-pricing-package);
    font-family: inherit;
    font-size: clamp(24px, 2vw, 34px);
    font-weight: 600;
    letter-spacing: -.035em;
    line-height: 1;
    margin: 0;
    transition: color .35s ease, transform .55s cubic-bezier(.22, 1, .36, 1);
}

.nvf-pricing__badge {
    background: var(--nvf-pricing-badge-bg);
    border-radius: 999px;
    color: var(--nvf-pricing-badge-text);
    display: inline-flex;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: .08em;
    line-height: 1;
    padding: 7px 9px 6px;
    text-transform: uppercase;
    transition: background-color .35s ease, color .35s ease;
}

.nvf-pricing__frequency {
    color: var(--nvf-pricing-value);
    font-size: 15px;
    line-height: 1.35;
    transition: color .35s ease, transform .55s cubic-bezier(.22, 1, .36, 1);
}

.nvf-pricing__micro-label {
    display: none;
}

.nvf-pricing__price {
    align-items: baseline;
    display: flex;
    flex-direction: column;
    min-width: 0;
    transition: transform .55s cubic-bezier(.22, 1, .36, 1);
}

.nvf-pricing__price-value {
    color: var(--nvf-pricing-price);
    font-size: clamp(25px, 2vw, 34px);
    font-weight: 600;
    letter-spacing: -.035em;
    line-height: 1;
    transition: color .35s ease;
    white-space: nowrap;
}

.nvf-pricing__note {
    color: var(--nvf-pricing-value);
    font-size: 10px;
    letter-spacing: .04em;
    line-height: 1.2;
    margin-top: 7px;
    text-transform: uppercase;
    transition: color .35s ease;
}

.nvf-pricing__arrow {
    align-items: center;
    border: 1px solid currentColor;
    border-radius: 50%;
    color: var(--nvf-pricing-package);
    display: inline-flex;
    height: 42px;
    justify-content: center;
    overflow: hidden;
    transition: background-color .35s ease, border-color .35s ease, color .35s ease, transform .55s cubic-bezier(.22, 1, .36, 1);
    width: 42px;
}

.nvf-pricing__arrow svg {
    fill: none;
    height: 17px;
    stroke: currentColor;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 1.5;
    transition: transform .55s cubic-bezier(.22, 1, .36, 1);
    width: 17px;
}

.nvf-pricing-hover--fill .nvf-pricing__plan--featured .nvf-pricing__plan-inner,
.nvf-pricing-hover--fill .nvf-pricing__plan:hover .nvf-pricing__plan-inner,
.nvf-pricing-hover--fill .nvf-pricing__plan:focus-within .nvf-pricing__plan-inner {
    color: var(--nvf-pricing-active-text);
}

.nvf-pricing-hover--fill .nvf-pricing__plan--featured :is(.nvf-pricing__number, .nvf-pricing__package, .nvf-pricing__frequency, .nvf-pricing__price-value, .nvf-pricing__note, .nvf-pricing__arrow),
.nvf-pricing-hover--fill .nvf-pricing__plan:hover :is(.nvf-pricing__number, .nvf-pricing__package, .nvf-pricing__frequency, .nvf-pricing__price-value, .nvf-pricing__note, .nvf-pricing__arrow),
.nvf-pricing-hover--fill .nvf-pricing__plan:focus-within :is(.nvf-pricing__number, .nvf-pricing__package, .nvf-pricing__frequency, .nvf-pricing__price-value, .nvf-pricing__note, .nvf-pricing__arrow) {
    color: var(--nvf-pricing-active-text);
}

.nvf-pricing-hover--fill .nvf-pricing__plan--featured .nvf-pricing__badge,
.nvf-pricing-hover--fill .nvf-pricing__plan:hover .nvf-pricing__badge,
.nvf-pricing-hover--fill .nvf-pricing__plan:focus-within .nvf-pricing__badge {
    background: var(--nvf-pricing-active-text);
    color: var(--nvf-pricing-active);
}

/* On capable browsers the selected row yields while another option is explored. */
@supports selector(.nvf-pricing__plans:has(.nvf-pricing__plan:hover)) {
    .nvf-pricing-hover--fill .nvf-pricing__plans:has(.nvf-pricing__plan:hover) .nvf-pricing__plan--featured:not(:hover)::before {
        transform: translate3d(0, 101%, 0);
    }

    .nvf-pricing-hover--fill .nvf-pricing__plans:has(.nvf-pricing__plan:hover) .nvf-pricing__plan--featured:not(:hover) .nvf-pricing__number {
        color: var(--nvf-pricing-number);
    }

    .nvf-pricing-hover--fill .nvf-pricing__plans:has(.nvf-pricing__plan:hover) .nvf-pricing__plan--featured:not(:hover) .nvf-pricing__package,
    .nvf-pricing-hover--fill .nvf-pricing__plans:has(.nvf-pricing__plan:hover) .nvf-pricing__plan--featured:not(:hover) .nvf-pricing__arrow {
        color: var(--nvf-pricing-package);
    }

    .nvf-pricing-hover--fill .nvf-pricing__plans:has(.nvf-pricing__plan:hover) .nvf-pricing__plan--featured:not(:hover) .nvf-pricing__price-value {
        color: var(--nvf-pricing-price);
    }

    .nvf-pricing-hover--fill .nvf-pricing__plans:has(.nvf-pricing__plan:hover) .nvf-pricing__plan--featured:not(:hover) .nvf-pricing__frequency {
        color: var(--nvf-pricing-value);
    }

    .nvf-pricing-hover--fill .nvf-pricing__plans:has(.nvf-pricing__plan:hover) .nvf-pricing__plan--featured:not(:hover) .nvf-pricing__note {
        color: var(--nvf-pricing-value);
    }

    .nvf-pricing-hover--fill .nvf-pricing__plans:has(.nvf-pricing__plan:hover) .nvf-pricing__plan--featured:not(:hover) .nvf-pricing__badge {
        background: var(--nvf-pricing-badge-bg);
        color: var(--nvf-pricing-badge-text);
    }
}

.nvf-pricing__plan:hover .nvf-pricing__package,
.nvf-pricing__plan:focus-within .nvf-pricing__package {
    transform: translateX(4px);
}

.nvf-pricing__plan:hover .nvf-pricing__price,
.nvf-pricing__plan:focus-within .nvf-pricing__price {
    transform: translateX(-4px);
}

.nvf-pricing__plan:hover .nvf-pricing__arrow,
.nvf-pricing__plan:focus-within .nvf-pricing__arrow {
    transform: rotate(-8deg);
}

.nvf-pricing__plan:hover .nvf-pricing__arrow svg,
.nvf-pricing__plan:focus-within .nvf-pricing__arrow svg {
    transform: translateX(2px);
}

.nvf-pricing__plan-link:focus-visible {
    outline: 2px solid var(--nvf-pricing-accent);
    outline-offset: -3px;
}

.nvf-pricing__footer {
    align-items: flex-start;
    display: flex;
    gap: 28px;
    justify-content: flex-end;
}

.nvf-pricing__footnote {
    color: #66635f;
    font-size: 14px;
    line-height: 1.55;
    max-width: 48ch;
}

.nvf-pricing__button {
    align-items: center;
    background: var(--nvf-pricing-text);
    border-radius: 999px;
    color: #fff;
    display: inline-flex;
    flex: 0 0 auto;
    font-size: 13px;
    font-weight: 600;
    gap: 15px;
    line-height: 1;
    min-height: 54px;
    text-decoration: none;
    transition: background-color .35s ease, color .35s ease, transform .35s ease;
}

.nvf-pricing__button-icon {
    align-items: center;
    background: rgba(255, 255, 255, .15);
    border-radius: 50%;
    display: inline-flex;
    height: 42px;
    justify-content: center;
    transition: transform .45s cubic-bezier(.22, 1, .36, 1);
    width: 42px;
}

.nvf-pricing__button-icon svg {
    fill: currentColor;
    height: 13px;
    width: 13px;
}

.nvf-pricing__button:hover .nvf-pricing__button-icon,
.nvf-pricing__button:focus-visible .nvf-pricing__button-icon {
    transform: rotate(-10deg);
}

.nvf-pricing__button:focus-visible {
    outline: 2px solid currentColor;
    outline-offset: 4px;
}

@media (max-width: 1100px) {
    .nvf-pricing__layout {
        column-gap: 48px;
        grid-template-columns: minmax(0, 34%) minmax(0, 1fr);
    }

    .nvf-pricing__heading {
        font-size: clamp(40px, 5vw, 62px);
    }

    .nvf-pricing__plan-inner {
        gap: 16px;
        grid-template-columns: 26px minmax(0, 1.1fr) minmax(105px, .7fr) minmax(90px, .7fr) 38px;
    }

    .nvf-pricing__arrow {
        height: 38px;
        width: 38px;
    }
}

@media (max-width: 767px) {
    .nvf-pricing__layout,
    .nvf-pricing-layout--split .nvf-pricing__layout {
        display: block;
    }

    .nvf-pricing__intro {
        max-width: 560px;
    }

    .nvf-pricing__heading,
    .nvf-pricing-layout--stacked .nvf-pricing__heading {
        font-size: clamp(38px, 12vw, 56px);
        max-width: 11ch;
    }

    .nvf-pricing__plans {
        margin-top: 54px;
    }

    .nvf-pricing__plan-inner {
        align-items: end;
        gap: 16px 12px;
        grid-template-columns: 24px minmax(0, 1fr) auto;
        grid-template-rows: auto auto;
    }

    .nvf-pricing__number {
        align-self: start;
        grid-column: 1;
        grid-row: 1;
        margin-top: 5px;
    }

    .nvf-pricing__identity {
        grid-column: 2 / -1;
        grid-row: 1;
        padding-right: 50px;
    }

    .nvf-pricing__package {
        font-size: clamp(25px, 8vw, 34px);
    }

    .nvf-pricing__frequency {
        grid-column: 2;
        grid-row: 2;
    }

    .nvf-pricing__price {
        align-items: flex-end;
        grid-column: 3;
        grid-row: 2;
        text-align: right;
    }

    .nvf-pricing__price-value {
        font-size: clamp(25px, 7vw, 32px);
    }

    .nvf-pricing__arrow {
        position: absolute;
        right: 0;
        top: 0;
    }

    .nvf-pricing__footer {
        align-items: flex-start;
        flex-direction: column;
    }
}

@media (max-width: 420px) {
    .nvf-pricing__plan-inner {
        grid-template-columns: 18px minmax(0, 1fr) auto;
    }

    .nvf-pricing__identity {
        padding-right: 42px;
    }

    .nvf-pricing__badge {
        font-size: 8px;
    }
}

@media (hover: none) {
    .nvf-pricing__plan:not(.nvf-pricing__plan--featured)::before {
        transform: translate3d(0, 101%, 0);
    }

    .nvf-pricing__plan:not(.nvf-pricing__plan--featured) :is(.nvf-pricing__package, .nvf-pricing__price, .nvf-pricing__arrow) {
        transform: none;
    }
}

@media (prefers-reduced-motion: reduce) {
    .nvf-pricing__plan::before,
    .nvf-pricing__plan-inner,
    .nvf-pricing__number,
    .nvf-pricing__package,
    .nvf-pricing__frequency,
    .nvf-pricing__price,
    .nvf-pricing__price-value,
    .nvf-pricing__note,
    .nvf-pricing__arrow,
    .nvf-pricing__arrow svg,
    .nvf-pricing__button,
    .nvf-pricing__button-icon {
        transition-duration: .01ms;
    }
}
