@charset "utf-8";
/* ===========================================================================
 * calculator-v4 — редизайн калькулятора стоимости обслуживания (ROKSIS).
 * Намеренно изолированный неймспейс .cv4 (свои классы, не пересекается со
 * старым .calculator-* / .calc-*). Значения — попиксельно из дизайн-хэндоффа.
 * ======================================================================== */

.cv4{
  --cv4-color-slider-track:#e3ecf3;
  font-family:var(--rd-font);
  color:var(--rd-color-text); line-height:1.4;
}
.cv4-section_compact-top{ padding-top:20px; }
.cv4 *{ box-sizing:border-box; }
.cv4 button{ font-family:inherit; }
.cv4 :is(button,a,summary){ touch-action:manipulation; -webkit-tap-highlight-color:rgb(from var(--rd-color-brand) r g b / .18); }
.cv4 [hidden]{ display:none!important; }
.cv4-sr-only{ position:absolute!important; width:1px!important; height:1px!important; padding:0!important; margin:-1px!important; overflow:hidden!important; clip:rect(0,0,0,0)!important; white-space:nowrap!important; border:0!important; }
.cv4 :is(button,input,summary,a):focus-visible{ outline:3px solid rgb(from var(--rd-color-action-primary-hover) r g b / .34); outline-offset:3px; }

.cv4__head h2{ font-size:var(--rd-type-section-size, 26px); font-weight:800; margin:0 0 14px; letter-spacing:var(--rd-tracking-normal, -.01em); line-height:var(--rd-type-section-leading, 1.15); color:var(--rd-color-text); text-wrap:balance; }
.cv4__sub{ margin:0 0 20px; font-size:var(--rd-type-lead-standard-size, 14px); line-height:var(--rd-type-lead-standard-leading); color:var(--rd-color-text-muted); font-weight:var(--rd-weight-regular, 600); text-wrap:pretty; }

.cv4__card{ background:var(--rd-color-surface); border-radius:18px; box-shadow:0 18px 50px -22px rgb(from var(--rd-color-shadow-brand) r g b / .45); padding:26px; }

.cv4__grid{ display:grid; grid-template-columns:1fr 360px; gap:28px; align-items:stretch; }

.cv4__step{ font-size:var(--rd-type-caption-size, 13px); line-height:var(--rd-type-caption-leading); font-weight:var(--rd-weight-semibold, 800); letter-spacing:.04em; text-transform:uppercase; color:var(--rd-color-control-muted); margin-bottom:12px; }

/* ---- Тарифы ---- */
.cv4__tariffs{ display:grid; grid-template-columns:1fr 1fr 1fr; gap:10px; margin-bottom:24px; }
.cv4-tariff{ text-align:left; cursor:pointer; padding:15px 16px; border-radius:14px; transition:border-color .15s,background-color .15s,box-shadow .15s; border:2px solid var(--rd-color-border); background:var(--rd-color-surface); }
.cv4-tariff.is-selected{ border-color:var(--rd-color-brand); background:var(--rd-color-surface-selected); box-shadow:0 8px 20px -10px rgb(from var(--rd-color-brand) r g b / .55); }
.cv4-tariff:not(.is-selected):active{ border-color:var(--rd-color-brand); background:var(--rd-color-surface-selected); }
.cv4-tariff__top{ display:flex; align-items:center; justify-content:space-between; gap:8px; }
.cv4-tariff__l{ display:flex; align-items:center; gap:9px; min-width:0; }
.cv4-tariff__dot{ flex:0 0 auto; width:17px; height:17px; border-radius:50%; box-sizing:border-box; border:2px solid var(--rd-color-border-strong); background:var(--rd-color-surface); transition:border .15s; }
.cv4-tariff.is-selected .cv4-tariff__dot{ border:5px solid var(--rd-color-brand); }
.cv4-tariff__name{ font-weight:700; font-size:var(--rd-type-compact-size,14px); line-height:var(--rd-type-compact-leading); color:var(--rd-color-text); white-space:nowrap; }
.cv4-tariff__hit{ font-size:var(--rd-type-caption-size, 10px); line-height:var(--rd-type-caption-leading); font-weight:var(--rd-weight-semibold, 800); padding:3px 8px; border-radius:99px; background:#fff0dc; color:#e0820a; letter-spacing:.03em; flex:0 0 auto; }
.cv4-tariff__price{ font-family:var(--rd-public-font, var(--rd-font-num, sans-serif)); font-weight:var(--rd-font-num-weight,700); font-size:23px; color:var(--rd-color-brand); white-space:nowrap; line-height:1; margin-top:12px; }
.cv4-tariff__per{ font-size:var(--rd-type-caption-size, 11px); line-height:var(--rd-type-caption-leading); color:var(--rd-color-control-muted); font-weight:600; margin-top:4px; }

/* ---- Табы ---- */
.cv4__tabs{ display:flex; gap:8px; margin-bottom:20px; }
.cv4-tab{ flex:1; display:flex; align-items:center; justify-content:center; gap:9px; height:46px; border-radius:12px; cursor:pointer; font-weight:700; font-size:var(--rd-type-action-size, 13.5px); line-height:var(--rd-type-action-leading); transition:border-color .15s,background-color .15s,color .15s,box-shadow .15s; border:1.5px solid var(--rd-color-border); background:var(--rd-color-surface); color:var(--rd-color-text-muted); }
.cv4-tab.is-active{ border:none; background:var(--rd-color-brand); color:var(--rd-color-text-on-brand); box-shadow:0 8px 18px -8px rgb(from var(--rd-color-brand) r g b / .7); }
.cv4-tab:not(.is-active):active{ border-color:var(--rd-color-brand); background:var(--rd-color-surface-selected); color:var(--rd-color-action-primary-hover); }
.cv4-tab__num{ width:22px; height:22px; border-radius:50%; display:inline-flex; align-items:center; justify-content:center; font-family:var(--rd-public-font, var(--rd-font-num, sans-serif)); font-weight:var(--rd-font-num-weight,700); font-size:var(--rd-type-caption-size,12px); line-height:var(--rd-type-caption-leading); flex:0 0 auto; background:#fff0dc; color:#e0820a; }
.cv4-tab.is-active .cv4-tab__num{ background:rgb(from var(--rd-color-surface) r g b / .25); color:var(--rd-color-text-on-brand); }

.cv4__panel{ display:none; }
.cv4__panel.is-active{ display:block; }

/* ---- Поля ПК/серверы ---- */
.cv4-fields{ display:flex; flex-direction:column; gap:12px; }
.cv4-field{ display:flex; gap:16px; padding:13px 18px; border:1.5px solid var(--rd-color-border); border-radius:14px; background:#fafcfe; transition:opacity .15s; }
.cv4-field.is-disabled{ opacity:.5; }
.cv4-field__icon{ flex:0 0 44px; padding-top:2px; }
.cv4-field__icon svg{ width:44px; height:44px; }
.cv4-field__body{ flex:1; min-width:0; }
.cv4-field__head{ display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:12px; }
.cv4-field__title{ font-size:var(--rd-type-compact-size, 15px); line-height:var(--rd-type-compact-leading); font-weight:700; display:flex; align-items:center; gap:7px; }
.cv4-num{ width:68px; height:36px; border:2px solid var(--rd-color-border); border-radius:10px; text-align:center; font-weight:var(--rd-font-num-weight,700); font-size:var(--rd-type-form-control-size,15px); color:var(--rd-color-text); font-family:var(--rd-public-font, var(--rd-font-num, sans-serif)); -moz-appearance:textfield; }
.cv4-num::-webkit-outer-spin-button,.cv4-num::-webkit-inner-spin-button{ -webkit-appearance:none; margin:0; }
.cv4-num:focus{ border-color:var(--rd-color-brand); }
.cv4-field__labels{ display:flex; justify-content:space-between; font-size:var(--rd-type-caption-size, 12px); line-height:var(--rd-type-caption-leading); color:var(--rd-color-control-muted); margin-top:14px; font-weight:600; }

.cv4-field__title-wrap{ position:relative; display:inline-flex; align-items:center; gap:7px; }
.cv4-help{ position:relative; display:inline-flex; align-items:center; justify-content:center; width:44px; height:44px; margin:-13.5px; padding:0; border:0; background:transparent; color:var(--rd-color-control-muted); font-size:var(--rd-type-caption-size); line-height:1; font-weight:var(--rd-weight-extrabold); cursor:help; flex:0 0 44px; }
.cv4-help__glyph{ display:inline-flex; align-items:center; justify-content:center; width:17px; height:17px; border:1.5px solid var(--rd-color-border-strong); border-radius:50%; background:var(--rd-color-surface); }
.cv4-help:active .cv4-help__glyph{ border-color:var(--rd-color-brand); color:var(--rd-color-action-primary-hover); }

/* подсказка про лимит Базового */
.cv4-hint{ display:none; align-items:center; gap:9px; padding:10px 14px; border-radius:10px; background:var(--rd-color-warning-bg); border:1px solid var(--rd-color-warning-border); font-size:var(--rd-type-caption-size, 12.5px); line-height:var(--rd-type-caption-leading); color:var(--rd-color-warning); font-weight:600; }
.cv4-hint.is-show{ display:flex; }
.cv4-hint a,.cv4-hint__link{ color:var(--rd-color-brand); text-decoration:underline; cursor:pointer; }
.cv4-hint svg{ flex:0 0 auto; }

/* ---- Инфраструктура (сервисы) ---- */
.cv4__svc-head{ display:flex; align-items:baseline; justify-content:space-between; margin-bottom:14px; }
.cv4__svc-title{ font-size:var(--rd-type-compact-size, 15px); line-height:var(--rd-type-compact-leading); font-weight:700; }
.cv4__svc-avail{ font-size:var(--rd-type-compact-size, 13px); line-height:var(--rd-type-compact-leading); color:var(--rd-color-control-muted); font-weight:600; }
.cv4__svc-avail b{ color:var(--rd-color-brand); font-weight:800; }
.cv4__svc-grid{ display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.cv4-svc{ display:flex; align-items:center; gap:10px; padding:11px 12px; border-radius:12px; border:1.5px solid var(--rd-color-border); background:var(--rd-color-surface); position:relative; transition:border-color .15s,background .15s; }
.cv4-svc.is-checked{ border-color:var(--rd-color-brand); background:var(--rd-color-surface-selected); }
.cv4-svc:active{ border-color:var(--rd-color-brand); }
.cv4-svc.is-hidden{ display:none; }
.cv4-svc__toggle{ display:flex; align-items:center; gap:10px; cursor:pointer; flex:1; min-width:0; padding:0; border:0; background:transparent; text-align:left; }
.cv4-svc__dot{ flex:0 0 auto; width:20px; height:20px; border-radius:6px; box-sizing:border-box; display:flex; align-items:center; justify-content:center; background:var(--rd-color-surface); border:1.5px solid var(--rd-color-border-strong); transition:.15s; }
.cv4-svc.is-checked .cv4-svc__dot{ background:var(--rd-color-brand); border-color:var(--rd-color-brand); }
.cv4-svc__dot svg{ display:block; opacity:0; transition:opacity .12s; }
.cv4-svc.is-checked .cv4-svc__dot svg{ opacity:1; }
.cv4-svc__name{ font-size:var(--rd-type-compact-size, 13.5px); font-weight:700; color:var(--rd-color-text); line-height:var(--rd-type-compact-leading, 1.25); min-width:0; }
.cv4-svc__counter{ display:flex; align-items:center; gap:2px; flex:0 0 auto; }
.cv4-step{ width:26px; height:26px; border:1.5px solid var(--rd-color-border-strong); background:var(--rd-color-surface); border-radius:7px; color:var(--rd-color-brand); font-size:16px; font-weight:700; cursor:pointer; line-height:1; display:flex; align-items:center; justify-content:center; padding:0; transition:border-color .12s ease,background-color .12s ease; }
.cv4-step:hover{ border-color:var(--rd-color-brand); background:var(--rd-color-surface-selected); }
.cv4-svc__count{ min-width:24px; text-align:center; font-family:var(--rd-public-font, var(--rd-font-num, sans-serif)); font-weight:var(--rd-font-num-weight,700); font-size:var(--rd-type-compact-size,14px); line-height:var(--rd-type-compact-leading); color:var(--rd-color-text); }

/* тёмный тултип (сервисы и «?») */
.cv4-tip{ position:absolute; left:0; right:0; bottom:calc(100% + 8px); background:var(--rd-color-text); color:var(--rd-color-text-on-inverse); font-size:var(--rd-type-caption-size, 11.5px); line-height:var(--rd-type-caption-leading, 1.35); font-weight:var(--rd-weight-regular, 500); padding:9px 11px; border-radius:9px; opacity:0; visibility:hidden; transform:translateY(4px); transition:opacity .15s,transform .15s; pointer-events:none; z-index:20; box-shadow:0 10px 26px -8px rgba(8,20,30,.55); }
.cv4-svc:hover .cv4-tip,.cv4-svc:has(:focus-visible) .cv4-tip{ opacity:1; visibility:visible; transform:none; }
.cv4-field__title-wrap > .cv4-tip{ left:auto; right:-8px; min-width:180px; }
.cv4-field__title-wrap:hover > .cv4-tip,.cv4-field__title-wrap:has(:focus-visible) > .cv4-tip{ opacity:1; visibility:visible; transform:none; }

/* ---- Карточка стоимости ---- */
.cv4__cost{ background:var(--rd-color-brand); border-radius:16px; padding:24px; color:var(--rd-color-text-on-brand); position:relative; overflow:hidden; display:flex; flex-direction:column; margin-top:33px; }
.cv4-circle{ position:absolute; right:-50px; top:-55px; width:160px; height:160px; border-radius:50%; background:rgb(from var(--rd-color-surface) r g b / .11); pointer-events:none; transform:scale(var(--cv4-circle-scale,1)); transform-origin:100% 0; transition:transform .6s cubic-bezier(.34,1.45,.5,1); }
.cv4__cost-inner{ position:relative; flex:1; display:flex; flex-direction:column; }
.cv4-cost__label{ font-size:var(--rd-type-caption-size, 13px); line-height:var(--rd-type-caption-leading); font-weight:600; opacity:.92; }
.cv4-cost__tariff{ font-size:var(--rd-type-body-size,16px); line-height:var(--rd-type-body-leading); font-weight:700; margin-top:2px; }
.cv4-cost__price-wrap{ display:flex; align-items:flex-end; gap:6px; margin:12px 0 4px; flex-wrap:wrap; }
.cv4-cost__price{ font-family:var(--rd-public-font, var(--rd-font-num, sans-serif)); font-weight:var(--rd-font-num-weight,700); font-size:42px; line-height:.95; }
.cv4-cost__price.is-individual{ font-size:27px; line-height:1.1; }
.cv4-cost__unit{ font-size:var(--rd-type-caption-size, 24px); line-height:var(--rd-type-caption-leading); font-weight:var(--rd-weight-semibold, 700); padding-bottom:3px; }
.cv4-cost__permonth{ font-size:var(--rd-type-caption-size, 12px); line-height:var(--rd-type-caption-leading); opacity:.85; font-weight:var(--rd-weight-semibold, 700); margin-left:auto; padding-bottom:5px; }
.cv4-cost__metrics{ display:flex; gap:8px; margin:10px 0; flex:1; max-height:150px; }
.cv4-cost__metric{ flex:1; background:rgb(from var(--rd-color-surface) r g b / .16); border-radius:13px; padding:14px; display:flex; flex-direction:column; justify-content:center; }
.cv4-cost__metric-val{ font-family:var(--rd-public-font, var(--rd-font-num, sans-serif)); font-weight:var(--rd-font-num-weight,700); font-size:22px; }
.cv4-cost__metric-cap{ font-size:var(--rd-type-caption-size, 11px); opacity:.9; line-height:var(--rd-type-caption-leading, 1.3); margin-top:4px; }
.cv4-cost__break{ border-top:1px solid rgb(from var(--rd-color-text-on-inverse) r g b / .2); padding-top:12px; margin-top:auto; display:flex; flex-direction:column; gap:8px; }
.cv4-cost__row{ display:flex; justify-content:space-between; font-size:var(--rd-type-compact-size,13px); line-height:var(--rd-type-compact-leading); }
.cv4-cost__row.is-hidden{ display:none; }
.cv4-cost__row span:first-child{ opacity:.9; font-weight:600; }
.cv4-cost__row span:last-child{ font-weight:var(--rd-font-num-weight,700); font-family:var(--rd-public-font, var(--rd-font-num, sans-serif)); }
.cv4-cost__order{ width:100%; height:50px; border:none; border-radius:12px; background:var(--rd-color-action-accent); color:var(--rd-color-text-on-accent); font-weight:var(--rd-weight-bold, 800); font-size:var(--rd-type-action-size, 15px); line-height:var(--rd-type-action-leading); letter-spacing:var(--rd-tracking-normal, .02em); cursor:pointer; margin-top:12px; box-shadow:0 8px 20px -6px rgb(from var(--rd-color-action-accent) r g b / .6); transition:background .15s; text-decoration:none; display:flex; align-items:center; justify-content:center; }
.cv4-cost__order:hover{ background:var(--rd-color-action-accent-hover); color:var(--rd-color-text-on-accent); }
.cv4-cost__order:active{ background:var(--rd-color-action-accent-hover); box-shadow:none; }
.cv4-cost__helper{ font-size:var(--rd-type-caption-size, 11px); opacity:.9; text-align:center; margin-top:8px; line-height:var(--rd-type-caption-leading, 1.4); }

/* ---- Что входит ---- */
.cv4__features{ margin-top:24px; padding-top:22px; border-top:1px solid var(--rd-color-border-soft); }
.cv4__features-label{ font-size:var(--rd-type-metadata-size,13px); line-height:var(--rd-type-caption-leading); font-weight:800; letter-spacing:.04em; text-transform:uppercase; color:var(--rd-color-control-muted); margin-bottom:14px; }
.cv4__features-label span{ font-weight:600; text-transform:none; letter-spacing:0; }
.cv4__features-grid{ display:grid; grid-template-columns:repeat(9,1fr); gap:8px; }
.cv4-feature{ position:relative; display:flex; flex-direction:column; align-items:center; padding:16px 6px; border-radius:12px; cursor:pointer; border:1.5px solid transparent; transition:border-color .15s,background-color .15s,opacity .15s,filter .15s; background:var(--rd-color-surface-soft); }
.cv4-feature:hover{ border-color:var(--rd-color-surface-brand-pale); }
.cv4-feature:active{ border-color:var(--rd-color-brand); background:var(--rd-color-surface-selected); }
.cv4-feature.is-dim{ opacity:.45; filter:grayscale(1); background:#f6f8fa; }
.cv4-feature__icon{ width:56px; height:46px; background-size:contain; background-repeat:no-repeat; background-position:center; }
.cv4-feature__name{ font-size:var(--rd-type-caption-size, 10.5px); font-weight:700; color:#3a4855; line-height:var(--rd-type-caption-leading, 1.2); margin-top:10px; text-align:center; }
.cv4__features-more{ display:none; min-height:44px; margin:12px auto 0; padding:8px 16px; border:1.5px solid var(--rd-color-border-strong); border-radius:10px; background:var(--rd-color-surface); color:var(--rd-color-action-primary-hover); font-size:var(--rd-type-action-size, 13px); line-height:var(--rd-type-action-leading); font-weight:700; cursor:pointer; }
.cv4__features-more:active{ border-color:var(--rd-color-brand); background:var(--rd-color-surface-selected); }

@media (hover:hover){
  .cv4-tariff:not(.is-selected):hover{ border-color:var(--rd-color-surface-brand-pale); background:var(--rd-color-surface-soft); }
  .cv4-tab:not(.is-active):hover{ border-color:var(--rd-color-surface-brand-pale); background:var(--rd-color-surface-soft); color:var(--rd-color-action-primary-hover); }
  .cv4-help:hover .cv4-help__glyph{ border-color:var(--rd-color-brand); color:var(--rd-color-action-primary-hover); }
  .cv4-svc:hover{ border-color:var(--rd-color-surface-brand-pale); }
  .cv4-popup__close:hover{ background:var(--rd-color-surface-selected); color:var(--rd-color-action-primary-hover); }
  .cv4__features-more:hover{ border-color:var(--rd-color-brand); background:var(--rd-color-surface-soft); }
}

/* ---- Утверждённый объединённый калькулятор и тарифы ---- */
.cv4__cost_collapsible{ appearance:none; }
.cv4-cost__summary{ position:relative; z-index:1; display:block; list-style:none; cursor:default; }
.cv4-cost__summary::-webkit-details-marker{ display:none; }
.cv4-cost__summary::marker{ display:none; content:""; }
.cv4-cost__summary > .cv4-cost__label,.cv4-cost__summary > .cv4-cost__tariff{ display:block; }
.cv4-cost__summary-action{ display:none; }
.cv4__cost-inner_details{ padding-top:10px; }
.cv4_with-tariffs .rd-tariffs_embedded{ margin-top:48px; padding:0; background:transparent; }
.cv4_with-tariffs .rd-tariffs_embedded .rd-tariffs__disclosure{ position:relative; border-top:1px solid var(--rd-color-border-soft); }
.cv4_with-tariffs .rd-tariffs_embedded .rd-tariffs__summary{ width:max-content; min-height:44px; margin:-23px auto 0; padding:0 12px; background:var(--rd-color-surface); }
.cv4_with-tariffs .rd-tariffs_embedded .rd-tariffs__summary::before{ display:none; }
.cv4_with-tariffs .rd-tariffs_embedded .rd-tariffs__toggle{ width:224px; min-width:224px; min-height:44px; justify-content:center; padding:0; border:1px solid var(--rd-color-surface-brand-pale); border-radius:10px; background:var(--rd-color-surface-selected); color:var(--rd-color-action-primary-hover); box-shadow:none; }
.cv4_with-tariffs .rd-tariffs_embedded .rd-tariffs__toggle-open,.cv4_with-tariffs .rd-tariffs_embedded .rd-tariffs__toggle-close{ position:absolute; top:50%; left:50%; width:max-content; transform:translate(-50%,-50%); text-align:center; }
.cv4_with-tariffs .rd-tariffs_embedded .rd-tariffs__disclosure[open] .rd-tariffs__toggle-close{ left:calc(50% - 16px); }
.cv4_with-tariffs .rd-tariffs_embedded .rd-tariffs__toggle svg{ position:absolute; top:50%; right:16px; transform:translateY(-50%); }
.cv4_with-tariffs .rd-tariffs_embedded .rd-tariffs__disclosure[open] .rd-tariffs__toggle{ border-color:var(--rd-color-surface-brand-pale); background:var(--rd-color-surface); box-shadow:none; }
.cv4_with-tariffs .rd-tariffs_embedded .rd-tariffs__disclosure[open] .rd-tariffs__toggle svg{ transform:translateY(-50%) rotate(180deg); }
.cv4_with-tariffs .rd-tariffs_embedded .rd-tariffs__body{ margin-top:22px; padding:0; }

/* ---- Попап ---- */
@keyframes cv4pop{ from{ opacity:0; transform:translateY(10px) scale(.97);} to{ opacity:1; transform:none;} }
@keyframes cv4fade{ from{ opacity:0;} to{ opacity:1;} }
.cv4-popup{ position:fixed; inset:0; background:rgba(13,28,40,.55); z-index:1050; display:none; align-items:center; justify-content:center; padding:24px; animation:cv4fade .15s ease; overscroll-behavior:contain; }
.cv4-popup.is-open{ display:flex; }
.cv4-popup__box{ background:var(--rd-color-surface); border-radius:18px; max-width:480px; width:100%; padding:30px; box-shadow:0 30px 80px -20px rgba(8,20,30,.6); animation:cv4pop .2s cubic-bezier(.2,.8,.3,1); position:relative; }
.cv4-popup__close{ position:absolute; top:16px; right:16px; width:32px; height:32px; border:none; background:#f1f5f8; border-radius:9px; color:var(--rd-color-text-muted); font-size:18px; cursor:pointer; line-height:1; }
.cv4-popup__head{ display:flex; align-items:center; gap:14px; margin-bottom:16px; padding-right:36px; }
.cv4-popup__icon-wrap{ flex:0 0 auto; width:60px; height:60px; border-radius:14px; background:#f1f9ff; display:flex; align-items:center; justify-content:center; }
.cv4-popup__icon{ width:38px; height:32px; background-size:contain; background-repeat:no-repeat; background-position:center; }
.cv4-popup__name{ font-size:var(--rd-type-card-major-size, 19px); font-weight:var(--rd-weight-bold, 800); color:var(--rd-color-text); line-height:var(--rd-type-card-major-leading, 1.2); }
.cv4-popup__tier{ display:inline-block; margin-top:6px; font-size:var(--rd-type-caption-size, 11px); line-height:var(--rd-type-caption-leading); font-weight:var(--rd-weight-semibold, 700); padding:3px 10px; border-radius:99px; background:#f1f7fc; color:var(--rd-color-action-primary-hover); }
.cv4-popup__desc{ font-size:var(--rd-type-compact-size, 14px); color:#4a5763; line-height:var(--rd-type-compact-leading, 1.55); font-weight:var(--rd-weight-regular, 500); }

@media not all{
  .cv4-popup,.cv4-popup__box{ animation:none; }
  .cv4 :is(.cv4-tariff,.cv4-tariff__dot,.cv4-tab,.cv4-field,.cv4-svc,.cv4-svc__dot,.cv4-svc__dot svg,.cv4-step,.cv4-tip,.cv4-circle,.cv4-cost__order,.cv4-feature){ transition:none; }
}

/* ---- noUiSlider под дизайн ---- */
.cv4 .noUi-target{ border:none; box-shadow:none; background:var(--cv4-color-slider-track); height:6px; border-radius:99px; margin:4px 0; }
.cv4 .noUi-connects{ border-radius:99px; }
.cv4 .noUi-connect{ background:var(--rd-color-brand); }
.cv4 .noUi-horizontal .noUi-handle{ width:18px; height:18px; right:-9px; top:-6px; border:none; border-radius:50%; background:var(--rd-color-surface); box-shadow:0 0 0 4px var(--rd-color-brand),0 2px 6px rgb(from var(--rd-color-brand) r g b / .4); cursor:pointer; }
.cv4 .noUi-handle:before,.cv4 .noUi-handle:after{ display:none; }
.cv4-field.is-disabled .noUi-connect{ background:#c2cedb; }
.cv4-field.is-disabled .noUi-handle{ box-shadow:0 0 0 4px #c2cedb,0 1px 3px rgb(from var(--rd-color-mask) r g b / .15); }

/* ---- Адаптив ---- */
@media (max-width:992px){
  .cv4__features-grid{ grid-template-columns:repeat(3,minmax(0,1fr)); }
}
@media (max-width:900px){
  .cv4__grid{ grid-template-columns:1fr; }
  .cv4__cost{ margin-top:0; }
}
@media (max-width:560px){
  .cv4__head h2{ font-size:var(--rd-type-section-size, 21px); }
  .cv4__card{ padding:18px; }
  .cv4__tariffs{ grid-template-columns:1fr; }
  .cv4__svc-grid{ grid-template-columns:1fr; }
  .cv4__features-grid{ grid-template-columns:repeat(3,minmax(0,1fr)); }
  .cv4-cost__price{ font-size:36px; }
  .cv4__tabs .cv4-tab{ font-size:var(--rd-type-action-size, 12px); padding:0 4px; }

  /* Историческая ветка сохраняется только как неактивный типографический baseline. */
  .cv4_combined .cv4__grid{ display:flex; flex-direction:column; gap:16px; }
  .cv4_combined .cv4__controls{ display:contents; }
  .cv4_combined .cv4__step{ order:1; margin-bottom:0; }
  .cv4_combined .cv4__tariffs{ order:2; margin-bottom:0; }
  .cv4_combined .cv4__cost{ order:3; margin:0; padding:20px; }
  .cv4_combined .cv4__tabs{ order:4; margin:0; }
  .cv4_combined .cv4__panel{ order:5; }
  .cv4_combined .cv4-cost__summary{ cursor:pointer; }
  .cv4_combined .cv4-cost__summary-action{ display:inline-flex; align-items:center; min-height:44px; margin-top:12px; color:var(--rd-color-text-on-brand); font-size:var(--rd-type-action-size,12px); line-height:var(--rd-type-action-leading); font-weight:700; text-decoration:underline; text-underline-offset:3px; }
  .cv4_combined [data-cv4-cost-close]{ display:none; }
  .cv4_combined .cv4__cost_collapsible[open] [data-cv4-cost-open]{ display:none; }
  .cv4_combined .cv4__cost_collapsible[open] [data-cv4-cost-close]{ display:inline; }
  .cv4_combined .cv4__cost-inner_details{ padding-top:14px; }
  .cv4_combined .cv4-num{ min-height:44px; }
  .cv4_combined .cv4-step{ width:44px; height:44px; }
  .cv4_combined .cv4-popup__close{ width:44px; height:44px; }
  .cv4_combined .cv4-feature__name{ font-size:var(--rd-type-caption-size, 12px); }
  .cv4_combined .cv4__features-grid .cv4-feature:nth-child(n+7){ display:none; }
  .cv4_combined.is-features-expanded .cv4__features-grid .cv4-feature:nth-child(n+7){ display:flex; }
  .cv4_combined .cv4__features-more{ display:block; }
  .cv4_combined .noUi-horizontal .noUi-handle::after{ content:""; display:block; position:absolute; inset:-13px; }

  .cv4_with-tariffs .rd-tariffs_embedded{ margin-top:40px; padding:0; }
  .cv4_with-tariffs .rd-tariffs_embedded .rd-tariffs__summary{ min-height:44px; margin-top:-23px; padding:0 8px; }
  .cv4_with-tariffs .rd-tariffs_embedded .rd-tariffs__toggle{ width:210px; min-width:210px; max-width:calc(100vw - 96px); min-height:44px; padding:0; white-space:normal; text-align:center; }
  .cv4_with-tariffs .rd-tariffs_embedded .rd-tariffs__toggle svg{ right:14px; }
  .cv4_with-tariffs .rd-tariffs_embedded .rd-tariffs__body{ margin-top:18px; padding:0; }
  .cv4_with-tariffs .rd-tariffs_embedded .rd-tariffs__difference-action{ min-height:44px; }
}

@media (max-width:340px){
  .cv4_combined .cv4__features-grid{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  .cv4_combined .cv4__tabs{ gap:5px; }
  .cv4_combined .cv4__tabs .cv4-tab{ min-width:0; gap:5px; padding:0 2px; font-size:var(--rd-type-action-size, 11px); }
  .cv4_combined .cv4__tabs .cv4-tab__num{ width:20px; height:20px; }
}

/* Numeric geometry is intentional; only the canonical figure behavior is shared. */
:is(
  .cv4-tariff__price,
  .cv4-tab__num,
  .cv4-num,
  .cv4-svc__count,
  .cv4-cost__price,
  .cv4-cost__metric-val,
  .cv4-cost__row span:last-child
){
  font-variant-numeric:var(--rd-numeric-variant);
}
