.btn{--notch:12px;clip-path:polygon(var(--notch) 0, 100% 0, 100% calc(100% - var(--notch)), calc(100% - var(--notch)) 100%, 0 100%, 0 var(--notch));text-transform:uppercase;justify-content:center;align-items:center;gap:.5rem;font-weight:500;transition:color .15s,background-color .15s,border-color .15s;display:inline-flex}.btn:focus-visible{outline:2px solid var(--color-accent);outline-offset:2px}.btn:disabled{pointer-events:none}.btn span{transition-property:transform,opacity;transition-timing-function:var(--ease-dynamic);transition-duration:.3s}.btn span:last-child{opacity:0;transform:translateY(1.5rem)}.btn:hover{background-color:var(--color-deep-blue)}.btn:hover span:first-child{opacity:0;transform:translateY(-1.5rem)}.btn:hover span:last-child{opacity:1;transform:translate(0,0)}.btn--primary{background-color:var(--color-accent);color:var(--color-accent-foreground)}.btn--secondary{background-color:var(--color-surface-2);color:var(--color-foreground)}.btn--secondary:hover{opacity:.9}.btn--outline{--notch:18px;border:3px solid var(--color-foreground);color:var(--color-foreground);background-color:var(--color-surface)}.btn--outline:hover{background-color:var(--color-foreground);color:var(--color-surface)}.btn--ghost{color:var(--color-foreground)}.btn--ghost:hover{background-color:var(--color-surface-2)}.btn--accent2{background-color:var(--color-accent-2);color:var(--color-accent-2-foreground)}.btn--accent2:hover{opacity:.9}.btn--sm{font-size:var(--text-sm);padding:.625rem 1.25rem}.btn--md{font-size:var(--text-md);padding:.75rem 2rem}.btn--lg{font-size:var(--text-lg);padding:1rem 2rem}