/* ═══════════════════════════════════════════════════════════
   АВАНГАРД · ИНЖЕНЕРНЫЙ ЖУРНАЛ — блог, индекс, материал
   расширяет av5-base.css / av5-sections.css
   ═══════════════════════════════════════════════════════════ */

/* ── таглайн рядом с логотипом (подстраницы наследуют из главной) ── */
.nav-tagline{
  display:none;align-self:center;padding-left:18px;
  border-left:1px solid var(--av-line-soft);
  font-family:var(--font-b);font-weight:300;font-size:11px;line-height:1.32;
  letter-spacing:.01em;color:var(--av-body);max-width:26ch;
}
@media (min-width:1180px){ .nav-tagline{display:block;} }

/* ── image-slot: убираем дефолтный border-radius (shape:rounded) ── */
.bl-shot image-slot::part(frame),.bl-shot image-slot::part(ring),
.bl-feat-shot image-slot::part(frame),.bl-feat-shot image-slot::part(ring),
.art-cover image-slot::part(frame),.art-cover image-slot::part(ring),
.prose figure image-slot::part(frame),.prose figure image-slot::part(ring){border-radius:0 !important;}

/* ── категория-бейдж (общий) ── */
.bl-cat{
  font-family:var(--font-m);font-size:9px;letter-spacing:.16em;text-transform:uppercase;
  padding:4px 9px;border:1px solid var(--av-line);color:var(--av-body);white-space:nowrap;
  display:inline-flex;align-items:center;gap:6px;line-height:1;
}
.bl-cat::before{content:"";width:5px;height:5px;background:var(--av-muted);}
.bl-cat.news::before{background:var(--av-signal);}
.bl-cat.case::before{background:#2EE6FF;}
.bl-cat.art::before{background:#FFB020;}
.bl-cat.news{color:var(--av-snow);}
.bl-cat.case{color:var(--av-snow);}
.bl-cat.art{color:var(--av-snow);}

/* ═══════════ КАРТОЧКА МАТЕРИАЛА ═══════════ */
.bl-card{
  display:flex;flex-direction:column;background:var(--av-void);
  position:relative;overflow:hidden;
  transition:background .25s var(--ease);
}
.bl-card::after{
  content:"";position:absolute;left:0;right:0;top:0;height:1px;
  background:var(--av-signal);transform:scaleX(0);transform-origin:left;
  transition:transform .4s var(--ease);z-index:4;
}
.bl-card:hover{background:var(--av-panel);}
.bl-card:hover::after{transform:scaleX(1);}
.bl-shot{position:relative;width:100%;aspect-ratio:16/10;overflow:hidden;border-bottom:1px solid var(--av-line-soft);}
.bl-shot image-slot{display:block;width:100%;height:100%;}
.bl-shot image-slot::part(image){filter:grayscale(.3) brightness(.82) contrast(1.04);transition:filter .4s var(--ease),transform .6s var(--ease);}
.bl-card:hover .bl-shot image-slot::part(image){filter:grayscale(0) brightness(.92) contrast(1.05);transform:scale(1.03);}
.bl-shot .bl-cat{position:absolute;left:13px;top:12px;z-index:3;background:rgba(4,7,10,.82);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);}
.bl-shot .bl-id{
  position:absolute;right:13px;top:12px;z-index:3;
  font-family:var(--font-m);font-size:9px;letter-spacing:.14em;color:var(--av-muted);
  background:rgba(4,7,10,.7);padding:4px 8px;
}
.bl-corner{position:absolute;width:12px;height:12px;border:1px solid var(--av-signal);opacity:0;transition:opacity .3s var(--ease);z-index:3;pointer-events:none;}
.bl-corner.tl{top:8px;left:8px;border-right:0;border-bottom:0;}
.bl-corner.br{bottom:8px;right:8px;border-left:0;border-top:0;}
.bl-card:hover .bl-corner{opacity:.9;}

.bl-body{display:flex;flex-direction:column;gap:13px;padding:clamp(18px,2vw,26px);flex:1;}
.bl-meta{display:flex;align-items:center;gap:12px;font-family:var(--font-m);font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--av-muted);}
.bl-meta .dot{width:3px;height:3px;border-radius:50%;background:var(--av-muted);flex:none;}
.bl-title{
  font-family:var(--font-d);font-weight:600;font-size:clamp(17px,1.5vw,21px);
  line-height:1.18;text-transform:uppercase;letter-spacing:-.005em;color:var(--av-snow);text-wrap:balance;
}
.bl-excerpt{font-size:14.5px;line-height:1.65;color:var(--av-body);text-wrap:pretty;flex:1;}
.bl-read{
  margin-top:4px;font-family:var(--font-m);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--av-signal);display:inline-flex;align-items:center;gap:9px;
}
.bl-read .arr{transition:transform .22s var(--ease);}
.bl-card:hover .bl-read .arr{transform:translateX(5px);}

/* ═══════════ ГЛАВНАЯ · ЛЕНТА-ТИЗЕР ═══════════ */
.blog-head{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;margin-bottom:clamp(34px,4vw,52px);flex-wrap:wrap;}
.blog-head .h2{margin:0;}
.blog-head p{max-width:440px;color:var(--av-body);margin-top:14px;}
.blog-all{
  font-family:var(--font-m);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--av-snow);
  border:1px solid var(--av-line);padding:13px 22px;display:inline-flex;align-items:center;gap:11px;white-space:nowrap;
  transition:border-color .22s var(--ease),color .22s var(--ease);
}
.blog-all:hover{border-color:var(--av-signal);color:var(--av-signal);}
.blog-all .arr{transition:transform .22s var(--ease);}
.blog-all:hover .arr{transform:translateX(5px);}

.bl-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--av-line-soft);border:1px solid var(--av-line-soft);}
@media (max-width:980px){ .bl-grid{grid-template-columns:1fr 1fr;} }
@media (max-width:680px){ .bl-grid{grid-template-columns:1fr;} }