/* ABCDEF Studio's public blog */
body.blog-site{background:#F8F7FC;color:#1e1b3a;margin:0} /* just off white, so the logo's white parts stand out */
.blog-top{display:flex;align-items:center;justify-content:space-between;gap:16px;max-width:1080px;margin:0 auto;padding:18px 20px;border-bottom:1px solid #e3e1ee}
.blog-logo img{display:block;height:44px;width:auto}
.blog-top nav{display:flex;gap:16px;align-items:center}
.blog-top nav a:not(.btn){color:#1e1b3a;text-decoration:none;font-weight:600}
.blog-main{max-width:760px;margin:0 auto;padding:36px 20px 56px}
.blog-intro h1{font-size:40px;margin:0 0 8px}.blog-intro p{color:#5b5878;font-size:18px;margin:0 0 32px}
.blog-card{padding:0 0 28px;margin:0 0 28px;border-bottom:1px solid #e3e1ee}
.blog-card a{color:inherit;text-decoration:none}.blog-card a:hover h2{text-decoration:underline}
.blog-card img{display:block;width:100%;height:auto;border-radius:14px;margin:0 0 14px}
.blog-card h2{font-size:26px;line-height:1.25;margin:0 0 6px}
.blog-meta{color:#6d6a85;font-size:14.5px;margin:0 0 10px}
.blog-pages{display:flex;justify-content:space-between;margin-top:8px}
.blog-back{margin:0 0 18px}.blog-back a{color:#2F3BF0;text-decoration:none}
.blog-post h1{font-size:40px;line-height:1.15;margin:0 0 10px}
.blog-hero{display:block;width:100%;height:auto;border-radius:16px;margin:18px 0 28px}
.blog-body{font-size:18.5px;line-height:1.7}
.blog-body h2{font-size:28px;line-height:1.25;margin:36px 0 12px}.blog-body h3{font-size:22px;margin:28px 0 10px}
.blog-body img{max-width:100%;height:auto;border-radius:10px}
.blog-body a{color:#2F3BF0}
.blog-body blockquote{margin:24px 0;padding:4px 20px;border-left:4px solid #C9C2F5;color:#3d3a5c}
.blog-body table{width:100%;border-collapse:collapse;display:block;overflow-x:auto}.blog-body th,.blog-body td{border:1px solid #e3e1ee;padding:8px 10px;text-align:left}
.blog-body pre{overflow-x:auto;background:#EDEBF5;padding:14px;border-radius:8px}
.blog-cta{margin:44px 0 0;padding:26px 28px;border:1px solid #1e1b3a;border-radius:14px;box-shadow:6px 6px 0 #C9C2F5}
.blog-cta h2{margin:0 0 8px;font-size:24px}.blog-cta p{margin:0 0 16px;color:#3d3a5c}
.blog-foot{text-align:center;color:#6d6a85;font-size:14px;padding:28px 20px 40px;border-top:1px solid #e3e1ee}
.blog-foot a{color:inherit}
@media (max-width:640px){.blog-intro h1,.blog-post h1{font-size:30px}.blog-top nav a:not(.btn){display:none}.blog-body{font-size:17.5px}}