Marquee Text Stroke

Hello!

I've placed scrolling text on my site, which I've edited with custom CSS.

I have the base text looking how I want it, but when I hover I want the text to change color, stroke, and shadow color. I can accomplish everything but the stroke. 

My first attempt used the following, which changed the color and shadow, but made no effect on the stroke. (See m1.png attached)

.Marquee:hover * {
  text-shadow: 3px 3px #e7756b;
  color: #FFFFFF !important;
  -webkit-text-stroke-width: 3px !important;
  -webkit-text-stroke-color: black !important;

}

Next I tried using stroke-width, as opposed to the webkit stroke, but that caused everything within the marquee element to have a stroke, including the hitbox. (See m2.png)

.Marquee:hover * {
  text-shadow: 5px 5px #e7756b;
  color: #FFFFFF !important;
    stroke-width: 3;
  stroke: #000000;

}

I've now come upon a solution that applies the stroke to just the text, but now the drop shadow has a stroke too, which appears on top of the text. (See m3.png)

.Marquee:hover * {
  text-shadow: 5px 5px #e7756b;
  color: #FFFFFF !important;
}

.Marquee:hover h1 {
   stroke-width: 3;
  stroke: #000000;
}

Any thoughts on a solution? I feel like I'm getting close, but I could be wrong.

I'm grateful for any help! I can share the web address and password if needed.

Just bumping this once, to hopefully get a reply!

Can you share link to page where you use marquee text? We can check easier

Can do.
The website is https://www.samkennedycs.com

It's password protected with the password: SKCS.

The site is still under much construction, but the marquee is near the bottom of the home page.

Thanks!

You can try this code

.Marquee:hover textPath * {
  text-shadow: 3px 3px #e7756b;
  color: #FFFFFF !important;
  -webkit-text-stroke-width: 3px !important;
  -webkit-text-stroke-color: black !important;

}