/* ============================================================
   Axivelo — blog styles. Loads AFTER /assets/styles.css.
   Reuses shared :root tokens (navy + gold). Never edit styles.css.
   ============================================================ */

/* header CTA pill (blog chrome reuses styles.css .site-header) */
.site-header .nav-cta{background:linear-gradient(180deg,#FBC52D,#F49A05);color:#0a0e18!important;font-weight:800;border-radius:8px}
.site-header .nav-cta:hover{filter:brightness(1.05);background:linear-gradient(180deg,#FBC52D,#F49A05)}

.blog-shell{width:min(var(--max),calc(100% - 32px));margin:0 auto;padding:40px 0 56px}
.post-shell{max-width:760px}

/* breadcrumb */
.crumbs{display:flex;flex-wrap:wrap;gap:6px;align-items:center;font-size:.85rem;color:var(--muted);margin:0 0 18px;padding:0;list-style:none}
.crumbs li{display:inline-flex;align-items:center;gap:6px}
.crumbs li+li::before{content:"›";color:var(--line);margin-right:2px}
.crumbs a{color:var(--link);text-decoration:none}
.crumbs a:hover{text-decoration:underline}
.crumbs [aria-current=page]{color:var(--text)}

/* post meta + lead */
.post-eyebrow{color:var(--accent);font-size:.78rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase;margin:0 0 12px}
.post-meta{display:flex;flex-wrap:wrap;gap:8px 16px;align-items:center;color:var(--muted);font-size:.9rem;margin:0 0 24px}
.post-meta strong{color:var(--text)}
.post-lead{font-size:1.18rem;line-height:1.6;color:var(--text);margin:0 0 26px}

/* key-takeaway / TL;DR box (AI-extractable answer-first) */
.tldr{border:1px solid rgba(248,176,36,.32);border-radius:12px;background:linear-gradient(135deg,rgba(248,176,36,.09),rgba(21,31,46,.6));padding:18px 20px;margin:0 0 30px}
.tldr p:last-child{margin-bottom:0}
.tldr .tldr-h{font-family:"Poppins",sans-serif;font-weight:700;color:var(--accent-2);font-size:.82rem;letter-spacing:.1em;text-transform:uppercase;margin:0 0 8px;display:block}

/* table of contents */
.toc{border:1px solid var(--line);border-radius:10px;background:rgba(15,23,36,.6);padding:16px 20px;margin:0 0 30px}
.toc p{font-weight:700;color:var(--text);margin:0 0 8px;font-size:.95rem}
.toc ul{margin:0;padding-left:1.1rem}
.toc li{margin:3px 0}
.toc a{color:var(--link);text-decoration:none}
.toc a:hover{text-decoration:underline}

/* article body rhythm */
.post-body h2{scroll-margin-top:80px}
.post-body h3{scroll-margin-top:80px}
.post-body ul,.post-body ol{margin:0 0 22px}

/* key-points list with check ticks */
.kp{list-style:none;padding-left:0;margin:0 0 22px}
.kp li{position:relative;padding-left:28px;margin:8px 0}
.kp li::before{content:"";position:absolute;left:0;top:.45em;width:14px;height:8px;border-left:2px solid var(--accent);border-bottom:2px solid var(--accent);transform:rotate(-45deg)}

/* author box (E-E-A-T) */
.author{display:flex;gap:14px;align-items:flex-start;border:1px solid var(--line);border-radius:12px;background:rgba(15,23,36,.6);padding:18px 20px;margin:36px 0}
.author img{border-radius:50%;flex:0 0 auto}
.author b{color:var(--text)}
.author p{margin:4px 0 0;font-size:.92rem}

/* in-article CTA band */
.cta{border:1px solid rgba(248,176,36,.34);border-radius:16px;background:linear-gradient(135deg,rgba(248,176,36,.12),rgba(21,31,46,.7));padding:28px 26px;margin:38px 0;text-align:center}
.cta h2{margin:0 0 8px;color:var(--text)}
.cta p{margin:0 0 18px}
.cta .btn-cta{display:inline-block;background:linear-gradient(180deg,#FBC52D,#F49A05);color:#0a0e18;font-weight:800;text-decoration:none;padding:13px 24px;border-radius:10px;font-size:1rem}
.cta .btn-cta:hover{filter:brightness(1.05)}

/* FAQ on posts */
.post-faq details{border:1px solid var(--line);border-radius:10px;background:rgba(15,23,36,.6);padding:0;margin:10px 0;overflow:hidden}
.post-faq summary{cursor:pointer;padding:16px 18px;font-weight:700;color:var(--text);list-style:none}
.post-faq summary::-webkit-details-marker{display:none}
.post-faq summary::after{content:"+";float:right;color:var(--accent);font-weight:800}
.post-faq details[open] summary::after{content:"–"}
.post-faq details[open] summary{border-bottom:1px solid var(--line)}
.post-faq details p{padding:14px 18px 4px}

/* related links */
.related{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin:18px 0 0}
.related a{display:block;border:1px solid var(--line);border-radius:10px;background:rgba(15,23,36,.6);padding:16px 18px;text-decoration:none}
.related a:hover{border-color:rgba(248,176,36,.45)}
.related span{display:block;color:var(--text);font-weight:700;font-size:.98rem}
.related small{color:var(--muted)}

/* ---------- blog index ---------- */
.blog-hero{margin:0 0 8px}
.post-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;margin:24px 0 0}
.post-card{display:flex;flex-direction:column;gap:10px;border:1px solid var(--line);border-radius:14px;background:rgba(15,23,36,.7);padding:22px;text-decoration:none;transition:border-color .2s,transform .2s}
.post-card:hover{border-color:rgba(248,176,36,.5);transform:translateY(-2px)}
.post-card .tag{align-self:flex-start;font-size:.7rem;letter-spacing:.12em;text-transform:uppercase;color:var(--accent);border:1px solid rgba(248,176,36,.35);border-radius:999px;padding:4px 10px;font-weight:700}
.post-card h2{font-size:1.18rem;margin:4px 0 0;color:var(--text);line-height:1.3}
.post-card p{font-size:.93rem;margin:0;flex:1}
.post-card .rd{color:var(--link);font-weight:700;font-size:.9rem}
.post-card .pm{color:var(--muted);font-size:.8rem}

@media(max-width:760px){
  .post-grid,.related{grid-template-columns:1fr}
  .blog-shell{padding:26px 0 40px}
}