/* ============================================================
   DENTA BLOG — единые стили для /blog и статей блога.
   Использует переменные из denta-shared.css (--ink, --mint и т.д.).
   ============================================================ */

/* === ARTICLE HERO === */
.blog-article-hero{
  position:relative;overflow:hidden;
  padding:clamp(38px,5vw,72px) 0 clamp(34px,4vw,52px);
  background:
    radial-gradient(ellipse 70% 60% at 88% 12%, rgba(216,245,237,.85) 0%, transparent 60%),
    radial-gradient(ellipse 55% 50% at 8% 95%, rgba(255,228,222,.7) 0%, transparent 65%),
    var(--cream);
}
.blog-article-hero__cat{
  display:inline-flex;align-items:center;gap:8px;
  background:var(--mint-mist);color:var(--mint-deep);
  padding:8px 16px;border-radius:999px;
  font-size:11px;font-weight:800;
  letter-spacing:.12em;text-transform:uppercase;margin-bottom:16px;
}
.blog-article-hero__cat .ico{
  width:14px;height:14px;display:inline-flex;align-items:center;justify-content:center;
}
.blog-article-hero__title{
  font-family:var(--font-head);
  font-size:clamp(28px,4vw,48px);
  font-weight:800;
  line-height:1.1;letter-spacing:-.02em;
  color:var(--ink);
  margin:0 0 22px;
  max-width:880px;
}
.blog-article-hero__title .accent{
  color:var(--mint-deep);font-style:italic;font-weight:500;
}
.blog-article-hero__meta{
  display:flex;align-items:center;gap:24px;flex-wrap:wrap;
  font-size:14px;color:var(--ink-soft);
}
.blog-article-hero__meta-item{
  display:inline-flex;align-items:center;gap:6px;
}
.blog-article-hero__meta-item svg{flex-shrink:0;color:var(--mint-deep)}
.blog-article-hero__author{
  display:inline-flex;align-items:center;gap:10px;
}
.blog-article-hero__author-ava{
  width:36px;height:36px;border-radius:50%;
  background:linear-gradient(135deg,var(--mint-soft) 0%,var(--mint) 100%);
  display:flex;align-items:center;justify-content:center;
  color:#fff;font-weight:800;font-size:13px;
  border:2px solid #fff;box-shadow:0 4px 14px rgba(11,37,69,.12);
}
.blog-article-hero__author-name{font-weight:700;color:var(--ink)}
.blog-article-hero__author-role{font-size:12px;color:var(--gray)}

/* === ARTICLE LAYOUT === */
.blog-article-layout{
  display:grid;
  grid-template-columns:minmax(0,1fr) 320px;
  gap:clamp(24px,3vw,44px);
  max-width:1200px;
  margin:0 auto;
  padding:clamp(34px,4vw,56px) clamp(16px,3vw,24px);
  align-items:start;
  /* Десктоп: отступ липкого сайдбара от верха (шапка + safe-area) */
  --blog-sticky-top:max(12px, calc(env(safe-area-inset-top, 0px) + 108px));
  --blog-sticky-bottom-gap:24px;
}

.blog-article-content{
  background:#fff;
  border-radius:28px;
  padding:clamp(24px,3.4vw,44px);
  box-shadow:0 24px 54px rgba(11,37,69,.06);
  font-size:17px;
  line-height:1.78;
  color:var(--ink-soft);
}

.blog-article-content > p:first-child{
  font-size:19px;line-height:1.65;color:var(--ink);
  font-weight:500;
}
.blog-article-content p{margin:0 0 18px}
.blog-article-content strong{color:var(--ink);font-weight:700}
.blog-article-content a{color:var(--mint-deep);text-decoration:underline;text-decoration-thickness:1.5px;text-underline-offset:3px}
.blog-article-content a:hover{color:var(--ink)}

.blog-article-content h2{
  font-family:var(--font-head);
  font-size:clamp(22px,2.6vw,30px);
  font-weight:700;
  line-height:1.18;letter-spacing:-.015em;
  color:var(--ink);
  margin:42px 0 18px;
  scroll-margin-top:80px;
}
.blog-article-content h2:first-child{margin-top:0}

.blog-article-content h3{
  font-family:var(--font-head);
  font-size:clamp(17px,2vw,22px);
  font-weight:700;line-height:1.25;color:var(--ink);
  margin:32px 0 14px;
}

.blog-article-content ul,
.blog-article-content ol{
  margin:0 0 22px;
  padding-left:0;
  list-style:none;
}
.blog-article-content ul li,
.blog-article-content ol li{
  position:relative;
  padding-left:30px;
  margin-bottom:10px;
}
.blog-article-content ul li::before{
  content:"";
  position:absolute;left:6px;top:11px;
  width:8px;height:8px;border-radius:50%;
  background:var(--mint-deep);
}
.blog-article-content ol{counter-reset:blog-li}
.blog-article-content ol li{counter-increment:blog-li}
.blog-article-content ol li::before{
  content:counter(blog-li);
  position:absolute;left:0;top:1px;
  width:22px;height:22px;border-radius:50%;
  background:var(--mint-mist);color:var(--mint-deep);
  display:flex;align-items:center;justify-content:center;
  font-size:12px;font-weight:800;
}

/* "Чек-лист" с галочками — круг + SVG (как hero-compare / hero-pill) */
.blog-article-content ul.checklist li{
  display:flex;align-items:flex-start;gap:12px;
  padding-left:0;
  margin-bottom:0;
}
.blog-article-content ul.checklist li::before{
  content:"";
  position:static;
  left:auto;
  top:auto;
  flex:0 0 20px;
  width:20px;height:20px;
  margin-top:2px;
  border-radius:50%;
  background-color:var(--mint);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-position:center;
  background-size:11px 11px;
}
.blog-article-content ul.checklist li::after{
  display:none;
}

.blog-article-content blockquote{
  margin:24px 0;
  padding:18px 22px;
  border-left:4px solid var(--mint);
  background:var(--mint-mist);
  border-radius:0 14px 14px 0;
  font-style:italic;color:var(--ink);
}

.blog-article-content img,
.blog-article-content figure img{
  max-width:100%;border-radius:18px;display:block;margin:24px auto;
}

/* === MODULES INSIDE ARTICLE === */

/* Карточки информации (4 шт. в гриде) */
.blog-article-content .info-cards{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(180px,1fr));
  gap:14px;margin:26px 0;
}
.blog-article-content .info-card{
  background:linear-gradient(145deg,var(--cream) 0%, #fff 100%);
  border:1px solid rgba(11,37,69,.08);
  border-radius:18px;
  padding:18px;
  transition:transform .2s ease,box-shadow .2s ease;
}
.blog-article-content .info-card:hover{
  transform:translateY(-3px);
  box-shadow:0 18px 36px rgba(11,37,69,.08);
}
.blog-article-content .info-card-icon{
  display:inline-flex;width:38px;height:38px;border-radius:12px;
  background:var(--mint-mist);color:var(--mint-deep);
  align-items:center;justify-content:center;
  font-size:18px;margin-bottom:10px;
}
.blog-article-content .info-card-title{
  font-family:var(--font-head);font-weight:700;font-size:15px;color:var(--ink);
  margin:0 0 6px;line-height:1.3;
}
.blog-article-content .info-card-text{
  font-size:13.5px;line-height:1.5;color:var(--ink-soft);margin:0;
}

/* Highlight «Важно знать» */
.blog-article-content .article-highlight{
  margin:24px 0;
  padding:18px 22px;
  border-radius:18px;
  background:linear-gradient(135deg,#FFF8EE 0%, #FFE9CB 100%);
  border:1px solid rgba(255,200,87,.4);
  color:var(--ink);
  font-size:15px;line-height:1.65;
}
.blog-article-content .article-highlight strong{color:var(--ink)}

/* Warning «Чего не делать» */
.blog-article-content .article-warning{
  margin:24px 0;
  padding:18px 22px;
  border-radius:18px;
  background:linear-gradient(135deg,#FFE9E5 0%, #FFD5CC 100%);
  border:1px solid rgba(208,74,60,.3);
  color:var(--ink);
  font-size:15px;line-height:1.65;
}

/* Этапы (1, 2, 3, 4) */
.blog-article-content .stages{
  display:grid;gap:12px;margin:24px 0;
}
.blog-article-content .stage-item{
  display:grid;grid-template-columns:46px 1fr;gap:14px;
  background:#fff;border:1px solid rgba(11,37,69,.08);
  border-radius:18px;padding:18px;
  transition:border-color .2s ease,transform .2s ease;
}
.blog-article-content .stage-item:hover{
  border-color:rgba(31,178,148,.4);
  transform:translateX(2px);
}
.blog-article-content .stage-num{
  width:46px;height:46px;border-radius:50%;
  background:linear-gradient(135deg,var(--mint) 0%,var(--mint-deep) 100%);
  color:#fff;font-family:var(--font-head);font-weight:800;font-size:18px;
  display:flex;align-items:center;justify-content:center;
  box-shadow:0 8px 18px rgba(31,178,148,.3);
}
.blog-article-content .stage-title{
  font-family:var(--font-head);font-weight:700;font-size:15px;color:var(--ink);
  margin:0 0 6px;
}
.blog-article-content .stage-text{
  font-size:14px;line-height:1.55;color:var(--ink-soft);margin:0;
}

/* CTA inline (в середине статьи) */
.blog-article-content .cta-inline{
  margin:32px 0;
  padding:26px;
  border-radius:22px;
  background:linear-gradient(135deg,var(--ink) 0%,#194f86 100%);
  color:#fff;text-align:center;
  position:relative;overflow:hidden;
}
.blog-article-content .cta-inline::before{
  content:"";position:absolute;
  top:-30px;right:-30px;width:120px;height:120px;border-radius:50%;
  background:radial-gradient(circle,rgba(62,207,178,.35) 0%,transparent 70%);
  pointer-events:none;
}
.blog-article-content .cta-inline-icon{
  font-size:38px;margin-bottom:10px;position:relative;z-index:1;
}
.blog-article-content .cta-inline-title{
  font-family:var(--font-head);font-weight:700;
  font-size:clamp(18px,2.2vw,22px);
  margin:0 0 10px;color:#fff;line-height:1.25;position:relative;z-index:1;
}
.blog-article-content .cta-inline-desc{
  font-size:14px;color:rgba(255,255,255,.85);
  margin:0 auto 16px;max-width:520px;position:relative;z-index:1;
}
.blog-article-content .cta-inline .btn,
.blog-article-content .cta-inline .blog-btn{
  position:relative;z-index:1;
  display:inline-flex;align-items:center;gap:8px;
  padding:14px 28px;border-radius:999px;
  background:var(--mint);color:#fff;font-weight:700;text-decoration:none;
  transition:transform .2s,box-shadow .2s;
  box-shadow:0 10px 24px rgba(31,178,148,.35);
}
.blog-article-content .cta-inline .btn:hover{
  transform:translateY(-2px);box-shadow:0 14px 30px rgba(31,178,148,.45);color:#fff;
}

/* Share-кнопки */
.blog-article-content .article-share{
  margin:32px 0 0;
  padding:18px 0 0;
  border-top:1px dashed rgba(11,37,69,.15);
  display:flex;align-items:center;gap:12px;flex-wrap:wrap;
}
.blog-article-content .share-label{
  font-size:13px;color:var(--gray);font-weight:600;
}
.blog-article-content .share-btn{
  display:inline-flex;align-items:center;gap:6px;
  padding:8px 14px;border-radius:999px;
  background:var(--mint-mist);color:var(--mint-deep);
  font-size:13px;font-weight:700;text-decoration:none;
  transition:all .2s;
}
.blog-article-content .share-btn:hover{
  background:var(--mint-deep);color:#fff;
}

/* === SIDEBAR === */
.blog-article-sidebar{
  display:grid;
  gap:18px;
}
/* Десктоп: «умный» sticky — привязка к вьюпорту, скролл внутри колонки, уезжает вместе с блоком статьи до футера */
@media(min-width:1025px){
  .blog-article-sidebar{
    position:sticky;
    top:var(--blog-sticky-top);
    align-self:start;
    max-height:calc(100vh - var(--blog-sticky-top) - var(--blog-sticky-bottom-gap));
    max-height:calc(100dvh - var(--blog-sticky-top) - var(--blog-sticky-bottom-gap));
    overflow-y:auto;
    overscroll-behavior:contain;
    scrollbar-gutter:stable;
    padding-right:2px;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:thin;
    scrollbar-color:rgba(11,37,69,.35) transparent;
  }
  .blog-article-sidebar::-webkit-scrollbar{width:6px}
  .blog-article-sidebar::-webkit-scrollbar-thumb{
    background:rgba(11,37,69,.22);
    border-radius:999px;
  }
}
html[data-theme="dark"] .blog-article-sidebar::-webkit-scrollbar-thumb{
  background:rgba(232,240,255,.28);
}
html[data-theme="dark"] .blog-article-sidebar{
  scrollbar-color:rgba(232,240,255,.35) transparent;
}
.blog-sidebar-card{
  background:#fff;
  border:1px solid rgba(11,37,69,.08);
  border-radius:22px;
  padding:22px;
  box-shadow:0 18px 40px rgba(11,37,69,.06);
}
.blog-sidebar-card__title{
  display:flex;align-items:center;gap:8px;
  font-family:var(--font-head);font-weight:700;font-size:15px;color:var(--ink);
  margin:0 0 14px;letter-spacing:-.005em;
}
.blog-sidebar-card__title svg{color:var(--mint-deep);flex-shrink:0}

/* Содержание */
.blog-toc{list-style:none;padding:0;margin:0}
.blog-toc li{margin-bottom:8px}
.blog-toc li a{
  display:block;
  padding:8px 12px;
  border-radius:10px;
  color:var(--ink-soft);font-size:13.5px;line-height:1.4;
  text-decoration:none;
  transition:all .2s;
  border-left:2px solid transparent;
}
.blog-toc li a:hover{
  background:var(--mint-mist);color:var(--mint-deep);
  border-left-color:var(--mint-deep);
}

/* Sidebar CTA (тёмная карточка) */
.blog-sidebar-card--cta{
  background:linear-gradient(135deg,var(--ink) 0%,#194f86 100%);
  border:0;color:#fff;text-align:center;
  position:relative;overflow:hidden;
}
.blog-sidebar-card--cta::before{
  content:"";position:absolute;
  top:-20px;right:-20px;width:100px;height:100px;border-radius:50%;
  background:radial-gradient(circle,rgba(62,207,178,.35) 0%,transparent 70%);
  pointer-events:none;
}
.blog-sidebar-card--cta .blog-sidebar-card__title{
  color:#fff;justify-content:center;font-size:14px;
  position:relative;z-index:1;
}
.blog-sidebar-card--cta .blog-sidebar-card__title svg{color:var(--mint)}
.blog-sidebar-card--cta__icon{
  font-size:36px;margin-bottom:8px;position:relative;z-index:1;
}
.blog-sidebar-card--cta__text{
  font-size:13px;color:rgba(255,255,255,.78);
  margin:0 auto 16px;line-height:1.55;position:relative;z-index:1;
}
.blog-sidebar-card--cta .blog-btn{
  position:relative;z-index:1;
  display:inline-flex;width:100%;justify-content:center;align-items:center;gap:8px;
  padding:13px 18px;border-radius:999px;
  background:var(--mint);color:#fff;font-weight:700;font-size:13px;
  text-decoration:none;transition:transform .2s;
}
.blog-sidebar-card--cta .blog-btn:hover{transform:translateY(-2px);color:#fff}

/* Список «Читайте также» */
.blog-related-list{display:grid;gap:8px}
.blog-related-item{
  display:block;padding:12px 14px;
  border-radius:14px;background:var(--cream);
  text-decoration:none;color:inherit;
  transition:all .2s;
  border:1px solid transparent;
}
.blog-related-item:hover{
  background:var(--mint-mist);
  border-color:rgba(31,178,148,.3);
  transform:translateX(2px);
}
.blog-related-item__cat{
  font-size:10px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;
  color:var(--mint-deep);display:block;margin-bottom:4px;
}
.blog-related-item__title{
  font-size:13.5px;line-height:1.4;color:var(--ink);font-weight:600;display:block;
}

/* === ARTICLE END CTA === */
.blog-article-end-cta{
  margin:0 auto;max-width:1200px;
  padding:0 clamp(16px,3vw,24px) clamp(40px,5vw,64px);
}
.blog-article-end-cta__inner{
  background:
    radial-gradient(ellipse 60% 60% at 0% 0%, rgba(62,207,178,.25) 0%, transparent 60%),
    linear-gradient(135deg,var(--ink) 0%,#194f86 100%);
  color:#fff;
  border-radius:30px;
  padding:clamp(28px,4vw,48px);
  display:grid;
  grid-template-columns:minmax(0,1.4fr) auto;
  gap:30px;
  align-items:center;
  box-shadow:0 30px 60px rgba(11,37,69,.18);
}
.blog-article-end-cta__tag{
  display:inline-flex;align-items:center;gap:6px;
  background:rgba(62,207,178,.2);border:1px solid rgba(62,207,178,.4);
  color:var(--mint);
  padding:6px 14px;border-radius:999px;
  font-size:11px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;
  margin-bottom:14px;
}
.blog-article-end-cta__title{
  font-family:var(--font-head);font-weight:700;
  font-size:clamp(24px,3vw,34px);line-height:1.15;letter-spacing:-.015em;
  color:#fff;margin:0 0 12px;
}
.blog-article-end-cta__desc{
  font-size:15px;line-height:1.6;
  color:rgba(255,255,255,.82);
  margin:0 0 18px;max-width:560px;
}
.blog-article-end-cta__promises{
  display:flex;flex-wrap:wrap;gap:14px;
  margin:0;padding:0;list-style:none;
}
.blog-article-end-cta__promises li{
  display:inline-flex;align-items:center;gap:6px;
  font-size:13px;font-weight:600;color:rgba(255,255,255,.85);
  padding:0;
}
.blog-article-end-cta__promises li::before{display:none}
.blog-article-end-cta__promises li svg{color:var(--mint);flex-shrink:0}
.blog-article-end-cta__actions{
  display:flex;flex-direction:column;gap:10px;min-width:240px;
}
.blog-article-end-cta__btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  padding:15px 26px;border-radius:999px;
  font-weight:700;font-size:14px;text-decoration:none;
  transition:transform .2s,box-shadow .2s;
}
.blog-article-end-cta__btn--primary{
  background:var(--mint);color:#fff;
  box-shadow:0 12px 28px rgba(31,178,148,.4);
}
.blog-article-end-cta__btn--primary:hover{
  transform:translateY(-2px);color:#fff;
  box-shadow:0 16px 36px rgba(31,178,148,.5);
}
.blog-article-end-cta__btn--ghost{
  background:rgba(255,255,255,.12);color:#fff;
  border:1px solid rgba(255,255,255,.25);
}
.blog-article-end-cta__btn--ghost:hover{
  background:rgba(255,255,255,.2);color:#fff;
}
.blog-article-end-cta__btn--wa{
  background:#25D366;color:#fff;
}
.blog-article-end-cta__btn--wa:hover{
  background:#1faa54;color:#fff;
}

/* === LISTING /blog === */
.blog-listing-hero{
  position:relative;overflow:hidden;
  padding:clamp(40px,5vw,72px) 0 clamp(28px,3.5vw,44px);
  background:
    radial-gradient(ellipse 70% 60% at 88% 12%, rgba(216,245,237,.85) 0%, transparent 60%),
    radial-gradient(ellipse 55% 50% at 8% 95%, rgba(255,228,222,.7) 0%, transparent 65%),
    var(--cream);
  text-align:center;
}
.blog-listing-hero__label{
  display:inline-flex;align-items:center;gap:8px;
  background:var(--mint-mist);color:var(--mint-deep);
  padding:8px 16px;border-radius:999px;
  font-size:11px;font-weight:800;
  letter-spacing:.12em;text-transform:uppercase;margin-bottom:14px;
}
.blog-listing-hero__title{
  font-family:var(--font-head);font-weight:800;
  font-size:clamp(34px,5vw,56px);line-height:1.05;letter-spacing:-.02em;
  color:var(--ink);
  margin:0 0 14px;
}
.blog-listing-hero__title .accent{
  color:var(--mint-deep);font-style:italic;font-weight:500;
}
.blog-listing-hero__sub{
  font-size:17px;line-height:1.55;color:var(--ink-soft);
  max-width:640px;margin:0 auto;
}

/* Фильтры (категории) */
.blog-filters{
  background:#fff;
  border-bottom:1px solid rgba(11,37,69,.06);
  padding:18px 0;
  position:sticky;top:0;z-index:20;
  box-shadow:0 2px 14px rgba(11,37,69,.05);
}
.blog-filters__inner{
  display:flex;flex-wrap:wrap;gap:8px;justify-content:center;
}
.blog-filter-btn{
  display:inline-flex;align-items:center;gap:6px;
  padding:8px 16px;border-radius:999px;
  background:var(--cream);color:var(--ink-soft);
  border:1px solid transparent;
  font-size:13px;font-weight:600;cursor:pointer;
  transition:all .2s;
}
.blog-filter-btn:hover{
  background:var(--mint-mist);color:var(--mint-deep);
}
.blog-filter-btn.active{
  background:var(--mint-deep);color:#fff;
  box-shadow:0 6px 14px rgba(31,178,148,.3);
}
.blog-filter-btn .filter-count{
  display:inline-flex;align-items:center;justify-content:center;
  min-width:22px;padding:0 6px;height:18px;border-radius:10px;
  background:rgba(0,0,0,.1);font-size:11px;font-weight:800;
}
.blog-filter-btn.active .filter-count{background:rgba(255,255,255,.2)}

/* Грид статей */
.blog-grid-section{
  padding:clamp(34px,4vw,56px) 0;
  background:var(--cream);
}
.blog-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:24px;
}
.blog-card{
  display:flex;flex-direction:column;
  background:#fff;border-radius:24px;overflow:hidden;
  border:1px solid rgba(11,37,69,.06);
  transition:transform .25s ease,box-shadow .25s ease;
  text-decoration:none;color:inherit;
}
.blog-card:hover{
  transform:translateY(-4px);
  box-shadow:0 24px 48px rgba(11,37,69,.1);
  color:inherit;
}
.blog-card__media{
  position:relative;
  height:200px;
  display:flex;align-items:center;justify-content:center;
  font-size:64px;
  color:#fff;
  background:linear-gradient(135deg,var(--ink) 0%,#194f86 100%);
}
.blog-card__cat{
  position:absolute;top:14px;left:14px;
  background:rgba(255,255,255,.92);color:var(--ink);
  padding:5px 12px;border-radius:999px;
  font-size:11px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;
}
.blog-card__read{
  position:absolute;top:14px;right:14px;
  background:rgba(11,37,69,.6);color:#fff;
  padding:5px 12px;border-radius:999px;
  font-size:11px;font-weight:600;
}
.blog-card__body{
  padding:22px;flex:1;display:flex;flex-direction:column;
}
.blog-card__date{
  font-size:12px;color:var(--gray);font-weight:600;
  letter-spacing:.04em;text-transform:uppercase;margin-bottom:10px;
}
.blog-card__title{
  font-family:var(--font-head);font-weight:700;
  font-size:18px;line-height:1.25;letter-spacing:-.005em;
  color:var(--ink);
  margin:0 0 12px;
  flex:1;
}
.blog-card__excerpt{
  font-size:14px;line-height:1.55;color:var(--ink-soft);
  margin:0 0 16px;
}
.blog-card__footer{
  display:flex;justify-content:space-between;align-items:center;gap:10px;
  padding-top:14px;border-top:1px dashed rgba(11,37,69,.1);
}
.blog-card__author{
  display:inline-flex;align-items:center;gap:8px;
  font-size:12px;font-weight:600;color:var(--ink-soft);
}
.blog-card__author-ava{
  width:26px;height:26px;border-radius:50%;
  background:linear-gradient(135deg,var(--mint-soft) 0%,var(--mint) 100%);
  display:flex;align-items:center;justify-content:center;font-size:11px;color:#fff;font-weight:800;
}
.blog-card__read-link{
  font-size:13px;font-weight:700;color:var(--mint-deep);
  text-decoration:none;display:inline-flex;align-items:center;gap:4px;
}
.blog-card__read-link:hover{color:var(--ink)}

/* Featured (первая большая) */
.blog-card--featured{
  grid-column:1/-1;
  display:grid;grid-template-columns:1.1fr 1fr;
}
.blog-card--featured .blog-card__media{
  height:auto;min-height:260px;font-size:88px;
}
.blog-card--featured .blog-card__title{font-size:24px}
.blog-card--featured .blog-card__excerpt{font-size:15px;margin-bottom:20px}

/* Цветовые градиенты медиа */
.blog-card__media--mint{background:linear-gradient(135deg,#1FB294 0%,#0e8770 100%)}
.blog-card__media--coral{background:linear-gradient(135deg,#D04A3C 0%,#9b2e22 100%)}
.blog-card__media--lilac{background:linear-gradient(135deg,#6B4FB7 0%,#3f2c80 100%)}
.blog-card__media--sky{background:linear-gradient(135deg,#1F6FE5 0%,#103e85 100%)}
.blog-card__media--sunny{background:linear-gradient(135deg,#FFC857 0%,#B97A0E 100%);color:#fff}
.blog-card__media--green{background:linear-gradient(135deg,#3ECFB2 0%,#1B8770 100%)}

/* === RESPONSIVE === */
@media(max-width:1024px){
  .blog-article-layout{grid-template-columns:1fr}
  .blog-article-sidebar{order:2}
  .blog-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .blog-card--featured{grid-template-columns:1fr}
  .blog-card--featured .blog-card__media{min-height:200px}
  .blog-article-end-cta__inner{grid-template-columns:1fr}
  .blog-article-end-cta__actions{min-width:0;flex-direction:row;flex-wrap:wrap}
  .blog-article-end-cta__actions .blog-article-end-cta__btn{flex:1;min-width:140px}
}
@media(max-width:640px){
  .blog-grid{grid-template-columns:1fr}
  .blog-article-content{padding:22px;border-radius:22px}
  .blog-article-end-cta__inner{padding:24px;border-radius:24px}
  .blog-article-end-cta__actions{flex-direction:column}
  .blog-article-end-cta__actions .blog-article-end-cta__btn{width:100%}
  .blog-article-hero__meta{font-size:13px;gap:14px}
}

/* === Подсветка ссылки «Блог» в общем подвале на blog-страницах === */
.footer-col ul a strong{
  font-weight:700;
  color:#9ee5d4;
  opacity:1;
}
.footer-col ul a:has(strong){opacity:1}

/* ============================================================
   Тёмная тема: фоны карточек и фильтров (иначе светлый текст на #fff).
   ============================================================ */
html[data-theme="dark"] .blog-article-hero,
html[data-theme="dark"] .blog-listing-hero{
  background:
    radial-gradient(ellipse 70% 60% at 88% 12%, rgba(62,207,178,.14) 0%, transparent 60%),
    radial-gradient(ellipse 55% 50% at 8% 95%, rgba(255,122,107,.12) 0%, transparent 65%),
    var(--cream);
}
html[data-theme="dark"] .blog-article-content{
  background:var(--white);
  border:1px solid rgba(232,240,255,.1);
  box-shadow:0 24px 54px rgba(0,0,0,.35);
}
html[data-theme="dark"] .blog-sidebar-card{
  background:var(--white);
  border-color:rgba(232,240,255,.12);
  box-shadow:0 18px 40px rgba(0,0,0,.32);
}
html[data-theme="dark"] .blog-toc li a:hover{
  background:var(--mint-mist);
  color:var(--mint-deep);
}
html[data-theme="dark"] .blog-related-item{
  background:var(--cream-deep);
  border-color:rgba(232,240,255,.08);
}
html[data-theme="dark"] .blog-related-item:hover{
  background:var(--mint-mist);
  border-color:rgba(62,207,178,.35);
}
html[data-theme="dark"] .blog-filters{
  background:var(--white);
  border-bottom-color:rgba(232,240,255,.1);
  box-shadow:0 2px 14px rgba(0,0,0,.25);
}
html[data-theme="dark"] .blog-card{
  background:var(--white);
  border-color:rgba(232,240,255,.1);
}
html[data-theme="dark"] .blog-card:hover{
  box-shadow:0 24px 48px rgba(0,0,0,.4);
}
html[data-theme="dark"] .blog-card__cat{
  background:rgba(7,11,17,.88);
  color:var(--ink);
  border:1px solid rgba(232,240,255,.12);
}
html[data-theme="dark"] .blog-card__footer{
  border-top-color:rgba(232,240,255,.12);
}
html[data-theme="dark"] .blog-article-content .info-card{
  background:linear-gradient(145deg,var(--cream-deep) 0%,var(--white) 100%);
  border-color:rgba(232,240,255,.12);
}
html[data-theme="dark"] .blog-article-content .info-card:hover{
  box-shadow:0 18px 36px rgba(0,0,0,.35);
}
html[data-theme="dark"] .blog-article-content .article-highlight{
  background:linear-gradient(135deg,#2a2418 0%,#3a3020 100%);
  border-color:rgba(255,200,87,.35);
  color:var(--ink);
}
html[data-theme="dark"] .blog-article-content .article-warning{
  background:linear-gradient(135deg,#3d2826 0%,#4a2f2c 100%);
  border-color:rgba(255,122,107,.35);
  color:var(--ink);
}
html[data-theme="dark"] .blog-article-content .stage-item{
  background:var(--white);
  border-color:rgba(232,240,255,.12);
}
html[data-theme="dark"] .blog-article-content .article-share{
  border-top-color:rgba(232,240,255,.15);
}
html[data-theme="dark"] .blog-article-hero__author-ava{
  border-color:var(--gray-light);
  box-shadow:0 4px 14px rgba(0,0,0,.35);
}
html[data-theme="dark"] .blog-article-end-cta__inner{
  box-shadow:0 30px 60px rgba(0,0,0,.45);
}