/* v8: unified premium blog / article / topic redesign */
:root{
  --bp-navy:#09214a;
  --bp-blue:#0f54d8;
  --bp-blue2:#2b7cff;
  --bp-ink:#10233f;
  --bp-muted:#64748b;
  --bp-line:rgba(26,72,143,.14);
  --bp-glass:rgba(255,255,255,.72);
  --bp-glass-strong:rgba(255,255,255,.86);
  --bp-shadow:0 24px 70px rgba(9,33,74,.14);
  --bp-shadow-soft:0 14px 38px rgba(9,33,74,.10);
}
body:has(.article-page),body:has(.blog-hub-page){background:radial-gradient(circle at 10% -5%,rgba(43,124,255,.16),transparent 34%),radial-gradient(circle at 92% 10%,rgba(9,33,74,.13),transparent 28%),linear-gradient(180deg,#f7faff 0%,#eef4fb 48%,#f8fbff 100%)!important;color:var(--bp-ink)}
.article-page,.blog-hub-page{max-width:1180px!important;margin-inline:auto!important;padding-inline:clamp(14px,3vw,28px)!important}.article-page a,.blog-hub-page a{text-decoration:none}.pg-breadcrumb{margin-top:16px;margin-bottom:14px;color:rgba(16,35,63,.62)}
/* Premium editorial hero */
.article-hero,.hero.blog-hub,.hero.blog-topic-page{position:relative;isolation:isolate;overflow:hidden;border:1px solid rgba(255,255,255,.72)!important;border-radius:34px!important;padding:clamp(24px,4vw,52px)!important;background:linear-gradient(135deg,rgba(255,255,255,.88),rgba(255,255,255,.58) 52%,rgba(232,240,253,.62))!important;box-shadow:var(--bp-shadow)!important;backdrop-filter:blur(22px) saturate(150%);-webkit-backdrop-filter:blur(22px) saturate(150%)}
.article-hero:before,.hero.blog-hub:before,.hero.blog-topic-page:before{content:"";position:absolute;inset:0;z-index:-2;background:radial-gradient(circle at 12% 8%,rgba(43,124,255,.22),transparent 30%),radial-gradient(circle at 86% 18%,rgba(9,33,74,.16),transparent 28%),linear-gradient(145deg,rgba(255,255,255,.32),rgba(255,255,255,0));pointer-events:none}.article-hero:after,.hero.blog-hub:after,.hero.blog-topic-page:after{content:"";position:absolute;inset:auto -8% -45% 38%;height:70%;z-index:-1;background:linear-gradient(90deg,transparent,rgba(255,255,255,.62),transparent);transform:rotate(-8deg);filter:blur(2px);pointer-events:none}
.article-hero{display:grid!important;grid-template-columns:minmax(0,1fr) minmax(300px,430px)!important;gap:clamp(20px,3.2vw,42px)!important;align-items:start!important}.article-hero>div:first-child{align-self:center}.article-hero h1,.hero.blog-hub .hero__title,.hero.blog-topic-page .hero__title{margin:0!important;color:var(--bp-navy)!important;letter-spacing:-.045em!important;font-weight:920!important;line-height:.98!important;text-wrap:balance}.article-hero h1{font-size:clamp(34px,5.2vw,68px)!important}.hero.blog-hub .hero__title,.hero.blog-topic-page .hero__title{font-size:clamp(36px,5.5vw,72px)!important;max-width:880px}.article-hero__meta,.article-byline,.blog-card__meta,.blog-topic-card__count{display:none!important}.article-lead,.hero.blog-hub .hero-landing-copy,.hero.blog-topic-page .hero-landing-copy{grid-column:1/-1!important;max-width:none!important;margin:0!important;padding:clamp(18px,2.4vw,28px)!important;border-radius:26px!important;border:1px solid var(--bp-line)!important;background:rgba(255,255,255,.56)!important;color:#334867!important;font-size:clamp(17px,1.45vw,21px)!important;line-height:1.72!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.8)!important}.article-answer{grid-column:1/-1!important;margin:0!important;padding:clamp(18px,2.2vw,26px)!important;border-radius:26px!important;border:1px solid rgba(43,124,255,.18)!important;background:linear-gradient(135deg,rgba(255,255,255,.82),rgba(240,246,255,.68))!important;color:#253a59!important;line-height:1.72!important;box-shadow:var(--bp-shadow-soft)!important}.article-answer strong{color:var(--bp-navy)!important}.article-hero__actions{grid-column:1/-1!important;display:flex!important;gap:12px!important;flex-wrap:wrap!important;margin:0!important}.article-hero__actions .blog-card__link{min-height:50px!important;padding:14px 20px!important;border-radius:999px!important;background:linear-gradient(135deg,var(--bp-blue),var(--bp-blue2))!important;color:#fff!important;box-shadow:0 16px 28px rgba(15,84,216,.22)!important;border:1px solid rgba(255,255,255,.24)!important}.article-hero__actions .blog-card__link+ .blog-card__link{background:rgba(255,255,255,.46)!important;color:var(--bp-navy)!important;border-color:rgba(15,84,216,.16)!important;backdrop-filter:blur(16px)!important;box-shadow:0 12px 26px rgba(9,33,74,.10)!important}
.article-hero .article-image-placeholder,.hero.blog-hub .hero__media,.hero.blog-topic-page .hero__media{margin:0!important;align-self:start!important;border-radius:30px!important;padding:10px!important;background:linear-gradient(145deg,rgba(255,255,255,.82),rgba(255,255,255,.44))!important;border:1px solid rgba(255,255,255,.76)!important;box-shadow:0 22px 44px rgba(9,33,74,.16)!important;overflow:hidden!important}.article-hero .article-image-placeholder img,.hero.blog-hub .hero__media img,.hero.blog-topic-page .hero__media img{display:block!important;width:100%!important;height:auto!important;min-height:0!important;max-height:360px!important;object-fit:cover!important;aspect-ratio:16/10!important;border-radius:22px!important;box-shadow:none!important;background:#eaf1fb!important}.hero.blog-hub,.hero.blog-topic-page{display:grid!important;grid-template-columns:minmax(0,1fr) minmax(280px,420px)!important;gap:clamp(20px,3.2vw,42px)!important;align-items:start!important}.hero.blog-hub .hero__overlay,.hero.blog-topic-page .hero__overlay{position:static!important;background:transparent!important;padding:0!important;display:flex!important;align-items:center!important;min-height:0!important}.hero.blog-hub .hero__cta{display:contents!important}.hero.blog-hub .blog-hub__stats{grid-column:1/-1!important;display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:14px!important;margin:0!important}.hero.blog-hub .blog-hub__stats>div{border-radius:22px!important;padding:18px!important;background:rgba(255,255,255,.56)!important;border:1px solid var(--bp-line)!important;box-shadow:var(--bp-shadow-soft)!important}.hero.blog-hub .blog-hub__stats strong{display:block;color:var(--bp-navy);font-size:30px}.hero.blog-hub .blog-hub__stats span{color:var(--bp-muted)}
/* Article body */
.article-content{max-width:1040px!important;margin:clamp(22px,3vw,36px) auto 0!important}.article-section.cp-card,.blog-hub__intro,.blog-hub__list,section.blog-topic-page.cp-card{border-radius:30px!important;border:1px solid rgba(255,255,255,.74)!important;background:rgba(255,255,255,.68)!important;box-shadow:var(--bp-shadow-soft)!important;backdrop-filter:blur(18px) saturate(145%);-webkit-backdrop-filter:blur(18px) saturate(145%);padding:clamp(20px,3vw,34px)!important}.article-section h2,.cp-section-head__title{color:var(--bp-navy)!important;letter-spacing:-.025em!important;font-weight:900!important}.article-section h2{font-size:clamp(26px,3vw,42px)!important}.article-section h3{color:#12386d!important}.article-section p,.article-section li{color:#314762!important;font-size:17px!important;line-height:1.78!important}.article-toc a,.article-links a{border:1px solid rgba(15,84,216,.12)!important;background:rgba(255,255,255,.58)!important;border-radius:18px!important;color:var(--bp-navy)!important;transition:transform .18s ease,box-shadow .18s ease,background .18s ease}.article-toc a:hover,.article-links a:hover{transform:translateY(-2px);background:rgba(255,255,255,.82)!important;box-shadow:0 12px 24px rgba(9,33,74,.10)}.article-note,.article-table-wrap,.article-faq details{background:rgba(255,255,255,.58)!important;border:1px solid var(--bp-line)!important;border-radius:22px!important;box-shadow:0 10px 24px rgba(9,33,74,.06)!important}.article-image-placeholder img{border-radius:28px!important;box-shadow:0 18px 44px rgba(9,33,74,.14)!important}
/* Blog and topic cards */
.blog-topic-nav,.blog-grid{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:clamp(16px,2vw,24px)!important}.blog-topic-card,.blog-card{position:relative!important;overflow:hidden!important;min-height:unset!important;border-radius:28px!important;padding:0!important;background:rgba(255,255,255,.66)!important;border:1px solid rgba(255,255,255,.72)!important;box-shadow:0 18px 44px rgba(9,33,74,.10)!important;backdrop-filter:blur(18px) saturate(145%);-webkit-backdrop-filter:blur(18px) saturate(145%);display:flex!important;flex-direction:column!important;color:var(--bp-ink)!important;transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease}.blog-topic-card:hover,.blog-card:hover{transform:translateY(-5px);box-shadow:0 26px 60px rgba(9,33,74,.16)!important;border-color:rgba(43,124,255,.28)!important}.blog-topic-card:before,.blog-card--with-bg:before{content:"";display:block;width:100%;aspect-ratio:16/10;background-image:var(--card-bg)!important;background-size:cover!important;background-position:var(--card-pos,center center)!important;border-radius:26px 26px 18px 18px!important;box-shadow:inset 0 -60px 80px rgba(9,33,74,.08)}.blog-topic-card:after,.blog-card:after{content:"";position:absolute;inset:0;border-radius:28px;background:linear-gradient(180deg,rgba(255,255,255,.08),rgba(255,255,255,0) 34%,rgba(255,255,255,.16));pointer-events:none}.blog-topic-card h3,.blog-topic-card p,.blog-card h4,.blog-card p,.blog-card .blog-card__link{position:relative;z-index:1}.blog-topic-card h3,.blog-card h4{margin:20px 20px 10px!important;color:var(--bp-navy)!important;font-size:clamp(19px,1.8vw,25px)!important;line-height:1.15!important;letter-spacing:-.025em!important}.blog-card h4 a{color:inherit!important}.blog-topic-card p,.blog-card p{margin:0 20px 18px!important;color:#4c607a!important;line-height:1.62!important;font-size:15.5px!important;display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden}.blog-topic-card p{margin-bottom:22px!important}.blog-card .blog-card__link{margin:auto 20px 20px!important;align-self:flex-start!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;min-height:46px!important;padding:12px 18px!important;border-radius:999px!important;background:rgba(255,255,255,.32)!important;border:1px solid rgba(255,255,255,.74)!important;color:var(--bp-navy)!important;font-weight:900!important;box-shadow:0 14px 28px rgba(9,33,74,.12),inset 0 1px 0 rgba(255,255,255,.78)!important;backdrop-filter:blur(18px) saturate(160%);-webkit-backdrop-filter:blur(18px) saturate(160%);transition:transform .18s ease,background .18s ease,box-shadow .18s ease}.blog-card .blog-card__link:hover{transform:translateY(-2px);background:rgba(255,255,255,.58)!important;box-shadow:0 18px 34px rgba(9,33,74,.16),inset 0 1px 0 rgba(255,255,255,.9)!important}.topic-backlink{display:inline-flex!important;margin-bottom:18px!important;padding:12px 16px!important;border-radius:999px!important;background:rgba(255,255,255,.50)!important;border:1px solid rgba(255,255,255,.70)!important;color:var(--bp-navy)!important;font-weight:850!important;backdrop-filter:blur(16px)}
/* Unified bottom CTA */
.article-service-cta,.article-cta{position:relative!important;overflow:hidden!important;border-radius:32px!important;border:1px solid rgba(255,255,255,.72)!important;background:linear-gradient(135deg,rgba(9,33,74,.96),rgba(15,84,216,.90))!important;color:#fff!important;padding:clamp(24px,3vw,38px)!important;box-shadow:0 26px 62px rgba(9,33,74,.24)!important}.article-service-cta:before,.article-cta:before{content:"";position:absolute;inset:-40% -12% auto 40%;height:160%;background:radial-gradient(circle,rgba(255,255,255,.28),transparent 58%);pointer-events:none}.article-service-cta .cp-section-head__title,.article-service-cta .ya-cta-lead,.article-cta h2,.article-cta p{color:#fff!important}.article-service-cta .cp-section-head__icon{background:rgba(255,255,255,.14)!important;border:1px solid rgba(255,255,255,.24)!important}.article-service-cta .messenger-actions{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:12px!important}.article-service-cta .messenger-actions a,.article-service-cta .messenger-actions button,.article-cta a{min-height:50px!important;border-radius:999px!important;border:1px solid rgba(255,255,255,.32)!important;background:rgba(255,255,255,.16)!important;color:#fff!important;text-decoration:none!important;font-weight:900!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.22),0 14px 26px rgba(0,0,0,.16)!important;backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}.article-service-cta .messenger-actions a:hover,.article-service-cta .messenger-actions button:hover,.article-cta a:hover{background:rgba(255,255,255,.24)!important}
@media(max-width:980px){.article-hero,.hero.blog-hub,.hero.blog-topic-page{grid-template-columns:1fr!important}.article-hero .article-image-placeholder,.hero.blog-hub .hero__media,.hero.blog-topic-page .hero__media{order:-1}.blog-topic-nav,.blog-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}.hero.blog-hub .blog-hub__stats{grid-template-columns:1fr!important}}
@media(max-width:640px){.article-page,.blog-hub-page{padding-inline:12px!important}.article-hero,.hero.blog-hub,.hero.blog-topic-page{border-radius:26px!important;padding:18px!important}.article-hero h1,.hero.blog-hub .hero__title,.hero.blog-topic-page .hero__title{font-size:clamp(30px,10vw,42px)!important}.blog-topic-nav,.blog-grid{grid-template-columns:1fr!important}.article-service-cta .messenger-actions{grid-template-columns:1fr!important}.article-lead,.article-answer,.hero.blog-hub .hero-landing-copy,.hero.blog-topic-page .hero-landing-copy{padding:16px!important}.article-section.cp-card,.blog-hub__intro,.blog-hub__list,section.blog-topic-page.cp-card{border-radius:24px!important;padding:18px!important}}


/* ===== Client fixes 2026-05-16: blog/topic/article/menu/mobile ===== */
/* 1) Blog hub hero: stats must not overlap text */
main.blog-hub-page .hero.blog-hub{align-items:start!important;overflow:hidden!important;}
main.blog-hub-page .hero.blog-hub .hero__cta{display:grid!important;grid-template-columns:1fr!important;gap:16px!important;grid-column:1/-1!important;width:100%!important;min-width:0!important;position:relative!important;z-index:2!important;}
main.blog-hub-page .hero.blog-hub .hero-landing-copy{width:100%!important;max-width:none!important;margin:0!important;}
main.blog-hub-page .hero.blog-hub .blog-hub__stats{position:relative!important;inset:auto!important;display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:14px!important;width:100%!important;max-width:100%!important;margin:0!important;z-index:2!important;}
main.blog-hub-page .hero.blog-hub .blog-hub__stats>div{min-width:0!important;overflow:hidden!important;}

/* 2) Remove the gold "Подборка статей" pseudo-badge on topic pages */
main.blog-hub-page > .hero.blog-topic-page .hero__title:before,
.hero.blog-topic-page .hero__title:before{content:none!important;display:none!important;}

/* 4) Uniform decorative stripe for article sections */
main.article-page .article-section.cp-card,
main.article-page .article-section{position:relative!important;overflow:hidden!important;}
main.article-page .article-section.cp-card:after,
main.article-page .article-section:after{content:""!important;position:absolute!important;left:0!important;top:22px!important;bottom:22px!important;width:5px!important;border-radius:0 999px 999px 0!important;background:linear-gradient(180deg,#0b63f6,#5bb7ff)!important;opacity:.95!important;pointer-events:none!important;}
main.article-page .article-section>h2:first-child,
main.article-page .article-section>h3:first-child{padding-left:10px!important;}

/* 5) Opaque mega menus only */
nav.nav .mega,.mega,.site-mega,nav.nav.desktop-only .site-mega,nav.nav.desktop-only .mega,
nav.nav .has-mega>.mega,.topbar .has-mega>.mega{background:linear-gradient(180deg,#ffffff 0%,#f3f7fc 100%)!important;background-color:#fff!important;opacity:1!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important;border:1px solid rgba(23,59,115,.16)!important;box-shadow:0 24px 70px rgba(8,34,74,.22),0 2px 12px rgba(8,34,74,.10)!important;}
.site-mega::before,.mega::before{background:none!important;opacity:0!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important;}
nav.nav .mega *, .site-mega *{opacity:1!important;}

/* 6-7) Mobile and fragile article layout fixes */
main.article-page,main.blog-hub-page{max-width:1220px!important;width:100%!important;min-width:0!important;}
main.article-page *,main.blog-hub-page *{min-width:0;}
main.article-page .article-content{width:min(100%,1000px)!important;max-width:1000px!important;}
main.article-page .article-hero{min-width:0!important;max-width:100%!important;}
main.article-page .article-hero h1,.hero.blog-hub .hero__title,.hero.blog-topic-page .hero__title{overflow-wrap:anywhere!important;word-break:normal!important;max-width:100%!important;}
main.article-page .article-table-wrap{max-width:100%!important;overflow-x:auto!important;-webkit-overflow-scrolling:touch!important;}
main.article-page .article-image-placeholder img{max-width:100%!important;height:auto!important;}
@media(max-width:980px){
  main.article-page .article-hero,main.blog-hub-page .hero.blog-hub,main.blog-hub-page .hero.blog-topic-page{display:grid!important;grid-template-columns:1fr!important;grid-template-areas:"media" "title" "lead" "answer" "actions"!important;gap:16px!important;}
  main.blog-hub-page .hero.blog-hub,main.blog-hub-page .hero.blog-topic-page{grid-template-areas:"media" "title" "copy" "stats"!important;}
  main.article-page .article-hero>div:first-child,main.blog-hub-page .hero__overlay{grid-area:title!important;width:100%!important;}
  main.article-page .article-hero .article-image-placeholder,main.blog-hub-page .hero__media{grid-area:media!important;justify-self:stretch!important;max-width:100%!important;width:100%!important;order:0!important;}
  main.article-page .article-lead{grid-area:lead!important;}
  main.article-page .article-answer{grid-area:answer!important;}
  main.article-page .article-hero__actions{grid-area:actions!important;}
  main.blog-hub-page .hero.blog-hub .hero-landing-copy,.hero.blog-topic-page .hero-landing-copy{grid-area:copy!important;}
  main.blog-hub-page .hero.blog-hub .blog-hub__stats{grid-area:stats!important;grid-template-columns:1fr!important;}
}
@media(max-width:640px){
  html,body{max-width:100%!important;overflow-x:hidden!important;}
  main.article-page,main.blog-hub-page{padding-left:12px!important;padding-right:12px!important;}
  main.article-page .article-hero,main.blog-hub-page .hero.blog-hub,main.blog-hub-page .hero.blog-topic-page{padding:16px!important;border-radius:24px!important;}
  main.article-page .article-hero h1,main.blog-hub-page .hero.blog-hub .hero__title,main.blog-hub-page .hero.blog-topic-page .hero__title{font-size:clamp(28px,9.5vw,40px)!important;line-height:1.06!important;letter-spacing:-.035em!important;}
  main.article-page .article-hero .article-image-placeholder img,main.blog-hub-page .hero__media img{max-height:260px!important;object-fit:cover!important;}
  main.article-page .article-section,main.article-page .article-section.cp-card,main.article-page .blog-final-cta,main.blog-hub-page .blog-hub__intro,main.blog-hub-page .blog-hub__list,main.blog-hub-page section.blog-topic-page.cp-card{padding:16px!important;border-radius:22px!important;}
  main.article-page .article-grid,main.article-page .article-links,main.blog-hub-page .blog-topic-nav,main.blog-hub-page .blog-grid,main.blog-hub-page .blog-articles-grid{grid-template-columns:1fr!important;}
  main.article-page .article-hero__actions .blog-card__link,main.article-page .article-service-cta .messenger-actions a,main.article-page .article-service-cta .messenger-actions button,main.article-page .article-cta a,main.blog-hub-page .blog-card__link{width:100%!important;max-width:100%!important;justify-content:center!important;text-align:center!important;white-space:normal!important;}
  main.article-page .article-section p,main.article-page .article-section li{font-size:16px!important;line-height:1.65!important;}
  main.article-page .article-table{min-width:680px!important;}
}
