.blog-wrapper{box-sizing:border-box;position:relative;display:flex;flex-direction:column;background-color:rgb(var(--primary-300));padding:8rem 0}.blog-wrapper header .blog-share{display:flex;gap:8px;justify-content:flex-start}.blog-wrapper article .blog-share{display:flex;gap:12px;margin:0 24px;max-width:800px}.blog-wrapper header .blog-share div{cursor:pointer}.blog-wrapper header ul li{text-transform:uppercase;margin:0 24px}.blog-wrapper header{margin:0 24px;display:grid;gap:24px;position:relative}.blog-wrapper header h1{margin:0 auto;text-align:left}.blog-wrapper header h1{font-size:48px;font-weight:700;line-height:1.2;color:#1a1a1a;opacity:0;transform:translateY(100px);animation:fadeInUp 2s ease-out forwards}@keyframes fadeInUp{0%{opacity:0;transform:translateY(100px)}to{opacity:1;transform:translateY(0)}}.blog-wrapper article{margin:68px auto 0}.blog-wrapper article .related-blogs{display:grid;gap:24px;margin:0 10px 24px}.blog-wrapper header .blog-container{display:flex;flex-direction:column;gap:24px}.blog-wrapper article .related-blogs .related-blogs-header{display:flex;flex-direction:column;justify-content:center;align-items:center;margin-top:68px;gap:12px}.blog-wrapper article .related-blogs .related-blogs-header h6{padding:0;font-size:24px;color:#333}.blog-wrapper article .related-blogs .blogs-container{gap:12px;list-style:none;padding:0;display:flex;align-items:stretch;overflow-x:auto;width:auto}.blog-wrapper header ul{margin:0;padding:0}.blog-wrapper header .blog-metadata{display:flex;flex-direction:row;align-items:center;gap:12px}.blog-wrapper header .blog-metadata span{color:#666;font-weight:var(--font-400);font-size:var(--font-base);line-height:24px}.blog-wrapper header .blog-information{display:flex;gap:12px}.blog-wrapper header .blog-information-container{display:grid;gap:12px}.blog-wrapper header .blog-information-container span{font-weight:var(--font-400);font-size:var(--font-base);line-height:24px;text-align:left;color:#666}.blog-wrapper header .blog-information-container span:first-child{font-weight:600}.blog-wrapper article .markdown-content{max-width:800px;margin:0 24px;font-size:18px;line-height:1.8;color:#333}.blog-wrapper article .markdown-content h1{font-size:2.5rem;font-weight:700;margin-bottom:1rem;color:#1a1a1a}.blog-wrapper article .markdown-content h2{font-size:2rem;font-weight:700;margin-bottom:.75rem;color:#1a1a1a;line-height:1.3}.blog-wrapper article .markdown-content h3{font-weight:700;margin-bottom:.75rem;color:#1a1a1a;line-height:1.35}.blog-wrapper article .markdown-content p{margin-bottom:1rem;line-height:1.42}.blog-wrapper article .markdown-content ul{padding-left:20px;margin-bottom:1rem}.blog-wrapper article .markdown-content ul li{margin-bottom:.5rem}.blog-wrapper article .markdown-content table{width:100%;border-collapse:collapse;margin-bottom:1rem}.blog-wrapper article .markdown-content table,.markdown-content th,.markdown-content td{border:1px solid #ddd;padding:8px;text-align:left}.blog-wrapper article .markdown-content blockquote{border-left:4px solid #0077cc;padding-left:15px;font-style:italic;color:#555;margin-bottom:1rem}.blog-wrapper article .markdown-content pre{background:#282c34;color:#fff;padding:15px;border-radius:5px;overflow-x:auto}.blog-wrapper article .markdown-content code{font-family:Courier New,monospace;background:#eee;padding:2px 4px;border-radius:4px}.blog-wrapper article .markdown-content img{object-fit:cover;object-position:center;width:100%;border-radius:24px;margin:20px 0;max-height:800px}@media(min-width:769px){.blog-wrapper header{padding-bottom:48px;border-bottom:1px solid #e5e5e5;margin:68px 48px 0}.blog-wrapper header h1{margin:0 48px;text-align:start}.blog-wrapper header ul{margin:0 48px;padding:0}.blog-wrapper header .blog-metadata{margin:0 48px;display:flex;align-items:center;gap:12px}.blog-wrapper header .blog-information{margin:0 48px}.blog-wrapper header .blog-information-container span{text-align:start}.blog-wrapper article .related-blogs .blogs-container{grid-template-columns:repeat(3,minmax(0,1fr))}.blog-wrapper article{margin:68px 48px}.blog-wrapper header .blog-container{align-items:center;flex-direction:row;justify-content:space-between}.blog-wrapper article .markdown-content{margin:0 auto}.blog-wrapper header .blog-share{justify-content:end}.blog-wrapper article .blog-share{margin:0 auto}.blog-wrapper header .blog-metadata{flex-direction:row}.blog-wrapper article .related-blogs .related-blogs-header{flex-direction:row;justify-content:space-between}.blog-wrapper article .related-blogs .blogs-container::-webkit-scrollbar{display:none}.blog-wrapper article .related-blogs .blogs-container{scrollbar-width:none}}
