1"use strict";(self.webpackChunkairfocus=self.webpackChunkairfocus||[]).push([[6506],{56:function(e,a,t){var i=t(3769),r=t(5588),n=t(6540),s=t(4033),o=t(5557),l=t(6994),d=t(7263),m=t(4903),c=t(4767),g=t(2982);a.A=({video:{title:e,imageSrc:a,imageAlt:t,gatsbyImageSrc:i,videoUrl:p,youTubeId:b,wistiaVideoId:x},className:f,isFocusable:Y=!0,withPlayButton:y=!0,withImageOverlay:A=!0,cssStyles:w,trigger:v,triggerClassName:S,triggerCssStyles:$})=>{const[k,N]=n.useState(!1),C=()=>{N(!0)};return(0,g.Y)("div",{className:f,css:[u,w,"",""]},v?(0,g.Y)(n.Fragment,null,a&&(0,g.Y)(l.A,{src:a}),i&&(0,g.Y)(r.G,{image:i.gatsbyImageData,alt:""}),A&&(0,g.Y)("div",{css:d.X}),(0,g.Y)(s.$n,{type:"unstyled",className:S,tabIndex:Y?void 0:-1,cssStyles:$,"aria-label":"Play"+(e?": "+e:t?": "+t:" video"),onClick:C},v)):(0,g.Y)(s.$n,{type:"unstyled",className:"video-popup-trigger",tabIndex:Y?void 0:-1,cssStyles:h,"aria-label":"Play"+(e?": "+e:t?": "+t:" video"),onClick:C},a&&(0,g.Y)(l.A,{src:a}),i&&(0,g.Y)(r.G,{image:i.gatsbyImageData,alt:""}),y&&(0,g.Y)(o.A,{id:"icon-above-image"}),A&&(0,g.Y)("div",{css:d.X})),b&&!p&&(0,g.Y)(c.A,{showModal:k,setShowModal:N,selectedVideo:b,title:e||t}),x&&!p&&(0,g.Y)(m.V,{showModal:k,setShowModal:N,wistiaVideoId:x,title:e||t}))};const u=i.AH` 2 position: relative; 3 height: 100%; 4 aspect-ratio: 16 / 9; 5 6 #icon-above-image { 7 transition: all 0.3s ease-out; 8 position: absolute; 9 left: calc(50% - 11px); 10 top: calc(50% - 11px); 11 z-index: 2; 12 pointer-events: none; 13 width: 1.5rem; 14 } 15 16 &:hover #icon-above-image { 17 transform: scale(1.15); 18 } 19`,h=i.AH` 20 display: block; 21 width: 100%; 22 height: 100%; 23`},126:function(e,a,t){var i=t(3769),r=t(6540),n=t(2358),s=t(9988),o=t(1143),l=t(4017),d=t(7263),m=t(2982);const c=["a","button","input","select","textarea"],g=e=>{if(Array.isArray(e))return e.some(g);if(!r.isValidElement(e))return!1;const a=e.props,t="string"==typeof e.type&&c.includes(e.type),i="href"in a||"to"in a||"link"in a||"onClick"in a||"link"===a.role||"button"===a.role||void 0!==a.tabIndex;return!(!t&&!i)||"children"in a&&g(a.children)};a.A=({className:e,title:a,descriptionAsMarkdown:t,blueSubtitle:r,graySubtitle:n,description:o,footnote:c,iconSrc:x,imageSrc:f,imageAlt:Y,gatsbyImageSrc:y,imgStyle:A,imgWithBorder:w=!1,hoverImageSrc:v,roundedImage:S=!1,primaryLink:$,arrowLink:k,footerLabel:N,additionalJsx:C,isCentered:H=!1,onClick:I,withImageOverlay:z,cssStyles:T=i.AH``,withCenteredImageOnGrayBG:B=!1,bgColor:M,headingClassName:D="heading4",withoutBorderRadius:F=!1})=>{const G=!(null==$||!$.url)||!!I,R=!(null==k||!k.url||null==k||!k.text),L=G||R||!!N,P=g(C),_=!(null==$||!$.url||null!=$&&$.text||R||P),O=a?(0,s.QZ)(a):(0,s.QZ)(o),j=(0,s.op)(null==$?void 0:$.url,O),W={baseAriaLabel:O,title:a,blueSubtitle:r,graySubtitle:n,description:o,descriptionAsMarkdown:t,footnote:c,gatsbyImageSrc:y,iconSrc:x,imageSrc:f,imageAlt:Y,imgStyle:A,imgWithBorder:w,hoverImageSrc:v,roundedImage:S,primaryLink:$,arrowLink:k,footerLabel:N,onClick:I,additionalJsx:C,useWholeCardLink:_,isCentered:H,withImageOverlay:z,withCardFrame:L,headingClassName:D,withoutBorderRadius:F};return(0,m.Y)("div",{className:e,css:[u(H),T,(B||M)&&b(M),"",""]},G?(0,m.Y)("div",{className:"translate-and-shadow-on-hover",css:h(!!I||_)},(0,m.Y)(d.A,W),_&&(0,m.Y)(l.N_,{href:null==$?void 0:$.url,css:p,"aria-label":j})):(0,m.Y)(d.A,W))};const u=e=>i.AH` 24 text-align: left; 25 height: 100%; 26 27 ${e&&"\n text-align: center;\n "}; 28`,h=e=>i.AH` 29 position: relative; 30 isolation: isolate; 31 z-index: 0; 32 display: flex; 33 flex-direction: column; 34 height: 100%; 35 border-radius: 0.25rem; 36 overflow: ${e?"visible":"hidden"}; 37 width: 100%; 38`,p=i.AH` 39 position: absolute; 40 inset: 0; 41 z-index: 1; 42 43 &:focus-visible { 44 ${o.Ms}; 45 border-radius: 0.25rem; 46 } 47`,b=e=>i.AH` 48 & > div { 49 height: 100%; 50 } 51 52 #text-card-image { 53 ${e?`\n background-size: cover;\n background-repeat: no-repeat;\n background-image: url('/images/${e}-gradient-bg.webp');\n `:`\n background: #fafafa;\n border: 1px solid ${n.T.grayLight};\n border-bottom: none;\n `} 54 aspect-ratio: 2/1; 55 display: flex; 56 justify-content: center;
57 align-items: center; 58 padding: 1rem; 59 } 60 61 #text-card-content { 62 border: 1px solid ${n.T.grayLight}; 63 border-top: none; 64 padding: 1.5rem; 65 border-radius: 0 0 0.25rem 0.25rem; 66 flex-grow: 1; 67 display: flex; 68 flex-direction: column; 69 justify-content: space-between; 70 } 71`},164:function(e,a,t){t.r(a),t.d(a,{Head:function(){return M},sidebarStyle:function(){return F}});var i=t(3769),r=t(9962),n=t.n(r),s=t(8078),o=t(6540),l=t(7243),d=t(695),m=t(2258),c=t(3029),g=t(2292),u=t(514),h=t(3892),p=t(7650),b=t(1718),x=t(2530),f=t(4017),Y=t(1541),y=t(2896),A=t(7746),w=t(8170),v=t(5793),S=t(196),$=t(2358),k=t(9988),N=t(9381),C=t(3442),H=t(6149),I=t(7022),z=t(6632),T=t(154),B=t(2982);a.default=({data:{article:{title:e,content:a,category:t,funnelStage:r,subcategories:A,author:v,createdAt:$},topArticles:M}})=>{const O=o.useMemo(()=>JSON.parse(a.raw),[a]),j=o.useMemo(()=>(0,N.ZZ)(O),[O]),W=(0,N.hW)(a,r,t.slug);return(0,B.Y)(x.Ay,{blackBG:!0},(0,B.Y)(I.LearnHeader,{hideOnScroll:!0}),(0,B.Y)(c.A,null,(0,B.Y)(Y.A,null),(0,B.Y)(y.A,null),(0,B.Y)("div",{css:G},(0,B.Y)("p",{className:"strong-body-1 center white-text"},n()($).format("D MMM YYYY")),(0,B.Y)("h1",{className:"heading2 center",css:L},e),(0,B.Y)(f.N_,{href:`/product-learn/category/${t.slug}/`,className:"center categories",css:R(t.categoryColor)},t.name.replace("<br />","")),A&&(0,B.Y)(m.A,{columns:A.length,noBreakForTablet:!0,css:D,columnsTemplate:`repeat(${A.length}, max-content)`,columnGap:.5,rowGap:1},A.map(({name:e,slug:a})=>(0,B.Y)(f.N_,{key:a,href:`/product-learn/subcategory/${a}/`},e)))),(0,k.Fr)(S.BA)&&(0,B.Y)(o.Fragment,null,(0,B.Y)(p.A,{size:4,isTop:!1,color:"rgba(136, 146, 158, 0.4)",notDecreased:!0}),(0,B.Y)(d.h,{withDescription:!0,author:v}),(0,B.Y)(p.A,{size:4,color:"rgba(136, 146, 158, 0.4)",notDecreased:!0})),(0,B.Y)(m.A,{css:T.longCopyBlockStyle},0===j.length?(0,B.Y)("h3",{className:"heading3 no-margin hide-on-small-medium",css:z.anchorsFallbackStyle},e):(0,B.Y)(l.A,{anchors:j,blackBG:!0}),(0,B.Y)("div",null,(0,B.Y)(u.A,null,!!a&&(0,s.C)(W,N.C5)),(0,B.Y)(p.A,{size:2,color:"rgba(136, 146, 158, 0.4)"}),(0,B.Y)(w.A,{blackBG:!0,title:e})),!(0,k.Fr)(S.BA)&&(0,B.Y)("div",{css:F},(0,B.Y)(d.h,{author:v,withDescription:!0,isInSidebar:!0}),(0,B.Y)(p.A,{size:6.5,color:"rgba(136, 146, 158, 0.4)"}),(0,C.he)(r,t.slug))),(0,B.Y)(p.A,{size:8,color:"rgba(136, 146, 158, 0.4)"}),(0,B.Y)("h3",{className:"heading3",css:i.AH` 72 margin-bottom: 2rem; 73 `},"Read also"),(0,B.Y)(m.A,{columns:2,columnsTemplate:"2fr 1fr",alignContent:"stretch",css:P(H.W)},(0,B.Y)(m.A,{columns:2,alignContent:"stretch",noBreakForTablet:!0},(0,B.Y)(g.A,{title:M.edges[0].node.title,description:M.edges[0].node.abstract.abstract,author:M.edges[0].node.author,categoryColor:M.edges[0].node.category.categoryColor,articleUrl:M.edges[0].node.slug,createdAt:M.edges[0].node.createdAt}),(0,B.Y)(g.A,{title:M.edges[1].node.title,description:M.edges[1].node.abstract.abstract,author:M.edges[1].node.author,categoryColor:M.edges[1].node.category.categoryColor,articleUrl:M.edges[1].node.slug,createdAt:M.edges[1].node.createdAt})),(0,B.Y)(m.A,{rowGap:1,css:_(H.W)},M.edges.slice(2,5).map(({node:{slug:e,category:{categoryColor:a,categoryWhiteLogo:t},author:i,createdAt:r,abstract:{abstract:n},title:s}})=>(0,B.Y)(g.A,{isSmall:!0,key:e,categoryColor:a,author:i,description:n,title:s,articleUrl:e,logoSrc:t,createdAt:r})))),(0,B.Y)(h.A,{type:(0,C.oi)(t.slug)})),(0,B.Y)(b.A,{blackBG:!0}))};const M=({data:{article:{title:e,abstract:{abstract:a},heroImage:t,createdAt:i,author:r}}})=>(0,B.Y)(o.Fragment,null,(0,B.Y)(A.A,{title:e,description:a,imageSrc:`https:${t.file.url}`,schemaData:{type:"Article",dateCreated:i,authorName:r.name}}),(0,B.Y)(v.x,null)),D=i.AH` 74 color: ${$.T.black}; 75 font-size: 0.75rem; 76 line-height: 1rem; 77 margin: 0 auto 1rem; 78 width: max-content; 79 80 a { 81 color: ${$.T.black}; 82 display: inline-block; 83 padding: 0.25rem 0.75rem; 84 border-radius: 1rem; 85 background-color: ${$.T.grayLight}; 86 margin: 0 auto; 87 } 88 89 @media screen and (max-width: ${S.fi.small}px) { 90 margin: 0 auto !important; 91 } 92`,F=i.AH` 93 height: 100%; 94`,G=i.AH` 95 padding: 4.5rem 0 3rem; 96 97 .strong-body-1 { 98 margin-bottom: 0.5rem; 99 } 100 101 @media screen and (max-width: ${S.fi.small}px) { 102 padding: 3rem 0; 103 104 .heading2 { 105 text-align: center !important; 106 } 107 } 108`,R=e=>i.AH` 109 color: ${e} !important; 110 margin-bottom: 1rem; 111 display: block; 112`,L=i.AH` 113 margin-bottom: 1rem !important; 114`,P=e=>i.AH` 115 @media screen and (min-width: ${S.fi.small+1}px) and (max-width: ${e}
115px) { 116 grid-template-columns: 1fr; 117 } 118`,_=e=>i.AH` 119 @media screen and (min-width: ${S.fi.small+1}px) and (max-width: ${e}px) { 120 grid-template-columns: 1fr 1fr; 121 } 122`},6632:function(e,a,t){t.r(a),t.d(a,{BlogPostPageTemplate:function(){return j},Head:function(){return W},anchorsFallbackStyle:function(){return J},blogPostContainerStyle:function(){return Z},blogTitleStyle:function(){return U},leftColumnSecondRowContainerStyle:function(){return V},readAlsoContainerStyle:function(){return ae},subTitleContainerStyle:function(){return E}});var i=t(8168),r=t(2003),n=t(3769),s=t(9962),o=t.n(s),l=t(5588),d=t(8078),m=t(6540),c=t(7243),g=t(695),u=t(2258),h=t(3029),p=t(7923),b=t(5583),x=t(3750),f=t(514),Y=t(3892),y=t(7650),A=t(1718),w=t(2530),v=t(4017),S=t(1541),$=t(2896),k=t(1857),N=t(7746),C=t(8170),H=t(5793),I=t(8335),z=t(196),T=t(3218),B=t(9988),M=t(9381),D=t(3442),F=t(7072),G=t(2123),R=t(8778),L=t(2495),P=t(164),_=t(154),O=t(2982);const j=({data:{blogPost:{content:e,createdAt:a,publishedAt:t,updatedAt:n,title:s,heroImage:N,imageWithBorder:H,postCategory:{name:j,slug:W,categoryColor:E},postAuthor:U,funnelStage:V,sidebarCta:Z},blogPosts:te}})=>{var ie;const re=m.useMemo(()=>(0,T.bi)(te),[te]),ne=m.useMemo(()=>JSON.parse(e.raw),[e]),se=m.useMemo(()=>(0,M.ZZ)(ne),[e]),oe=m.useMemo(()=>(0,r.l)(ne).split(" ").length,[]),le=(0,T.c2)(oe),de=o()(n||t||a).format("D MMM YYYY"),[me,ce]=m.useState(""),ge=(0,F.o)(me),ue=m.useMemo(()=>re.filter(({title:e})=>e.toLowerCase().includes(ge.toLowerCase())),[ge]),he=(0,M.hW)(e,V,W),pe=(0,R.M)("blog_subscribed",!1)[1];return(0,G.m)({onFormSubmittedCallback:()=>pe(!0),hubspotFormIds:["7cd8c2f7-7dc1-498c-9184-29539d228229"]}),(0,O.Y)(w.Ay,null,(0,O.Y)(L.BlogHeader,{search:me,setSearch:ce,hideOnScroll:!0}),(0,O.Y)(h.A,null,(0,O.Y)(S.A,null),(0,O.Y)($.A,null),(0,O.Y)("div",{css:ee},(0,O.Y)(v.N_,{className:"heading4 center",href:`/blog/category/${W}/`,css:(0,L.firstPostLinkStyle)(E)},j),(0,O.Y)("h1",{className:"heading1 center"},s),(0,O.Y)("div",{className:"subtitle",css:K},(0,O.Y)("span",null,de),(0,O.Y)(I.A,{height:"23px",marginLeftRight:"1rem",translateY:"0"}),(0,O.Y)("span",null,le),(0,O.Y)(I.A,{className:"hide-on-small",height:"23px",marginLeftRight:"1rem",translateY:"0"}),(0,O.Y)(b.g,{className:"hide-on-small",author:U,textClassName:"subtitle",avatarSize:43,isImageOnTheRight:!0}))),(0,O.Y)(l.G,{className:H?"with-box-shadow":"",image:N.gatsbyImageData,alt:"",css:q,loading:"eager"}),(0,O.Y)(b.g,{className:"hide-on-medium-large-desktop",author:U,textClassName:"subtitle",avatarSize:43,cssStyles:X}),(0,O.Y)(u.A,{css:_.longCopyBlockStyle},0===se.length?(0,O.Y)("h3",{className:"heading3 no-margin hide-on-small-medium",css:J},s):(0,O.Y)(c.A,{anchors:se}),(0,O.Y)("div",null,(0,O.Y)(f.A,null,(0,d.C)(he,M.C5)),(0,O.Y)(y.A,{size:2,notDecreased:!0}),(0,B.Fr)(z.BA)&&(0,O.Y)(m.Fragment,null,(0,O.Y)(g.h,{blackBG:!1,withDescription:!0,leftOnSmall:!0,author:U}),(0,O.Y)(y.A,{size:2})),(0,O.Y)(C.A,{title:s}),(0,O.Y)(y.A,{size:2}),(0,O.Y)(p.A,null)),!(0,B.Fr)(z.BA)&&(0,O.Y)("div",{css:P.sidebarStyle},(0,O.Y)(g.h,{blackBG:!1,author:U,withDescription:!0,isInSidebar:!0}),(0,O.Y)(y.A,{size:6.5,color:"rgba(136, 146, 158, 0.4)"}),(0,D.he)(V,W,null==Z?void 0:Z.type,null==Z||null===(ie=Z.ebookResource)||void 0===ie?void 0:ie.slug))),(0,O.Y)("div",{css:ae},(0,O.Y)("h3",{className:"heading3"},"Read also"),(0,O.Y)(u.A,{columns:3,rowGap:2,twoColumnsForTablet:!0,css:Q,alignContent:"stretch"},re.slice(0,4).map((e,a)=>(0,O.Y)(x.z,(0,i.A)({key:e.id,className:3===a?"hide-on-small hide-on-large-desktop":void 0},e))))),(0,O.Y)(y.A,{size:4,color:"transparent"}),(0,O.Y)(Y.A,{type:(0,D.oi)(W)}),(0,O.Y)(k.OV,{search:me,debouncedSearch:ge,resultsArray:ue,resultsBlockContent:ue.map(e=>(0,O.Y)(x.z,(0,i.A)({key:e.id},e))),breakPoint:z.Yk})),(0,O.Y)(A.A,null))};a.default=j;const W=({data:{blogPost:{postAuthor:e,title:a,abstract:{abstract:t},heroImage:i,publishedAt:r,createdAt:n,updatedAt:s}}})=>(0,O.Y)(m.Fragment,null,(0,O.Y)(N.A,{title:a,description:t,imageSrc:`https:${i.file.url}`,schemaData:{type:"BlogPosting",authorName:e.name,datePublished:r||n,dateCreated:n,dateModified:s}}),(0,O.Y)(H.x,null)),E=n.AH` 123 margin-bottom: 3em; 124`,U=n.AH` 125 font-weight: normal; 126 font-size: 1.75em; 127 text-align: center; 128 @media screen and (min-width: ${z.fi.medium}px) { 129 text-align: left; 130 font-size: 42px; 131 } 132`,V=n.AH` 133 grid-row: 2; 134 display: none; 135 @media screen and (min-width: ${z.fi.xlarge}px) { 136 display: block; 137 } 138`,Z=n.AH` 139 margin: 75px auto 150px auto; 140 display: grid; 141 grid-gap: 0px 10px; 142 grid-template-columns: 1fr; 143 grid-template-rows: 1fr; 144 padding: 0 20px; 145 text-align: justify; 146 147 @media screen and (min-width: ${z.fi.xlarge}px) { 148 text-align: left; 149 grid-gap: 0px 40px; 150 grid-template-columns: auto minmax(auto, 768px); 151 grid-template-rows: auto 1fr; 152 } 153 @media screen and (min-width: ${z.fi.xxlarge}px) {
154 padding: 0 30px; 155 grid-gap: 0px 40px; 156 grid-template-columns: 1fr minmax(auto, 768px) 1fr; 157 } 158`,J=n.AH` 159 position: sticky; 160 top: 6.5rem; 161`,Q=n.AH` 162 margin-bottom: 4rem; 163`,q=n.AH` 164 max-height: 400px; 165 width: 100%; 166 margin-bottom: 4rem; 167 border-radius: 0.5rem; 168 169 @media screen and (max-width: ${z.fi.small}px) { 170 margin-bottom: 1.5rem; 171 aspect-ratio: 2; 172 } 173`,X=n.AH` 174 & > div { 175 margin-bottom: 2rem; 176 } 177`,K=n.AH` 178 display: flex; 179 text-align: left; 180 align-items: center; 181 justify-content: center; 182 margin: 0 0 3rem !important; 183 @media screen and (max-width: ${z.fi.large}px) { 184 margin-bottom: 2rem !important; 185 } 186`,ee=n.AH` 187 padding-top: 4rem; 188 text-align: center; 189 190 .heading1 { 191 margin: 0.5rem auto 2rem; 192 pointer-events: none; 193 } 194 195 @media screen and (max-width: ${z.fi.large}px) { 196 padding-top: 3rem; 197 198 .heading1 { 199 margin-bottom: 1rem; 200 } 201 } 202 203 @media screen and (max-width: ${z.fi.medium}px) { 204 .heading1 { 205 font-size: 40px !important; 206 line-height: 42.5px !important; 207 } 208 } 209`,ae=n.AH` 210 margin: 4rem 0; 211 212 .heading3 { 213 margin-bottom: 2rem; 214 } 215`},7923:function(e,a,t){var i=t(3769),r=t(9308),n=t(4017),s=t(2982);a.A=()=>(0,s.Y)("div",{className:"heading4",css:o},"Share what you learned or ask questions in"," ",(0,s.Y)(n.N_,{href:"https://community.lucid.co/?utm_source=airfocus&utm_medium=lucid-community&utm_campaign=airfocus-links&utm_content=website-site-blogs"},"the community",(0,s.Y)(r.A,{width:"30px",path:"#318eff"})));const o=i.AH` 216 svg { 217 margin-left: 6px; 218 transform: translateY(8px); 219 } 220`},9318:function(e,a,t){t.r(a),t.d(a,{Head:function(){return K},HeroMedia:function(){return U},default:function(){return X}});var i=t(4506),r=t(840),n=t(3769),s=t(5588),o=t(8078),l=t(6540),d=t(3029),m=t(4033),c=t(514),g=t(8837),u=t(4794),h=t(196),p=t(5921),b=t(1143),x=t(6629),f=t(6994),Y=t(2982);var y=({caseStudySlug:e,colorScheme:a="purple",cssStyles:t})=>{const{caseStudies:i}=(0,u.useStaticQuery)("845053531"),r=i.edges.find(a=>a.node.slug===e);if(!r)return null;const{headline:n,seoTitle:o,pdfCoverImage:l,pdfFile:d}=r.node,c=`https://${d.file.url}`;return(0,Y.Y)("div",{className:`${a.toLowerCase()}-gradient-bg with-box-shadow`,css:[A,t,"",""]},(0,Y.Y)("div",{css:w},(0,Y.Y)("div",null,(0,Y.Y)("div",{className:"blue-text body-1 no-margin"},"CASE STUDY"),(0,Y.Y)("h3",{className:"heading3 black-text no-margin",css:S},(0,Y.Y)(g.r,{content:n.headline}))),(0,Y.Y)(m.$n,{link:c,"aria-label":`Download case study PDF: ${o} (opens in a new tab)`,cssStyles:v},"Download now")),(0,Y.Y)(x.A,{css:[$,(0,b.uh)(h.R),"",""]}),(0,Y.Y)("div",{className:"hide-on-medium-large-desktop",css:N},(0,Y.Y)(f.A,{src:"cta/ebook-small.webp",alt:""})),(0,Y.Y)("div",{className:"hide-on-small",css:k},(0,Y.Y)(s.G,{image:l.gatsbyImageData,alt:"",imgStyle:{borderRadius:"0 0.5rem 0.5rem 0"}})))};const A=n.AH` 221 // richt-text (center column) always has a slight margin-top for which we need to align 222 box-sizing: border-box; 223 margin: 2rem auto; 224 position: relative; 225 border-radius: 0.5rem; 226 padding: 2rem; 227 overflow: hidden; 228 max-width: 800px; 229 min-height: 9rem; 230 231 // stretch content div to 100% height & for tablet / mobile design 232 display: flex; 233 234 @media screen and (max-width: ${h.fi.medium}px) { 235 justify-content: space-between; 236 padding: 2rem 3rem; 237 } 238 239 @media screen and (max-width: ${h.fi.small}px) { 240 overflow: visible; 241 display: block; 242 padding: 2rem; 243 } 244`,w=n.AH` 245 display: flex; 246 flex-direction: column; 247 justify-content: space-between; 248 align-items: flex-start; 249 max-width: 70%; 250 251 @media screen and (max-width: ${h.fi.xlarge}px) { 252 max-width: 65%; 253 } 254 255 @media screen and (max-width: ${h.fi.medium}px) { 256 max-width: 70%; 257 } 258 259 @media screen and (max-width: ${h.fi.small}px) { 260 max-width: 100%; 261 } 262`,v=n.AH` 263 margin-top: 1.5rem; 264 background: ${p.Y.blue[60]}; 265`,S=n.AH` 266 &.heading3 { 267 margin-top: 0.5rem !important; 268 font-weight: initial !important; 269 } 270`,$=n.AH` 271 position: absolute; 272 width: 370px; 273 right: -30px; 274 bottom: -15px; 275`,k=n.AH` 276 position: absolute; 277 width: 167px; 278 bottom: -41px; 279 right: 58px; 280 border-radius: 0 0.5rem 0.5rem 0; 281 282 @media screen and (max-width: ${h.R}px) { 283 width: 120px; 284 right: 32px; 285 bottom: 50%; 286 transform: translateY(50%); 287 } 288`,N=n.AH` 289 width: 4rem; 290 position: absolute; 291 top: -2rem; 292 right: 2rem; 293`;var C=t(3892),H=t(7650),I=t(1718),z=t(6065),T=t(4913),B=t(4253),M=t(2530),D=t(4017),F=t(2896),G=t(7746),R=t(126),L=t(56),P=t(2358),_=t(1099),O=t(1281),j=t(9381),W=t(61),E=t(6632);const U=({className:e,image:a,youtubeId:t,slug:i,colorScheme:r})=>(0,Y.Y)("div",{className:e,css:ne(r,t)},t?(0,Y.Y)(L.A,{video:{gatsbyImageSrc:a,imageAlt:`airfocus case study: ${i}`,youTubeId:t},withPlayButton:!1,withImageOverlay:!1,cssStyles:oe,triggerClassName:"strong-body-1",triggerCssStyles:le,trigger:(0,Y.Y)(l.Fragment,null,(0,Y.Y)(B.A,{"aria-hidden":!0})," Play video")}):(0,Y.Y)(s.G,{image:a.gatsbyImageData,alt:""})),V=({className:e,colorScheme:a,industries:t,location:r,companySize:n})=>(0,Y.Y)("div",{className:e,css:de(a)},(0,Y.Y)("div",{css:me},(0,Y.Y)("div",{className:"strong-body-2"},"INDUSTRY"),(0,Y.Y)("div",{className:"body-2"},(0,i.A)(t).sort((e,a)=>e.localeCompare(a)).join(", "))),(0,Y.Y)("div",{css:me},(0,Y.Y)("div",{className:"strong-body-2"},"HEADQUARTERS"),(0,Y.Y)("div",{className:"body-2"},r)),(0,Y.Y)("div",{css:me},(0,Y.Y)("div",{className:"strong-body-2"},"COMPANY SIZE"),(0,Y.Y)("div",{className:"body-2"},n))),Z=({className:e,stats:a,colorScheme:t})=>(0,Y.Y)(z.A,{className:e,columnsTemplate:`repeat(${a.length-1}, 1fr auto) 1fr`,cssStyles:pe(t),noBreakForTablet:!0},a.map(({value:e,label:i},r)=>(0,Y.Y)(l.Fragment,{key:`${i}-${e}`},(0,Y.Y)("div",{css:be},(0,Y.Y)("div",{css:xe},e),(0,Y.Y)("div",{className:"body-1 center no-margin"},i)),r<a.length-1&&(0,Y.Y)("div",{className:"center",css:fe(t)})))),J={...j.C5,renderNode:{...j.C5.renderNode,[r.nA.HEADING_2]:(0,j.B6)(2,3),[r.nA.HEADING_3]:(0,j.B6)(3,4)}},Q=e=>{var a;const t=document.getElementById(e);if(!t)return;const i=null!==(a=t.querySelector("section"))&&void 0!==a?a:t;i.hasAttribute("tabindex")||i.setAttribute("tabindex","-1"),i.focus({preventScroll:!0})}
293,q=({id:e,title:a,content:t})=>(0,Y.Y)(z.A,{id:e,columnGap:3,cssStyles:Ye},(0,Y.Y)("h2",{className:"heading3",css:ye},(0,Y.Y)("span",{className:"hide-on-large"},"The ",a.toLowerCase()),(0,Y.Y)("span",{className:"hide-on-small-medium hide-on-desktop"},a)),(0,Y.Y)(c.A,null,(0,o.C)(t,J)));var X=({data:{caseStudy:{slug:e,colorScheme:a,testimonialImage:t,headline:r,heroImage:n,cardImage:u,youtubeId:p,industries:b,location:x,companySize:f,challengeAbstract:A,resultsAbstract:w,customerSuccessStats:v,introContent:S,challengeContent:$,solutionContent:k,resultsContent:N,moreCaseStudies:B}}})=>{const G=(0,O.zd)(a),L=(0,O.W_)(G),P=l.useMemo(()=>(0,O.VM)(B||[]),[B]);return(0,Y.Y)(M.Ay,null,(0,Y.Y)(_.Q,{value:G},(0,Y.Y)(T.Ay,null),(0,Y.Y)(d.A,null,(0,Y.Y)("div",{className:"full-screen-relative",css:ee(L)},(0,Y.Y)(z.A,{columns:2,columnGap:4,cssStyles:ae},(0,Y.Y)("div",{css:te},(0,Y.Y)(s.G,{className:"hide-on-small-medium",image:t.gatsbyImageData,alt:"",style:{height:"30px",width:"auto",display:"flex"},imgStyle:{height:"30px",width:"auto",objectFit:"contain"}}),(0,Y.Y)(U,{className:"hide-on-small hide-on-large-desktop",slug:e,image:u,youtubeId:p,colorScheme:L}),(0,Y.Y)("div",{className:"hide-on-medium-large-desktop",css:se},(0,Y.Y)(U,{slug:e,image:u,youtubeId:p,colorScheme:L})),(0,Y.Y)("h1",{css:ie},(0,Y.Y)(g.r,{content:r.headline})),(0,Y.Y)(V,{className:"hide-on-medium-large-desktop",colorScheme:L,industries:b,location:x,companySize:f}),(0,Y.Y)(m.s,{type:L.buttonType,buttonText:"Get these results for your team",cssStyles:re})),(0,Y.Y)(U,{className:"hide-on-small-medium",slug:e,image:n,youtubeId:p,colorScheme:L})),(0,Y.Y)(F.A,{referenceIdForVisibility:S?"intro":"challenge/"}),(0,Y.Y)(V,{className:"hide-on-small",colorScheme:L,industries:b,location:x,companySize:f})),(0,Y.Y)(z.A,{columns:2,columnGap:2,alignContent:"stretch",cssStyles:ce(!!S)},(0,Y.Y)("div",{className:"black-text",css:[he(L),ge,"",""]},(0,Y.Y)("p",{className:"card-title",id:`${e}-challenge-label`},"Challenge"),(0,Y.Y)("div",{className:"body-1 no-margin"},A.challengeAbstract),(0,Y.Y)(D.N_,{href:`/resources/case-studies/${e}/#challenge/`,"aria-labelledby":`${e}-challenge-label`,onClick:()=>Q("challenge/"),css:ue})),(0,Y.Y)("div",{className:"black-text",css:[he(L),ge,"",""]},(0,Y.Y)("p",{className:"card-title",id:`${e}-results-label`},"Results"),(0,Y.Y)("div",{className:"body-1 no-margin"},w.resultsAbstract),(0,Y.Y)(D.N_,{href:`/resources/case-studies/${e}/#results/`,"aria-labelledby":`${e}-results-label`,onClick:()=>Q("results/"),css:ue}))),(0,Y.Y)(Z,{className:"hide-on-small",stats:v,colorScheme:L}),S&&(0,Y.Y)(z.A,{id:"intro",columnGap:3,cssStyles:Ye},(0,Y.Y)("h2",{className:"heading3",css:ye},(0,Y.Y)("span",{className:"hide-on-large"},"The story"),(0,Y.Y)("span",{className:"hide-on-small-medium hide-on-desktop"},"Story")),(0,Y.Y)(c.A,null,(0,o.C)(S,J))),(0,Y.Y)(q,{id:"challenge/",title:"Challenge",content:$}),(0,Y.Y)(q,{title:"Solution",content:k}),(0,Y.Y)(Z,{className:"hide-on-medium-large-desktop",stats:v,colorScheme:L}),(0,Y.Y)(q,{id:"results/",title:"Results",content:N}),(0,Y.Y)(z.A,{columnGap:3,cssStyles:Ye},(0,Y.Y)("div",null),(0,Y.Y)(y,{caseStudySlug:e,colorScheme:G})),(0,Y.Y)(H.A,{size:6}),(0,Y.Y)("div",{css:E.readAlsoContainerStyle},(0,Y.Y)("h2",{className:"heading3"},"More case studies"),(0,Y.Y)(z.A,{columns:3,rowGap:2,twoColumnsForTablet:!0,alignContent:"stretch",breakPoint:h.R},P.map(({slug:e,colorScheme:a,industries:t,headline:r,cardImage:n},s)=>{const o=(0,O.zd)(a),l=(0,O.W_)(o);return(0,Y.Y)(R.A,{key:`${e}-case-study`,additionalJsx:(0,Y.Y)("div",{className:"black-text",css:(0,W.industryTagStyle)(l)},(0,i.A)(t).sort((e,a)=>e.localeCompare(a)).join(", ")),description:r.headline,descriptionAsMarkdown:!0,gatsbyImageSrc:n,primaryLink:{url:`/resources/case-studies/${e}/`,text:"Learn more"},cssStyles:Ae(s===P.length-1)})}))),(0,Y.Y)(C.A,null)),(0,Y.Y)(I.A,null)))};const K=({data:{caseStudy:{seoTitle:e,seoDescription:{seoDescription:a},featuredImage:t,cardImage:i}}})=>{var r;return(0,Y.Y)(G.A,{title:e,description:a,imageSrc:`https:${null!==(r=null==t?void 0:t.file.url)&&void 0!==r?r:i.file.url}`})},ee=e=>n.AH` 294 position: relative; 295 padding: 4rem 0; 296 background-color: ${e.veryLight}; 297 298 @media screen and (max-width: ${h.fi.small}px) { 299 padding-top: 0; 300 padding-bottom: 8rem; 301 } 302`,ae=n.AH` 303 @media screen and (max-width: ${h.R}px) { 304 grid-template-columns: 2fr 1fr; 305 column-gap: 2rem; 306 } 307 308 @media screen and (max-width: ${h.fi.medium}px) { 309 grid-template-columns: 1fr; 310 column-gap: 2rem; 311 } 312`,te=n.AH` 313 @media screen and (max-width: ${h.fi.medium}px) { 314 display: flex; 315 flex-direction: column; 316 align-items: center; 317 } 318`,ie=n.AH` 319 font-size: 3rem; 320 line-height: 3.125rem; 321 font-weight: initial !important; 322 letter-spacing: -1px; 323 margin: 1rem 0 2rem !important; 324 325 @media screen and (max-width: ${h.R}px) { 326 font-size: 2.5rem; 327 line-height: 2.85rem; 328 } 329 330 @media screen and (max-width: ${h.fi.medium}px) { 331 text-align: center; 332 margin: 2rem auto !important; 333 max-width: 600px; 334 } 335 336 @media screen and (max-width: ${h.fi.small}px) { 337 font-size: 2.15rem; 338 line-height: 2.65rem; 339 } 340`,re=n.AH` 341 max-width: 100%; 342`,ne=(e,a)=>n.AH` 343 position: relative; 344 border-radius: 0.5rem; 345 overflow: hidden; 346 ${a&&"transition: box-shadow 0.3s ease;"}; 347 348 &:hover { 349 ${a&&`box-shadow: ${e.boxShadow};`}; 350 } 351 352 @media screen and (max-width: ${h.fi.medium}px) { 353 width: 550px; 354 } 355 356 @media screen and (max-width: ${h.fi.small}px) { 357 width: auto; 358 border-radius: 0; 359 } 360`,se=n.AH` 361 width: 100vw; 362 margin-left: -2rem; 363 margin-right: -2rem; 364`,oe=n.AH` 365 aspect-ratio: initial; 366`,le=n.AH` 367 position: absolute; 368 display: flex; 369 align-items: center; 370 gap: 0.75rem; 371 left: 2.5rem; 372 bottom: 2.5rem; 373 padding: 8px 20px; 374 border-radius: 20px; 375 background: ${p.Y.yellow[10]}; 376 transition: background 0.3s ease; 377 z-index: 2; 378 379 &:hover { 380 background: ${p.Y.yellow[5]}; 381 } 382 383 svg { 384 width: 18px; 385 386 path { 387 fill: ${P.T.black}; 388 } 389 } 390 391 @media screen and (max-width: ${h.R}px) { 392 padding: 4px 10px; 393 gap: 0.5rem; 394 left: 1rem; 395 bottom: 1rem; 396 397 &.strong-body-1 { 398 font-size: 0.75rem; 399 } 400 401 svg { 402 width: 14px; 403 } 404 } 405 406 @media screen and (max-width: ${h.fi.small}px) { 407 left: 1.5rem; 408 bottom: 1.5rem; 409 } 410`,de=e=>n.AH` 411 width: auto;
412 margin: 2rem auto calc(2rem + 4rem); 413 display: flex; 414 justify-content: space-around; 415 align-items: center; 416 padding: 1.5rem 2rem; 417 border-radius: 20px; 418 background-color: ${e.light}; 419 420 @media screen and (max-width: ${h.fi.medium}px) { 421 display: grid; 422 grid-template-columns: repeat(3, 1fr); 423 padding: 1.5rem 1rem; 424 } 425 426 @media screen and (max-width: ${h.fi.small}px) { 427 display: flex; 428 width: -webkit-fill-available; 429 flex-direction: column; 430 padding: 1.25rem 2rem; 431 margin: 0 0 2rem; 432 row-gap: 0.65rem; 433 } 434`,me=n.AH` 435 display: flex; 436 column-gap: 2rem; 437 438 @media screen and (max-width: ${h.fi.xlarge}px) { 439 column-gap: 1rem; 440 } 441 442 @media screen and (max-width: ${h.R}px) { 443 flex-direction: column; 444 align-items: center; 445 row-gap: 0.25rem; 446 } 447 448 @media screen and (max-width: ${h.fi.medium}px) { 449 text-wrap: balance; 450 padding: 0 0.5rem; 451 } 452 453 @media screen and (max-width: ${h.fi.small}px) { 454 padding: 0; 455 flex-direction: row; 456 justify-content: space-between; 457 align-items: start; 458 width: 100%; 459 460 .body-2 { 461 text-align: right; 462 } 463 } 464`,ce=e=>n.AH` 465 position: relative; 466 margin-top: -8rem; 467 468 a { 469 display: flex; 470 } 471 472 @media screen and (max-width: ${h.fi.small}px) { 473 margin-top: -6rem; 474 ${e&&"margin-bottom: 4rem"}; 475 } 476`,ge=n.AH` 477 position: relative; 478`,ue=n.AH` 479 position: absolute; 480 inset: 0; 481`,he=e=>n.AH` 482 border-radius: 20px; 483 background-color: ${e.light}; 484 485 // visual-only card label (a non-heading <p>) 486 .card-title { 487 margin: 0; 488 text-align: center; 489 font-size: 1.5rem; 490 line-height: 1.75rem; 491 font-weight: 700; 492 font-family: 493 'Eina 01', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen-Sans, Ubuntu, Cantarell, 494 'Helvetica Neue', sans-serif; 495 padding: 1.5rem 0; 496 border-bottom: 1px solid ${e.dark}; 497 } 498 499 .body-1 { 500 line-height: 2rem; 501 padding: 1.5rem 3rem; 502 } 503 504 @media screen and (max-width: ${h.R}px) { 505 .card-title { 506 padding: 1.25rem 0; 507 } 508 509 .body-1 { 510 padding: 1.25rem 2rem; 511 } 512 } 513`,pe=e=>n.AH` 514 width: auto; 515 background-color: ${e.light}; 516 padding: 1.5rem 2rem; 517 border-radius: 20px; 518 margin: 2rem auto 4rem; 519 520 @media screen and (max-width: ${h.fi.medium}px) { 521 padding: 1.5rem; 522 } 523 524 @media screen and (max-width: ${h.fi.small}px) { 525 padding: 1.5rem 1.5rem 2rem; 526 } 527`,be=n.AH` 528 display: flex; 529 flex-direction: column; 530 align-items: center; 531 row-gap: 0.5rem; 532 align-self: flex-start; 533 534 .body-1 { 535 max-width: 22ch; 536 text-wrap: balance; 537 width: 100%; 538 } 539 540 @media screen and (max-width: ${h.R}px) { 541 row-gap: 0.25rem; 542 } 543`,xe=n.AH` 544 font-size: 2.25rem; 545 line-height: 2.5rem; 546 font-weight: bold; 547 548 @media screen and (max-width: ${h.R}px) { 549 font-size: 1.75rem; 550 } 551`,fe=e=>n.AH` 552 width: 1px; 553 background: ${e.dark}; 554 height: 90%; 555 556 @media screen and (max-width: ${h.fi.small}px) { 557 margin: 1rem 0 0.5rem; 558 height: 1px; 559 width: 90%; 560 } 561`,Ye=n.AH` 562 padding-top: 6rem !important; 563 margin-top: -6rem !important; 564 565 grid-template-columns: 2fr 6fr; 566 align-items: start; 567 568 @media screen and (max-width: ${h.fq}px) { 569 padding-top: 5rem !important; 570 margin-top: -4rem !important; 571 } 572 573 @media screen and (max-width: ${h.fi.medium}px) { 574 row-gap: 1.5rem; 575 } 576`,ye=n.AH` 577 display: flex; 578 justify-content: center; 579 padding: 14px 30px; 580 border: 1px solid ${P.T.black}; 581 border-radius: 40px; 582 transform: translateY(-8px); 583 // keep the body font now that this pill is a semantic <h2> (avoids the global heading-font rule) 584 font-family: inherit; 585 font-weight: 700; 586 587 @media screen and (max-width: ${h.fi.medium}px) { 588 transform: translateY(0); 589 } 590`,Ae=e=>n.AH` 591 @media screen and (min-width: ${h.vS+1}px), screen and (max-width: ${h.fi.small}px) { 592 ${e?"display: none;":""} 593 } 594`}}]); 595//# sourceMappingURL=component---src-page-templates-case-study-tsx-d9c5af202b057afa953d.js.map
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.