/* Equal spacing for tariff actions and the stacked benefits panel. */
.page-pricing .pricing-shell,
.page-cab .pricing-shell{row-gap:20px}
.plans-column .promo-cluster{margin:0 auto}
.plans-column .goo-defs{position:absolute;width:0;height:0;pointer-events:none}
.plans-column .promo-msg{margin:0;min-height:0}
.plans-column .promo-msg:not(:has(.show)){display:none}

/* Reduce the actual gap below the header by 55%, moving the whole checkout. */
.page-checkout{--checkout-header-height:64px}
.page-checkout #checkout{
  padding-top:calc(var(--checkout-header-height) + (var(--header-h) + var(--page-top) - var(--checkout-header-height)) * .45);
}
@media(max-width:899px){.page-checkout{--checkout-header-height:60px}}

/* The selected provider is visible even before JS can measure the moving frame. */
#groups:not(.is-highlight-ready) .co-tile.is-selected{
  outline:2px solid var(--accent);outline-offset:-2px;
}
#groups:not(.is-highlight-ready) .co-highlight{visibility:hidden}
#checkout #continueBtn[disabled]{cursor:wait}

/* Марки платёжных систем в плитках /checkout/. Высоты взяты из пропорций
   самих знаков — по тому же правилу, что у .pay-mark--mir/--sbp в main.css:
   SberPay — сплошная плашка, как круги Mastercard (20px);
   знак ЮMoney и щит Т-Банка — знаки-символы, по высоте ряда, как СБП. */
.pay-mark--sberpay{height:23px}
.pay-mark--yoomoney,.pay-mark--tbank{height:24px}
/* Иконка карты CloudPayments стоит в том же ряду. Сама иконка прежнего
   размера — сжимается только бокс, до высоты ряда, чтобы ряд оставался 24px. */
#groups .pay-marks .co-tile-icon{width:auto;height:100%}
@media(max-width:620px){
  .pay-mark--sberpay{height:20px}
  .pay-mark--yoomoney,.pay-mark--tbank{height:20px}
}

/* Блок «Способы оплаты» на /podpiska/. Знаки крупнее, чем в плитках /checkout/,
   в одной пропорции (×1,33), так что соотношение между ними прежнее.
   Высота ряда одна на все три плитки — по самому высокому знаку, чтобы заголовки
   стояли на одной линии; знаки пониже центрируются с равным запасом сверху и снизу.
   От края плитки до знаков видимо столько же, сколько от знаков до заголовка.
   Над заглавными буквами заголовка (16px/26px) строка сама держит 7,2px пустоты,
   поэтому знаки опущены на половину этого — 3,6px: верхнее поле больше, отступ
   до текста меньше, сумма та же, высота плитки не меняется (173 / 150px).
   /checkout/ не затрагивается — всё под .payment-tile. */
.payment-grid .payment-tile{padding-top:33.6px}
.payment-tile .pay-marks{height:32px;gap:13px;margin-bottom:26.4px}
.payment-tile .pay-mark--mir,.payment-tile .pay-mark--visa{height:16px}
.payment-tile .pay-mark--mc{height:26px}
.payment-tile .pay-mark--sberpay{height:30px}
.payment-tile .pay-mark--sbp,.payment-tile .pay-mark--tbank,.payment-tile .pay-mark--yoomoney{height:32px}
@media(max-width:620px){
  .payment-grid .payment-tile{padding-top:27.6px}
  .payment-tile .pay-marks{height:27px;gap:11px;margin-bottom:20.4px}
  .payment-tile .pay-mark--mir,.payment-tile .pay-mark--visa{height:13px}
  .payment-tile .pay-mark--mc{height:22px}
  .payment-tile .pay-mark--sberpay{height:25px}
  .payment-tile .pay-mark--sbp,.payment-tile .pay-mark--tbank,.payment-tile .pay-mark--yoomoney{height:27px}
}
