/* Plans comparison: a table from 720px, a card per plan below. */
.cms-block--pricing_table {
    --ptable-featured: var(--c-accent-soft);
    --ptable-yes: var(--c-success, var(--c-accent));
    --ptable-no: var(--c-text-faint, var(--c-text-muted));
}

/* ---------- table ---------- */
.cms-block--pricing_table .cms-ptable__scroll {
    display: none;
    max-width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}
.cms-block--pricing_table .cms-ptable__table {
    width: 100%;
    min-width: calc(12rem + var(--ptable-plans) * 9.5rem);
    border-collapse: separate;
    border-spacing: 0;
    font-size: var(--t-sm);
    line-height: var(--lh-ui);
}
.cms-block--pricing_table .cms-ptable__table th,
.cms-block--pricing_table .cms-ptable__table td {
    padding: var(--s-3) var(--s-4);
    border-bottom: 1px solid var(--c-border);
    text-align: center;
    vertical-align: middle;
}
.cms-block--pricing_table .cms-ptable__corner { border-bottom-color: transparent; }
.cms-block--pricing_table .cms-ptable__plan {
    vertical-align: bottom;
    padding-block: var(--s-5) var(--s-4);
    font-weight: 400;
    border-radius: var(--r-md) var(--r-md) 0 0;
}
.cms-block--pricing_table .cms-ptable__plan-inner {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--s-2);
}
.cms-block--pricing_table .cms-ptable__name {
    margin: 0;
    font-family: var(--font-display);
    font-size: var(--t-md);
    font-weight: var(--fw-heading);
    color: var(--c-text-strong);
}
.cms-block--pricing_table .cms-ptable__badge {
    display: inline-block;
    padding: 0.2rem 0.6rem;
    border-radius: var(--r-pill);
    background: var(--c-mark);
    color: #15171c;
    font-size: var(--t-xs);
    font-weight: 700;
    white-space: nowrap;
}
.cms-block--pricing_table .cms-ptable__price {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    justify-content: center;
    gap: 0 var(--s-2);
    margin: 0;
}
.cms-block--pricing_table .cms-ptable__amount {
    font-family: var(--font-display);
    font-size: var(--t-lg);
    font-weight: 700;
    color: var(--c-text-strong);
    white-space: nowrap;
}
.cms-block--pricing_table .cms-ptable__old { color: var(--c-text-muted); white-space: nowrap; }
.cms-block--pricing_table .cms-ptable__period { color: var(--c-text-muted); font-size: var(--t-sm); }
.cms-block--pricing_table .cms-ptable__description { color: var(--c-text-muted); font-size: var(--t-sm); margin: 0; }
.cms-block--pricing_table .cms-ptable__action { display: block; width: 100%; margin-top: var(--s-2); }
.cms-block--pricing_table .cms-ptable__action .cms-btn { width: 100%; }

.cms-block--pricing_table .cms-ptable__group th {
    padding-top: var(--s-5);
    text-align: left;
    font-size: var(--t-xs);
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--c-text-muted);
}
.cms-block--pricing_table .cms-ptable__table .cms-ptable__feature { text-align: left; font-weight: 500; }
.cms-block--pricing_table .cms-ptable__feature-title { display: block; color: var(--c-text); }
.cms-block--pricing_table .cms-ptable__hint {
    display: block;
    margin-top: 0.15rem;
    font-weight: 400;
    font-size: var(--t-xs);
    color: var(--c-text-muted);
}
.cms-block--pricing_table .cms-ptable__row:hover > * { background-color: var(--c-surface-sunk); }
.cms-block--pricing_table .is-featured.cms-ptable__plan,
.cms-block--pricing_table .is-featured.cms-ptable__cell,
.cms-block--pricing_table .cms-ptable__row:hover > .is-featured { background-color: var(--ptable-featured); }
.cms-block--pricing_table .is-featured.cms-ptable__plan { box-shadow: inset 0 3px 0 var(--c-accent); }

.cms-block--pricing_table .cms-ptable__mark { display: inline-flex; align-items: center; justify-content: center; }
.cms-block--pricing_table .cms-ptable__mark .cms-icon { width: 1.25rem; height: 1.25rem; }
.cms-block--pricing_table .cms-ptable__mark--yes { color: var(--ptable-yes); }
.cms-block--pricing_table .cms-ptable__mark--no { color: var(--ptable-no); }
.cms-block--pricing_table .cms-ptable__mark--empty { color: var(--ptable-no); }
.cms-block--pricing_table .cms-ptable__text { font-weight: 600; color: var(--c-text); }

/* ---------- cards (phones) ---------- */
.cms-block--pricing_table .cms-ptable__cards {
    display: grid;
    gap: var(--s-5);
    margin: 0;
    padding: 0;
    list-style: none;
}
.cms-block--pricing_table .cms-ptable__card {
    display: flex;
    flex-direction: column;
    gap: var(--s-3);
    min-width: 0;
}
.cms-block--pricing_table .cms-ptable__card.is-featured { border-color: var(--c-accent); box-shadow: 0 0 0 1px var(--c-accent); }
.cms-block--pricing_table .cms-ptable__card-head {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: var(--s-2);
}
.cms-block--pricing_table .cms-ptable__card .cms-ptable__price { justify-content: flex-start; }
.cms-block--pricing_table .cms-ptable__list { margin: 0; font-size: var(--t-sm); }
.cms-block--pricing_table .cms-ptable__list-group {
    padding-top: var(--s-3);
    font-size: var(--t-xs);
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--c-text-muted);
}
.cms-block--pricing_table .cms-ptable__list-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--s-3);
    padding: var(--s-2) 0;
    border-bottom: 1px solid var(--c-border);
}
.cms-block--pricing_table .cms-ptable__list-row dt { min-width: 0; overflow-wrap: anywhere; }
.cms-block--pricing_table .cms-ptable__list-row dd { margin: 0; flex: 0 0 auto; max-width: 50%; text-align: right; overflow-wrap: anywhere; }

.cms-block--pricing_table .cms-ptable__note {
    margin: var(--s-5) 0 0;
    color: var(--c-text-muted);
    font-size: var(--t-sm);
}

@media (min-width: 45rem) {
    .cms-block--pricing_table .cms-ptable__scroll { display: block; }
    .cms-block--pricing_table .cms-ptable__cards { display: none; }
}