/* ==========================================================================
   workingcell.ru — раздел «Блог». Надстройка над base.css + site.css
   Компоненты префикса .bl-*
   ========================================================================== */

/* ---------- Хлебные крошки ---------- */
.bl-crumbs{display:flex;flex-wrap:wrap;align-items:center;gap:8px;font-size:13px;color:rgba(255,255,255,.55);}
.bl-crumbs a{color:rgba(255,255,255,.72);text-decoration:none;transition:color .15s ease;}
.bl-crumbs a:hover{color:var(--color-orange-500);}
.bl-crumbs span[aria-current]{color:#fff;}

/* ---------- Hero раздела ---------- */
.bl-hero{position:relative;overflow:hidden;background:linear-gradient(135deg,#1a2d38 0%,#2f485c 62%,#3d5d74 100%);color:#fff;}
.bl-hero__tile{position:absolute;inset:0;background:url(../img/tile-white.png) 0 0;background-size:118px 96px;opacity:.04;pointer-events:none;}
.bl-hero__glow{position:absolute;right:-140px;top:-120px;width:520px;height:520px;border-radius:50%;
  background:radial-gradient(circle,rgba(255,73,0,.28) 0%,rgba(255,73,0,0) 68%);pointer-events:none;}
.bl-hero__slash{position:absolute;left:0;bottom:0;width:100%;height:6px;background:var(--color-orange-600);
  clip-path:polygon(0 0,58% 0,54% 100%,0 100%);}
.bl-hero__inner{position:relative;display:grid;grid-template-columns:1.35fr .95fr;gap:clamp(28px,4vw,56px);align-items:start;
  padding-top:clamp(34px,4.4vw,54px);padding-bottom:clamp(38px,4.8vw,58px);}
.bl-hero h1{font-family:var(--font-brand);font-weight:900;font-size:clamp(30px,4.8vw,50px);line-height:1.04;
  text-transform:uppercase;letter-spacing:-.01em;margin:16px 0 14px;color:#fff;}
.bl-hero__lead{font-size:clamp(15px,1.6vw,17.5px);line-height:1.62;color:rgba(255,255,255,.76);margin:0 0 24px;max-width:640px;}

/* Поиск */
.bl-search{position:relative;max-width:560px;}
.bl-search svg{position:absolute;left:16px;top:50%;transform:translateY(-50%);pointer-events:none;}
.bl-search input{width:100%;height:56px;border-radius:var(--radius-md);border:1.5px solid rgba(255,255,255,.18);
  background:rgba(255,255,255,.08);color:#fff;font-family:var(--font-body);font-size:16px;padding:0 120px 0 48px;outline:none;
  transition:border-color .15s ease,background .15s ease;}
.bl-search input::placeholder{color:rgba(255,255,255,.5);}
.bl-search input:focus{border-color:var(--color-orange-500);background:rgba(255,255,255,.12);}
.bl-search__btn{position:absolute;right:6px;top:6px;height:44px;}

/* Быстрые темы */
.bl-quick{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px;align-items:center;}
.bl-quick__label{font-size:12.5px;text-transform:uppercase;letter-spacing:.06em;color:rgba(255,255,255,.45);font-weight:700;margin-right:4px;}
.bl-quick a{font-size:13.5px;color:rgba(255,255,255,.82);text-decoration:none;padding:6px 13px;border-radius:999px;
  border:1px solid rgba(255,255,255,.2);background:rgba(255,255,255,.05);transition:all .15s ease;white-space:nowrap;}
.bl-quick a:hover{border-color:var(--color-orange-500);background:rgba(255,73,0,.16);color:#fff;}

/* Топ-3 в hero */
.bl-top{background:rgba(255,255,255,.055);border:1px solid rgba(255,255,255,.13);border-radius:var(--radius-lg);padding:22px 22px 10px;}
.bl-top h2{font-family:var(--font-brand);font-weight:800;font-size:13px;text-transform:uppercase;letter-spacing:.09em;
  color:var(--color-orange-500);margin:0 0 4px;}
.bl-top ol{list-style:none;margin:0;padding:0;counter-reset:t;}
.bl-top li{counter-increment:t;border-top:1px solid rgba(255,255,255,.1);}
.bl-top li:first-child{border-top:none;}
.bl-top ol a{display:flex;gap:14px;align-items:flex-start;padding:15px 0;text-decoration:none;}
.bl-top ol a::before{content:counter(t);font-family:var(--font-brand);font-weight:900;font-size:19px;color:rgba(255,255,255,.28);line-height:1.2;flex-shrink:0;}
.bl-top__t{font-family:var(--font-brand);font-weight:600;font-size:14.5px;line-height:1.38;color:rgba(255,255,255,.9);transition:color .15s ease;}
.bl-top ol a:hover .bl-top__t{color:var(--color-orange-500);}
.bl-top__m{display:block;font-size:12px;color:rgba(255,255,255,.42);margin-top:5px;font-weight:400;}

.bl-topcta{border-top:1px solid rgba(255,255,255,.1);margin-top:4px;padding:18px 0 20px;display:flex;flex-direction:column;gap:12px;}
.bl-topcta p{margin:0;font-size:13.5px;line-height:1.5;color:rgba(255,255,255,.62);}
.bl-topcta .wc-btn{width:100%;text-decoration:none;}

@media(max-width:1000px){
  .bl-hero__inner{grid-template-columns:1fr;}
  .bl-hero__slash{clip-path:polygon(0 0,72% 0,68% 100%,0 100%);}
}

/* ---------- Липкая панель рубрик ---------- */
.bl-chipbar{position:sticky;top:93px;z-index:40;background:rgba(255,255,255,.96);backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);border-bottom:1px solid var(--color-border);}
.bl-chipbar__inner{display:flex;align-items:center;gap:16px;padding-top:12px;padding-bottom:12px;}
.bl-chips{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;flex:1;padding-bottom:2px;}
.bl-chips::-webkit-scrollbar{display:none;}
.bl-chip{flex-shrink:0;display:inline-flex;align-items:center;gap:7px;height:38px;padding:0 16px;border-radius:999px;
  border:1.5px solid var(--color-border);background:#fff;cursor:pointer;font-family:var(--font-brand);font-weight:700;
  font-size:14px;color:var(--color-navy-800);white-space:nowrap;transition:all .15s ease;}
.bl-chip span{font-size:12px;font-weight:700;color:var(--color-text-muted);}
.bl-chip:hover{border-color:var(--color-orange-200);background:var(--color-orange-50);}
.bl-chip.is-active{background:var(--color-navy-800);border-color:var(--color-navy-800);color:#fff;}
.bl-chip.is-active span{color:rgba(255,255,255,.6);}
.bl-sort{flex-shrink:0;height:38px;padding:0 34px 0 14px;border-radius:var(--radius-md);border:1.5px solid var(--color-border);
  background:#fff;font-family:var(--font-body);font-size:14px;color:var(--color-text-primary);cursor:pointer;appearance:none;-webkit-appearance:none;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%237a8f9c' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'><polyline points='6 9 12 15 18 9'/></svg>");
  background-repeat:no-repeat;background-position:right 10px center;}
@media(max-width:760px){.bl-sort{display:none;}.bl-chipbar{top:71px;}}

/* ---------- Общая карточка материала ---------- */
.bl-card{display:flex;flex-direction:column;background:#fff;border:1px solid var(--color-border);border-radius:var(--radius-lg);
  box-shadow:var(--shadow-sm);overflow:hidden;text-decoration:none;height:100%;
  transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease;}
.bl-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-xl);border-color:var(--color-orange-200);}
.bl-card__img{position:relative;aspect-ratio:16/9;background:var(--color-neutral-100);overflow:hidden;flex-shrink:0;}
.bl-card__img img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .4s ease;}
.bl-card:hover .bl-card__img img{transform:scale(1.04);}
.bl-card__badge{position:absolute;left:12px;top:12px;display:inline-flex;align-items:center;height:26px;padding:0 12px;
  border-radius:999px;background:rgba(26,45,56,.86);backdrop-filter:blur(4px);color:#fff;font-family:var(--font-brand);
  font-weight:800;font-size:11px;text-transform:uppercase;letter-spacing:.06em;}
.bl-card__body{padding:20px 22px 22px;display:flex;flex-direction:column;gap:10px;flex:1;}
.bl-meta{display:flex;flex-wrap:wrap;align-items:center;gap:8px;font-size:12.5px;color:var(--color-text-muted);}
.bl-meta__dot{width:3px;height:3px;border-radius:50%;background:var(--color-border-strong);flex-shrink:0;}
.bl-meta__read{display:inline-flex;align-items:center;gap:5px;}
.bl-card h3{font-family:var(--font-brand);font-weight:800;font-size:18px;line-height:1.26;color:var(--color-navy-800);
  margin:0;letter-spacing:-.005em;transition:color .15s ease;}
.bl-card:hover h3{color:var(--color-orange-700);}
.bl-card p{font-size:14.5px;line-height:1.55;color:var(--color-text-body);margin:0;
  display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;}
.bl-card__more{margin-top:auto;padding-top:6px;display:inline-flex;align-items:center;gap:7px;font-family:var(--font-brand);
  font-weight:700;font-size:13px;text-transform:uppercase;letter-spacing:.05em;color:var(--color-orange-600);}
.bl-card__more svg{transition:transform .18s ease;}
.bl-card:hover .bl-card__more svg{transform:translateX(4px);}

/* ---------- Главный материал + свежее ---------- */
.bl-feat{display:grid;grid-template-columns:1.55fr 1fr;gap:24px;align-items:stretch;}
.bl-feat__main{display:grid;grid-template-rows:auto 1fr;}
.bl-feat__main .bl-card__img{aspect-ratio:21/10;}
.bl-feat__main h3{font-size:clamp(22px,2.5vw,30px);line-height:1.15;}
.bl-feat__main p{font-size:16px;-webkit-line-clamp:4;}
.bl-feat__main .bl-card__body{padding:26px 28px 28px;gap:12px;}
.bl-side{display:flex;flex-direction:column;background:var(--color-navy-50);border:1px solid var(--color-navy-100);
  border-radius:var(--radius-lg);padding:22px 22px 8px;}
.bl-side__h{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:4px;}
.bl-side__h h2{font-family:var(--font-brand);font-weight:800;font-size:13px;text-transform:uppercase;letter-spacing:.09em;
  color:var(--color-navy-800);margin:0;}
.bl-side__h a{font-size:12.5px;font-weight:700;color:var(--color-orange-600);text-decoration:none;text-transform:uppercase;letter-spacing:.04em;}
.bl-mini{display:flex;gap:14px;padding:16px 0;border-top:1px solid var(--color-neutral-200);text-decoration:none;align-items:flex-start;}
.bl-mini:first-of-type{border-top:none;}
.bl-mini__img{width:88px;height:66px;flex-shrink:0;border-radius:var(--radius-sm);overflow:hidden;background:var(--color-neutral-100);}
.bl-mini__img img{width:100%;height:100%;object-fit:cover;display:block;}
.bl-mini__cat{font-family:var(--font-brand);font-weight:800;font-size:10.5px;text-transform:uppercase;letter-spacing:.07em;
  color:var(--color-orange-600);display:block;margin-bottom:5px;}
.bl-mini__t{font-family:var(--font-brand);font-weight:700;font-size:14.5px;line-height:1.34;color:var(--color-navy-800);
  display:block;transition:color .15s ease;}
.bl-mini:hover .bl-mini__t{color:var(--color-orange-700);}
.bl-mini__m{font-size:12px;color:var(--color-text-muted);display:block;margin-top:6px;}
.bl-ask{margin-top:auto;border-top:1px solid var(--color-neutral-200);padding:18px 0 16px;}
.bl-ask b{display:block;font-family:var(--font-brand);font-weight:800;font-size:13px;text-transform:uppercase;
  letter-spacing:.06em;color:var(--color-navy-800);margin-bottom:7px;}
.bl-ask p{margin:0;font-size:13.5px;line-height:1.55;color:var(--color-text-muted);}
.bl-ask a{color:var(--color-orange-600);font-weight:700;text-decoration:none;}
.bl-ask a:hover{text-decoration:underline;}
@media(max-width:1000px){.bl-feat{grid-template-columns:1fr;}}

/* ---------- Сетка материалов ---------- */
.bl-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;}
@media(max-width:980px){.bl-grid{grid-template-columns:repeat(2,1fr);gap:20px;}}
@media(max-width:620px){.bl-grid{grid-template-columns:1fr;}}
.bl-empty{display:none;text-align:center;padding:52px 20px;color:var(--color-text-muted);font-size:15px;
  border:1px dashed var(--color-border-strong);border-radius:var(--radius-lg);}

/* ---------- CTA-полоса ---------- */
.bl-cta{position:relative;overflow:hidden;background:var(--color-navy-800);border-radius:var(--radius-xl);
  padding:clamp(26px,3.4vw,40px) clamp(24px,3.4vw,44px);display:grid;grid-template-columns:1fr auto;gap:26px;align-items:center;}
.bl-cta__tile{position:absolute;inset:0;background:url(../img/tile-white.png) 0 0;background-size:118px 96px;opacity:.05;pointer-events:none;}
.bl-cta__bar{position:absolute;left:0;top:0;bottom:0;width:5px;background:var(--color-orange-600);}
.bl-cta h2{position:relative;font-family:var(--font-brand);font-weight:900;font-size:clamp(21px,2.6vw,29px);text-transform:uppercase;
  line-height:1.1;color:#fff;margin:0 0 8px;}
.bl-cta p{position:relative;margin:0;font-size:15px;line-height:1.55;color:rgba(255,255,255,.7);max-width:640px;}
.bl-cta__act{position:relative;display:flex;flex-direction:column;gap:10px;align-items:stretch;min-width:230px;}
.bl-cta__phone{display:inline-flex;align-items:center;justify-content:center;gap:8px;font-family:var(--font-brand);font-weight:700;
  font-size:15px;color:#fff;text-decoration:none;padding:11px 18px;border:1.5px solid rgba(255,255,255,.25);border-radius:var(--radius-md);
  transition:border-color .15s ease,background .15s ease;}
.bl-cta__phone:hover{border-color:#fff;background:rgba(255,255,255,.08);}
@media(max-width:820px){.bl-cta{grid-template-columns:1fr;}.bl-cta__act{min-width:0;}}

/* ---------- Разделы блога (перелинковка) ---------- */
.bl-hub{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;}
@media(max-width:900px){.bl-hub{grid-template-columns:repeat(2,1fr);}}
@media(max-width:560px){.bl-hub{grid-template-columns:1fr;}}
.bl-hubcard{display:flex;gap:16px;align-items:flex-start;background:#fff;border:1px solid var(--color-border);
  border-radius:var(--radius-lg);padding:22px;text-decoration:none;box-shadow:var(--shadow-xs);
  transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease;}
.bl-hubcard:hover{transform:translateY(-3px);box-shadow:var(--shadow-lg);border-color:var(--color-orange-200);}
.bl-hubcard__ic{width:46px;height:46px;border-radius:var(--radius-md);background:var(--color-orange-50);display:flex;
  align-items:center;justify-content:center;flex-shrink:0;}
.bl-hubcard h3{font-family:var(--font-brand);font-weight:800;font-size:15.5px;text-transform:uppercase;color:var(--color-navy-800);
  margin:0 0 6px;line-height:1.2;letter-spacing:.01em;}
.bl-hubcard p{margin:0;font-size:13.5px;line-height:1.5;color:var(--color-text-muted);}
.bl-hubcard b{display:block;margin-top:8px;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--color-orange-600);}

/* ---------- Подписка ---------- */
.bl-sub{background:var(--color-navy-50);border:1px solid var(--color-navy-100);border-radius:var(--radius-xl);
  padding:clamp(26px,3.4vw,40px);display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,3vw,44px);align-items:center;}
.bl-sub h2{font-family:var(--font-brand);font-weight:900;font-size:clamp(21px,2.5vw,28px);text-transform:uppercase;
  color:var(--color-navy-800);margin:14px 0 10px;line-height:1.1;}
.bl-sub p{margin:0;font-size:15px;line-height:1.6;color:var(--color-text-body);}
.bl-sub__form{display:flex;flex-direction:column;gap:12px;}
.bl-sub__row{display:flex;gap:10px;}
.bl-sub__row .wc-field__control{height:52px;}
@media(max-width:860px){.bl-sub{grid-template-columns:1fr;}.bl-sub__row{flex-direction:column;}}

/* ---------- SEO-текст и врезка-определение ---------- */
.bl-seo{display:grid;grid-template-columns:1.5fr 1fr;gap:clamp(24px,3.4vw,48px);align-items:start;}
.bl-seo h2{font-family:var(--font-brand);font-weight:900;font-size:clamp(20px,2.3vw,26px);text-transform:uppercase;
  color:var(--color-navy-800);margin:0 0 14px;line-height:1.12;}
.bl-seo p{font-size:14.5px;line-height:1.68;color:var(--color-text-body);margin:0 0 12px;}
.bl-seo a{color:var(--color-navy-700);}
.bl-def{background:#fff;border:1px solid var(--color-border);border-left:4px solid var(--color-orange-600);
  border-radius:var(--radius-md);padding:22px 24px;box-shadow:var(--shadow-xs);}
.bl-def h3{font-family:var(--font-brand);font-weight:800;font-size:13px;text-transform:uppercase;letter-spacing:.08em;
  color:var(--color-orange-700);margin:0 0 12px;}
.bl-def dl{margin:0;display:flex;flex-direction:column;gap:14px;}
.bl-def dt{font-family:var(--font-brand);font-weight:700;font-size:14px;color:var(--color-navy-800);margin-bottom:3px;}
.bl-def dd{margin:0;font-size:14px;line-height:1.55;color:var(--color-text-body);}
@media(max-width:860px){.bl-seo{grid-template-columns:1fr;}}

/* ---------- Подвал: компактная сетка (4 колонки, реквизиты в блоке компании) ---------- */
.wc-footer__grid{display:grid;grid-template-columns:1.25fr 1fr 1fr 1.05fr;gap:32px 30px;}
@media(max-width:900px){.wc-footer__grid{grid-template-columns:repeat(2,1fr);}}
@media(max-width:560px){.wc-footer__grid{grid-template-columns:1fr;gap:28px;}}

/* ---------- Кнопка «показать ещё» ---------- */
.bl-more{display:flex;justify-content:center;}
.bl-more .wc-btn{min-width:260px;border:1.5px solid var(--color-border-strong);background:#fff;color:var(--color-navy-800);}
.bl-more .wc-btn:hover{border-color:var(--color-orange-600);color:var(--color-orange-700);background:var(--color-orange-50);}

/* ---------- Секционные отступы ---------- */
.bl-sec{padding-top:clamp(38px,4.6vw,60px);}
.bl-sec--last{padding-bottom:clamp(44px,5.2vw,72px);}
.bl-sechead{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin-bottom:22px;flex-wrap:wrap;}
.bl-sechead h2{font-family:var(--font-brand);font-weight:900;font-size:clamp(22px,3vw,32px);text-transform:uppercase;
  color:var(--color-navy-800);margin:12px 0 0;line-height:1.06;letter-spacing:-.01em;}
.bl-sechead__note{font-size:14px;color:var(--color-text-muted);}

/* Пустое состояние на боевом показываем классом --on (в прототипе блок прятался и показывался фильтром). */
.bl-empty--on{display:block;}
.bl-empty--on h2{font-family:var(--font-brand);font-size:22px;color:var(--color-navy-900);margin:0 0 8px;}
/* Чипы рубрик в теме — ссылки, а не кнопки: снимаем подчёркивание. */
a.bl-chip{text-decoration:none;}
