/* Блог поверх styles.css: шапка/футер/кнопки/токены — общие с витриной.
   Здесь только контентная типографика списка и статьи. */

/* ---------- Индекс: герой + сетка карточек ---------- */
.blog-hero { padding: 56px 0 10px; }
.blog-hero h1 { font-size: clamp(1.9rem, 3.6vw, 2.6rem); max-width: 24ch; }
.blog-lead { max-width: 640px; margin-top: 10px; color: var(--muted); font-size: 1.08rem; line-height: 1.6; }
.blog-list { padding: 30px 0 90px; }
.blog-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 20px; }
.blog-card, .blog-empty, .editorial-note, .article-next {
  border: 1px solid var(--line); border-radius: var(--radius); background: var(--paper);
}
.blog-card { display: flex; flex-direction: column; padding: 24px; transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease; }
.blog-card:hover { transform: translateY(-2px); border-color: #C5D2E2; box-shadow: 0 10px 24px rgba(13,27,42,.08); }
.blog-card h2 { margin: 10px 0 10px; font-size: 1.18rem; line-height: 1.32; }
.blog-card h2 a { color: var(--ink); text-decoration: none; }
.blog-card h2 a:hover { color: var(--signal-dark); }
.blog-card p { color: var(--muted); font-size: .98rem; line-height: 1.55; }
.blog-date, .blog-byline { color: var(--muted); font-family: var(--font-mono); font-size: .76rem; letter-spacing: .04em; }
.blog-read { margin-top: auto; padding-top: 16px; color: var(--signal-dark); font-weight: 700; font-size: .95rem; text-decoration: none; }
.blog-read::after { content: " →"; }
[dir="rtl"] .blog-read::after { content: " ←"; }
.blog-read:hover { text-decoration: underline; text-underline-offset: 3px; }
.blog-empty { padding: 30px; }
.blog-empty p { margin: 0 0 18px; color: var(--muted); }

/* ---------- Country commerce owner: live catalog + editorial bridge ---------- */
.visually-hidden { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.country-owner-hero { position: relative; overflow: hidden; padding: 56px 0 34px; border-bottom: 1px solid var(--line); background: radial-gradient(circle at 82% 18%, rgba(12,181,107,.15), transparent 30%), linear-gradient(180deg, #f8fbff 0%, #fff 100%); }
.country-owner-hero::after { content: ""; position: absolute; inset: auto -8% -95px auto; width: 360px; height: 180px; border: 1px dashed rgba(12,181,107,.28); border-radius: 50%; rotate: -12deg; pointer-events: none; }
.country-owner-hero h1 { max-width: 22ch; margin: 8px 0 14px; font-size: clamp(1.75rem, 3.4vw, 2.45rem); line-height: 1.2; }
.country-owner-hero .answer-capsule { margin-top: 24px; }
.country-owner-main { padding-bottom: 90px; }
.country-owner-main .article-prose { overflow-x: hidden; }
.country-owner-main .live-catalog-block { margin-top: 0; padding: 30px !important; border: 1px solid #dbe4ef; border-radius: 24px; background: #f3f7fb; box-shadow: 0 18px 48px rgba(13,27,42,.07); }
.country-price-answer { display: inline-flex; align-items: center; gap: 14px; max-width: 100%; margin: 6px 0 18px; padding: 12px 16px; border: 1px solid #b9ddc9; border-radius: 16px; background: rgba(255,255,255,.88); box-shadow: 0 10px 28px rgba(13,27,42,.07); }
.country-price-flag { font-size: 2rem; line-height: 1; }
.country-price-answer > div { display: grid; gap: 2px; }
.country-price-answer strong { color: var(--ink); font-family: var(--font-display); font-size: clamp(1rem, 2.2vw, 1.22rem); font-weight: 600; }
.country-price-answer small { color: var(--muted); font-family: var(--font-mono); font-size: .68rem; letter-spacing: .04em; }
.country-owner-guide { margin-top: 28px; padding: 24px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--paper); }
.country-owner-guide h2 { margin: 6px 0 10px; font-size: clamp(1.2rem, 2.2vw, 1.5rem); }
.country-owner-guide p { color: var(--muted); }
.country-owner-guide .btn { margin-top: 8px; }

/* ---------- Статья: узкая колонка чтения ---------- */
.article-container { max-width: 768px; }
.article-wide-container { max-width: 1120px; }
.blog-article-head { padding: 44px 0 26px; border-bottom: 1px solid var(--line); }
.article-crumb { margin-bottom: 16px; }
.article-crumb a {
  font-family: var(--font-mono); font-size: .78rem; font-weight: 500;
  text-transform: uppercase; letter-spacing: .14em;
  color: var(--signal-dark); text-decoration: none;
}
.article-crumb a::before { content: "← "; }
[dir="rtl"] .article-crumb a::before { content: "→ "; }
.article-crumb a:hover { text-decoration: underline; text-underline-offset: 3px; }
.blog-article-head h1 { font-size: clamp(1.6rem, 3.2vw, 2.3rem); line-height: 1.2; margin: 0 0 14px; }
.blog-article-head .blog-lead { font-size: 1.06rem; }
.blog-byline { margin-top: 18px; }

.article-hero-figure { margin: 0; padding: 28px 0 0; }
.article-hero-media { position: relative; }
.article-hero-figure img {
  display: block; width: 100%; height: auto; aspect-ratio: 3 / 2; object-fit: cover;
  border: 1px solid var(--line); border-radius: clamp(16px, 2.5vw, 28px);
  background: var(--paper); box-shadow: 0 18px 50px rgba(13,27,42,.08);
}
.article-hero-figure figcaption { max-width: 768px; margin: 10px auto 0; color: var(--muted); font-size: .88rem; line-height: 1.5; }

.article-prose { padding-top: 36px; padding-bottom: 90px; }
.article-prose section { padding: 10px 0 16px; }
.article-prose h2 { font-size: clamp(1.28rem, 2.4vw, 1.6rem); line-height: 1.25; margin: 0 0 12px; }
.article-prose p, .article-prose li { font-size: 1.03rem; line-height: 1.72; }
.article-prose p { margin: 0 0 14px; }
.article-prose ul, .article-prose ol { padding-inline-start: 22px; }
.article-prose li { margin: 7px 0; }
.article-prose a { color: var(--signal-dark); text-decoration: underline; text-underline-offset: 3px; overflow-wrap: anywhere; }
.article-prose a:hover { color: var(--ink); }
.article-prose .btn, .article-prose .btn:hover { color: #fff; text-decoration: none; }

.editorial-note { margin-bottom: 24px; padding: 14px 18px; color: var(--muted); font-size: .92rem; line-height: 1.55; }
.answer-capsule {
  margin: 0 0 26px; padding: 16px 18px;
  border-inline-start: 4px solid var(--signal); border-radius: 0 12px 12px 0;
  background: var(--paper); color: var(--ink); font-size: 1.04rem; font-weight: 600;
}
[dir="rtl"] .answer-capsule { border-radius: 12px 0 0 12px; }

.article-toc { margin: 0 0 28px; padding: 20px 22px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--paper); }
.article-toc > p, .decision-label, .timeline-label {
  margin: 0 0 10px; font-family: var(--font-mono); font-size: .78rem; font-weight: 700;
  letter-spacing: .08em; text-transform: uppercase; color: var(--signal-dark);
}
.article-toc ol { columns: 2; gap: 30px; margin: 0; padding-inline-start: 20px; }
.article-toc li { break-inside: avoid; font-size: .93rem; line-height: 1.45; }
.rich-block { scroll-margin-top: 24px; }
.claim-citations { white-space: nowrap; font-family: var(--font-mono); font-size: .72em; font-weight: 700; }
.claim-citations a { text-decoration: none; }

.decision-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin: 18px 0; }
@media (min-width: 821px) {
  .decision-grid:has(> article:nth-child(4)) { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
.decision-grid article { padding: 18px; border: 1px solid var(--line); border-radius: 16px; background: var(--paper); }
.decision-grid h3, .rich-timeline h3, .rich-annotated-steps h3 { margin: 0 0 8px; font-size: 1rem; line-height: 1.35; }
.decision-grid ul { margin: 0; padding-inline-start: 18px; }
.decision-grid li { font-size: .94rem; line-height: 1.55; }
.decision-note { color: var(--muted); font-size: .94rem !important; }

.rich-checklist { margin: 16px 0 24px; padding: 22px; border: 1px solid #b9ddc9; border-radius: var(--radius); background: #f4fbf7; }
.rich-checklist ul { list-style: none; margin: 12px 0 0; padding: 0; }
.rich-checklist li { display: grid; grid-template-columns: 20px 1fr; gap: 10px; align-items: start; }
.rich-checklist li span { width: 18px; height: 18px; margin-top: 5px; border: 2px solid var(--signal-dark); border-radius: 5px; background: #fff; }

.rich-callout, .rich-cta { margin: 22px 0; padding: 22px; border-radius: var(--radius); }
.rich-callout { border: 1px solid #e4c477; background: #fff9e8; }
.rich-callout h2, .rich-cta h2 { font-size: 1.15rem; }
.rich-cta { border: 1px solid var(--line); background: var(--ink); color: #fff; }
.rich-cta h2, .rich-cta p { color: #fff; }

.table-scroll { overflow-x: auto; margin: 16px 0; }
.rich-table table { width: 100%; min-width: 560px; border-collapse: collapse; }
.rich-table caption { padding: 0 0 10px; text-align: start; color: var(--muted); }
.rich-table th, .rich-table td { padding: 12px; border: 1px solid var(--line); text-align: start; vertical-align: top; }
.rich-table thead th { background: var(--paper); font-family: var(--font-mono); font-size: .82rem; }
.rich-table-scroll { overflow-x: auto; margin: 16px 0; border: 1px solid var(--line); border-radius: 18px; background: #fff; }
.rich-table-scroll table { width: 100%; min-width: 720px; border-collapse: separate; border-spacing: 0; }
/* Keep the wide table inside the viewport in RTL. Its own direction stays RTL; the
   LTR scroll coordinate prevents Chromium from counting the hidden left side as root overflow. */
[dir="rtl"] .rich-table-scroll { direction: ltr; }
[dir="rtl"] .rich-table-scroll table { direction: rtl; }
.rich-table-scroll th, .rich-table-scroll td { padding: 15px 16px; border: 0; border-bottom: 1px solid var(--line); text-align: start; vertical-align: middle; }
.rich-table-scroll thead th { background: #eef3f8; color: #41546a; font-family: var(--font-mono); font-size: .72rem; letter-spacing: .05em; text-transform: uppercase; }
.rich-table-scroll tbody tr:last-child > * { border-bottom: 0; }
.rich-timeline ol { list-style: none; margin: 16px 0; padding: 0; border-inline-start: 2px solid var(--signal); }
.rich-timeline li { position: relative; padding: 0 0 20px 24px; }
[dir="rtl"] .rich-timeline li { padding: 0 24px 20px 0; }
.rich-timeline li::before { content: ""; position: absolute; inset-inline-start: -7px; top: 7px; width: 12px; height: 12px; border-radius: 50%; background: var(--signal); }
.rich-annotated-steps > ol { list-style: none; margin: 16px 0 24px; padding: 0; display: grid; gap: 14px; }
.rich-annotated-steps > ol > li { overflow: hidden; border: 1px solid var(--line); border-radius: var(--radius); background: #fff; }
.annotated-step-head { display: grid; grid-template-columns: minmax(72px, auto) 1fr; gap: 14px; align-items: center; padding: 14px 18px; background: var(--ink); color: #fff; }
.annotated-step-head h3 { color: #fff; }
.annotated-step-label { margin: 0; color: var(--signal); font-family: var(--font-mono); font-size: .75rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.rich-annotated-steps dl { margin: 0; padding: 16px 18px 18px; display: grid; gap: 12px; }
.rich-annotated-steps dl > div { display: grid; grid-template-columns: minmax(120px, .32fr) 1fr; gap: 14px; }
.rich-annotated-steps dt { color: var(--muted); font-family: var(--font-mono); font-size: .78rem; font-weight: 700; }
.rich-annotated-steps dd { margin: 0; }
.rich-figure img { display: block; max-width: 100%; height: auto; border-radius: var(--radius); }
.rich-figure figcaption, .article-change-note { color: var(--muted); font-size: .88rem; line-height: 1.55; }
.article-change-note { margin-top: 28px; padding-top: 16px; border-top: 1px dashed var(--line); }
.article-change-note p { font-size: .88rem; }

/* ---------- Country utility: verified apps + live catalog ---------- */
.country-apps, .live-catalog-block { margin-top: 34px; padding-top: 28px !important; border-top: 1px solid var(--line); }
.country-app-grid, .live-plan-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin-top: 18px; }
.country-app-card, .live-plan-card { min-width: 0; padding: 18px; border: 1px solid var(--line); border-radius: 16px; background: var(--paper); }
.country-app-card h3 { margin: 2px 0 8px; font-size: 1.08rem; }
.country-app-card > p { font-size: .91rem; line-height: 1.52; }
.country-app-task { margin: 0 !important; color: var(--signal-dark); font-family: var(--font-mono); font-size: .72rem !important; font-weight: 700; letter-spacing: .07em; text-transform: uppercase; }
.country-app-links { display: flex; flex-wrap: wrap; gap: 8px 12px; margin-top: 14px; }
.country-app-links a { font-size: .86rem; font-weight: 700; }
.country-app-evidence { margin: 14px 0 0 !important; padding-top: 12px; border-top: 1px dashed var(--line); color: var(--muted); }
.country-apps-brand { margin-top: 46px; padding: 28px !important; border: 1px solid var(--line); border-radius: 24px; background: #fff; }
.country-apps-brand > p { max-width: 70ch; color: var(--muted); }
.country-app-card-brand { display: grid; grid-template-columns: 58px minmax(0,1fr); gap: 15px; align-items: start; padding: 20px; background: var(--sky); transition: border-color .16s ease, transform .16s ease, box-shadow .16s ease; }
.country-app-card-brand:hover { transform: translateY(-1px); border-color: #bfd0de; box-shadow: 0 10px 26px rgba(13,27,42,.07); }
.country-app-icon { display: grid; width: 58px; height: 58px; place-items: center; border: 1px solid #bde7d2; border-radius: 15px; background: var(--signal-tint); color: var(--signal-dark); }
.country-app-icon svg { display: block; width: 34px; height: 34px; }
.country-app-copy { min-width: 0; }
.country-app-card-brand h3 { margin-top: 3px; font-family: var(--font-display); font-size: .98rem; }
.country-app-card-brand .country-app-links { gap: 7px; }
.country-app-card-brand .country-app-links a { display: inline-flex; align-items: center; gap: 6px; padding: 7px 9px; border: 1px solid var(--line); border-radius: 9px; background: #fff; color: var(--ink); text-decoration: none; }
.country-app-card-brand .country-app-links a:hover { border-color: var(--signal); color: var(--signal-dark); }
.country-app-card-brand .country-app-evidence { font-size: .74rem !important; line-height: 1.45; }

.live-catalog-block { position: relative; }
.article-storefront { overflow: hidden; padding: 28px !important; border: 1px solid #dbe4ef; border-radius: 24px; background: #f3f7fb; box-shadow: 0 18px 48px rgba(13,27,42,.08); }
.article-storefront .eyebrow { margin: 0 0 8px; color: var(--signal-dark); font-size: .72rem !important; }
.live-plan-head { display: grid; grid-template-columns: 1fr auto; gap: 18px; align-items: start; }
.live-plan-head p { color: var(--muted); }
.live-plan-dot { width: 12px; height: 12px; margin-top: 8px; border-radius: 50%; background: var(--signal); box-shadow: 0 0 0 6px rgba(12,181,107,.12); }
.article-product-proof { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin: 20px 0 0; padding: 16px 0 0; border-top: 1px solid #dbe4ef; list-style: none; }
.article-product-proof li { display: grid; grid-template-columns: 22px 1fr; gap: 8px; align-items: start; margin: 0; color: var(--ink); font-size: .84rem; line-height: 1.45; }
.article-product-proof li > span { display: grid; width: 20px; height: 20px; place-items: center; border-radius: 50%; background: rgba(12,181,107,.12); color: var(--signal-dark); font-family: var(--font-mono); font-size: .72rem; font-weight: 700; }
.article-country-picker { margin-top: 22px; }
.article-country-picker label { display: block; margin-bottom: 8px; color: var(--ink); font-size: .86rem; font-weight: 700; }
.article-country-select-wrap { position: relative; }
.article-country-select-wrap select { width: 100%; min-height: 52px; appearance: none; padding: 0 46px 0 16px; border: 1px solid var(--line); border-radius: 14px; background: var(--paper); color: var(--ink); font: 500 1rem/1.3 var(--font-body); box-shadow: 0 6px 18px rgba(13,27,42,.05); }
.article-country-select-wrap select:focus-visible { outline: 3px solid rgba(12,181,107,.25); outline-offset: 2px; border-color: var(--signal); }
.article-country-select-wrap > span { position: absolute; inset-inline-end: 16px; top: 50%; translate: 0 -52%; color: var(--signal-dark); font-size: 1.2rem; pointer-events: none; }
[dir="rtl"] .article-country-select-wrap select { padding: 0 16px 0 46px; }
.article-plan-destination { display: inline-flex; align-items: center; gap: 10px; margin: 18px 0 2px; padding: 8px 12px; border: 1px solid #dbe4ef; border-radius: 999px; background: #fff; color: var(--ink); }
.article-plan-destination[hidden] { display: none; }
.article-plan-destination > span { font-size: 1.25rem; line-height: 1; }
.article-plan-destination > strong { font-size: .9rem; }
.live-plan-status { margin: 14px 0 0 !important; color: var(--muted); font-family: var(--font-mono); font-size: .78rem !important; }
.live-plan-status.is-live { color: var(--signal-dark); }
.live-plan-status.is-error { color: #8d5b00; }
.live-plan-status.is-prompt { color: var(--signal-dark); }
.live-plan-status[hidden] { display: none; }
/* Дата рядом с ценой, а не в статус-строке: статус на гидратации становится «живой
   каталог», сноска же обязана пережить рендер без JS и остаться при числе. */
.live-plan-footnote { margin: 10px 0 0 !important; color: var(--muted); font-family: var(--font-mono); font-size: .74rem !important; }
.live-plan-card p { margin: 0; }
.live-plan-card { display: flex; flex-direction: column; align-items: stretch; }
.live-plan-data { color: var(--ink); font-size: 1.14rem !important; font-weight: 700; }
.live-plan-days { color: var(--muted); font-size: .86rem !important; }
.live-plan-price { margin-top: 12px !important; color: var(--signal-dark); font-family: var(--font-mono); font-size: 1rem !important; font-weight: 700; }
[dir="rtl"] .live-plan-days, [dir="rtl"] .live-plan-price, [dir="rtl"] .country-app-evidence time { unicode-bidi: isolate; }
.live-plan-cta { margin-top: 18px; }
.article-storefront .live-plan-cta { display: inline-flex; }
.live-plan-buy { width: 100%; margin-top: 16px; text-align: center; }
.article-storefront-noscript { margin: 12px 0 0 !important; color: var(--muted); font-size: .84rem !important; }

/* Country offer cards reuse the native app's product hierarchy and verified catalog facts. */
.country-offer-card { padding: 0; overflow: hidden; border: 1.5px solid #dbe4ef; background: #fff; transition: border-color .16s ease, box-shadow .16s ease, transform .16s ease; }
.country-offer-card:hover { transform: translateY(-2px); border-color: var(--signal); box-shadow: 0 14px 30px rgba(13,27,42,.09); }
.country-offer-card:focus-within { border-color: var(--signal); box-shadow: 0 0 0 3px rgba(12,181,107,.17); }
.country-offer-card.is-recommended { border-color: var(--signal); }
.country-offer-link { display: flex; min-height: 306px; flex-direction: column; padding: 16px; color: var(--ink) !important; text-decoration: none !important; }
.country-offer-link:focus-visible { outline: 0; }
.country-offer-kicker { display: flex; min-height: 30px; align-items: flex-start; justify-content: space-between; gap: 8px; font-family: var(--font-mono); font-size: .61rem; font-weight: 700; letter-spacing: .055em; text-transform: uppercase; }
.country-offer-badges, .country-offer-network { display: flex; min-width: 0; align-items: center; gap: 6px; }
.country-offer-badges { flex-wrap: wrap; }
.country-offer-network { flex: 0 0 auto; justify-content: flex-end; }
.country-offer-brand { color: var(--signal-dark); letter-spacing: .11em; }
.country-offer-badge { padding: 4px 6px; border-radius: 6px; background: rgba(12,181,107,.12); color: var(--signal-dark); line-height: 1; white-space: nowrap; }
.country-offer-network-names { overflow: hidden; max-width: 108px; color: var(--muted); font-size: .57rem; letter-spacing: .045em; text-overflow: ellipsis; white-space: nowrap; }
.country-offer-generation { border: 1px solid rgba(12,181,107,.22); background: #fff; }
.country-offer-network > i { display: grid; flex: 0 0 auto; width: 22px; height: 22px; place-items: center; border-radius: 7px; background: var(--signal); color: #fff; font-style: normal; }
.country-offer-main { margin-top: 13px; }
.country-offer-metrics { display: grid; grid-template-columns: minmax(0,1fr) 1px minmax(0,1fr); gap: 12px; align-items: stretch; }
.country-offer-divider { min-height: 68px; background: var(--line); }
.country-offer-metrics .article-plan-metric { gap: 4px; }
.country-offer-metrics .article-plan-metric > strong { font-size: clamp(1.08rem,2vw,1.32rem) !important; }
.country-offer-metrics .live-plan-days { color: var(--ink); }
.country-offer-metrics .article-plan-scale-data b { width: 5px; }
.country-offer-metrics .article-plan-scale-days b { width: 10px; }
.country-offer-bottom { display: flex; min-height: 69px; align-items: center; justify-content: space-between; gap: 10px; margin-top: 14px; padding-top: 13px; border-top: 1px solid var(--line); }
.country-offer-activation { display: grid; min-width: 0; grid-template-columns: 20px minmax(0,1fr); gap: 7px; align-items: start; color: var(--muted); }
.country-offer-activation > i { position: relative; width: 18px; height: 18px; border: 1.5px solid var(--signal); border-radius: 50%; }
.country-offer-activation > i::before { position: absolute; top: 3px; left: 7px; width: 1.5px; height: 5px; border-radius: 2px; background: var(--signal-dark); content: ""; }
.country-offer-activation > i::after { position: absolute; top: 8px; left: 7px; width: 4px; height: 1.5px; border-radius: 2px; background: var(--signal-dark); content: ""; transform: rotate(18deg); transform-origin: left center; }
.country-offer-activation > span { display: flex; min-width: 0; flex-direction: column; gap: 3px; }
.country-offer-activation b, .country-offer-activation small { font-family: var(--font-mono); font-weight: 500; line-height: 1.3; }
.country-offer-activation b { font-size: .58rem; }
.country-offer-activation small { color: var(--signal-dark); font-size: .57rem; }
.country-offer-pricebox { display: flex; flex: 0 0 auto; flex-direction: column; align-items: flex-end; gap: 5px; }
.country-offer-pricebox .live-plan-price { min-width: 98px; margin: 0 !important; padding: 11px 10px; border-radius: 10px; background: var(--signal); color: #fff; font-size: .92rem !important; line-height: 1; text-align: center; white-space: nowrap; }
.country-offer-unit { color: var(--muted); font-family: var(--font-mono); font-size: .57rem; white-space: nowrap; }
.country-offer-action { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: auto; padding-top: 10px; color: var(--signal-dark); font-family: var(--font-mono); font-size: .68rem; font-weight: 700; }
.country-offer-action b { font-size: 1rem; }
[dir="rtl"] .country-offer-action b { transform: rotate(180deg); }

/* Article mini-storefront: the homepage shelf compressed into the reading column. */
.article-storefront .live-plan-grid { grid-template-columns: 1fr; gap: 12px; }
.article-plan-card { padding: 0; border: 1.5px solid #dbe4ef; border-radius: 16px; background: #fff; transition: border-color .16s ease, box-shadow .16s ease, transform .16s ease; }
.article-plan-card:hover { transform: translateY(-1px); border-color: var(--signal); box-shadow: 0 10px 28px rgba(13,27,42,.08); }
.article-plan-card:focus-within { border-color: var(--signal); box-shadow: 0 0 0 3px rgba(12,181,107,.18); }
.article-plan-link { display: block; padding: 18px; color: var(--ink) !important; text-decoration: none !important; }
.article-plan-link:focus-visible { outline: 0; }
.article-plan-metrics { display: grid; grid-template-columns: minmax(0, 1fr) 1px minmax(0, 1fr); gap: 18px; align-items: stretch; }
.article-plan-divider { min-height: 72px; background: #dbe4ef; }
.article-plan-metric { min-width: 0; display: flex; flex-direction: column; align-items: flex-start; gap: 5px; }
.article-plan-metric > span { color: #718196; font-family: var(--font-mono); font-size: .62rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.article-plan-metric > strong { color: var(--ink); font-family: var(--font-display); font-size: clamp(1.14rem, 3.5vw, 1.4rem) !important; font-weight: 600; line-height: 1.2; white-space: nowrap; }
.article-plan-scale { display: flex; height: 15px; align-items: flex-end; gap: 3px; margin-top: auto; }
.article-plan-scale b { display: block; background: #dbe4ef; }
.article-plan-scale b.on { background: var(--signal); }
.article-plan-scale-data b { width: 6px; border-radius: 2px; }
.article-plan-scale-data b:nth-child(1) { height: 5px; }
.article-plan-scale-data b:nth-child(2) { height: 7px; }
.article-plan-scale-data b:nth-child(3) { height: 9px; }
.article-plan-scale-data b:nth-child(4) { height: 11px; }
.article-plan-scale-data b:nth-child(5) { height: 14px; }
.article-plan-scale-days { align-items: center; }
.article-plan-scale-days b { width: 14px; height: 7px; border-radius: 999px; }
.article-plan-foot { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-top: 16px; }
.article-plan-foot > span { color: var(--signal-dark); font-family: var(--font-mono); font-size: .74rem; font-weight: 700; }
.article-plan-foot .live-plan-price { flex: 0 0 auto; min-width: 132px; margin: 0 !important; padding: 13px 16px; border-radius: 12px; background: var(--signal); color: #fff; text-align: center; font-size: 1rem !important; line-height: 1; }
.article-plan-foot .live-plan-price::after { content: " →"; }
[dir="rtl"] .article-plan-foot .live-plan-price::after { content: " ←"; }
.article-plan-skeleton { height: 142px; border: 1px solid #dbe4ef; border-radius: 16px; background: linear-gradient(90deg,#fff,#eaf0f6,#fff); background-size: 200% 100%; animation: articlePlanPulse 1.2s ease-in-out infinite; }
@keyframes articlePlanPulse { 0% { background-position: 200% 0; } 100% { background-position: -200% 0; } }
.article-storefront .live-plan-cta { margin-top: 16px; border-color: #bfd0de; background: #fff; color: var(--ink) !important; }
.article-storefront .live-plan-cta:hover { border-color: var(--signal); color: var(--signal-dark) !important; }

/* Country v2: full commercial ladder and honest comparison. */
.country-plan-ladder { margin-top: 46px; }
.country-plan-ladder h2 { max-width: 32ch; }
.country-plan-ladder table { table-layout: fixed; }
.country-plan-ladder caption { padding: 14px 16px; background: #fff; color: var(--muted); text-align: start; font-size: .8rem; caption-side: bottom; }
.country-plan-row { transition: background .15s ease; }
.country-plan-row:hover { background: #f8fbfd; }
.country-plan-data { color: var(--ink); font-family: var(--font-display); font-size: 1rem; font-weight: 600; }
.country-plan-validity { color: var(--muted); }
.country-plan-total { color: var(--ink); font-family: var(--font-mono); font-weight: 700; }
.country-plan-unit { color: var(--signal-dark); font-family: var(--font-mono); font-size: .86rem; }
.country-plan-action { width: 138px; text-align: end !important; }
.country-plan-choose { min-height: 40px; padding: 9px 14px; font-size: .82rem; white-space: nowrap; }
.country-comparison { margin-top: 46px; padding: 26px; border: 1px solid #b9ddc9; border-radius: 22px; background: #f4fbf7; }
.country-comparison .rich-table-scroll { margin-bottom: 0; }
.country-comparison tbody .is-letisim { background: rgba(12,181,107,.1); }
.country-comparison tbody th span { display: block; margin-top: 3px; color: var(--signal-dark); font-family: var(--font-mono); font-size: .65rem; letter-spacing: .06em; text-transform: uppercase; }

/* Detailed installation guide: a calm product flow plus one bounded pre-flight card. */
.country-setup-guide { margin-top: 46px; padding: clamp(24px,4vw,36px); border: 1px solid var(--line); border-radius: 24px; background: #fff; }
.country-setup-head { max-width: 760px; }
.country-setup-layout { display: grid; grid-template-columns: minmax(0,1.55fr) minmax(250px,.65fr); gap: 22px; align-items: start; margin-top: 24px; }
.country-setup-steps { display: grid; gap: 0; margin: 0 !important; padding: 0 !important; list-style: none; counter-reset: none; }
.country-setup-steps li { position: relative; display: grid; grid-template-columns: 42px minmax(0,1fr); gap: 14px; margin: 0; padding: 0 0 24px; }
.country-setup-steps li:not(:last-child)::after { content: ""; position: absolute; inset: 38px auto 0 20px; width: 2px; background: var(--line); }
.country-setup-number { position: relative; z-index: 1; display: grid; width: 42px; height: 42px; place-items: center; border-radius: 13px; background: var(--ink); color: var(--signal); font: 700 .82rem var(--font-mono); }
.country-setup-steps h3 { margin: 1px 0 4px; font-family: var(--font-display); font-size: .98rem; }
.country-setup-steps p { margin: 0 !important; color: var(--ink); font-size: .94rem; line-height: 1.55; }
.country-setup-steps small { display: block; margin-top: 7px; color: var(--muted); font-size: .81rem; line-height: 1.5; }
.country-important { padding: 21px; border: 1px solid #b9ddc9; border-radius: 18px; background: var(--signal-tint); }
.country-important-mark { display: grid; width: 34px; height: 34px; place-items: center; margin: 0 0 14px !important; border-radius: 10px; background: var(--signal); color: #fff; font-family: var(--font-mono); font-weight: 700; }
.country-important h3 { margin-bottom: 10px; font-family: var(--font-display); font-size: 1rem; }
.country-important ul { margin: 0; padding-inline-start: 18px; }
.country-important li { margin: 7px 0; color: var(--ink); font-size: .86rem; line-height: 1.5; }

/* Final conversion block: app utility wrapped in the future passport mechanic. */
.country-passport-promo { display: grid; grid-template-columns: minmax(300px,.92fr) minmax(0,1.08fr); gap: 34px; align-items: center; margin-top: 44px; padding: clamp(24px,4vw,42px); border-radius: 28px; background: linear-gradient(135deg,#0d1b2a 0%,#16334d 62%,#185441 100%); color: #fff; overflow: hidden; box-shadow: 0 24px 60px rgba(13,27,42,.18); }
.country-passport-visual { position: relative; min-height: 290px; isolation: isolate; }
.country-world { position: absolute; inset: 16px -26px auto auto; width: min(100%,390px); opacity: .2; }
.country-world ellipse, .country-world path { fill: none; stroke: #fff; stroke-width: 1.2; }
.country-world .country-flight-path { stroke: var(--signal); stroke-width: 2.5; stroke-dasharray: 7 7; }
.country-world .country-flight-dot { fill: var(--signal); stroke: none; }
.country-passport-book { position: absolute; inset: 24px auto auto 8px; display: grid; width: 174px; height: 236px; place-content: center; gap: 10px; padding: 20px; border: 1px solid rgba(255,255,255,.22); border-radius: 12px 18px 18px 12px; background: linear-gradient(145deg,#153f38,#0c2824); box-shadow: 18px 22px 42px rgba(0,0,0,.3); rotate: -7deg; text-align: center; }
.country-passport-book::before { content: ""; position: absolute; inset: 0 auto 0 13px; width: 1px; background: rgba(255,255,255,.12); }
.country-passport-mark { display: grid; width: 58px; height: 58px; place-items: center; margin: 0 auto; border: 1px solid rgba(255,255,255,.55); border-radius: 50%; color: var(--signal); }
.country-passport-mark .logo-bars { height: 29px; gap: 4px; }
.country-passport-mark .logo-bars i { width: 6px; }
.country-passport-book b { font-family: var(--font-display); font-size: .82rem; letter-spacing: .18em; }
.country-passport-book small { color: rgba(255,255,255,.72); font-family: var(--font-mono); font-size: .62rem; letter-spacing: .08em; text-transform: uppercase; }
.country-passport-stamp { position: absolute; inset: auto 2px 5px auto; width: 202px; margin: 0; padding: 10px 10px 7px; border: 1px solid rgba(255,255,255,.36); border-radius: 12px; background: #fbfaf6; box-shadow: 0 18px 34px rgba(0,0,0,.24); rotate: 7deg; }
.country-passport-stamp img { display: block; width: 100%; height: auto; aspect-ratio: 4/3; object-fit: contain; }
.country-passport-stamp figcaption { overflow: hidden; color: var(--muted); font-family: var(--font-mono); font-size: .56rem; letter-spacing: .05em; text-align: center; text-overflow: ellipsis; text-transform: uppercase; white-space: nowrap; }
.country-passport-copy h2, .country-passport-copy p { color: #fff; }
.country-passport-copy h2 { max-width: 19ch; margin: 8px 0 12px; font-size: clamp(1.4rem,3vw,2rem); line-height: 1.18; }
.country-passport-copy > p { color: rgba(255,255,255,.78); }
.country-passport-copy .eyebrow { color: var(--signal); }
.country-passport-app-note { margin-top: 18px !important; font-size: .9rem !important; }
.country-passport-copy .app-promo-stores { display: flex; flex-wrap: wrap; margin-top: 20px; }
.country-passport-copy .store-btn { min-width: 190px; color: #fff !important; text-decoration: none !important; }
[dir="rtl"] .country-passport-book { inset: 24px 8px auto auto; rotate: 7deg; }
[dir="rtl"] .country-passport-stamp { inset: auto auto 5px 2px; rotate: -7deg; }

/* ---------- Store promo: every article ---------- */
.app-promo-banner { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 26px; align-items: center; margin-top: 34px; padding: 26px; border-radius: var(--radius); background: linear-gradient(135deg, #0d1b2a 0%, #17344f 100%); color: #fff; overflow: hidden; }
.app-promo-copy h2, .app-promo-copy p { color: #fff; }
.app-promo-copy h2 { margin-bottom: 8px; }
.app-promo-copy > p:last-child { margin-bottom: 0; color: rgba(255,255,255,.78); font-size: .94rem; }
.app-promo-stores { display: grid; gap: 9px; min-width: 180px; }
.article-prose .store-btn, .article-prose .store-btn:hover { color: #fff; text-decoration: none; }
.store-btn.is-disabled { cursor: not-allowed; opacity: .48; filter: grayscale(1); }

/* Мостик к продукту после прочтения: следующие шаги + CTA каталога */
.article-next { padding: 24px; margin-top: 30px; }
.article-next h2 { font-size: 1.18rem; margin: 0 0 10px; }
.article-next ul { padding-inline-start: 22px; margin: 0 0 6px; }
.article-next .btn { margin-top: 14px; }

.article-sources { border-top: 1px solid var(--line); margin-top: 34px; padding-top: 20px; }
.article-sources h2 { font-size: 1.05rem; }
.article-sources p, .article-sources li { font-size: .9rem; color: var(--muted); }

@media (max-width: 720px) {
  .blog-hero { padding: 36px 0 4px; }
  .blog-article-head { padding: 32px 0 22px; }
  .blog-grid { grid-template-columns: 1fr; }
  .country-owner-hero { padding-top: 34px; }
  .country-owner-main .live-catalog-block { padding: 22px !important; }
  .blog-list, .article-prose { padding-bottom: 60px; }
  .article-hero-figure { padding-top: 18px; }
  .article-toc ol { columns: 1; }
  .decision-grid { grid-template-columns: 1fr; }
  .country-app-grid, .live-plan-grid { grid-template-columns: 1fr; }
  .country-apps-brand { padding: 22px !important; }
  .country-setup-layout { grid-template-columns: 1fr; }
  .article-product-proof { grid-template-columns: 1fr; }
  .article-storefront { padding: 22px !important; }
  .article-plan-link { padding: 16px; }
  .app-promo-banner { grid-template-columns: 1fr; padding: 22px; }
  .app-promo-stores { grid-template-columns: repeat(2, minmax(0, 1fr)); min-width: 0; }
  .app-promo-stores .store-btn { min-width: 0; padding-inline: 12px; }
  .country-passport-promo { grid-template-columns: 1fr; gap: 20px; padding: 22px; }
  .country-passport-visual { min-height: 250px; }
  .country-passport-book { width: 150px; height: 204px; }
  .country-passport-stamp { width: 174px; height: auto; }
  .country-plan-ladder table { min-width: 690px; }
  .rich-checklist, .rich-callout, .rich-cta { padding: 18px; }
  .annotated-step-head, .rich-annotated-steps dl > div { grid-template-columns: 1fr; gap: 5px; }
  .claim-citations { white-space: normal; }
}

@media (max-width: 460px) {
  .article-plan-metrics { gap: 12px; }
  .article-plan-foot { align-items: stretch; flex-direction: column; gap: 10px; }
  .article-plan-foot .live-plan-price { width: 100%; min-width: 0; }
  .app-promo-stores { grid-template-columns: 1fr; }
  .country-price-answer { align-items: flex-start; }
  .country-offer-main { align-items: end; }
  .country-offer-main .live-plan-price { min-width: 94px; padding-inline: 10px; }
  .country-app-card-brand { grid-template-columns: 50px minmax(0,1fr); gap: 12px; }
  .country-app-icon { width: 50px; height: 50px; border-radius: 13px; }
  .country-app-icon svg { width: 29px; height: 29px; }
  .country-passport-copy .app-promo-stores { display: grid; grid-template-columns: 1fr; }
  .country-passport-copy .store-btn { width: 100%; min-width: 0; }
}
