/*
New Version of style.css
*/

/* GRADIENT BUTTON */
.smooth-gradient-btn .elementor-button{position: relative; overflow: hidden; display: inline-flex; align-items: center; justify-content: center; isolation: isolate; z-index: 1;}
.smooth-gradient-btn .elementor-button::before{content: ""; position: absolute; inset: 0; border-radius: inherit; background: linear-gradient(90deg, var(--e-global-color-primary) -31.91%, var(--e-global-color-secondary) 100%);opacity: 0; transition: opacity .5s ease; z-index: -1; pointer-events: none;}
.smooth-gradient-btn .elementor-button:hover::before{opacity: 1;}
/* Box Hover */
.products-cards .products-box{position: relative; overflow: hidden; border-radius: 28px; background: #fff;}
.products-cards .products-box::before{content: ""; position: absolute; inset: 0; border-radius: inherit; padding: 2px; background: linear-gradient(90deg, #2C8C8A 0%, #2C8C8A 100%); opacity: 0;
    -webkit-mask:linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0); -webkit-mask-composite: xor; mask-composite: exclude; pointer-events: none;}
.products-cards .products-box:hover::before{opacity: 1; animation: borderDraw 1s ease forwards;}
@keyframes borderDraw{0%{clip-path: inset(0 100% 100% 0);}25%{clip-path: inset(0 0 100% 0);}50%{clip-path: inset(0 0 0 100%);}75%{clip-path: inset(100% 0 0 0);}100%{clip-path: inset(0 0 0 0);}}