/* ========== Components ========== */

/* Component: button */
.button-block{--border-radius: 9999px;--transition: 0.3s ease-in-out;--active: 0;--btn-before-background-color: hsl(214.63deg 95.26% 58.63%);--btn-after-background-color: rgba(59, 121, 252, .75);--btn-after-background-image: radial-gradient(at 51% 89%, hsl(189.23, 45%, 74%) 0px, transparent 50%), radial-gradient(at 100% 100%, hsl(204, 36%, 60%) 0px, transparent 50%), radial-gradient(at 22% 91%, hsl(207.69, 36%, 60%) 0px, transparent 50%);display:inline-block}.button-block.noshadow .button-block__btn::before{box-shadow:none !important}.button-block .button-block__btn{cursor:pointer;position:relative;display:flex;align-items:center;gap:.5rem;transform-origin:center;padding:1rem 2rem;background-color:rgba(0,0,0,0);border:none;border-radius:var(--border-radius);transform:scale(calc(1 + var(--active, 0) * 0.1));transition:transform var(--transition);text-decoration:none}.button-block .button-block__btn:is(:hover,:focus-visible){--active: 1}.button-block .button-block__btn:is(:hover,:focus) .sparkle .path{animation:path 1.5s linear .5s infinite}@keyframes path{0%,34%,71%,100%{transform:scale(1)}17%{transform:scale(var(--scale_path_1, 1))}49%{transform:scale(var(--scale_path_2, 1))}83%{transform:scale(var(--scale_path_3, 1))}}.button-block .button-block__btn:active{transform:scale(1)}.button-block .button-block__btn:hover{text-decoration:none}.button-block .button-block__btn::before{content:"";position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);width:100%;height:100%;background-color:var(--btn-before-background-color);border-radius:var(--border-radius);box-shadow:inset 0 .5px #fff,inset 0 -1px 2px 0 rgba(255,255,255,.17),0px 4px 10px -4px hsla(0 0% 0%/calc(1 - var(--active, 0))),0 0 0 calc(var(--active, 0)*.375rem) rgba(4,150,251,.29);transition:all var(--transition);z-index:0}.button-block .button-block__btn::after{content:"";position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);width:100%;height:100%;background-color:var(--btn-after-background-color);background-image:var(--btn-after-background-image);background-position:top;opacity:var(--active, 0);border-radius:var(--border-radius);transition:opacity var(--transition);z-index:2}.button-block .button-block__btn .dots_border{--size_border: calc(100% + 2px);overflow:hidden;position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);width:var(--size_border);height:var(--size_border);background-color:rgba(0,0,0,0);border-radius:var(--border-radius);z-index:-10}.button-block .button-block__btn .dots_border::before{content:"";position:absolute;top:30%;left:50%;transform:translate(-50%, -50%);transform-origin:left;transform:rotate(0deg);width:100%;height:2rem;background-color:#fff;mask:linear-gradient(transparent 0%, white 120%);animation:rotate 2s linear infinite}@keyframes rotate{to{transform:rotate(360deg)}}.button-block .button-block__btn .sparkle{position:relative;z-index:10;width:1.75rem}.button-block .button-block__btn .sparkle .path{fill:currentColor;stroke:currentColor;transform-origin:center;color:#fff}.button-block .button-block__btn .sparkle .path:nth-child(1){--scale_path_1: 1.2 }.button-block .button-block__btn .sparkle .path:nth-child(2){--scale_path_2: 1.2 }.button-block .button-block__btn .sparkle .path:nth-child(3){--scale_path_3: 1.2 }.button-block .button-block__btn .text_button{position:relative;z-index:10;background-image:linear-gradient(90deg, hsl(0, 0%, 100%) 0%, hsla(0, 0%, 100%, 0.5) 120%);background-clip:text;font-size:1rem;color:rgba(0,0,0,0)}.button-block .button-block__btn--secondary{--btn-before-background-color: hsl(0deg 0% 100% / 13%);--btn-after-background-color: rgb(255 255 255 / 15%);--btn-after-background-image: radial-gradient(at 51% 89%, hsl(0deg 0% 100% / 0%) 0px, transparent 50%), radial-gradient(at 100% 100%, hsl(0deg 0% 100% / 0%) 0px, transparent 50%), radial-gradient(at 22% 91%, hsl(207, 100%, 94%) 0px, transparent 50%)}.button-block .button-block__btn--secondary::before{box-shadow:inset 0 .5px #fff,inset 0 -1px 2px 0 rgba(255,255,255,.17),0px 4px 10px -4px hsla(0 0% 0%/calc(1 - var(--active, 0))),0 0 0 calc(var(--active, 0)*.375rem) rgba(255,255,255,.29)}.button-block .button-block__btn--secondary .dots_border::before{display:none}.button-block .button-block__btn--outline{--btn-before-background-color: transparent;--btn-after-background-color: rgba(0, 153, 255, 0.1);--btn-after-background-image: radial-gradient(at 51% 89%, rgba(0, 153, 255, 0.5) 0px, transparent 50%);border:1px solid;transform:unset !important;background-color:#fff}.button-block .button-block__btn--outline::before,.button-block .button-block__btn--outline::after{display:none}.button-block .button-block__btn--outline .text_button{color:#09f;background-image:none;background-clip:unset}.button-block .button-block__btn--outline .dots_border::before{display:none}.button-block .button-block__btn--ghost{--btn-before-background-color: rgba(255, 255, 255, 0.1);--btn-after-background-color: rgba(255, 255, 255, 0.15);--btn-after-background-image: radial-gradient(at 51% 89%, rgba(255, 255, 255, 0.3) 0px, transparent 50%);backdrop-filter:blur(10px)}.button-block .button-block__btn--ghost::before{box-shadow:inset 0 0 0 2px rgba(255,255,255,.3),0px 4px 10px -4px hsla(0 0% 0%/calc(1 - var(--active, 0)))}.button-block .button-block__btn--ghost .dots_border::before{display:none}.button-block .button-block__btn--success{--btn-before-background-color: hsl(158deg 64% 52%);--btn-after-background-color: rgba(16, 185, 129, 0.75);--btn-after-background-image: radial-gradient(at 51% 89%, hsl(158deg 45% 74%) 0px, transparent 50%), radial-gradient(at 100% 100%, hsl(158deg 36% 60%) 0px, transparent 50%), radial-gradient(at 22% 91%, hsl(158deg 36% 60%) 0px, transparent 50%)}.button-block .button-block__btn--success::before{box-shadow:inset 0 .5px #fff,inset 0 -1px 2px 0 rgba(255,255,255,.17),0px 4px 10px -4px hsla(0 0% 0%/calc(1 - var(--active, 0))),0 0 0 calc(var(--active, 0)*.375rem) rgba(16,185,129,.29)}.button-block .button-block__btn--danger{--btn-before-background-color: hsl(0deg 84% 60%);--btn-after-background-color: rgba(239, 68, 68, 0.75);--btn-after-background-image: radial-gradient(at 51% 89%, hsl(0deg 45% 74%) 0px, transparent 50%), radial-gradient(at 100% 100%, hsl(0deg 36% 60%) 0px, transparent 50%), radial-gradient(at 22% 91%, hsl(0deg 36% 60%) 0px, transparent 50%)}.button-block .button-block__btn--danger::before{box-shadow:inset 0 .5px #fff,inset 0 -1px 2px 0 rgba(255,255,255,.17),0px 4px 10px -4px hsla(0 0% 0%/calc(1 - var(--active, 0))),0 0 0 calc(var(--active, 0)*.375rem) rgba(239,68,68,.29)}.button-block .button-block__btn--warning{--btn-before-background-color: hsl(38deg 92% 50%);--btn-after-background-color: rgba(245, 158, 11, 0.75);--btn-after-background-image: radial-gradient(at 51% 89%, hsl(38deg 45% 74%) 0px, transparent 50%), radial-gradient(at 100% 100%, hsl(38deg 36% 60%) 0px, transparent 50%), radial-gradient(at 22% 91%, hsl(38deg 36% 60%) 0px, transparent 50%)}.button-block .button-block__btn--warning::before{box-shadow:inset 0 .5px #fff,inset 0 -1px 2px 0 rgba(255,255,255,.17),0px 4px 10px -4px hsla(0 0% 0%/calc(1 - var(--active, 0))),0 0 0 calc(var(--active, 0)*.375rem) rgba(245,158,11,.29)}.button-block .button-block__btn--light{--btn-before-background-color: #ffffff;--btn-after-background-color: rgba(247, 250, 252, 1);--btn-after-background-image: radial-gradient(at 51% 89%, rgba(255, 255, 255, 0.8) 0px, transparent 50%)}.button-block .button-block__btn--light::before{box-shadow:inset 0 .5px #fff,inset 0 -1px 2px 0 rgba(255,255,255,.17),0px 4px 10px -4px hsla(0 0% 0%/calc(1 - var(--active, 0)))}.button-block .button-block__btn--light .text_button{color:#2d3748;background-image:none;background-clip:unset}.button-block .button-block__btn--light .dots_border::before{background-color:#2d3748}.button-block .button-block__btn--dark{--btn-before-background-color: #2d3748;--btn-after-background-color: rgba(26, 32, 44, 1);--btn-after-background-image: radial-gradient(at 51% 89%, rgba(26, 32, 44, 0.8) 0px, transparent 50%)}.button-block .button-block__btn--dark::before{box-shadow:inset 0 .5px rgba(255,255,255,.1),inset 0 -1px 2px 0 rgba(0,0,0,.3),0px 4px 10px -4px hsla(0 0% 0%/calc(1 - var(--active, 0))),0 0 0 calc(var(--active, 0)*.375rem) rgba(45,55,72,.29)}.button-block .button-block__btn--minimum{padding:.5rem .875rem;line-height:1}.button-block .button-block__btn--minimum .text_button{font-size:.75rem}.button-block .button-block__btn--small{padding:.75rem 1.5rem}.button-block .button-block__btn--small .text_button{font-size:.875rem}.button-block .button-block__btn--medium{padding:1rem 2rem}.button-block .button-block__btn--medium .text_button{font-size:1rem}.button-block .button-block__btn--large{padding:1.25rem 2.5rem}.button-block .button-block__btn--large .text_button{font-size:1.125rem}@media(max-width: 768px){.button-block .button-block__btn{width:100%;max-width:100%;padding:.75rem 1.5rem}.button-block .button-block__btn .text_button{font-size:1rem}}