.tabs{display:flex;justify-self:center;align-items:center;gap:30px;flex-wrap:wrap}.tab-item{border:1px solid rgb(30 30 30 / 20%);background-size:cover;background-position:center top;background-repeat:no-repeat;overflow:hidden;padding:0 50px;width:180px;height:550px;position:relative;display:flex;justify-content:center;align-items:center;border-radius:24px;counter-increment:tabCounter;cursor:pointer}.tab-item:not(.active):hover{background:rgb(30 30 30 / 10%)!important;transition:.4s ease-in-out}.image-wrapper{position:absolute;z-index:-1;opacity:1;height:100%;width:100%;left:0;display:none}.image-wrapper img{height:100%;width:100%;object-fit:cover}.tab-item__header{display:flex;flex-direction:column;gap:54px;height:100%;justify-content:end;transform:translateY(-40px)}.tab-item__header-counter{width:70px;min-height:70px;border-radius:99px;border:1px solid var(--e-global-color-accent);position:relative;display:flex;justify-content:center;align-items:center;padding:10px}.tab-item__header-counter:before{content:counter(tabCounter,decimal-leading-zero);font-size:40px;color:var(--e-global-color-accent);font-family:"Scarlet Jazz",Sans-serif}.tabs .tab-item__header-title{transform-origin:center center;transform:rotate(-90deg);white-space:nowrap;position:absolute;left:0;right:0;bottom:115px;font-size:24px;letter-spacing:.1em;line-height:24px}.tab-item__body{display:none;flex-direction:column;height:100%}.tab-item__body *{margin:0}.tab-item__body .tab-title{margin:24px 0 40px;font-size:24px;line-height:1.3em}.tab-text{line-height:1.4em}.tab-item.active .tab-item__header{display:none}.tab-item.active{width:350px;padding:45px 32px;height:550px;transition:width 0.3s ease-in-out,padding 0.3s ease-in-out,height 0.3s ease-in-out,background-color 0.3s ease-in-out,color 0.3s ease-in-out}.tab-item{transition:width 0.3s ease-in-out,padding 0.3s ease-in-out,height 0.3s ease-in-out,background-color 0.3s ease-in-out,color 0.3s ease-in-out}.tab-item.active .tab-item__body{display:flex}.tab-item{padding:10px}.tab-item.active .image-wrapper{display:block}.tab-item:not(.active){background-image:none!important}@media screen and (max-width:768px){.tabs{height:auto}.tab-item{padding:32px 21px;justify-content:flex-start}.tab-item__header{gap:16px;align-items:center}.tab-item,.tab-item.active{width:100%;height:auto;min-width:unset}.tab-item.active{padding:32px 48px}.tabs .tab-item__header-title{position:static;transform:none;white-space:normal}.tab-item__header{flex-direction:row-reverse;transform:unset}.tab-item__body .tab-title{margin:32px 0 40px;font-size:20px}}