@keyframes blogCurtainDown{0%{clip-path:inset(0 0 100% round 24px)}to{clip-path:inset(0 0 0% round 24px)}}@keyframes blogCurtainUp{0%{clip-path:inset(0 0 0% round 24px)}to{clip-path:inset(0 0 100% round 24px)}}@keyframes blogContentUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}@keyframes blogContentDown{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(20px)}}.blog-nav-backdrop{z-index:70;-webkit-backdrop-filter:none;backdrop-filter:none;pointer-events:auto;background:0 0;position:fixed;inset:0}.blog-nav-panel{z-index:100;will-change:clip-path;background:#fff;border-radius:24px;flex-direction:column;width:470px;max-width:calc(100vw - 32px);max-height:min(855px,100dvh - 110px);display:flex;position:absolute;top:calc(100% + 10px);left:50%;overflow:hidden;transform:translate(-50%);box-shadow:0 14px 40px -10px #16336f26,2px 4px 20px #c4cfd733;pointer-events:auto!important}.blog-nav-panel--open{animation:.38s cubic-bezier(.22,1,.36,1) forwards blogCurtainDown}.blog-nav-panel--closing{animation:.25s cubic-bezier(.22,1,.36,1) .12s forwards blogCurtainUp}.blog-nav-content{will-change:transform, opacity;flex-direction:column;flex:1;width:100%;height:100%;min-height:0;display:flex;overflow:hidden}.blog-nav-panel--open .blog-nav-content{animation:.3s cubic-bezier(.22,1,.36,1) .11s both blogContentUp}.blog-nav-panel--closing .blog-nav-content{animation:.18s cubic-bezier(.4,0,.2,1) forwards blogContentDown}.blog-nav-head{border-bottom:1px solid #0000001a;flex-shrink:0;justify-content:space-between;align-items:center;margin:0 25px;padding:25px 0 16px;display:flex}.blog-nav-kicker{color:#adb6be;margin:0;font-size:16px;font-weight:400;line-height:1.2}.blog-nav-all{color:#5b6c7d;align-items:center;gap:10px;font-size:16px;font-weight:400;line-height:1.2;text-decoration:none;transition:color .18s;display:inline-flex}.blog-nav-all:hover,.blog-nav-all:focus-visible{color:#ff2c4e}.blog-nav-all svg{display:block}.blog-nav-scroll{overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#5b6c7d59 transparent;flex:1;min-height:0;padding:0 25px 25px;overflow:hidden auto}.blog-nav-scroll::-webkit-scrollbar{width:6px}.blog-nav-scroll::-webkit-scrollbar-thumb{background:#5b6c7d59;border-radius:6px}.blog-nav-card{color:inherit;flex-direction:column;gap:10px;padding-top:20px;text-decoration:none;display:flex}.blog-nav-card+.blog-nav-card{border-top:1px solid #0000001a;margin-top:20px}.blog-nav-cover{background:#d2dee9;border-radius:10px;width:420px;height:250px;position:relative;overflow:hidden}.blog-nav-cover--red{background:#ef0840}.blog-nav-cover--orange{background:#f4a574}.blog-nav-cover--blue{background:#cde9ff}.blog-nav-cover img{object-fit:cover;transition:transform .4s}.blog-nav-card:hover .blog-nav-cover img,.blog-nav-card:focus-visible .blog-nav-cover img{transform:scale(1.06)}.blog-nav-body{flex-direction:column;gap:20px;display:flex}.blog-nav-meta{justify-content:space-between;align-items:center;gap:10px;display:flex}.blog-nav-author{align-items:center;gap:10px;min-width:0;display:inline-flex}.blog-nav-avatar{background:#ebf4fb;border-radius:40px;flex-shrink:0;width:30px;height:30px;position:relative;overflow:hidden}.blog-nav-avatar img{object-fit:cover;width:100%;height:100%}.blog-nav-avatar-icon{object-fit:contain;padding:6px}.blog-nav-author-name{color:#5b6c7d;white-space:nowrap;font-size:14px;line-height:1.2}.blog-nav-tags{flex-wrap:wrap;justify-content:flex-end;gap:5px;display:flex}.blog-nav-tag{color:#5b6c7d;white-space:nowrap;background:#e9f3fb;border-radius:20px;justify-content:center;align-items:center;height:30px;padding:0 15px;font-size:12px;line-height:1.2;display:inline-flex}.blog-nav-title{color:#243649;margin:0;font-size:16px;font-weight:400;line-height:1.2;transition:color .18s}.blog-nav-card:hover .blog-nav-title,.blog-nav-card:focus-visible .blog-nav-title{color:#ff2c4e}.blog-nav-rule{background:#0000001a;border:0;height:1px;margin:0}.header-nav-link--open img{transform:rotate(180deg)}.header-nav-link img{transition:filter .18s,transform .18s}
