/* ============================================================
   JellyBlue — blog section stylesheet (separate from style.css)
   jjellyblue.com · prefix: jb-
   Loaded only on /blog/ pages.
   ============================================================ */

.jb-bloghead{
  background:var(--jb-navy-dd);
  border-bottom:1px solid var(--jb-line-soft);
  padding:2.6rem 0 2.2rem;position:relative;overflow:hidden;
}
.jb-bloghead::before{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(60% 70% at 82% 20%,rgba(46,125,215,.22),transparent 68%);
}
.jb-bloghead > .container{position:relative;z-index:2}

/* ── Category chips ───────────────────────────────────────── */
.jb-cats{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:1.5rem}
.jb-cats a{
  font-family:var(--jb-mono);font-size:.65rem;letter-spacing:.1em;text-transform:uppercase;
  padding:.5rem 1rem;border-radius:999px;border:1px solid var(--jb-line);
  background:var(--jb-navy-card);color:var(--jb-body);text-decoration:none;
  transition:border-color .16s,color .16s,background .16s;
}
.jb-cats a:hover,.jb-cats a[aria-current="page"]{
  border-color:var(--jb-gold);color:var(--jb-gold-l);background:rgba(200,160,48,.1);
  text-decoration:none;
}

/* ── Post cards ───────────────────────────────────────────── */
.jb-postcard{
  background:var(--jb-navy-card);border:1px solid var(--jb-line);
  border-radius:var(--jb-r);padding:1.5rem 1.4rem;height:100%;
  display:flex;flex-direction:column;
  transition:transform .2s,border-color .2s,box-shadow .2s;
}
.jb-postcard:hover{transform:translateY(-4px);border-color:var(--jb-blue);box-shadow:var(--jb-sh)}
.jb-postcard__cat{
  font-family:var(--jb-mono);font-size:.58rem;letter-spacing:.13em;text-transform:uppercase;
  padding:.3rem .65rem;border-radius:999px;align-self:flex-start;margin-bottom:.9rem;
  background:rgba(46,125,215,.14);color:var(--jb-blue-l);border:1px solid rgba(46,125,215,.32);
}
.jb-postcard__cat--rev{background:rgba(200,160,48,.14);color:var(--jb-gold-l);border-color:rgba(200,160,48,.35)}
.jb-postcard h3{font-size:1.06rem;line-height:1.32;margin-bottom:.6rem}
.jb-postcard h3 a{color:#fff;text-decoration:none}
.jb-postcard h3 a:hover{color:var(--jb-gold-l);text-decoration:none}
.jb-postcard p{font-size:.9rem;margin:0 0 1rem;color:var(--jb-body)}
.jb-postcard__meta{
  margin-top:auto;padding-top:.9rem;border-top:1px solid var(--jb-line-soft);
  font-family:var(--jb-mono);font-size:.6rem;letter-spacing:.09em;text-transform:uppercase;
  color:var(--jb-muted);display:flex;justify-content:space-between;gap:.7rem;flex-wrap:wrap;
}

/* ── Pagination ───────────────────────────────────────────── */
.jb-pager{display:flex;flex-wrap:wrap;justify-content:center;gap:.4rem;margin-top:2.8rem}
.jb-pager a,.jb-pager span{
  min-width:42px;height:42px;display:inline-flex;align-items:center;justify-content:center;
  padding:0 .8rem;border-radius:10px;border:1px solid var(--jb-line);
  background:var(--jb-navy-card);color:var(--jb-body);text-decoration:none;
  font-family:var(--jb-mono);font-size:.82rem;
}
.jb-pager a:hover{border-color:var(--jb-gold);color:var(--jb-gold-l);text-decoration:none}
.jb-pager .is-current{background:var(--jb-gold);color:#1B1305;border-color:var(--jb-gold);font-weight:700}
.jb-pager .is-gap{border:none;background:transparent;color:var(--jb-muted);min-width:22px;padding:0}

/* ── Post layout ──────────────────────────────────────────── */
.jb-post{padding:2.6rem 0 3.4rem}
.jb-post__head{margin-bottom:2rem}
.jb-post__head h1{font-size:clamp(1.7rem,4.2vw,2.7rem);line-height:1.14}
.jb-post__byline{
  display:flex;flex-wrap:wrap;align-items:center;gap:.8rem 1.4rem;
  margin-top:1.4rem;padding:1rem 0;
  border-block:1px solid var(--jb-line-soft);
  font-family:var(--jb-mono);font-size:.64rem;letter-spacing:.09em;
  text-transform:uppercase;color:var(--jb-muted);
}
.jb-post__byline b{color:var(--jb-body);font-weight:500}
.jb-avatar{
  width:36px;height:36px;border-radius:50%;flex:none;
  background:linear-gradient(135deg,var(--jb-blue),var(--jb-navy-l));
  color:#fff;display:inline-flex;align-items:center;justify-content:center;
  font-family:var(--jb-display);font-size:.76rem;font-weight:800;letter-spacing:0;
}

.jb-post__body{font-size:1.04rem;line-height:1.82}
.jb-post__body h2{font-size:clamp(1.32rem,3vw,1.75rem);margin-top:2.2em;margin-bottom:.7em}
.jb-post__body h3{font-size:1.16rem;margin-top:1.8em;margin-bottom:.6em}
.jb-post__body ul,.jb-post__body ol{padding-left:1.35rem;margin:0 0 1.3em}
.jb-post__body li{margin-bottom:.55em}
.jb-post__body li::marker{color:var(--jb-gold)}
.jb-post__body a{color:var(--jb-blue-l)}
.jb-post__body a:hover{color:var(--jb-gold-l)}

/* Key-takeaway block inside posts */
.jb-key{
  background:linear-gradient(135deg,rgba(46,125,215,.13),rgba(46,125,215,.03));
  border:1px solid rgba(46,125,215,.35);border-left:4px solid var(--jb-blue);
  border-radius:var(--jb-r);padding:1.3rem 1.5rem;margin:0 0 2rem;
}
.jb-key p{margin:0;font-size:1.02rem;color:var(--jb-ink)}
.jb-key p+p{margin-top:.7rem}
.jb-key__label{
  font-family:var(--jb-mono);font-size:.62rem;letter-spacing:.15em;text-transform:uppercase;
  color:var(--jb-blue-l);display:block;margin-bottom:.6rem;
}

/* In-post CTA */
.jb-cta{
  background:linear-gradient(135deg,rgba(200,160,48,.14),rgba(200,160,48,.03));
  border:1px solid rgba(200,160,48,.4);border-radius:var(--jb-r);
  padding:1.7rem 1.6rem;margin:2.4rem 0;text-align:center;
}
.jb-cta h3{font-size:1.2rem;margin-bottom:.6rem}
.jb-cta p{font-size:.95rem;margin-bottom:1.2rem;color:var(--jb-body)}
.jb-cta .jb-small{margin-top:1rem}

/* TOC */
.jb-toc{
  background:var(--jb-navy-card);border:1px solid var(--jb-line);
  border-radius:var(--jb-r);padding:1.3rem 1.45rem;margin:0 0 2.2rem;
}
.jb-toc h2{
  font-family:var(--jb-mono);font-size:.64rem;letter-spacing:.15em;text-transform:uppercase;
  color:var(--jb-gold);margin:0 0 .9rem;font-weight:500;
}
.jb-toc ol{margin:0;padding-left:1.2rem;font-size:.94rem}
.jb-toc li{margin-bottom:.45rem}
.jb-toc a{color:var(--jb-body)}
.jb-toc a:hover{color:var(--jb-gold-l)}

/* Related posts */
.jb-related{border-top:1px solid var(--jb-line-soft);margin-top:3rem;padding-top:2.2rem}
.jb-related h2{font-size:1.3rem;margin-bottom:1.3rem}
.jb-related ul{list-style:none;margin:0;padding:0;display:grid;gap:.7rem}
.jb-related li{
  border:1px solid var(--jb-line-soft);border-radius:var(--jb-r-sm);
  padding:.9rem 1.1rem;background:var(--jb-navy-card);
  transition:border-color .16s,transform .16s;
}
.jb-related li:hover{border-color:var(--jb-gold);transform:translateX(3px)}
.jb-related a{color:var(--jb-ink);text-decoration:none;font-weight:600;font-size:.96rem}
.jb-related a:hover{color:var(--jb-gold-l);text-decoration:none}

/* Post-level FAQ reuses .jb-acc from style.css */
.jb-postfaq{margin-top:2.6rem}
.jb-postfaq > h2{font-size:1.35rem;margin-bottom:1.2rem}

/* Author box */
.jb-authorbox{
  background:var(--jb-navy-card);border:1px solid var(--jb-line);
  border-radius:var(--jb-r);padding:1.5rem;margin-top:2.6rem;
}
.jb-authorbox h3{font-size:1.05rem;margin-bottom:.5rem}
.jb-authorbox p{font-size:.92rem;margin:0}
.jb-authorbox p+p{margin-top:.7rem}

/* Blog-side disclaimer */
.jb-postnote{
  border:1px solid var(--jb-line);border-radius:var(--jb-r);
  padding:1.2rem 1.35rem;margin-top:2.4rem;background:rgba(255,255,255,.02);
  font-size:.83rem;line-height:1.7;color:var(--jb-muted);
}
.jb-postnote strong{color:var(--jb-body)}
.jb-postnote p:last-child{margin-bottom:0}