.px-fluid-x[data-astro-cid-cer7bslx]{padding-left:clamp(8px,.9615vw + -1.8462px,12px);padding-right:clamp(8px,.9615vw + -1.8462px,12px)}.py-fluid-y[data-astro-cid-cer7bslx]{padding-top:clamp(6px,.4808vw + 1.0769px,8px);padding-bottom:clamp(6px,.4808vw + 1.0769px,8px)}.case-study-page :target{-webkit-animation:target-fade 5s 1;-moz-animation:target-fade 5s 1}.case-study-page .article{display:flex;margin-bottom:40px;max-width:1200px;margin-left:auto;margin-right:auto;flex-direction:row-reverse;justify-content:space-between}.case-study-page .bg-gradient{background:linear-gradient(179deg,#1b1e24,#2e323e)}.case-study-page .case-study-content{font-style:normal;font-weight:400;font-size:18px;line-height:30px;color:#666}.case-study-page .case-study-content a{color:#09f}.case-study-page .fin-end{display:flex;width:100%;max-width:1200px;margin:64px auto;align-items:center}.case-study-page .find-end-line{border-top:1px solid #e6e6e6;width:50%}.case-study-page .find-end-image{margin:0 1rem}.case-study-page .back{width:85px;display:flex;align-items:center;justify-content:space-between;font-style:normal;font-weight:400;font-size:20px;line-height:28px;letter-spacing:.01em;color:#222428;outline:none;text-decoration:none;margin-bottom:75px}.case-study-page .back:hover{filter:invert(44%) sepia(70%) saturate(7055%) hue-rotate(215deg) brightness(101%) contrast(102%)}.case-study-page .article-body{flex:4;max-width:760px}.case-study-page .article-description{font-style:normal;font-weight:400;font-size:18px;line-height:26px;color:#666;mix-blend-mode:normal;margin-bottom:20px}.case-study-page .right-sidebar{flex:1}.case-study-page .article-body-h1{font-style:normal;font-weight:600;font-size:36px;line-height:48px;color:#1c1c1c;margin:0 0 2rem}.case-study-page .case-study-content h2{font-style:normal;font-weight:600;font-size:28px;line-height:40px;color:#1c1c1c;margin-top:48px;margin:3rem 0 1rem}.case-study-page .case-study-content h3{font-style:normal;font-weight:500;font-size:20px;line-height:24px;margin:2.5rem 0 1rem;color:#1c1c1c}.case-study-page .case-study-content h3 strong{font-style:normal;font-weight:500;font-size:20px;line-height:24px;margin:2.5rem 0 1rem}.case-study-page .case-study-content strong{color:#1c1c1c;font-weight:500}.case-study-page .case-study-content h4{margin-top:38px}.case-study-page .case-study-content p,.case-study-page .case-study-content li{font-style:normal;font-weight:400;font-size:18px;line-height:1.6;color:#696969}.case-study-page .cover-image{width:100%;max-height:481px;border-radius:4px;-o-object-fit:cover;object-fit:cover}.case-study-page .article-tag{margin-top:2rem;font-style:normal;font-weight:500;font-size:16px;line-height:20px;margin-bottom:10px;display:flex;color:#333c;text-decoration:underline;width:-moz-fit-content;width:fit-content}.case-study-page .article-tag:active{background:#0585dd;color:#fff}.case-study-page .author-meta-row{display:flex;margin-bottom:3rem;flex-direction:column}.case-study-page .author-meta-row .author-section{margin-bottom:4px;margin-top:0}.case-study-page .illustrator{margin:8px 0 0}.case-study-page .illustrator article{font-style:normal;font-weight:400;font-size:12px;line-height:16px;color:var(--neutral-700)}.case-study-page .illustrator-details{text-decoration:none;color:var(--neutral-700)}.case-study-page .illustrator-details.no-highlight{color:var(--neutral-700)!important}.case-study-page .illustrator-details:hover{color:#09f}.case-study-page .cover-image-container{margin:0 0 48px}.case-study-page .left-sidebar{max-width:360px}@media only screen and (min-width: 1281px){.case-study-page .left-sidebar{width:100%;max-width:360px}}.case-study-page .markdown-content img,.case-study-page .markdown-content pre{margin:16px 0}.case-study-page .markdown-content pre{position:relative;border-radius:6px}.case-study-page .case-study-content pre{font-size:1rem;line-height:150%;overflow:scroll}.case-study-page .case-study-content pre code{word-wrap:break-word;border-radius:4px}.case-study-page .case-study-content code{word-wrap:break-word}.case-study-page .markdown-content img{max-width:100%;margin:16px auto;display:flex}.case-study-page .markdown-content blockquote:before{content:url(/images/quotesymbol.svg);position:absolute;height:40px;width:40px}.case-study-page .markdown-content blockquote{margin:3rem 0;position:relative}@media (min-width: 760px){.case-study-page .cards:not(:first-child):before{display:block;content:"";height:60%;position:absolute;width:2px;top:50%;transform:translateY(-50%);left:0;background-color:#3a3f51}}.case-study-page .markdown-content blockquote p{font-style:normal;font-weight:600;font-size:24px;line-height:40px;color:#696969;margin:0 0 0 4rem}.case-study-page .markdown-content iframe{width:100%;height:50vh;margin:16px 0}.case-study-page .article-metadata{color:#696969;display:flex;font-size:14px}.case-study-page .article-date,.case-study-page .article-metadata img{margin-right:10px}.case-study-page .breadcrumb-parent{max-width:1200px;position:sticky;top:71px;margin:2rem 0 1rem;background:#fff;z-index:10;margin-left:auto;margin-right:auto;padding:1rem 0}.case-study-page .breadcrumbs{display:block;flex-direction:row;align-items:center;max-width:1440px;margin-left:auto;margin-right:auto;text-overflow:ellipsis;overflow:hidden;white-space:nowrap}.case-study-page .breadcrumb-item{font-style:normal;font-weight:400;font-size:16px;line-height:20px;text-decoration:none;color:#333;text-transform:capitalize}.case-study-page .breadcrumb-item.active{color:#09f}.case-study-page .breadcrumb-separator{margin-right:10px;color:#22242833}.case-study-page .breadcrumb-item:hover{color:#222428cc}.case-study-page .arrow-image-breadcrumb{padding:0 8px}@media only screen and (max-width: 1400px){.case-study-page .article-body{min-width:0}}@media only screen and (max-width: 1280px){.case-study-page .article{max-width:56.5rem}.case-study-page .fin-end{max-width:56.5rem;width:90%}}@media only screen and (max-width: 984px){.case-study-page .article-body{max-width:47.5rem;width:47.5rem}}@media only screen and (max-width: 768px){.case-study-page .article-body-h1{font-style:normal;font-weight:600;font-size:28px;line-height:40px;margin-bottom:1rem}.case-study-page .case-study-content h2{font-style:normal;font-weight:500;font-size:24px;line-height:32px;margin-top:32px}.case-study-page .case-study-content h3{font-style:normal;font-weight:500;font-size:18px;line-height:24px}.case-study-page .case-study-content p,.case-study-page .case-study-content li{font-style:normal;font-weight:400;font-size:16px;line-height:1.6}.case-study-page .markdown-content blockquote:before{transform:scale(.7)}.case-study-page .markdown-content blockquote p{font-size:20px;line-height:30px;color:#696969;margin:0 0 0 3rem}.case-study-page .article-date,.case-study-page .read-time{font-size:14px}.case-study-page .author-meta-row{width:100%}.case-study-page .seperator-circle{width:10px;height:10px}.case-study-page .article-metadata{align-items:center}}.case-study-page .code-toolbar{display:flex;padding-bottom:25px;width:100%;align-items:center}.case-study-page .toolbar-circle{width:12px;height:12px;border-radius:50%;margin-right:10px;cursor:pointer}.case-study-page .toolbar-circle.red{background-color:#ff605c}.case-study-page .toolbar-circle.yellow{background-color:#ffbd44}.case-study-page .toolbar-circle.green{background-color:#00ca4e}.case-study-page .hljs-copy{display:flex;align-items:center;justify-content:center;margin-left:auto;cursor:pointer;padding:8px;color:#fff;background:transparent;border:1px solid #e6e6e6;border-radius:4px;margin-top:6px;margin-right:6px;position:absolute;right:0}.case-study-page .hljs-copy:hover{color:#fff;background:#000}.case-study-page .case-study-content p{margin-block-start:1em;margin-block-end:1em}.case-study-page .case-study-content ul{padding-left:20px}.case-study-page .case-study-content ul li{margin-top:10px;padding-left:10px;position:relative}.case-study-page .case-study-content ol{padding-left:20px}.case-study-page .case-study-content ol li{list-style-type:decimal;margin-top:10px;padding-left:5px}.case-study-page .case-study-content ul li:before{position:absolute;content:"•";width:8px;height:8px;color:#696969;font-size:1.5em;top:-10px;left:-12px}