.bel-pricing-tabs__bar { display: grid; grid-auto-flow: column; grid-auto-columns: 1fr; width: min(740px, 100%); margin: 0 auto 46px; padding: 4px; border: 1px solid var(--bel-line); background: #fff; }
.bel-pricing-tabs.is-dark .bel-pricing-tabs__bar { border-color: var(--bel-line-light); background: transparent; }
.bel-pricing-tabs__bar [role="tab"] { min-height: 54px; padding: 8px 14px; border: 0; background: transparent; color: var(--bel-heading); font: 500 19px/1.2 var(--bel-font-h); cursor: pointer; transition: background-color .25s, color .25s; }
.bel-pricing-tabs.is-dark .bel-pricing-tabs__bar [role="tab"] { color: #fff; }
.bel-pricing-tabs__bar [role="tab"]:hover { color: var(--bel-accent); }
.bel-pricing-tabs__bar [role="tab"][aria-selected="true"], .bel-pricing-tabs.is-dark .bel-pricing-tabs__bar [role="tab"][aria-selected="true"] { background: var(--bel-accent); color: var(--bel-on-accent); }
.bel-pricing-tabs__panel { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 30px; animation: bel-pt-fade .45s var(--bel-ease); }
.bel-pricing-tabs__panel[hidden] { display: none; }
@keyframes bel-pt-fade { from { opacity: 0; transform: translateY(14px); } }

.bel-plan { display: flex; flex-direction: column; background: var(--bel-grey); background-image: var(--bel-tex-light); color: var(--bel-text); }
.bel-plan__head { display: flex; align-items: center; justify-content: center; gap: 16px; min-height: 120px; padding: 20px; }
.bel-plan__icon { width: 46px; height: 46px; color: var(--bel-heading); stroke-width: 1.1; }
.bel-plan__name, .bel-tex-dark .bel-plan__name { margin: 0; color: var(--bel-heading); font-size: clamp(1.5rem, 2.2vw, 1.9rem); transition: color .3s; }
.bel-plan__price { display: flex; align-items: baseline; justify-content: center; gap: 8px; min-height: 102px; margin: 0; padding: 20px; background: var(--bel-dark); color: #fff; font: 500 clamp(1.4rem, 2.2vw, 1.9rem)/1.2 var(--bel-font-h); transition: background-color .3s, color .3s; }
.bel-plan__price strong { font-weight: 500; }
.bel-plan__features { flex: 1; margin: 0; padding: 42px 30px 20px; list-style: none; text-align: center; }
.bel-plan__features li { position: relative; display: table; margin: 0 auto; padding: 11px 0 11px 18px; color: var(--bel-heading); }
.bel-plan__features li::before { content: ""; position: absolute; left: 0; top: 50%; width: 6px; height: 6px; border-radius: 50%; background: currentColor; transform: translateY(-50%); }
.bel-plan__features li.is-off { color: #9a9a9a; text-decoration: line-through; text-decoration-color: rgba(0, 0, 0, .2); }
.bel-plan__foot { padding: 20px 30px 54px; text-align: center; }
.bel-plan.is-featured { clip-path: polygon(0 0, calc(100% - 60px) 0, 100% 90px, 100% 100%, 0 100%); }
.bel-plan.is-featured .bel-plan__icon, .bel-plan.is-featured .bel-plan__name, .bel-tex-dark .bel-plan.is-featured .bel-plan__name { color: var(--bel-accent); }
.bel-plan.is-featured .bel-plan__price, .bel-plan:hover .bel-plan__price { background: var(--bel-accent); color: var(--bel-on-accent); }
.bel-plan:not(.is-featured):hover .bel-btn--dark { --bel-btn-bg: var(--bel-accent); --bel-btn-fg: var(--bel-on-accent); --bel-btn-line: var(--bel-accent); color: var(--bel-on-accent); }
@media (max-width: 1024px) { .bel-pricing-tabs__panel { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 680px) {
	.bel-pricing-tabs__panel { grid-template-columns: 1fr; }
	.bel-pricing-tabs__bar [role="tab"] { min-height: 48px; padding: 6px; font-size: 15px; }
}
