.roll-btn{color:#fff;font-family:var(--display,"Space Grotesk", sans-serif);letter-spacing:.06em;text-transform:uppercase;cursor:pointer;isolation:isolate;background:#0a0a0a;border:1.5px solid #0a0a0a;border-radius:999px;align-items:center;gap:18px;padding:7px 7px 7px 28px;font-size:15px;font-weight:600;text-decoration:none;transition:color .4s,border-color .4s,box-shadow .4s,transform .4s;display:inline-flex;position:relative;overflow:hidden;box-shadow:0 10px 24px #0a0a0a2e}.roll-btn:before{content:"";z-index:-1;border-radius:inherit;background:var(--yellow,#e8d24a);transform-origin:0;transition:transform .5s cubic-bezier(.65,0,.35,1);position:absolute;inset:0;transform:scaleX(0)}.roll-btn__label{height:1.3em;line-height:1.3;display:block;overflow:hidden}.roll-btn__roll{transition:transform .45s cubic-bezier(.65,0,.35,1);display:block;position:relative}.roll-btn__roll:after{content:attr(data-text);white-space:nowrap;position:absolute;top:100%;left:0}.roll-btn__arrow{background:var(--yellow,#e8d24a);color:#0a0a0a;border-radius:50%;place-items:center;width:44px;height:44px;transition:background-color .4s,color .4s;display:grid}.roll-btn__arrow svg{fill:none;stroke:currentColor;stroke-width:2.2px;stroke-linecap:round;stroke-linejoin:round;width:18px;height:18px;transition:transform .45s cubic-bezier(.65,0,.35,1);transform:rotate(-45deg)}.roll-btn:hover,.roll-btn:focus-visible{color:#0a0a0a;border-color:var(--yellow,#e8d24a);transform:translateY(-2px);box-shadow:0 14px 30px #e8d24a73}.roll-btn:hover:before,.roll-btn:focus-visible:before{transform:scaleX(1)}.roll-btn:hover .roll-btn__roll,.roll-btn:focus-visible .roll-btn__roll{transform:translateY(-100%)}.roll-btn:hover .roll-btn__arrow,.roll-btn:focus-visible .roll-btn__arrow{color:var(--yellow,#e8d24a);background:#0a0a0a}.roll-btn:hover .roll-btn__arrow svg,.roll-btn:focus-visible .roll-btn__arrow svg{transform:rotate(0)}.roll-btn:focus-visible{outline-offset:3px;outline:2px solid #0a0a0a}.roll-btn:active{transform:translateY(0)scale(.98)}@media (prefers-reduced-motion:reduce){.roll-btn,.roll-btn:before,.roll-btn__roll,.roll-btn__arrow svg{transition:none}}@media (width<=480px){.roll-btn{letter-spacing:.02em;gap:10px;max-width:100%;padding-left:18px;font-size:12px}.roll-btn__arrow{flex-shrink:0;width:40px;height:40px}}
