button Adding button effects to all buttons site-wide

Hello

I'm trying to do a few intertwined things, so I figured I'd make one post.

Site: https://dinosaur-celery-y98y.squarespace.com/

Pass: lgbtq

1. I have a scrolling text effect on the Donate buttons on hover. One button is in the primary nav, and one is in the middle of the page. The larger donate button in the middle of the page is perfect. I want to mimic that on the header nav button. So on button hover, the button stays solid pink, the donate text scrolls, and the visible drop shadow disappears.

2. Apply the same drop shadow button effects to all buttons. The prominent Donate or Learn More buttons in the middle of the page with the animated solid black drop shadow is the button effect I'm trying to mimic on all buttons. Specifically, the header nav Donate button and Newsletter form sign up, which currently don't have the drop shadow effect.

3. How do I remove the scrolling text on the Newsletter sign-up button? I only want the drop shadow on that button. The donate buttons are the only buttons that should have scrolling text.

4. How do I change the newsletter button to pink, not the black that it currently is?

#1. So your problem now is add black shadow to other buttons, and make it disappear on hover?

#2. To remove scroll text on Newsletter button, you can use this code to Website > Website Tools > Custom CSS

span.newsletter-form-button-label>div {
    display: none !important;
}

span.marquee-button-label {
    opacity: 1 !important;
}

#3. Change to pink: color or background color? and which color on hover?