.blog-post-container{margin:160px auto var(--vertical-section-spacer);width:100%}.post-muted-text{color:var(--text-300);font-size:13px;margin-bottom:0}.post-heading{align-items:center;display:flex;gap:64px;margin-bottom:var(--spacer-lg)}.post-heading__content{flex:1 1 45%}.post-heading__preheader{align-items:center;display:flex;gap:4px;margin-bottom:12px}.post-heading__tag{font-size:.7778rem;font-weight:700;margin-bottom:0;text-transform:uppercase}.post-heading__title{margin-bottom:16px}.post-heading__summary{font-size:.8889rem;line-height:1.65}.post-heading__author{align-items:center;display:flex;gap:8px;margin-bottom:20px}.post-heading__author-avatar{border-radius:150px;height:50px;overflow:hidden;position:relative;width:50px}.post-heading__author-avatar img{height:100%;object-fit:cover;object-position:center;width:100%}.post-heading__featured-image{flex:1 1 50%}.post-heading__featured-image img{border-radius:var(--border-radius);display:block;height:auto;object-fit:cover;width:100%}.post__social-share-wrapper{border-top:1px solid var(--border-color);display:flex;flex-direction:column;gap:8px;padding-top:16px}.post__social-share{align-items:center;display:flex;gap:8px;margin-bottom:21px}.post__social-share a{align-items:center;background-color:var(--primary-base);border-radius:4px;display:flex;height:30px;justify-content:center;transition:all .2s ease-in-out;width:30px}.post__social-share svg{fill:var(--white);height:15px;width:15px}@media (hover:hover){.post__social-share a:hover{transform:translateY(-3px)}}@media (max-width:1024px){.post-heading{display:block}}@media (min-width:1024px){.progress{display:block}}@media (max-width:640px){.blog-post-container{margin:80px auto var(--vertical-section-spacer)}}.post-body{display:flex;flex-direction:column;gap:32px;justify-content:space-between;margin:0 auto}.post-body__content{order:2;width:100%}.post-body__content h2+img,.post-body__content h3+img,.post-body__content h4+img,.post-body__content h5+img,.post-body__content h6+img{margin-top:0}.post-body__content img{box-shadow:0 6px 9px 0 rgb(18 30 255/6%);margin:32px 0;width:100%!important}.post-body__content h1,.post-body__content h2,.post-body__content h3,.post-body__content h4,.post-body__content h5,.post-body__content h6{margin-bottom:20px;margin-top:40px}.post-body__content h2{font-size:2.0736em;scroll-margin-top:160px}.post-body__content h3{font-size:1.728em}.post-body__content h4{font-size:1.44em}.post-body__content h5{font-size:1.2em}.post-body__content h6{font-size:1rem}.post-body__content p{font-size:var(--base-font-size);line-height:1.65;margin-bottom:20px}.post-body__content a{color:var(--text-base);text-decoration:underline;text-decoration-color:var(--primary-base)}.post-body__content a:hover{color:var(--primary-base)}.post-body__content figure{margin:0}.post-body__content figure img{margin:16px 0 0}.post-body__content figcaption{color:#777;font-size:15px;margin-bottom:32px}.post-body__clipboard-btn{display:flex;justify-content:center;margin-bottom:var(--spacer-md)}.post-body__content .standout{background:var(--background-base);border:1px solid var(--border-color);border-radius:8px;margin-bottom:32px;padding:20px}@media (min-width:1024px){.post-body{flex-direction:row;gap:64px}.post-body__content{order:1;width:60%}}.post-body__content tr:first-child{background-color:var(--primary-base)}.post-body__content tr:first-child td{border-right:none;color:var(--white)}.post-body__content tr{border:1px solid var(--text-300)}.post-body__content td{border-right:1px solid var(--text-300);font-size:16px;padding:10px 12px!important;vertical-align:middle}.post-body__sidebar-wrapper{order:1;position:static;width:100%}@media (min-width:1024px){.post-body__sidebar-wrapper{max-width:30%;order:2;position:relative;width:auto}.post-body__sidebar{position:sticky;top:140px}}.post-toc{margin-bottom:var(--spacer-sm)}.post-toc__title{font-size:1.0556rem;font-weight:700;margin-bottom:14px;margin-top:0}.post-toc ol{list-style:none;margin-bottom:0;margin-left:0;padding-left:0}.post-toc__item{font-size:.8333rem;margin-bottom:10px}.post-toc__item:last-child{margin-bottom:0}.post-toc__item a{color:var(--text-base);font-size:14px;position:relative}.post-toc__item a:hover{text-decoration:underline}.post-toc__item a[data-state=active]{color:var(--primary-base);font-weight:600;position:relative}.table-wrapper{overflow-x:scroll;overflow-y:auto;padding:0 20px}.table{box-shadow:0 11px 21px 0 rgb(18 30 255/9%);margin-bottom:var(--spacer-md);min-width:700px;width:100%}.table .thead{background-color:var(--primary-base);padding:20px 10px;width:100%}.table .tbody{border:0;font-size:100%;font:inherit;margin:0;padding:0;vertical-align:baseline}.table .tr{align-items:center;display:flex;justify-content:space-between}.post-body .tbody .tr ul,.tbody span,.thead .th{flex-basis:33%;margin:0;padding:20px 10px}.thead .th{color:var(--white);font-weight:600;padding:0;text-align:center}.tbody .tr{border-bottom:1px solid var(--border-color)}.tbody .tr span{display:flex;justify-content:center;text-align:center}.tbody .tr span:first-child{justify-content:flex-start;text-align:left}.table .icon--checkmark{fill:var(--primary-base)}.table .icon--times{fill:var(--text-300)}@media (min-width:768px){.table-wrapper{overflow-x:visible;overflow-y:visible;padding:0}}.post-body__content ul:not(.post-body__content form ul):not(.code-card ul){list-style:none;margin:20px 0 30px 10px;padding:0}.post-body__content ul li:not(.post-body__content form ul li):not(.code-card ul li){margin-bottom:8px;padding-left:21px;position:relative}.post-body__content ul li:not(.post-body__content form ul li):not(.code-card ul li):before{color:var(--primary-base);content:"•";left:0;position:absolute;top:0}.post-body__content blockquote{align-items:center;border:none;display:flex;flex-wrap:wrap;font-style:italic;margin:35px 0 45px;min-height:60px;overflow:hidden;padding-left:124px;position:relative}.post-body__content blockquote:before{background:url(//8119038.fs1.hubspotusercontent-na1.net/hubfs/8119038/raw_assets/public/pixl-labs/assets/icons/quote-icon.svg)#fff no-repeat 50%;content:"";display:inline-block;height:60px;left:0;opacity:.6;position:absolute;top:0;width:60px}.post-body__content blockquote:after{background-color:#a570ff;content:"";height:100%;left:30px;opacity:.6;position:absolute;top:75px;width:2px;z-index:-1}.post-body__content blockquote cite{color:#777;font-style:normal;font-weight:700;margin-top:15px}.post-body__content .highlight-box{margin-bottom:var(--spacer-md);padding:20px 20px 25px;position:relative}.post-body__content .highlight-box--light{background:var(--background-base)}.post-body__content .highlight-box--center{text-align:center}.post-body__content .highlight-box--lg{padding:35px 20px}.post-body__content .highlight-box--purple{background:#f1e7ff}.post-body__content .highlight-box--orange{background:#fbe6c6;border-bottom:5px solid #feae2b;border-top:5px solid #feae2b}.post-body__content .highlight-box__header{align-items:center;display:flex;gap:15px;margin-bottom:20px}.post-body__content .highlight-box--center .highlight-box__header{justify-content:center;margin-bottom:10}.post-body__content .highlight-box__header img{margin:0;max-width:50px!important}.post-body__content img.highlight-box__icon{box-shadow:none;max-width:50px}.post-body__content .highlight-box__title{font-size:20px;font-weight:600;margin-bottom:0}.post-body__content .highlight-box--orange ul li{padding-left:30px}.post-body__content .highlight-box--orange ul li:before{content:url(//8119038.fs1.hubspotusercontent-na1.net/hubfs/8119038/raw_assets/public/pixl-labs/assets/icons/test-checkmark.svg);display:block}.post-related-articles-wrapper{margin-bottom:var(--spacer-xxl)}.blog-tag__container{padding-bottom:var(--spacer-xxl)}.rating-wrapper{margin-bottom:var(--spacer-md)}.rating{align-items:center;display:flex;gap:4px}.rating__title{font-weight:700}.rating svg{height:20px;width:18px;fill:var(--primary-base)}.rating__footer{display:block}.snippet-tippy-icon{display:none}.snippet-icon svg{fill:#ff6dc9}.code-card{background:#272a37;border-radius:8px;box-shadow:0 11px 21px 0 rgba(18,30,255,.09);color:#fff;margin-bottom:20px}.code-card__header{display:grid;grid-template-columns:repeat(2,1fr)}.code-card__header p{color:var(--text-300);font-size:14px;margin-bottom:4px;text-transform:uppercase}.code-card--3 .code-card__body,.code-card__header--3{column-gap:20px;grid-template-columns:repeat(3,1fr)}.code-card__body{align-items:center;display:grid;grid-template-columns:repeat(2,1fr);padding:20px 32px}.code-card__body p{color:#00ff69;margin-bottom:0}.code-card__body ul{list-style:none;margin:0;padding:0;text-indent:0}.code-card__body li{align-items:center;color:#ff6dc9;display:flex;gap:16px;padding-left:0;transition:all .15s ease}.code-card__body li:last-child{margin-bottom:0}.code-card__body li:before{display:none}.code-card__body li svg{animation:fadeIn .3s ease-in-out}p.code-card__desc{color:#fff;font-size:14px}.syntax-card{border:1px solid var(--border-color);border-radius:8px;margin-bottom:20px}.syntax-card__header{background:var(--primary-base);border-radius:8px 8px 0 0;color:#fff;font-size:15px;padding:5px 20px;text-transform:uppercase}.syntax-card__body{font-size:16px;padding:20px}@media (hover:hover){.code-card__body li:hover{cursor:pointer;opacity:.8}}@media (max-width:767px){.code-card__header{display:none}.code-card__body{display:block}.code-card__body ul{margin-top:15px}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}pre{margin-bottom:32px}pre code{border-radius:8px}