How to have a different video background on mobile ?

Hi everyone !

Haven't found exactly what I'm looking for yet, so I figured I would ask here.

I made a promotional video for my company that I set as a background on the website's main page. However, I also made a vertical version of the same video to post on Tiktok and Instagram, and I would like to have it as the mobile background. 

This is my website : https://rtfxcreative.com (It's in french)

This is the original video : https://youtu.be/dSLlPzs87MY

And this is the vertical one for mobile : https://youtube.com/shorts/Kd9T37ntvIs

Ideally I would like to have them both directly hosted on the website instead of relying on YouTube links. Is there a way to do that ?

Thanks in advance for your help !

@timrocheleau You have the option to create a section with the vertical video background just below the background video section for desktop view. With custom CSS code, we can ensure that the section with vertical video background is visible only on mobile devices. Once you've created this section, I can provide you with the necessary code.

Additionally, you can download and upload the YouTube video on Squarespace and use it as a background. Thank you.

Thanks for your quick response @Lesum ! I just created the section like you said.

It worked ! Thank you so much for you help !