/* Charterfile resources — shares the landing-page design system (Instrument Sans,
   warm white, blue accent). Linked by /blog pages. */
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:#fbfaf8;color:#191a1c;font-family:'Instrument Sans',system-ui,-apple-system,sans-serif;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;line-height:1.5}
a{color:#2a6fd6;text-decoration:none}
a:hover{color:#1d54a8}
:focus-visible{outline:2px solid #2a6fd6;outline-offset:2px}
.wrap{max-width:1120px;margin:0 auto;padding:0 32px}

/* nav */
.nav{position:sticky;top:0;z-index:50;background:rgba(251,250,248,.92);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border-bottom:1px solid #e8e5df}
.nav-inner{display:flex;align-items:center;justify-content:space-between;padding:14px 32px;max-width:1120px;margin:0 auto}
.wordmark{font-size:19px;font-weight:700;letter-spacing:-.02em;color:#191a1c}
.wordmark span{color:#2a6fd6}
.nav-cta{background:#191a1c;color:#fff;font-size:14px;font-weight:600;padding:8px 18px;border-radius:7px;transition:background .12s}
.nav-cta:hover{background:#33353a;color:#fff}

/* breadcrumb */
.crumb{font-size:13px;color:#6d7076;padding:22px 0 0}
.crumb a{color:#6d7076}
.crumb a:hover{color:#45484f}

/* index hero */
.hub-head{padding:40px 0 8px}
.hub-head .eyebrow{font-size:12px;font-weight:600;letter-spacing:.13em;text-transform:uppercase;color:#2a6fd6;margin-bottom:14px}
.hub-head h1{margin:0;font-size:44px;font-weight:700;letter-spacing:-.03em}
.hub-head p{margin:14px 0 0;font-size:18px;color:#5c5f66;max-width:640px;line-height:1.55}

/* article card grid */
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:20px;padding:36px 0 80px}
.card{display:block;background:#fff;border:1px solid #e6e3dd;border-radius:14px;padding:26px;box-shadow:0 1px 2px rgba(25,26,28,.04);transition:border-color .12s,transform .12s}
.card:hover{border-color:#c9d7ef;transform:translateY(-2px)}
.card .tag{font-size:11.5px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:#2a6fd6}
.card h2{margin:10px 0 8px;font-size:20px;font-weight:700;letter-spacing:-.02em;color:#191a1c;line-height:1.25}
.card p{margin:0;font-size:14.5px;color:#5c5f66;line-height:1.5}
.card .more{display:inline-block;margin-top:14px;font-size:14px;font-weight:600;color:#2a6fd6}

/* article prose */
.article{max-width:720px;margin:0 auto;padding:8px 0 72px}
.article .eyebrow{font-size:12px;font-weight:700;letter-spacing:.13em;text-transform:uppercase;color:#2a6fd6}
.article h1{margin:14px 0 10px;font-size:42px;font-weight:700;letter-spacing:-.03em;line-height:1.08}
.article .meta{font-size:13.5px;color:#6d7076;margin-bottom:28px}
.article h2{margin:38px 0 12px;font-size:26px;font-weight:700;letter-spacing:-.02em}
.article h3{margin:28px 0 8px;font-size:19px;font-weight:600}
.article p{margin:0 0 16px;font-size:17px;line-height:1.65;color:#33353a}
.article ul,.article ol{margin:0 0 16px;padding-left:22px}
.article li{font-size:17px;line-height:1.6;color:#33353a;margin-bottom:7px}
.article strong{color:#191a1c}
.article blockquote{margin:20px 0;padding:4px 0 4px 20px;border-left:3px solid #dbe3ef;color:#45484f;font-size:17px}
.article .lead{font-size:20px;line-height:1.55;color:#45484f;margin-bottom:24px}

/* inline CTA */
.cta-box{background:#eef2f8;border:1px solid #dbe3ef;border-radius:14px;padding:26px;margin:36px 0;text-align:center}
.cta-box h3{margin:0 0 6px;font-size:20px;font-weight:700;letter-spacing:-.02em}
.cta-box p{margin:0 0 16px;font-size:15px;color:#5c5f66}
.cta-btn{display:inline-block;background:#2a6fd6;color:#fff;font-size:15px;font-weight:600;padding:11px 24px;border-radius:8px;transition:background .12s}
.cta-btn:hover{background:#1d54a8;color:#fff}

/* related */
.related{border-top:1px solid #e8e5df;padding-top:28px;margin-top:8px}
.related h2{font-size:16px;font-weight:700;margin:0 0 14px;letter-spacing:-.01em}
.related a{display:block;font-size:16px;font-weight:600;color:#191a1c;padding:8px 0}
.related a:hover{color:#2a6fd6}

/* footer */
.foot{background:#191a1c;color:#fff}
.foot-inner{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px;padding:22px 32px;max-width:1120px;margin:0 auto}
.foot-inner .c{font-size:13px;color:#8a8d94}
.foot-links{display:flex;gap:20px;font-size:13px;flex-wrap:wrap}
.foot-links a{color:#8a8d94}
.foot-links a:hover{color:#fff}

@media (max-width:720px){
  .wrap,.nav-inner,.foot-inner{padding-left:20px;padding-right:20px}
  .hub-head h1{font-size:34px}
  .article h1{font-size:32px}
  .article p,.article li{font-size:16px}
}