:root{
  --navy:#105CAF; --navy-2:#0B4486; --deep:#0B3566; --ink:#111827; --paper:#FFFDF7; --mist:#F6F2E7;
  --line:#E4DFD2; --muted:#5A6272; --steel:#9DBBE0; --wa:#25D366; --wa-2:#1DA851;
  --serif:"Montserrat",system-ui,sans-serif; --sans:"Inter",system-ui,sans-serif;
}
*{box-sizing:border-box;margin:0;padding:0}
body{font-family:var(--sans);color:var(--ink);background:var(--paper);font-size:17px;line-height:1.65;-webkit-font-smoothing:antialiased}
a{color:inherit}
img{max-width:100%;display:block}
.wrap{width:min(1200px,100% - 40px);margin-inline:auto}
.narrow{width:min(760px,100% - 40px);margin-inline:auto}
.btn{display:inline-flex;align-items:center;gap:10px;padding:13px 22px;border-radius:2px;font-weight:600;font-size:15px;text-decoration:none;transition:background .2s;border:1px solid transparent}
.btn svg{width:18px;height:18px;flex:none}
.btn-wa{background:var(--wa);color:#fff}
.btn-wa:hover{background:var(--wa-2)}

header{position:sticky;top:0;z-index:50;background:var(--deep);border-bottom:1px solid rgba(255,255,255,.08)}
.nav{display:flex;align-items:center;justify-content:space-between;height:76px;gap:20px}
.brand img{height:34px;width:auto}
.nav-links{display:flex;gap:26px;list-style:none}
.nav-links a{text-decoration:none;font-size:16px;font-weight:500;color:rgba(255,255,255,.82)}
.nav-links a:hover,.nav-links a[aria-current]{color:#fff}
@media(max-width:900px){.nav-links{display:none}.nav .btn span{display:none}.nav .btn{padding:11px}}
@media(max-width:520px){.brand img{height:26px}}

.blog-head{padding:88px 0 48px;border-bottom:1px solid var(--line)}
.kicker{font-size:12px;letter-spacing:.22em;text-transform:uppercase;font-weight:600;color:var(--navy)}
.blog-head h1{font-family:var(--serif);font-weight:700;font-size:clamp(32px,4vw,52px);letter-spacing:-.03em;line-height:1.1;margin-top:14px}
.blog-head p{color:var(--muted);max-width:56ch;margin-top:16px}

.posts{list-style:none;display:grid;grid-template-columns:repeat(3,1fr);gap:28px;padding:56px 0 110px}
.post-card a{display:flex;flex-direction:column;height:100%;text-decoration:none;background:#fff;border:1px solid var(--line);transition:border-color .2s,transform .2s}
.post-card a:hover{border-color:var(--navy);transform:translateY(-2px)}
.post-card .cover{aspect-ratio:16/9;background:linear-gradient(135deg,var(--navy),var(--deep));object-fit:cover;width:100%}
.post-card .body{padding:22px 22px 26px;display:flex;flex-direction:column;gap:10px;flex:1}
.post-card .meta{font-size:12.5px;color:var(--muted)}
.post-card h2{font-family:var(--serif);font-weight:700;font-size:20px;line-height:1.3;letter-spacing:-.01em}
.post-card p{font-size:15px;color:var(--muted)}
.post-card .more{margin-top:auto;font-size:14px;font-weight:600;color:var(--navy)}
@media(max-width:900px){.posts{grid-template-columns:1fr}}

article{padding:72px 0 40px}
.back{font-size:14px;font-weight:600;color:var(--navy);text-decoration:none}
article h1{font-family:var(--serif);font-weight:700;font-size:clamp(30px,3.6vw,46px);letter-spacing:-.03em;line-height:1.15;margin:18px 0 14px}
article .meta{font-size:14px;color:var(--muted);padding-bottom:28px;border-bottom:1px solid var(--line);margin-bottom:32px}
article .content h2{font-family:var(--serif);font-weight:700;font-size:24px;letter-spacing:-.02em;line-height:1.25;margin:40px 0 12px}
article .content h3{font-family:var(--serif);font-weight:600;font-size:19px;margin:28px 0 8px}
article .content p,article .content ul,article .content ol{margin-bottom:18px}
article .content ul,article .content ol{padding-left:22px}
article .content li{margin-bottom:6px}
article .content blockquote{border-left:3px solid var(--navy);padding-left:20px;color:var(--muted);margin:24px 0}
article .content img{margin:28px 0}
.cta-box{margin:48px 0 0;padding:28px;background:var(--mist);border:1px solid var(--line)}
.cta-box b{font-family:var(--serif);font-size:20px;display:block;letter-spacing:-.01em}
.cta-box p{color:var(--muted);font-size:15px;margin:6px 0 18px}

footer{background:var(--deep);color:rgba(255,255,255,.6);font-size:13px;padding:36px 0;margin-top:60px}
footer .foot{display:flex;justify-content:space-between;gap:24px;flex-wrap:wrap}
footer img{height:26px;width:auto;margin-bottom:14px;opacity:.9}