.blog-site{background:#f5fbff;color:#031b2e}
.blog-site main{padding-top:110px}
.blog-site .blog-wrap{width:90%;max-width:1280px;margin:auto}
.blog-site h1{font-size:var(--ds-compact);line-height:1.1;max-width:1000px;margin:12px 0 20px;}
.blog-intro h1 span{display:block;color:#0062ff}
.blog-intro{padding:30px 0;background:linear-gradient(125deg,#e6f5ff,#fff)}
.blog-site h2{font-size:var(--ds-title);line-height:1.1;margin:0 0 16px;}
.blog-site h3{font-size:var(--ds-card);}
.blog-topics{display:flex;flex-wrap:wrap;gap:10px;margin:20px 0}
.blog-topics a{padding:8px 14px;border:1px solid #abcde8;border-radius:24px;color:#004ebd;background:white}
.blog-search{display:block;max-width:520px;font-weight:600}
.blog-search input{display:block;width:100%;font:inherit;padding:12px 16px;border:1px solid #abcde8;border-radius:9px;margin-top:6px;background:#fff;color:#031b2e}
.blog-topic-section{padding:28px 0;border-bottom:1px solid #cfe1ef;scroll-margin-top:110px}
.blog-feature{display:grid;grid-template-columns:38% 58%;gap:4%;align-items:center}
.blog-feature>img{width:100%;height:230px;object-fit:cover;border-radius:16px;background:#e4f1fb}
.blog-feature h2 a{color:inherit;text-decoration:none}
.blog-feature h2 a:hover{color:#0062ff}
.blog-meta{font-size:14px;color:#46617a}
.blog-feature .button{margin-top:6px}
.blog-site [hidden]{display:none!important}
.blog-article-header{padding:26px 0}
.blog-article-header nav:first-child{margin-bottom:22px}
.blog-contents{display:flex;flex-wrap:wrap;gap:10px 24px;margin-top:20px;padding-top:16px;border-top:1px solid #cfe1ef}
.blog-reading{max-width:800px;width:90%;margin:auto}
.blog-chapter{padding:30px 0;scroll-margin-top:110px;border-top:1px solid #cfe1ef}
.blog-chapter p{line-height:1.55;margin:0;}
.blog-next{padding:30px 0;background:#e7f3fd}
.blog-next li{margin-bottom:10px}
@media(max-width:700px){.blog-site main{padding-top:90px}.blog-intro{padding:20px 0}.blog-topics{gap:8px}.blog-topics a{padding:6px 10px}.blog-feature{display:flex;flex-direction:column;align-items:stretch;gap:18px}.blog-feature>img{height:150px}.blog-topic-section{padding:22px 0}.blog-site h1{font-size:var(--ds-compact);}.blog-article-header{padding:20px 0}.blog-chapter{padding:24px 0}.blog-contents{display:grid;gap:8px}}
.blog-site .header{padding-block:11px}
.blog-site .header::before{opacity:1;transform:none;border-color:#3596c6;background:var(--nav-surface-solid);box-shadow:0 0 9px #00caff70,0 8px 24px #001b3240}
.blog-feature h2 a{font-family:inherit;font-size:inherit;font-weight:inherit;line-height:inherit}
