How to Exclude Footer When Setting Height of First Section with CSS?

Hello Community!

I'm trying to set the height of the first section of each page of my Squarespace site using CSS, but the code I'm using also affects the footer. Here is the CSS I'm currently using:

.page-section:first-child {
    min-height: clamp(0px, 54.25vw, 100vh) !important;
}

This code also applies to the footer, which I want to exclude. I've tried several alternative selectors and approaches, but none have worked so far.

Is there a way to specifically target only the first content section and exclude the footer from being affected by this CSS rule? Any help or suggestions would be greatly appreciated!

Thank you!

Site URL: https://offbeat-festival.squarespace.com/

PW: Offbeat

p.s. I have no idea where that posted image came from?!?

Omg ANGEL! Thank you so much Ziggy, you are a superstar. 🥲

1 minute ago, sarahhalliday said:

Omg ANGEL! Thank you so much Ziggy, you are a superstar. 🥲

Glad to help, thanks for the like!