/* assets/ru.css — the Russian storefront's own layer on top of the shared
 * design system (assets/site.css + the shared page CSS, assets/page-*.css).
 * Only what the Russian pages have and the English ones do not lives here:
 * the editorial text above the tariffs, the «Покрытие и условия» window, the
 * per-day term picker with its prices, the look-alike chips, the second line
 * of buttons, and the Russian sections below the tariffs (why / help / FAQ /
 * other destinations). Everything else — tokens, type, header, footer, blocks,
 * the plan card itself — is the English design, unchanged.
 * Versioned by seo/stamp-assets.mjs like every other asset. */

/* ---------- country page: the text above the tariffs ---------- */
.cp-title h1{margin:0}
.cp-text{max-width:760px;margin-top:16px}
.cp-text .lead{margin:0 0 14px;font-size:clamp(16px,1.8vw,19px)}
.cp-text .intro{margin:0 0 12px;color:var(--muted);line-height:1.7}
.cp-text .facts{margin:14px 0 0;color:var(--muted);font-size:14px;line-height:1.7}
.cp-text .facts b{color:var(--text)}
@media (max-width:599px){.cp-text{margin-top:12px}.cp-text .lead{font-size:16px}}

/* ---------- loading / empty ---------- */
.packages{display:block}
.packages-status:empty{display:none}
.packages-status{margin:0 0 22px;text-align:center}
/* While a country page loads its plans (#packagesStatus says «Загружаем
   тарифы…»), the empty «Тарифы для X» / «Региональные» headings stay out of
   the page and the area keeps a viewport-sized place. Otherwise the plans
   arrive, the «На каждый день» block is inserted ABOVE those headings, and
   they — and everything under them — jump down by the whole block: CLS 0.24
   on template pages (/esim/peru/) after #95. The render clears the status and
   shows the blocks in one task, so no frame shows both states. A failure
   clears the status too, and the page is as before.
   The state is ONE attribute, #tariffs[data-loading], written by
   assets/country-tariffs.js: "true" while it loads, "false" once the render (or
   a failure) is done. Safari 26.4 misses the restyle of a :has(:not(:empty))
   rule when the status text is cleared: the blocks stayed display:none with ten
   cards inside until something else restyled the page (a scroll, ~15 s, or
   never) — measured 2026-10-20. An attribute change always restyles. The :has()
   rules below serve only the first paint, before the script sets the attribute
   (:not([data-loading])); a rule that watches the status without that guard
   fails seo/test-plans-loading-state.mjs. */
.packages:not([data-loading]):has(> .packages-status:not(:empty)) > .plan-block{display:none}
.packages[data-loading="true"] > .plan-block{display:none}
/* Pages outside the SEO experiment follow the EN country page (stage 2 PR A):
   the facts line is the one line under a short H1, the EN skeleton stands in
   for the plans while they load, and the authored text sits under the plans. */
.cp-title .facts{margin:6px 0 0;color:var(--muted);font-size:clamp(15px,1.6vw,18px);line-height:1.55}
.cp-title .facts b{color:var(--text);white-space:nowrap}
#tariffs > .cp-skeleton{display:none}
#tariffs:not([data-loading]):has(> .packages-status:not(:empty)) > .cp-skeleton{display:grid}
#tariffs[data-loading="true"] > .cp-skeleton{display:grid}
.cp-sec.about{max-width:760px}
.cp-sec.about .lead{margin:0 0 14px;font-size:clamp(16px,1.8vw,19px)}
.cp-sec.about .intro{margin:0 0 12px;color:var(--muted);line-height:1.7}
/* Destination search (home, /esim/): the place typed, after the country it
   leads to — «Индонезия  Бали». assets/ru-search.js. */
.res .res-via{margin-left:auto;padding-left:8px;color:var(--muted);font-size:13px;font-weight:500}
.packages:not([data-loading]):has(> .packages-status:not(:empty)){min-height:var(--plans-reserve,80vh)}
.packages[data-loading="true"]{min-height:var(--plans-reserve,80vh)}
.block-empty{margin:0 0 18px;padding:14px 16px;border:1px dashed var(--border-strong);border-radius:var(--r-m);background:var(--surface)}
.packages-grid:empty{display:none}

/* ---------- the plan card: what only the Russian card carries ---------- */
.plan .meta strong{font-weight:650;color:var(--text)}
.plan .meta .m-cov strong{font-weight:700}
.plan-badge.package-best{background:#e7f6ee;color:#14794a}
.plan-net .net-k{font-size:12px;font-weight:700;color:var(--muted)}
.plan-net .net-g{display:inline-flex;align-items:center;gap:4px}
.plan-tech svg{width:14px;height:14px;flex:none}
.plan-topup{display:inline-flex;align-items:center;gap:5px;color:var(--muted)}
/* «Покрытие и условия»: a quiet text button, so the card keeps ONE primary button. */
.plan-info{align-self:flex-start;display:inline-flex;align-items:center;gap:6px;min-height:32px;margin:-2px 0 0;padding:0;border:0;background:none;color:var(--accent);font:inherit;font-size:14px;font-weight:650;cursor:pointer}
.plan-info::after{content:"→"}
/* The 44 px target (brand book v1.2), B1 cards only: the visible link stays 28 px and an invisible ::before, centred on it, makes the
   pressable area 44 px high — no layout change, the card is not taller, the first «Купить» stays where it was. Its own text width
   only: it never reaches «Купить» or a day button. The ten SEO-experiment pages (old card) are left exactly as they are (owner,
   2026-10-24). test/e2e/coverage-target.spec.js holds both. */
#tariffs[data-cards="compact"] .plan-info{position:relative}
#tariffs[data-cards="compact"] .plan-info::before{content:"";position:absolute;left:0;right:0;top:50%;height:44px;margin-top:-22px}
.plan-info:hover{text-decoration:underline;text-underline-offset:3px}
.plan .btn.package-buy{white-space:nowrap}
.plan .btn[aria-disabled="true"]{opacity:.55;pointer-events:none;box-shadow:none}
/* Look-alikes in one block: the network or exit country that tells them apart. */
.package-distinct{display:flex;flex-wrap:wrap;gap:6px;margin:-2px 0 0}
.package-distinct__chip{display:inline-flex;align-items:center;min-width:0;padding:2px 8px;border-radius:6px;background:#f1efff;color:#4338ca;box-shadow:inset 0 0 0 1px #d6d0fb;font-size:12px;font-weight:650;line-height:1.4;overflow-wrap:anywhere}
.package-distinct__chip--ip{background:var(--accent-soft);color:#2f4fc4;box-shadow:inset 0 0 0 1px #c9d4f5}

/* === DAILY CARD BLOCK — the per-day term picker on the plan card ===
 * The cells keep their two lines (the term, then its price from the server's
 * ladder) in the shape of the English «Days» row: small selectable tiles. */
.daily-card{gap:10px}
.daily-terms-block{min-width:0}
.daily-terms-block>.package-meta-label{margin:0 0 6px;font-size:11.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.daily-terms-block .package-meta{display:flex;flex-wrap:wrap;gap:6px}
.daily-term{display:inline-flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;min-width:62px;min-height:44px;padding:4px 9px;border:1px solid var(--border-strong);border-radius:9px;background:var(--surface);color:var(--text);font:inherit;cursor:pointer;font-variant-numeric:tabular-nums}
.daily-term .package-meta-label{font-size:12px;font-weight:600;color:var(--muted);line-height:1.2}
.daily-term .package-meta-value{font-size:14px;font-weight:750;line-height:1.2;white-space:nowrap}
@media (hover:hover) and (pointer:fine){.daily-term:hover:not(.is-selected){border-color:#a9b8ee}}
.daily-term:focus-visible{outline:3px solid rgba(66,103,232,.55);outline-offset:2px}
.daily-term.is-selected,
.daily-term.is-selected:hover{background:var(--accent-btn);border-color:var(--accent-btn)}
.daily-term.is-selected .package-meta-label,
.daily-term.is-selected .package-meta-value{color:#fff;}
/* Compact cards (the EN plan card's density) — the plans block of a country page
   outside the SEO experiment only (data-cards="compact", set by the generator). */
/* Lower cards need a lower loading reserve: 80vh made a one-plan page (timor-leste)
   jump UP when its single compact card arrived (CLS 0.028). */
#tariffs[data-cards="compact"]:not([data-loading]):has(> .packages-status:not(:empty)){min-height:60vh}
#tariffs[data-cards="compact"][data-loading="true"]{min-height:60vh}
#tariffs[data-cards="compact"] .plan{gap:8px;--plan-gap:8px;padding:14px 16px 12px}
#tariffs[data-cards="compact"] .plan-info{min-height:28px;margin:-4px 0 0;font-size:13.5px}
/* the same pull-up on the shared lines of a card row (page-country.css, subgrid): the gap is a margin there, never a gap around an empty slot */
@supports (grid-template-rows:subgrid){#tariffs[data-cards="compact"] .plan-grid>.plan{row-gap:0}#tariffs[data-cards="compact"] .plan-grid>.plan>.plan-info:not(:first-child){margin-top:calc(var(--plan-gap) - 4px)}}
#tariffs[data-cards="compact"] .daily-terms-block>.package-meta-label{margin:0 0 4px}
#tariffs[data-cards="compact"] .daily-terms-block .package-meta{flex-wrap:nowrap;gap:6px;overflow-x:auto;scrollbar-width:none}
#tariffs[data-cards="compact"] .daily-term{min-width:40px;min-height:40px;padding:0 8px;flex:none}
#tariffs[data-cards="compact"] .daily-term .package-meta-label{font-size:15px;font-weight:750;color:var(--text)}
#tariffs[data-cards="compact"] .daily-term.is-selected .package-meta-label{color:#fff}
@media (forced-colors:active){.daily-term{border:1px solid ButtonBorder}.daily-term.is-selected{outline:3px solid Highlight;outline-offset:-3px}}
/* === END DAILY CARD BLOCK === */

/* ---------- «Покрытие и условия» ---------- */
.cov-overlay{position:fixed;inset:0;z-index:210;display:flex;align-items:center;justify-content:center;padding:20px;background:rgba(17,24,39,.45);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}
.cov-overlay[hidden]{display:none}
.cov-modal{position:relative;width:min(480px,100%);max-height:86vh;overflow-y:auto;padding:24px 22px;border:1px solid var(--border);border-radius:var(--r-xl);background:var(--surface);box-shadow:var(--shadow-2)}
.cov-close{position:absolute;top:12px;right:12px;width:40px;height:40px;border:1px solid var(--border-strong);border-radius:12px;background:var(--surface);color:var(--text);font-size:22px;line-height:1;cursor:pointer}
.cov-close:hover{background:var(--accent-soft)}
.cov-modal h3{margin:0 44px 6px 0;font-size:20px}
.cov-modal .cov-sub{margin:0 0 14px;color:var(--muted);font-size:14px}
.cov-row{display:flex;justify-content:space-between;gap:14px;padding:12px 0;border-top:1px solid var(--border);font-size:14px}
.cov-row:first-child{border-top:0}
.cov-row[hidden]{display:none!important}
.cov-row .k{color:var(--muted)}
.cov-row .v{max-width:64%;color:var(--text);font-weight:650;text-align:right}
.cov-countries{margin-top:14px;padding-top:14px;border-top:1px solid var(--border)}
.cov-countries[hidden]{display:none}
.cov-countries .k{margin-bottom:6px;color:var(--muted);font-size:13px}
.cov-countries .v{font-size:14px;line-height:1.55}
@media (max-width:599px){.cov-overlay{align-items:flex-end;padding:0}.cov-modal{width:100%;max-height:88vh;border-radius:var(--r-xl) var(--r-xl) 0 0}}

/* ---------- sections under the tariffs ---------- */
.cp-sec{margin:56px 0 0;padding-top:36px;border-top:1px solid var(--border)}
.cp-sec>h2,.cp-help>h2{margin:0 0 18px}
.cp-sec+.cp-help,.cp-help+.cp-sec{margin-top:48px}
.why-card .ico{display:flex;align-items:center;justify-content:center;width:44px;height:44px;margin:0 0 12px;border-radius:12px;background:var(--accent-soft);font-size:22px}
.why-card p{margin:0}
/* Prose cards: links inside sentences, no «→» */
.help-card.why a::after,.help-card.compat a::after,.help-card.howto a::after{content:none}
.help-card.why a,.help-card.compat a,.help-card.howto a{text-decoration:underline;text-underline-offset:3px}
.why-list,.howto-list{margin:0;padding-left:20px;display:grid;gap:8px;color:var(--muted);font-size:15px;line-height:1.6}
.why-list b{color:var(--text)}
.help-card .howto-note{margin:12px 0 0}
.faq .faq-item{margin-top:10px}
.faq .faq-item summary{list-style:none;display:flex;justify-content:space-between;gap:12px}
.faq .faq-item summary::-webkit-details-marker{display:none}
.faq .faq-item summary::after{content:"+";flex:none;color:var(--accent);font-weight:700}
.faq .faq-item[open] summary::after{content:"−"}
.faq .faq-item p{margin:10px 0 0;color:var(--muted)}
.ru-tiles{display:grid;gap:10px;grid-template-columns:repeat(auto-fill,minmax(200px,1fr))}
.ru-tile{display:flex;align-items:center;gap:12px;min-height:56px;padding:10px 14px;border:1px solid var(--border);border-radius:var(--r-m);background:var(--surface);box-shadow:var(--shadow-1);color:var(--text);font-weight:650;text-decoration:none}
.ru-tile::after{content:"→";margin-left:auto;color:var(--faint);font-weight:500}
.ru-tile:hover{border-color:#c9d4f5;background:var(--accent-soft);color:var(--text)}
.ru-tile .flag{width:36px;height:27px}
.ru-more{margin:16px 0 0}
@media (max-width:599px){.cp-sec{margin-top:40px;padding-top:28px}.ru-tiles{grid-template-columns:repeat(2,minmax(0,1fr))}.ru-tile{gap:8px;padding:10px 12px;min-width:0}.ru-tile span{min-width:0;overflow-wrap:anywhere}}
@media (max-width:359px){.ru-tiles{grid-template-columns:1fr}}

/* ---------- /esim/: what the Russian list adds to the English one ---------- */
.hub-hero .lead+.lead{margin-top:-10px}
.hub-hero .lead a{color:var(--accent);font-weight:650}
.az-group .dest a span{display:grid;gap:1px}
.dest-meta{color:var(--muted);font-size:12.5px;font-weight:500}
.materials{list-style:none;margin:0;padding:0;display:grid;gap:14px;grid-template-columns:repeat(3,minmax(0,1fr))}
.materials li{display:flex;flex-direction:column;gap:6px;padding:18px 20px;border:1px solid var(--border);border-radius:var(--r-l);background:var(--surface)}
.materials a{color:var(--accent);font-weight:700;text-decoration:none}
.materials a::after{content:" →"}
.materials a:hover{text-decoration:underline;text-underline-offset:3px}
.materials span{color:var(--muted);font-size:14px}
@media (max-width:899px){.materials{grid-template-columns:1fr 1fr}}
@media (max-width:599px){.materials{grid-template-columns:1fr}}

/* ---------- guides: what the Russian guide markup carries ---------- */
.g-kicker{margin:0 0 6px;color:var(--accent);font-size:12px;font-weight:750;letter-spacing:.08em;text-transform:uppercase}
.g-sec .prose>:last-child{margin-bottom:0}
.g-sec .prose+.prose,.g-sec .prose+ol,.g-sec .prose+ul,.g-sec ol+.prose,.g-sec ul+.prose{margin-top:12px}
.g-sec a{color:var(--accent);font-weight:600;text-underline-offset:3px}
.g-sec .muted{color:var(--muted);font-size:14px}
/* Steps: numbered badges, the English guides' .steps */
.g-sec .ol-steps{counter-reset:step;list-style:none;margin:4px 0 14px;padding:0;display:grid;gap:10px}
.g-sec .ol-steps li{counter-increment:step;position:relative;margin:0;padding:3px 0 0 42px;max-width:70ch}
.g-sec .ol-steps li::before{content:counter(step);position:absolute;left:0;top:0;display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:999px;background:var(--accent-soft);color:#2f4fc4;font-size:14px;font-weight:800;font-variant-numeric:tabular-nums}
.g-sec .check-list{list-style:none;margin:4px 0 14px;padding:0;display:grid;gap:8px}
.g-sec .check-list li{position:relative;padding-left:28px;max-width:70ch}
.g-sec .check-list li::before{content:"";position:absolute;left:4px;top:.45em;width:12px;height:7px;border-left:2px solid var(--ok);border-bottom:2px solid var(--ok);transform:rotate(-45deg)}
/* Questions: the visible FAQ that equals the FAQPage, as quiet cards */
.faq-list{display:grid;gap:10px}
.faq-list .faq-item{padding:15px 18px;border:1px solid var(--border);border-radius:var(--r-m);background:var(--surface)}
.faq-list .faq-q{margin:0 0 6px;font-weight:700}
.faq-list .faq-a{margin:0;color:var(--muted);font-size:15px}
#faq.g-sec .faq-list{margin-top:4px}
.ru-tile-guide::before{content:"";flex:none;width:8px;height:8px;border-radius:50%;background:var(--grad)}
/* the closing call to action, in the brand gradient */
.ru-cta{display:flex;align-items:center;justify-content:space-between;gap:16px 24px;flex-wrap:wrap;margin:36px 0 8px;padding:28px 30px;border-radius:var(--r-xl);background:var(--grad-deep);color:#fff;box-shadow:var(--shadow-2)}
.ru-cta h2{margin:0 0 6px;color:#fff;font-size:clamp(22px,2.8vw,28px)}
.ru-cta p{margin:0;max-width:60ch;color:rgba(255,255,255,.88)}
.ru-cta .btn{background:#fff;color:#1f2a5a;box-shadow:none}
.ru-cta .btn:hover{background:#eef2ff;color:#1f2a5a}
@media (max-width:599px){.ru-cta{padding:22px 20px}.ru-cta .btn{width:100%}}

/* ======================================================================
   The Russian home (index.html): what it carries beyond the English home —
   the Mini App button in the hero, and «Частые вопросы» (the FAQ behind the
   FAQPage). Everything else on it is page-home.css, as on /en/. The catalogue
   that used to live here moved to the country pages (RU↔EN migration PR C).
   ====================================================================== */

.hero-tg{margin:18px 0 0}
.hero-tg__btn{gap:10px}
.hero-tg__btn svg{width:20px;height:20px;flex:none;color:#229ed9}

/* the catalogue's stale / failed notice — the country pages (country-tariffs.js) */
.catalog-notice{display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin:0 0 18px;padding:14px 16px;border:1px solid var(--warn-line);border-radius:var(--r-m);background:var(--warn-bg);color:var(--warn-ink);font-size:15px;line-height:1.5}
.catalog-notice[hidden]{display:none}
.catalog-notice-text{flex:1;min-width:min(100%,260px)}
.catalog-notice-btn{min-height:42px}
@media (max-width:599px){.catalog-notice-btn{width:100%}}

/* the questions: the English accordion */
.install-accordion details{margin:12px 0 0;padding:0;border:1px solid var(--border);border-radius:var(--r-m);background:var(--surface);box-shadow:var(--shadow-1);overflow:hidden}
.install-accordion summary{display:flex;align-items:center;gap:12px;padding:16px 20px;list-style:none;font-weight:700;font-size:17px;cursor:pointer}
.install-accordion summary::-webkit-details-marker{display:none}
.install-accordion summary::after{content:"";flex:0 0 auto;width:9px;height:9px;margin-left:auto;border-right:2px solid var(--muted);border-bottom:2px solid var(--muted);transform:rotate(45deg) translate(-2px,-2px);transition:transform .15s ease}
.install-accordion details[open] summary::after{transform:rotate(-135deg) translate(-2px,-2px)}
.install-accordion summary:hover{color:#2f4fc4}
.install-accordion-body{padding:0 20px 18px}
.install-accordion-body p{margin:0;color:var(--muted)}
.install-accordion-body a,.install-section .section-head a{color:var(--accent);font-weight:650;text-underline-offset:3px}

@media (max-width:599px){.install-accordion summary{padding:14px 16px;font-size:16px}.install-accordion-body{padding:0 16px 16px}}

/* ---------- the checkout window (Platega), in the English window's look ---------- */
.checkout-overlay{position:fixed;inset:0;z-index:200;display:flex;align-items:flex-start;justify-content:center;padding:24px 16px;overflow-y:auto;background:rgba(17,24,39,.45);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}
.checkout-overlay[hidden]{display:none}
.checkout-modal{position:relative;width:min(500px,100%);margin:auto;padding:26px 24px 24px;border:1px solid var(--border);border-radius:var(--r-xl);background:var(--surface);box-shadow:var(--shadow-2)}
.checkout-close{position:absolute;top:14px;right:14px;width:40px;height:40px;border:1px solid var(--border-strong);border-radius:12px;background:var(--surface);color:var(--text);font-size:22px;line-height:1;cursor:pointer}
.checkout-close:hover{background:var(--accent-soft)}
.checkout-modal h3{margin:0 48px 16px 0;font-size:22px}
.checkout-summary{margin:0 0 4px;padding:16px;border:1px solid var(--border);border-radius:var(--r-m);background:var(--bg)}
.checkout-plan{margin:0 0 12px;font-size:17px;font-weight:750}
.checkout-rows{display:grid;gap:8px}
.checkout-rows>div{display:flex;justify-content:space-between;gap:12px;color:var(--muted);font-size:14px}
.checkout-rows b{color:var(--text);font-weight:650;text-align:right}
.checkout-rows>div[hidden],.co-promo-applied[hidden]{display:none!important}
.checkout-total{margin-top:4px;padding-top:10px;border-top:1px solid var(--border)}
.checkout-total b{font-size:20px;font-weight:800}
.co-disc-row.co-disc-neg b,.checkout-summary.co-has-promo #coPrice{color:var(--ok)}
.checkout-method{display:flex;gap:8px;margin-top:14px}
.co-method{flex:1;display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:8px 12px;border:1px solid var(--border-strong);border-radius:var(--r-s);background:var(--surface);color:var(--text);font:inherit;font-size:14px;font-weight:650;cursor:pointer}
.co-method>span{min-width:0}
.co-method .pay-ico{height:18px;width:auto}
.co-method[aria-checked="true"]{border-color:var(--accent-btn);background:var(--accent-soft);box-shadow:0 0 0 2px rgba(66,103,232,.18)}
.co-method:focus-visible{outline:3px solid rgba(66,103,232,.55);outline-offset:2px}
.checkout-promo{margin-top:14px}
.co-promo-row{display:flex;gap:8px}
.checkout-promo .co-promo-input{flex:1;min-width:0;min-height:44px;text-transform:uppercase}
.co-promo-input::placeholder{text-transform:none}
.co-promo-apply{flex:none;min-height:44px;padding:0 16px;font-size:14px;box-shadow:none}
.co-promo-apply[disabled]{opacity:.6;cursor:progress}
.co-promo-msg{margin:8px 0 0;font-size:13px;line-height:1.4}
.co-promo-msg.co-err{color:var(--err)}
.co-promo-msg.co-ok{color:var(--ok)}
.co-promo-applied{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px 12px;margin-top:8px;padding:10px 12px;border:1px solid #bfe6cf;border-radius:12px;background:rgba(31,157,87,.08)}
.co-promo-tag{flex:1 1 auto;min-width:0;font-size:13px;font-weight:650}
.co-promo-remove{flex:none;display:inline-flex;align-items:center;gap:6px;min-height:40px;padding:0 14px;border:1px solid #f0b4ad;border-radius:12px;background:#fdecea;color:#c5372b;font:inherit;font-size:14px;font-weight:650;cursor:pointer;white-space:nowrap}
.co-promo-remove svg{width:14px;height:14px;flex:none}
.co-promo-remove:hover{background:#fbddd8}
.co-promo-remove:focus-visible{outline:2px solid #c5372b;outline-offset:2px}
.checkout-form{display:grid;gap:14px;margin-top:16px}
.checkout-form label{display:grid;gap:6px;margin:0;font-size:13px;font-weight:600;color:var(--muted)}
.checkout-consent{display:flex!important;flex-direction:row;align-items:flex-start;gap:10px;font-weight:500!important}
.checkout-consent input{margin-top:3px;width:18px;height:18px;flex:none}
.checkout-consent a,.checkout-result a,.checkout-note a{color:var(--accent)}
.req{color:var(--err)}
.checkout-error{margin:0;color:var(--err);font-size:13px}
.checkout-result{margin:0;padding:12px 14px;border:1px solid #c9d4f5;border-radius:12px;background:var(--accent-soft);font-size:13px;line-height:1.5}
.checkout-pay{width:100%;min-height:52px;gap:11px}
.checkout-pay .pay-logo-badge{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:52px;height:32px;padding:5px 8px;border-radius:9px;background:#fff}
.checkout-pay .pay-logo-badge .pay-ico{display:block;max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;pointer-events:none}
.checkout-pay .pay-label{white-space:nowrap}
.checkout-note{margin:0;color:var(--muted);font-size:12px;line-height:1.5}
@media (max-width:599px){.checkout-modal{padding:22px 16px 18px}.checkout-pay .pay-logo-badge{width:46px;height:28px}}
@media (max-width:430px){.co-promo-apply{padding:0 12px}}
/* On a short screen the window is taller than the viewport and the pay button
   sat below the fold (320x568: 800 px window). It stays in view at the bottom
   while the form scrolls; the overlay is the scroll container. */
@media (max-height:760px){.checkout-pay{position:sticky;bottom:12px;z-index:2;box-shadow:0 6px 24px rgba(17,24,39,.22)}}

/* ======================================================================
   Service pages: the payment return (payment-success / payment-failed) and
   the legal pages (privacy / terms), in the shared shell.
   ====================================================================== */
.svc{display:flex;align-items:center;min-height:calc(100vh - 68px - 120px);padding:48px 0 64px;background:radial-gradient(900px 420px at 0% -10%,rgba(138,22,199,.08),transparent 60%),radial-gradient(820px 420px at 100% -10%,rgba(0,199,223,.08),transparent 58%),var(--bg)}
.svc>.wrap{width:100%}
.svc-card{width:min(560px,100%);margin:0 auto;padding:36px 32px 32px;border:1px solid var(--border);border-radius:var(--r-xl);background:var(--surface);box-shadow:var(--shadow-2);text-align:center}
.svc-card,.svc-card *{min-width:0;overflow-wrap:anywhere}
.svc-card .icon{display:grid;place-items:center;width:64px;height:64px;margin:0 auto 18px;border-radius:50%;border:1px solid var(--border);background:var(--accent-soft);color:var(--accent);font-size:28px;font-weight:800}
.svc-card.ok .icon{border-color:#bfe6cf;background:rgba(31,157,87,.10);color:var(--ok)}
.svc-card.warn .icon{border-color:var(--warn-line);background:var(--warn-bg);color:var(--warn-ink)}
.svc-card .spinner{width:44px;height:44px;margin:0 auto 18px;border:3px solid var(--border);border-top-color:var(--accent);border-radius:50%;animation:svc-spin 1s linear infinite}
@keyframes svc-spin{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.svc-card .spinner{animation:svc-spin 2s linear infinite!important}}
.svc-card h1{margin:0 0 10px;font-size:clamp(24px,4vw,32px)}
.svc-card .msg{max-width:460px;margin:0 auto 8px;color:var(--text)}
.svc-card .sub{max-width:460px;margin:14px auto 0;color:var(--muted);font-size:14px}
.svc-card .sub a{color:var(--accent);font-weight:600}
.svc-card .actions{display:flex;flex-wrap:wrap;justify-content:center;gap:12px;margin-top:26px}
.svc-card .btn.secondary{background:var(--surface);border:1px solid var(--border-strong);color:var(--text);box-shadow:none}
.svc-card .btn.secondary:hover{background:var(--accent-soft);color:var(--text)}
.svc-card .hide{display:none!important}
@media (max-width:599px){.svc{padding:28px 0 44px;min-height:0}.svc-card{padding:28px 20px 24px}.svc-card .actions .btn{width:100%}}

.legal{padding:8px 0 24px;background:radial-gradient(900px 420px at 0% -10%,rgba(138,22,199,.06),transparent 60%),var(--bg)}
.legal .crumbs{margin:18px 0 18px}
.legal-card{min-width:0;overflow-wrap:anywhere;max-width:860px;padding:34px 36px;border:1px solid var(--border);border-radius:var(--r-xl);background:var(--surface);box-shadow:var(--shadow-1)}
.legal-card h1{margin:0 0 8px;font-size:clamp(28px,4.4vw,40px)}
.legal-card h2{margin:30px 0 10px;font-size:clamp(19px,2.2vw,22px)}
.legal-card h3{margin:20px 0 8px}
.legal-card p,.legal-card li{max-width:75ch;color:#334155;line-height:1.7}
.legal-card ul,.legal-card ol{padding-left:22px}
.legal-card a{color:var(--accent);font-weight:600;text-underline-offset:3px}
.legal-card .updated{margin:0 0 22px;color:var(--muted);font-size:14px}
.legal-card .intro{color:var(--text)}
.legal-card .contacts{margin-top:14px;padding:16px 18px;border:1px solid var(--border);border-radius:var(--r-m);background:var(--bg)}
.legal-card table{width:100%;border-collapse:collapse;margin:12px 0}
.legal-card td,.legal-card th{padding:8px 10px;border:1px solid var(--border);text-align:left;vertical-align:top}
@media (max-width:599px){.legal-card{padding:22px 18px;border-radius:var(--r-l)}}

/* ---------- plan cards: B1 «Soft Neutral» on the Russian country pages (owner, 2026-10-23; brand book v1.1) ----------
 * The international card (en/en.css, storefront #134) brought to the Russian card — the same design, values and layout;
 * the Russian card's own parts kept and fitted: «Покрытие и условия →», the indigo twin chips, «Сеть» with its icon,
 * «Пополнение», the green «Оптимальный выбор», and the per-day terms as buttons (.daily-term, 6 or 1 per card).
 * Scope: #tariffs[data-cards="compact"] — the 188 country pages outside the SEO experiment; the experiment's ten pages
 * keep their card until the pilot verdict. The rules repeat en/en.css's B1 block on purpose: en/en.css never reaches a
 * Russian page (seo/test-design-system.mjs) and the international files are not touched. Nothing here sets transform,
 * animation or transition: every animation of site.css runs as before (entrance, hover lift + ring, focus ring, the buy
 * button's lift / press / card-hover colour, the info arrow, the term press + settle, reduced motion). Prices, plan ids
 * and every data-* the checkout reads are untouched — this is CSS only. */
/* spacing = the English reference card (en/en.css .cp .plan: 20 / 20 / 16 px, gap 12) — owner, 2026-10-24: the RU page must look like a
   language version of the EN one. Measured: the first «Купить» stays in the first 390×844 screen on the same pages as with the
   #100 density (185/198 incl. Italy); the median first card 238 → 264 px. */
#tariffs[data-cards="compact"] .plan { --pc-strip: #9aa3bd; --pc-ico: #5b6478; --pc-word: #5b6478; --pc-ink: #2e3441; padding: 20px 20px 16px; gap: 12px; --plan-gap: 12px; }
/* the card's width is asked by its parts, each as wide as the card's content: a card that were a size container
 * would be laid out alone (containment), and could not share the lines of its row (page-country.css, subgrid) */
#tariffs[data-cards="compact"] .plan > :is(.plan-top, .daily-terms-block, .plan-foot) { container-type: inline-size; }
#tariffs[data-cards="compact"] .plan-regional { --pc-strip: #c58fe0; --pc-ico: #8a16c7; --pc-word: #6a1199; }
#tariffs[data-cards="compact"] .plan-daily { --pc-strip: #6cc3d4; --pc-ico: #0a7a8f; --pc-word: #0a5f72; }
/* the family strip follows the card's rounded top (a mask, not overflow:hidden — that would clip the hover ring) */
#tariffs[data-cards="compact"] .plan::before { content: ""; position: absolute; inset: -1px -1px auto -1px; height: 24px; border-radius: var(--r-l) var(--r-l) 0 0; background: var(--pc-strip); pointer-events: none; -webkit-mask: linear-gradient(#000 0 3px, transparent 3px); mask: linear-gradient(#000 0 3px, transparent 3px); }

/* header: volume and price on one baseline; the term + plan-type row across the card; a daily price under its sentence */
#tariffs[data-cards="compact"] .plan-top { display: grid; grid-template-columns: minmax(0, 1fr) auto; column-gap: 12px; row-gap: 8px; align-items: baseline; }
#tariffs[data-cards="compact"] .plan-main { display: contents; }
#tariffs[data-cards="compact"] .plan .plan-data { grid-column: 1; grid-row: 1; font-size: 30px; font-weight: 700; color: var(--pc-ink); -webkit-hyphens: manual; hyphens: manual; text-wrap: pretty; }
#tariffs[data-cards="compact"] .plan:not(.plan-daily) .plan-data { white-space: nowrap; }
#tariffs[data-cards="compact"] .plan .price { grid-column: 2; grid-row: 1; font-size: 24px; font-weight: 700; color: var(--pc-ink); white-space: nowrap; }
#tariffs[data-cards="compact"] .plan-row { grid-column: 1 / -1; grid-row: 2; gap: 10px; }
#tariffs[data-cards="compact"] .plan-daily .plan-top { grid-template-columns: minmax(0, 1fr); }
#tariffs[data-cards="compact"] .plan-daily .plan-data { font-size: 20px; font-weight: 650; }
#tariffs[data-cards="compact"] .plan-daily .price { grid-column: 1; grid-row: 2; text-align: left; }
#tariffs[data-cards="compact"] .plan-daily .plan-row { grid-row: 3; }
@container (max-width: 260px) {
  #tariffs[data-cards="compact"] .plan:not(.plan-daily) .plan-data { font-size: 27px; }
  #tariffs[data-cards="compact"] .plan .price { font-size: 22px; }
}

/* the term: a very light neutral pill; the plan type: the family icon + the word, no fill («Оптимальный выбор» stays green) */
#tariffs[data-cards="compact"] .plan-term { min-height: 26px; padding: 0 12px; border-radius: 999px; background: #f1f4fa; color: var(--pc-ink); font-size: 13px; font-weight: 600; white-space: nowrap; }
#tariffs[data-cards="compact"] .plan .plan-badge:not(.package-best) { gap: 6px; min-height: 0; padding: 0; border-radius: 0; background: none; color: var(--pc-word); font-size: 13px; font-weight: 550; white-space: nowrap; }
#tariffs[data-cards="compact"] .plan .plan-badge.package-best { border-radius: 999px; white-space: nowrap; }
#tariffs[data-cards="compact"] .plan-badge:not(.package-best)::before { content: ""; flex: none; width: 16px; height: 16px; background: var(--pc-ico); -webkit-mask: var(--pc-icon) center / 16px 16px no-repeat; mask: var(--pc-icon) center / 16px 16px no-repeat; }
/* line icons on the brand book's 24 grid, 2 px stroke, round caps: pin (local), globe (regional), calendar (daily) */
#tariffs[data-cards="compact"] .plan-local .plan-badge { --pc-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 21s-6.5-5.6-6.5-11a6.5 6.5 0 0 1 13 0c0 5.4-6.5 11-6.5 11z'/%3E%3Ccircle cx='12' cy='10' r='2.4'/%3E%3C/svg%3E"); }
#tariffs[data-cards="compact"] .plan-regional .plan-badge { --pc-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='8.5'/%3E%3Cpath d='M3.5 12h17M12 3.5c2.6 2.4 3.9 5.2 3.9 8.5s-1.3 6.1-3.9 8.5c-2.6-2.4-3.9-5.2-3.9-8.5S9.4 5.9 12 3.5z'/%3E%3C/svg%3E"); }
#tariffs[data-cards="compact"] .plan-daily .plan-badge { --pc-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='4' y='5.5' width='16' height='14.5' rx='2.5'/%3E%3Cpath d='M8 3.5v4M16 3.5v4M4 10h16'/%3E%3C/svg%3E"); }

/* coverage and the card facts: a family dot for the coverage, a quiet dot for the rest; «Покрытие и условия →» in
 * graphite (blue is the buy button's), its arrow still moves */
#tariffs[data-cards="compact"] .plan .meta span { text-wrap: pretty; }
#tariffs[data-cards="compact"] .plan .meta .m-cov::before { background: var(--pc-ico); }
#tariffs[data-cards="compact"] .plan .meta strong { color: var(--pc-ink); }
#tariffs[data-cards="compact"] .plan :is(.plan-ip, .m-also, .m-cov) { -webkit-hyphens: manual; hyphens: manual; }
#tariffs[data-cards="compact"] .plan .plan-info { color: var(--pc-ink); font-size: 13.5px; font-weight: 600; }
#tariffs[data-cards="compact"] .plan .plan-info:focus-visible { outline: 2px solid var(--text); outline-offset: 2px; border-radius: 6px; }

/* the per-day terms: six even choices (three and three on a narrow card), 44 px, neutral until chosen; the chosen one
 * stays Button blue; the press and settle of site.css run unchanged */
#tariffs[data-cards="compact"] .daily-terms-block > .package-meta-label { margin: 0 0 8px; font-size: 13px; font-weight: 600; letter-spacing: 0; text-transform: none; color: var(--muted); }
#tariffs[data-cards="compact"] .daily-terms-block .package-meta { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 6px; overflow: visible; }
#tariffs[data-cards="compact"] .daily-term { width: 100%; min-width: 0; min-height: 44px; padding: 0; border: 0; border-radius: var(--r-s); background: #f1f4fa; box-shadow: inset 0 0 0 1px var(--border-strong); }
#tariffs[data-cards="compact"] .daily-term .package-meta-label { font-size: 14px; font-weight: 650; color: var(--pc-ink); }
#tariffs[data-cards="compact"] .daily-term.is-selected, #tariffs[data-cards="compact"] .daily-term.is-selected:hover { background: var(--accent-btn); box-shadow: none; }
#tariffs[data-cards="compact"] .daily-term.is-selected .package-meta-label { color: #fff; }
#tariffs[data-cards="compact"] .daily-term:focus-visible { outline: 2px solid var(--text); outline-offset: 2px; }
@container (max-width: 300px) { #tariffs[data-cards="compact"] .daily-terms-block .package-meta { grid-template-columns: repeat(3, minmax(0, 1fr)); } }

/* foot: «Сеть» and «Пополнение» (both short on the Russian card) stacked on the left, the button beside them — the
 * compact card's arrangement, so the foot is one button tall */
#tariffs[data-cards="compact"] .plan-foot { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; column-gap: 12px; row-gap: 6px; padding-top: 10px; }
#tariffs[data-cards="compact"] .plan-tech { display: contents; }
#tariffs[data-cards="compact"] .plan-foot .plan-net { grid-column: 1; grid-row: 1; align-self: end; gap: 6px; font-size: 13px; font-weight: 550; color: var(--pc-ink); }
#tariffs[data-cards="compact"] .plan-foot .plan-ip { grid-column: 1; grid-row: 2; align-self: start; font-size: 13px; }
#tariffs[data-cards="compact"] .plan-foot > :is(.btn, .note) { grid-column: 2; grid-row: 1 / span 2; }
/* the buy button: solid Button blue, 44 px, one line; no shadow AT REST — the hover shadow, lift, press and the
 * card-hover colour stay */
#tariffs[data-cards="compact"] .plan .btn { min-height: 44px; font-size: 14px; font-weight: 650; white-space: nowrap; }
#tariffs[data-cards="compact"] .plan .btn:not(:hover):not(:focus-visible) { box-shadow: none; }
#tariffs[data-cards="compact"] .plan .btn:focus-visible { outline: 2px solid var(--text); outline-offset: 2px; }
/* the Russian foot carries only «Сеть …» and «Пополнение», so the button stays beside them down to a 220 px card (a 320 px
 * phone included) and goes full width only below that */
@container (max-width: 220px) {
  #tariffs[data-cards="compact"] .plan-foot :is(.plan-net, .plan-ip) { grid-column: 1 / -1; }
  #tariffs[data-cards="compact"] .plan-foot > :is(.btn, .note) { grid-column: 1 / -1; grid-row: 3; width: 100%; margin-top: 6px; }
}
/* the ≤359 px rule in page-country.css lifts every headline to 24 px — a daily sentence keeps its own size */
@media (max-width: 359px) { #tariffs[data-cards="compact"] .plan.plan-daily .plan-data { font-size: 19px; } }