Moved footer section above header, need help resizing for accordion and for mobile

Hello. I am using the code below to move a footer section above my page header. That part worked great.

Problem 1: This section contains an accordion menu, though, and the section does not expand when the accordion menu is opened. (See screenshot.)

Problem 2: The section does not display fully in mobile view. (See screenshot.)

Thank you for your help!

Current code:

/*Move footer section to header */
#footer-sections .page-section:nth-child(1) {
 position: fixed!important;
 top: 0!important;
 z-index:9 9!important;
 width: 100%!important;
 height: auto!important;
}
header,#page{
margin-top: 4rem!important
}
 

Sure @Lesum! Thanks! It's still a draft:

https://chicagoparentprogram.squarespace.com/

Password: fireworks23

Any luck, @Lesum? @tuanphan? Your code has saved me so many times! Hopeful you might know what to do here. Thank you!

Thank you so so much @tuanphan. You are my hero.