.animated-button{background-color:inherit;color:var(--color-gray-900);box-shadow:0 0 0 2px var(--color-gray-900);cursor:pointer;border:.25rem solid transparent;border-radius:6.25rem;align-items:center;gap:1rem;padding:.4rem 1.4rem;font-size:1rem;font-weight:600;transition:all .6s cubic-bezier(.23,1,.32,1);display:flex;position:relative;overflow:hidden}.animated-button svg{width:1.5rem;fill:var(--color-gray-900);z-index:9;transition:all .8s cubic-bezier(.23,1,.32,1);position:absolute}.animated-button .arr-1{right:.2rem}.animated-button .arr-2{left:-25%}.animated-button .circle{background-color:var(--color-gray-900);opacity:0;border-radius:50%;width:1.25rem;height:1.25rem;transition:all .8s cubic-bezier(.23,1,.32,1);position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.animated-button .text{z-index:1;font-size:.9rem;transition:all .8s cubic-bezier(.23,1,.32,1);position:relative;transform:translate(-12px)}.animated-button:hover{color:#212121;border-radius:12px;box-shadow:0 0 0 12px transparent}.animated-button:hover .arr-1{right:-25%}.animated-button:hover .arr-2{left:.3rem}.animated-button:hover .text{color:#fff;font-size:1rem;transform:translate(12px)}.animated-button:hover svg{fill:#fff}.animated-button:active{box-shadow:0 0 0 4px var(--color-gray-900);scale:.95}.animated-button:hover .circle{opacity:1;width:220px;height:220px}
.animated-btn-2{--color:var(--color-gray-900);cursor:pointer;border:2px solid var(--color-gray-900);z-index:1;width:8em;height:2.7em;color:var(--color-gray-900);border-radius:6px;font-family:inherit;font-size:1rem;font-weight:500;line-height:2.5em;transition:color .5s;display:inline-block;position:relative;overflow:hidden}.animated-btn-2:before{content:"";z-index:-1;background:var(--color-gray-900);border-radius:50%;width:200px;height:150px;position:absolute}.animated-btn-2:hover{color:#fff}.animated-btn-2:before{transition:all .7s;top:100%;left:100%}.animated-btn-2:hover:before{top:-30px;left:-30px}.animated-btn-2:active:before{background:var(--color-gray-900);transition:background}
.card-1{border-radius:24px;justify-content:center;align-items:center;width:320px;line-height:1.6;transition:all .48s cubic-bezier(.23,1,.32,1);display:flex;position:relative}.card-1-content{color:#fff;background:var(--color-gray-900);border-radius:1.375rem;flex-direction:column;align-items:flex-start;gap:1.5rem;padding:2.25rem;transition:all .48s cubic-bezier(.23,1,.32,1);display:flex;overflow:hidden}.alt-colors{color:var(--color-gray-900);background:var(--color-gray-200)}.card-1-content:before{content:"";z-index:-1;transform-origin:bottom;border-radius:inherit;background:#ced8ff;width:90%;height:90%;transition:all .48s cubic-bezier(.23,1,.32,1);position:absolute;top:-4%;left:50%;transform:translate(-50%)}.card-1-content:after{content:"";z-index:-2;transform-origin:bottom;border-radius:inherit;background:#e7ecff;width:80%;height:80%;transition:all .48s cubic-bezier(.23,1,.32,1);position:absolute;top:-8%;left:50%;transform:translate(-50%)}.card-1-content svg{width:48px;height:48px}.card-1-content .para{z-index:1;opacity:1;font-size:18px;transition:all .48s cubic-bezier(.23,1,.32,1)}.card-1-content .para-alt{z-index:1;opacity:1;transition:all .48s cubic-bezier(.23,1,.32,1)}.card-1-content .link{z-index:1;color:#fea000;font-family:inherit;font-size:16px;text-decoration:none;transition:all .48s cubic-bezier(.23,1,.32,1)}.card-1-content .link:hover{text-decoration:underline}.card-1:hover{transform:translateY(-16px)}.card-1:hover .card-1-content:before{width:100%;height:100%;top:0;rotate:-8deg}.card-1:hover .card-1-content:after{width:100%;height:100%;top:0;rotate:8deg}
.animated-button-4{background-color:inherit;color:#fff;cursor:pointer;border:.25rem solid transparent;border-radius:6.25rem;align-items:center;gap:1rem;width:10rem;padding:.4rem 1.4rem;font-size:1rem;font-weight:600;transition:all .6s cubic-bezier(.23,1,.32,1);display:flex;position:relative;overflow:hidden;box-shadow:0 0 0 2px #fff}.animated-button-4 svg{fill:#fff;z-index:9;width:1.5rem;transition:all .8s cubic-bezier(.23,1,.32,1);position:absolute}.animated-button-4 .arr-1{right:.2rem}.animated-button-4 .arr-2{left:-25%}.animated-button-4 .circle{opacity:0;background-color:#fff;border-radius:50%;width:1.25rem;height:1.25rem;transition:all .8s cubic-bezier(.23,1,.32,1);position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.animated-button-4 .text{z-index:1;font-size:.9rem;transition:all .8s cubic-bezier(.23,1,.32,1);position:relative;transform:translate(-12px)}.animated-button-4:hover{color:#212121;border-radius:12px;box-shadow:0 0 0 12px transparent}.animated-button-4:hover .arr-1{right:-25%}.animated-button-4:hover .arr-2{left:.3rem}.animated-button-4:hover .text{color:var(--color-gray-900);font-size:1rem;transform:translate(12px)}.animated-button-4:hover svg{fill:var(--color-gray-900)}.animated-button-4:active{scale:.95;box-shadow:0 0 0 4px #fff}.animated-button-4:hover .circle{opacity:1;width:220px;height:220px}