.feature-showcase{overflow:hidden}.feature-showcase__description{margin-bottom:3rem;text-align:center;max-width:60rem;margin-left:auto;margin-right:auto}.feature-showcase__container{display:grid;grid-template-columns:1fr;gap:4rem;align-items:center}@media screen and (min-width: 990px){.feature-showcase__container{grid-template-columns:1fr 1fr;gap:6rem}}.feature-showcase__features{display:flex;flex-direction:column;gap:1rem}.feature-showcase__feature-button{width:100%;background:transparent;border:2px solid rgba(var(--color-foreground),.1);border-radius:1.5rem;padding:2rem;text-align:left;cursor:pointer;transition:all .3s ease;display:flex;align-items:center;gap:1.5rem;position:relative;overflow:hidden}.feature-showcase__feature-button:hover{border-color:rgba(var(--color-foreground),.2);transform:translateY(-2px);box-shadow:0 8px 25px rgba(var(--color-foreground),.1)}.feature-showcase__feature-button.active{border-color:rgb(var(--color-button));background:rgba(var(--color-button),.05);transform:translateY(-2px);box-shadow:0 8px 25px rgba(var(--color-button),.15)}.feature-showcase__feature-button.active:before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:rgb(var(--color-button));border-radius:0 2px 2px 0}.feature-showcase__feature-icon{flex-shrink:0;width:4rem;height:4rem;display:flex;align-items:center;justify-content:center;border-radius:1rem;background:rgba(var(--color-button),.1);color:rgb(var(--color-button));transition:all .3s ease}.feature-showcase__feature-button.active .feature-showcase__feature-icon{background:rgb(var(--color-button));color:rgb(var(--color-button-text));transform:scale(1.1)}.feature-showcase__feature-content{flex:1}.feature-showcase__feature-title{margin:0 0 .5rem;font-size:1.8rem;font-weight:600;line-height:1.2;transition:color .3s ease}.feature-showcase__feature-button.active .feature-showcase__feature-title{color:rgb(var(--color-button))}.feature-showcase__feature-description{margin:0;color:rgba(var(--color-foreground),.7);line-height:1.4;transition:color .3s ease}.feature-showcase__feature-button.active .feature-showcase__feature-description{color:rgba(var(--color-foreground),.9)}.feature-showcase__feature-arrow{flex-shrink:0;width:2rem;height:2rem;display:flex;align-items:center;justify-content:center;color:rgba(var(--color-foreground),.4);transform:rotate(-90deg);transition:all .3s ease}.feature-showcase__feature-button.active .feature-showcase__feature-arrow{color:rgb(var(--color-button));transform:rotate(-90deg) scale(1.2)}.feature-showcase__media-container{display:flex;justify-content:center;align-items:center;min-height:55rem}.feature-showcase__phone-frame{position:relative;max-width:36rem;width:100%;aspect-ratio:9 / 19.5;background:linear-gradient(145deg,#1a1a1a,#2d2d2d);border-radius:3.5rem;padding:1rem;box-shadow:0 0 0 2px #ffffff1a,0 20px 40px #0000004d,inset 0 2px 4px #ffffff1a;overflow:hidden}.feature-showcase__phone-frame:before{content:"";position:absolute;top:1.2rem;left:50%;transform:translate(-50%);width:10rem;height:.8rem;background:#333;border-radius:1rem}.feature-showcase__phone-frame:after{content:"";position:absolute;bottom:1.2rem;left:50%;transform:translate(-50%);width:14rem;height:.5rem;background:#333;border-radius:1rem}.feature-showcase__media-wrapper{position:relative;width:100%;height:100%;border-radius:2.5rem;overflow:hidden;background:#000}.feature-showcase__media{position:absolute;top:0;left:0;width:100%;height:100%;opacity:0;display:flex;align-items:center;justify-content:center;background:#000;z-index:1}.feature-showcase__media.active{opacity:1;z-index:2}.feature-showcase__video{width:100%;height:100%;position:relative}.feature-showcase__video .deferred-media__poster{position:absolute;top:0;left:0;width:100%;height:100%;border:none;background:transparent;cursor:pointer;z-index:1}.feature-showcase__video .deferred-media__poster img{width:100%;height:100%;object-fit:cover}.feature-showcase__video .deferred-media__poster-button{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:6rem;height:6rem;background:#ffffffe6;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#000;transition:all .3s ease;z-index:2}.feature-showcase__video .deferred-media__poster-button:hover{background:#fff;transform:translate(-50%,-50%) scale(1.1)}.feature-showcase__video video,.feature-showcase__video iframe{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover;border:none;z-index:1}.feature-showcase__video .deferred-media[loaded] .deferred-media__poster{display:none}.feature-showcase__video-placeholder{position:absolute;top:0;left:0;width:100%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1rem;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;text-align:center;padding:2rem}.feature-showcase__video-placeholder .svg-wrapper{width:4rem;height:4rem;opacity:.8}.feature-showcase__video-placeholder p{margin:0;font-size:1.4rem;font-weight:500;opacity:.9}.feature-showcase__image{width:100%;height:100%;display:flex;align-items:center;justify-content:center}.feature-showcase__image img{width:100%;height:100%;object-fit:contain}.feature-showcase__placeholder{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1rem;color:#fff9;text-align:center;padding:2rem}.feature-showcase__placeholder .svg-wrapper{width:4rem;height:4rem}@media screen and (max-width: 989px){.feature-showcase__container{grid-template-columns:1fr;gap:3rem}.feature-showcase__phone-frame{max-width:32rem}.feature-showcase__feature-button{padding:1.5rem;gap:1rem}.feature-showcase__feature-icon{width:3rem;height:3rem}.feature-showcase__feature-title{font-size:1.6rem}}@media screen and (max-width: 749px){.feature-showcase__phone-frame{max-width:28rem;min-height:45rem}.feature-showcase__media-container{min-height:45rem}}@keyframes slideInRight{0%{opacity:0;transform:translate(100%)}to{opacity:1;transform:translate(0)}}@keyframes slideOutLeft{0%{opacity:1;transform:translate(0)}to{opacity:0;transform:translate(-100%)}}.feature-showcase__video .deferred-media.loading:after{content:"";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:4rem;height:4rem;border:3px solid rgba(255,255,255,.3);border-top:3px solid rgba(255,255,255,.9);border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{0%{transform:translate(-50%,-50%) rotate(0)}to{transform:translate(-50%,-50%) rotate(360deg)}}
/*# sourceMappingURL=/cdn/shop/t/30/assets/section-feature-showcase.css.map */