:root { color-scheme: light; --paper:#f7f5ef; --ink:#172033; --muted:#667085; --line:#ddd9cf; --blue:#0065DE; }
* { box-sizing:border-box; }
html,body { margin:0; min-width:320px; min-height:100%; background:var(--paper); color:var(--ink); }
body { font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif; }
a { color:inherit; }
.blog-nav,.blog-footer { width:min(1180px,calc(100% - 40px)); margin:auto; display:flex; align-items:center; justify-content:space-between; gap:24px; }
.blog-nav { min-height:84px; border-bottom:1px solid var(--line); }
.blog-brand img { display:block; width:150px; }
.blog-nav nav,.blog-footer nav { display:flex; align-items:center; gap:24px; }
.blog-nav a,.blog-footer a { text-decoration:none; font-weight:700; }
.blog-nav-cta { padding:11px 16px; border-radius:10px; background:#0065DE; color:#fff; }
.blog-nav-cta:hover { background:#045FB3; }
.blog-hero { width:min(900px,calc(100% - 40px)); margin:0 auto; padding:100px 0 74px; }
.blog-eyebrow,.blog-meta { color:#176af5; font-size:13px; font-weight:800; letter-spacing:.06em; text-transform:uppercase; }
.blog-hero h1 { max-width:820px; margin:14px 0 22px; font-family:Georgia,serif; font-size:clamp(44px,7vw,78px); line-height:1.02; letter-spacing:-.04em; }
.blog-hero>p:last-child { max-width:700px; color:var(--muted); font-size:20px; line-height:1.7; }
.blog-index { width:min(1180px,calc(100% - 40px)); margin:0 auto 100px; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:28px; }
.blog-card { overflow:hidden; border:1px solid var(--line); border-radius:18px; background:#fffdfa; }
.blog-card-image { display:flex; height:210px; align-items:center; justify-content:center; overflow:hidden; background:#e9eef7; color:#65758b; text-decoration:none; font-weight:800; }
.blog-card-image img { width:100%; height:100%; object-fit:cover; }
.blog-card-copy { padding:24px; }
.blog-meta { display:flex; justify-content:space-between; gap:16px; color:#667085; letter-spacing:.03em; }
.blog-meta span { color:var(--blue); }
.blog-card h2 { margin:14px 0 10px; font-family:Georgia,serif; font-size:25px; line-height:1.2; }
.blog-card h2 a,.blog-read { text-decoration:none; }
.blog-card p { min-height:72px; margin:0 0 18px; color:var(--muted); line-height:1.6; }
.blog-read { color:var(--blue); font-weight:800; }
.blog-empty { grid-column:1/-1; padding:60px; border:1px solid var(--line); border-radius:18px; text-align:center; background:#fffdfa; }
.article-main { width:min(1000px,calc(100% - 40px)); margin:auto; }
.blog-article { padding:84px 0 110px; }
.article-header { max-width:820px; margin:auto; text-align:center; }
.article-back { display:inline-block; margin-bottom:40px; color:var(--blue); font-weight:800; text-decoration:none; }
.article-header .blog-meta { justify-content:center; }
.article-header h1 { margin:22px 0; font-family:Georgia,serif; font-size:clamp(42px,7vw,72px); line-height:1.05; letter-spacing:-.035em; }
.article-deck { margin:0 auto; max-width:720px; color:var(--muted); font-size:20px; line-height:1.65; }
.article-author { margin:20px 0 0; color:#667085; font-size:14px; font-weight:600; }
.article-hero-image { margin:58px 0 64px; }
.article-hero-image img { display:block; width:100%; max-height:560px; object-fit:cover; border-radius:20px; }
.article-content { max-width:740px; margin:64px auto 0; font-family:Georgia,serif; font-size:19px; line-height:1.82; }
.article-content h2,.article-content h3 { margin:2em 0 .65em; line-height:1.2; }
.article-content h2 { font-size:34px; }.article-content h3 { font-size:27px; }
.article-content p,.article-content ul,.article-content ol,.article-content blockquote { margin:0 0 1.35em; }
.article-content a { color:#0b5bd3; }.article-content img { max-width:100%; height:auto; border-radius:14px; }
.article-content blockquote { margin-left:0; padding:8px 0 8px 24px; border-left:4px solid var(--blue); color:#475467; }
.article-tags { max-width:740px; margin:60px auto 0; padding-top:24px; border-top:1px solid var(--line); display:flex; flex-wrap:wrap; gap:8px; }
.article-tags span { padding:7px 11px; border-radius:999px; background:#e8edf5; color:#475467; font-size:13px; font-weight:700; }
.blog-footer { padding:36px 0; border-top:1px solid var(--line); color:var(--muted); }
@media(max-width:850px){.blog-index{grid-template-columns:repeat(2,minmax(0,1fr));}}
@media(max-width:620px){.blog-nav nav a:not(.blog-nav-cta){display:none}.blog-index{grid-template-columns:1fr}.blog-hero{padding:70px 0 48px}.blog-footer{align-items:flex-start;flex-direction:column}.article-content{font-size:18px}}