.HeroPhoneComponent{--theme-settings-button-variant-primary-background-color: #47a4d8;--theme-settings-button-text-transform: capitalize;transform:perspective(2000px) rotate(-28deg) rotateY(23deg) rotateX(18deg) translate3d(-58px,44px,154px);transform-style:preserve-3d;filter:drop-shadow(-28px 38px 40px hsla(0,0%,0%,.25));height:600px;text-align:center}.HeroPhoneComponent .phoneImage{height:100%}.HeroPhoneComponent .phoneContent{position:absolute;top:0;left:0;right:0;width:100%;height:100%;display:flex;flex-direction:column;padding-top:100px!important;align-items:center}.HeroPhoneComponent .brandLogo{max-height:50px;object-fit:contain;object-position:center}.HeroPhoneComponent .logoStack,.HeroPhoneComponent .faceplateStack{display:grid}.HeroPhoneComponent .logoStack .stackItem,.HeroPhoneComponent .faceplateStack .stackItem{grid-area:1/1;opacity:0;transition:opacity .5s ease}.HeroPhoneComponent .logoStack .stackItem.active,.HeroPhoneComponent .faceplateStack .stackItem.active{opacity:1}.HeroPhoneComponent .phoneHeader{font-size:11px!important;margin-bottom:1.25rem}.HeroPhoneComponent h2{font-size:28px!important}.HeroPhoneComponent h3{font-size:11px!important}.HeroPhoneComponent p{font-size:8px!important}.HeroPhoneComponent .eg-button{font-size:11px!important;cursor:auto!important;transition:background-color .5s ease!important}@media (max-width: 991.98px){.HeroPhoneComponent{height:400px}.HeroPhoneComponent .phoneContent{padding-top:70px!important}.HeroPhoneComponent .brandLogo{width:66px;margin-bottom:.7rem!important}.HeroPhoneComponent .phoneHeader{font-size:8px;margin-bottom:.7rem!important}.HeroPhoneComponent h2{font-size:18px}.HeroPhoneComponent .eg-button,.HeroPhoneComponent h3{font-size:8px}.HeroPhoneComponent p{font-size:6px}}.HeroCardStackComponent{height:400px;perspective:800px}.HeroCardStackComponent.hasFaceplates .cardStackImage{visibility:hidden}.HeroCardStackComponent .faceplate{top:0;left:0;width:243px;border-bottom:2px solid #fff;border-radius:10px;background-color:#fff;filter:drop-shadow(0 10px 14px hsla(0,0%,0%,.28))}.HeroCardStackComponent .faceplate-1{width:255px;transform:translate(28.5%,10.8%) rotate(14.7deg) scale(1.01);z-index:3}.HeroCardStackComponent .faceplate-2{transform:translate(40.8%,79.3%) rotate(3.9deg) rotateX(56.4deg) rotateY(-12deg) scale(1.08);z-index:2;transform-origin:right center}.HeroCardStackComponent .faceplate-3{transform:translate(21.1%,136%) rotate(-5.5deg) rotateX(62.9deg) rotateY(14deg) scale(1.16);transform-origin:bottom;z-index:1}.HeroComboImageComponent{width:fit-content}.HeroComboImageComponent .HeroCardStackComponent{left:0;top:50%;transform:translate(-76%,-50%)}.HeroComboImageComponent .HeroPhoneComponent{transform:none}.HeroBannerComponent{background-color:hsla(var(--theme-color-primary-h),var(--theme-color-primary-s),var(--theme-color-primary-l),.32)}.HeroBannerComponent .heroSection{overflow:hidden}.HeroBannerComponent .heroSection .textContainer{padding:4rem 3rem}@media (max-width: 991.98px){.HeroBannerComponent .heroSection .textContainer{padding:2rem 1.5rem 200px}}.HeroBannerComponent .heroSection .textContainer h2{font-size:1.5rem!important}.HeroBannerComponent .heroSection .heroImage{position:absolute;top:50px;right:0}@media (min-width: 992px){.HeroBannerComponent .heroSection .heroImage.heroImageCardsOnly .HeroCardStackComponent{transform:scale(1.35);transform-origin:right top}}@media (max-width: 991.98px){.HeroBannerComponent .heroSection .heroImage{top:auto;right:auto;left:60%;bottom:-200px;transform:translate(-50%)}}.HeroBannerComponent .heroCtas .heroCtaLabel{font-size:.75rem}