.btn{cursor:pointer;border:none;border-radius:8px;outline:none;justify-content:center;align-items:center;font-family:inherit;font-weight:500;transition:all .2s;display:inline-flex}.btn:focus-visible{outline:2px solid var(--primary);outline-offset:2px}.btn:disabled{opacity:.5;cursor:not-allowed}.btn--primary{background-color:var(--primary);color:var(--background);position:relative;overflow:hidden}.btn--primary:before{content:"";background:#ffffff4d;border-radius:50%;width:0;height:0;transition:width .6s,height .6s;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.btn--primary:hover:not(:disabled){opacity:.9;transform:translateY(-2px);box-shadow:0 4px 12px #886cad66}.btn--primary:hover:not(:disabled):before{width:300px;height:300px}.btn--primary:active:not(:disabled){transform:translateY(0)}.btn--secondary{color:var(--primary);border:2px solid var(--primary);background-color:#0000;position:relative;overflow:hidden}.btn--secondary:before{content:"";background-color:var(--primary);z-index:-1;width:100%;height:100%;transition:left .3s;position:absolute;top:0;left:-100%}.btn--secondary:hover:not(:disabled){background-color:var(--primary);color:var(--background);transform:translateY(-2px);box-shadow:0 4px 12px #886cad4d}.btn--secondary:hover:not(:disabled):before{left:0}.btn--ghost{color:var(--foreground);background-color:#0000}.btn--ghost:hover:not(:disabled){background-color:#886cad1a}.btn--small{padding:6px 12px;font-size:14px}.btn--medium{padding:10px 20px;font-size:16px}@media (max-width:320px){.btn--medium{padding:8px 12px;font-size:14px}}.btn--large{padding:14px 28px;font-size:18px}