/* ═══════════════════════════════════════════════════════════════════
   kagami-blog.css · v0.1 · 2026-09-30
   Само класовете на блога и статиите (Ш6 статия · Ш7 блог — индекс).
   Зарежда се СЛЕД kagami-brand.css; kagami-brand.css не се пипа.
   Цвят на темата: --accent (слага се на <body> или на картата).
   Раздели: 1 теми · 2 индекс (филтри, търсачка, карти) · 3 статия (подпис, съдържание, цитат, мнение, свързани) · 4 телефон
   ═══════════════════════════════════════════════════════════════════ */

/* ── 1 · теми (цвят по тема, от палитрата на брандбука) ── */
.t-ai{--accent:#0ABFB0}      /* AI инструменти — мент */
.t-home{--accent:#2BB673}    /* умен дом — зелено */
.t-hw{--accent:#0B7EA8}      /* хардуер и роботи — теал */
.t-cpu{--accent:#E8A020}     /* процесори — кехлибар */
.t-retro{--accent:#E8A020}   /* ретро компютри — кехлибар */
.t-reg{--accent:#D85A30}     /* регулации / съответствие — корал */
.t-news{--accent:#8FC7FF}    /* новини и анализи 2026 — светло синьо */
.t-op{--accent:#F6F7FA}      /* мнение — бяло */

/* ── 2 · индекс ── */
.blog{max-width:1120px;margin:0 auto;padding:0 20px 40px}
.bl-links{display:flex;flex-wrap:wrap;gap:10px;margin-top:20px}
.bl-bar{position:sticky;top:64px;z-index:10;background:rgba(8,18,43,.94);backdrop-filter:blur(8px);border-bottom:1px solid var(--line);padding:14px 0;margin:0 0 26px;display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.bl-search{flex:1 1 220px;min-width:200px;background:rgba(255,255,255,.05);border:1px solid var(--line);border-radius:10px;padding:9px 14px;color:#fff;font-family:var(--f-body);font-size:.92rem}
.bl-search:focus{outline:none;border-color:var(--mint)}
.bl-search::placeholder{color:var(--muted)}
.bl-f{display:flex;flex-wrap:wrap;gap:6px}
.bl-f button{font-family:var(--f-mono);font-size:.72rem;font-weight:600;padding:6px 12px;border-radius:20px;border:1px solid var(--line);background:transparent;color:var(--silver);cursor:pointer;display:inline-flex;align-items:center;gap:6px}
.bl-f button i{width:8px;height:8px;border-radius:50%;background:var(--accent,var(--mint));display:inline-block}
.bl-f button:hover{color:#fff;border-color:var(--accent,var(--mint))}
.bl-f button.on{background:var(--accent,var(--mint));border-color:var(--accent,var(--mint));color:var(--ink)}
.bl-f button.on i{background:var(--ink)}
.bl-count{font-family:var(--f-mono);font-size:.72rem;color:var(--muted);margin-left:auto}
.bl-group{margin-bottom:40px;scroll-margin-top:140px}
.bl-group>h2{font-size:clamp(1.4rem,2.6vw,1.8rem);margin-bottom:6px}
.bl-group>h2 .n{display:block;font-family:var(--f-mono);font-size:.74rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--accent,var(--mint));margin-bottom:6px}
.bl-group>p.sub{color:var(--silver);font-size:.94rem;margin-bottom:16px;max-width:70ch}
.bl-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.bl-card{display:flex;flex-direction:column;gap:8px;color:inherit;border-top:3px solid var(--accent,var(--mint))}
.bl-card:hover{text-decoration:none;border-color:var(--accent,var(--mint))}
.bl-card .meta{display:flex;flex-wrap:wrap;gap:4px 10px;align-items:center}
.bl-card .tg{font-family:var(--f-mono);font-size:.68rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--accent,var(--mint))}
.bl-card .dt,.bl-card .rt{font-family:var(--f-mono);font-size:.7rem;color:var(--muted)}
.bl-card .dt.nd{font-style:italic;opacity:.8}
.bl-card h3{font-size:1.15rem;line-height:1.25;margin:2px 0 0}
.bl-card p{font-size:.9rem;flex:1}
.bl-card .labs{display:flex;flex-wrap:wrap;gap:6px}
.bl-card .labs .lab{font-size:.64rem;padding:3px 8px}
.bl-card .go{font-family:var(--f-mono);font-size:.72rem;color:var(--muted);align-self:flex-end}
.bl-card:hover .go{color:var(--accent,var(--mint))}
.bl-card .old{font-family:var(--f-mono);font-size:.66rem;color:var(--muted)}
.bl-card.hide,.bl-group.hide{display:none}
.bl-empty{display:none;color:var(--silver);padding:20px 0}
.bl-empty.on{display:block}

/* ── 3 · статия ── */
.article{max-width:860px;margin:0 auto;padding:0 20px 40px}
.byline{display:flex;flex-wrap:wrap;gap:6px 16px;align-items:center;font-family:var(--f-mono);font-size:.76rem;color:var(--muted);margin:4px 0 18px}
.byline b{color:var(--text2);font-weight:600}
.art-toc{border:1px solid var(--line);border-radius:var(--r);background:var(--surface);padding:16px 20px;margin:0 0 34px}
.art-toc .k{font-family:var(--f-mono);font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;color:var(--accent,var(--mint));margin-bottom:8px}
.art-toc ol{margin:0 0 0 20px;color:var(--silver);font-size:.92rem;columns:2;column-gap:28px}
.art-toc li{padding:3px 0;break-inside:avoid}
.art-toc a{color:var(--silver)}
.art-toc a:hover{color:var(--accent,var(--mint));text-decoration:none}
.article .l-sec>h2 .n{color:var(--accent,var(--mint))}
.article .crumb .here{color:var(--accent,var(--mint))}
.article .l-sec ul.dots{margin:4px 0 16px 22px;color:var(--text2)}
.article .l-sec ul.dots li{padding:3px 0;line-height:1.7}
.article .l-sec ol.steps>li::before{background:var(--accent,var(--mint))}
/* цитат */
blockquote.q{margin:20px 0;padding:16px 20px 16px 22px;border-left:3px solid var(--accent,var(--mint));background:rgba(255,255,255,.03);border-radius:0 12px 12px 0}
blockquote.q p{font-family:var(--f-head);font-style:italic;font-size:1.08rem;color:#fff;line-height:1.6;margin-bottom:8px}
blockquote.q p[lang=en]{font-family:var(--f-body);font-style:normal;font-size:.95rem;color:var(--text2)}
blockquote.q cite{display:block;font-family:var(--f-mono);font-style:normal;font-size:.72rem;color:var(--muted)}
/* какво е обновено */
.upd{border:1px solid #3d86d6;background:rgba(61,134,214,.08);border-radius:12px;padding:16px 18px;margin:0 0 30px}
.upd .tt{font-family:var(--f-mono);font-size:.74rem;font-weight:600;letter-spacing:.12em;color:#8fc7ff;margin-bottom:8px}
.upd ul{margin:0 0 0 18px;color:var(--text2);font-size:.92rem;line-height:1.7}
.upd li{padding:2px 0}
.upd s{color:var(--muted)}
/* мнение на Галин — само ако живата статия има мнение */
.opinion{border:1px solid rgba(246,247,250,.35);border-radius:var(--r);padding:20px 22px;background:rgba(246,247,250,.04);margin:30px 0}
.opinion .k{font-family:var(--f-mono);font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;color:#fff;margin-bottom:8px}
.opinion p{font-family:var(--f-head);font-style:italic;color:var(--text2)}
/* свързано и споделяне */
.rel-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.rel-grid .card{display:flex;flex-direction:column;gap:6px;color:inherit}
.rel-grid .card:hover{text-decoration:none}
.rel-grid .card .k{font-family:var(--f-mono);font-size:.68rem;letter-spacing:.12em;text-transform:uppercase;color:var(--accent,var(--mint))}
.rel-grid .card h3{font-size:1.08rem}
.shr-inline{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-top:18px}
.shr-inline .k{font-family:var(--f-mono);font-size:.72rem;color:var(--muted);margin-right:4px}
.shr-inline a{font-size:.8rem;font-weight:700;padding:6px 12px;border-radius:8px;border:1px solid var(--line);color:#fff;background:rgba(255,255,255,.03)}
.shr-inline a:hover{border-color:var(--accent,var(--mint));color:var(--accent,var(--mint));text-decoration:none}
.disclaimer{font-size:.84rem;color:var(--muted);border-top:1px dashed var(--line);padding-top:14px;margin-top:10px}

/* ── 4 · телефон ── */
@media(max-width:980px){.bl-grid,.rel-grid{grid-template-columns:1fr 1fr}}
@media(max-width:700px){
  .blog,.article{padding:0 16px 30px}
  .bl-grid,.rel-grid{grid-template-columns:1fr}
  .bl-bar{position:static}
  .bl-count{margin-left:0;width:100%}
  .art-toc ol{columns:1}
}

/* Карето „Следваща стъпка“ в края на статия (blog_cta.py) */
.cta-next{margin:0 0 46px}.cta-next .tt{font-size:1.05rem}
.cta-next .cta-btns{display:flex;flex-wrap:wrap;gap:10px;margin-top:14px}
.cta-next .btn{font-size:.95rem;padding:10px 16px}