:root { --blog-blue:#1b75bc; --blog-orange:#f37023; --blog-teal:#0d9488; --blog-ink:#111827; --blog-bg:#f9f9ff; }
* { box-sizing: border-box; }
body { margin:0; background:var(--blog-bg); color:var(--blog-ink); font-family:'Hanken Grotesk',Arial,sans-serif; }
a { color:inherit; text-decoration:none; }
.blog-shell { max-width:1180px; margin:0 auto; padding:28px 24px 80px; }
.blog-nav { display:flex; align-items:center; justify-content:space-between; gap:20px; padding:10px 0 34px; }
.blog-nav img { width:190px; max-height:42px; object-fit:contain; object-position:left center; }
.blog-nav-links { display:flex; gap:22px; align-items:center; color:#526071; font-size:14px; font-weight:600; }
.blog-nav-links a:hover { color:var(--blog-blue); }
.blog-hero { display:grid; grid-template-columns:1.05fr .95fr; gap:36px; align-items:center; padding:34px 0 54px; }
.eyebrow { color:var(--blog-blue); letter-spacing:.12em; text-transform:uppercase; font-size:11px; font-weight:800; }
h1 { font-size:clamp(38px,6vw,68px); line-height:1.02; letter-spacing:-.045em; margin:14px 0 20px; }
h2 { font-size:28px; line-height:1.12; letter-spacing:-.025em; margin:8px 0 12px; }
.lead { color:#596576; font-size:18px; line-height:1.6; max-width:640px; }
.hero-image { position:relative; min-height:360px; border-radius:28px; overflow:hidden; box-shadow:0 24px 60px rgba(17,24,39,.18); }
.hero-image img { width:100%; height:100%; min-height:360px; object-fit:cover; }
.hero-image::after { content:''; position:absolute; inset:0; background:linear-gradient(135deg,rgba(27,117,188,.05),transparent 50%,rgba(243,112,35,.22)); }
.article-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
.article-card { background:#fff; border:1px solid #e2e7f1; border-radius:20px; overflow:hidden; box-shadow:0 10px 30px rgba(17,24,39,.06); transition:transform .25s ease,box-shadow .25s ease; }
.article-card:hover { transform:translateY(-6px); box-shadow:0 18px 42px rgba(17,24,39,.12); }
.article-card img { width:100%; height:190px; object-fit:cover; }
.article-card-content { padding:20px; }
.article-card h2 { font-size:22px; }
.article-card p { color:#647083; line-height:1.55; }
.article-meta { color:#8290a2; font-size:12px; font-weight:700; }
.read-more { display:inline-flex; margin-top:8px; color:var(--blog-blue); font-weight:800; font-size:14px; }
.blog-cta { margin-top:54px; background:var(--blog-blue); color:#fff; border-radius:24px; padding:34px; display:flex; justify-content:space-between; gap:24px; align-items:center; }
.blog-cta h2 { margin:0; }
.button { display:inline-flex; align-items:center; justify-content:center; padding:13px 18px; border-radius:12px; background:var(--blog-orange); color:#fff; font-weight:800; white-space:nowrap; }
.article-page { max-width:820px; margin:0 auto; }
.article-page .cover { width:100%; height:380px; object-fit:cover; border-radius:24px; margin:18px 0 34px; box-shadow:0 20px 50px rgba(17,24,39,.16); }
.article-page p,.article-page li { color:#4f5d70; font-size:18px; line-height:1.75; }
.article-page li { margin:10px 0; }
.article-page blockquote { margin:28px 0; padding:18px 22px; border-left:4px solid var(--blog-orange); background:#fff; border-radius:0 14px 14px 0; color:#263348; font-size:20px; line-height:1.55; }
.back-link { display:inline-flex; color:var(--blog-blue); font-weight:800; margin:10px 0 22px; }
@media (max-width:760px) { .blog-shell{padding:18px 16px 56px}.blog-nav{align-items:flex-start}.blog-nav-links{display:none}.blog-hero{grid-template-columns:1fr;padding-top:20px}.hero-image{min-height:260px}.hero-image img{min-height:260px}.article-grid{grid-template-columns:1fr}.blog-cta{display:block}.blog-cta .button{margin-top:18px}.article-page .cover{height:250px}.article-page p,.article-page li{font-size:16px} }