Multi-Column Footer Builder

Generate the Liquid, CSS, and JavaScript for a multi-column footer builder section that I can paste into my theme as a custom section, supporting up to [MAX_COLUMNS] configurable columns using section blocks. Each column block should have a type setting that the merchant can set to one of the following: menu (renders links from a [MENU_HANDLE] link list), text (renders a rich text editor field), newsletter (renders an email signup form connected to Shopify customer marketing), social (renders social media icon links), or image (renders an image with an optional link). The footer should use a CSS grid layout with column distribution [COLUMN_LAYOUT] such as equal, 2-1-1, or 1-2-1 on desktop, stacking vertically on mobile below [MOBILE_BREAKPOINT] pixels. Include a bottom bar beneath the columns displaying copyright text with the current year inserted dynamically, payment icons using the shop.enabled_payment_types object, and optional links to terms and privacy pages. Add section-level settings for background color [FOOTER_BG_COLOR], text color [FOOTER_TEXT_COLOR], link hover color [LINK_HOVER_COLOR], top border style [BORDER_STYLE], column gap [COLUMN_GAP], and vertical padding [VERTICAL_PADDING]. The newsletter block should include a heading [NEWSLETTER_HEADING], subtext [NEWSLETTER_SUBTEXT], and a submit button with color [BUTTON_COLOR]. Provide the complete Liquid section file with schema, styles, and JavaScript for the newsletter form submission.

To use the generated code: go to Online Store > Themes > Edit code, create a new file at sections/multi-column-footer.liquid, and paste the code in. Save, then open the theme customizer, remove/disable the theme’s default footer section, and add this “Multi-Column Footer” section to the footer group instead.