.btn-gradual-shadow{--btn-bg:#3b82f6;--btn-text:#fff;--btn-shadow-opacity:0.08;--btn-transition-speed:0.30s;--btn-lift:-2px;align-items:center;background-color:var(--btn-bg);border:none;border-radius:.5rem;box-shadow:0 4px 6px -1px rgba(0,0,0,var(--btn-shadow-opacity)),0 2px 4px -1px rgba(0,0,0,calc(var(--btn-shadow-opacity)/2));color:var(--btn-text);cursor:pointer;display:inline-flex;font-size:1rem;font-weight:600;justify-content:center;padding:.75rem 1.5rem;text-decoration:none;transition:background-color var(--btn-transition-speed) cubic-bezier(.4,0,.2,1),box-shadow var(--btn-transition-speed) cubic-bezier(.4,0,.2,1),transform .2s cubic-bezier(.4,0,.2,1)}.btn-gradual-shadow:hover{background-color:color-mix(in srgb,var(--btn-bg) 80%,#000);box-shadow:0 10px 15px -3px rgba(0,0,0,calc(var(--btn-shadow-opacity)*1.3)),0 4px 6px -2px rgba(0,0,0,calc(var(--btn-shadow-opacity)*.8));transform:translateY(var(--btn-lift))}.btn-gradual-shadow:active{background-color:color-mix(in srgb,var(--btn-bg) 70%,#000);box-shadow:0 2px 4px 0 rgba(0,0,0,calc(var(--btn-shadow-opacity)*.7));transform:translateY(0)}