PartTwoDesign

Put this in the Custom CSS section of your website and see if it does the trick...
.video-player .plyr video { object-fit: cover !important; border-radius: 10px !important; }  

@PartTwoDesign It looks like you may have been trying to divide the sections using, -----------------------, but the appears to be breaking the CSS. If you want to divide the section of CSS, use a CSS comment insead by adding an opening /* and closing */ like so: /* ---------------------- */

Here's a video deleting the divider using Chrome dev tools and that fixes the issue:

Z0JBfc7ADh.mp4    

@PartTwoDesign You can use the following CSS that adds height of 100% to some of the containers and then overrides the object-fit property from contain to cover
#block-yui_3_17_2_1_1705927316935_8707.video-block > .sqs-block-content, #block-yui_3_17_2_1_1705927316935_8707.video-block .intrinsic, #block-yui_3_17_2_1_1705927316935_8707.video-block .embed-block-wrapper, #block-yui_3_17_2_1_1705927316935_8707.video-block .sqs-native-video { height: 100%; } #block-yui_3_17_2_1_1705927316935_8707.video-block .video-player { padding: 0; } #block-yui_3_17_2_1_1705927316935_8707.video-block video { object-fit: cover; } Working example:
tUYEFEvAnU.mp4    

When you get Vimeo embed code, try find this option

Thanks again @Ziggy. That worked perfectly!
Chris

@Ziggy That worked! Thank you so much!
Chris

Try this instead:
@media only screen and (min-width:768px) { .header-title-nav-wrapper { margin-left: 47px; } }

Thanks again @Ziggy. That worked perfectly!
Chris

Try this Custom CSS:
.user-items-list-carousel__slide { border-radius: 42px; } Adjust the 42px to whatever value works for your design.

Thanks @Ziggy That worked!
Thank you for all the help!
Chris

Center the title:
.header-title-nav-wrapper { margin-left: 47px; } Can you remove the 20px line height property entirely, and use this instead to adjust the spacing between elements:
.header-menu-nav-item a { margin: 1vw 4vw; }

This is a genius workaround, thanks as always @tuanphan!

I once saw a site, they used Summary Block with Blog Post to do this. And use Source URL in Blog Posts to link to portfolio subpages. You can consider.

I hope that the workaround that I provided above was helpful, at least for the moment. 
Your comments in this user forum may not been seen by anyone from Squarespace, but you can make a feature request and ensure it is seen by the right people at Squarespace, by raising it via a support ticket.
Did this help? Please give feedback by clicking an icon below  ⬇️

The change from "*" to "(required)" is part of the Form Block update, currently being rolled out to all sites.
Have you checked the Language & Region settings on your sites (in Settings > Language & Region > Region) to check they are correctly configured for French?

If you're looking for a CSS solution to restore the asterisk on form titles, please try this:
/* Hide required on field titles Tip by sf.digital */ .form-wrapper .react-form-contents .field-list .title .required, .form-wrapper .react-form-contents .field-list .fields .description.required { visibility: hidden; } .form-wrapper .react-form-contents .field-list .title .required:before, .form-wrapper .react-form-contents .field-list .fields .description.required:before { visibility: visible; content: "*"; font-size: 1.5em; line-height: 1em; } .form-wrapper .react-form-contents--submitted .required:before { visibility: hidden!important; } Let me know how you get on.
Did this help? Please give feedback by clicking an icon below  ⬇️

Your first block of CSS isn't working because it is using old classes that don't exist on the new Form Block. Squarespace replaced the old Form Block in May 2023, so instead of:
.form-wrapper .field-list .field .field-element
...you'll want to use something like:
.form-wrapper .field-list .form-item input 
Did this help? Please give feedback by clicking an icon below  ⬇️

Thank you so much @paul2009 🙏🏻 that has worked perfectly.

For anyone else who might see this I also used 
.field-list textarea {} for the large form fields.

Thanks @christyprice that code worked perfectly! That's exactly what I needed.

@PartTwoDesign if you want this just for the homepage, you can use this code from @tuanphan:
.homepage .header-announcement-bar-wrapper { background: transparent !important; position: absolute !important; } If it's for a different page, you'll want to replace .homepage above with the collectionID for that page starting with # - I have a walkthrough on how to find that: https://christyprice.com/blog/how-to-find-block-section-ids-squarespace

@bangank36 I have solved it. I added "background=1" to the embed code.

Make sure that you have set the autoplay=1 and muted = 1 on your embed code

Thanks @bangank36! That worked! Thank you so much for all the help.

My testing

Try
section[data-section-id="6284c9b3a51737799fd1690e"] .content-wrapper { padding-bottom: 0 !important; } Let me know how it works on your site

Site URL: https://sunflower-accordion-z2d3.squarespace.com/
I currently have the below code in Custom CSS:
// Floating Mobile Info Bar //
.sqs-mobile-info-bar {
  background-color: #e33c31 !important;
  border-radius: 100px;
  margin: 5%;
  width: 90%;
}
I've attached a visual of how this appears on mobile and how I'd like to change it i.e. hide the icon, increase the font, make the bar narrower but centred on the screen. 
Thanks in advance for any advice.