src/app/page.tsx

@@ -120,6 +120,8 @@ export default function LandingPage() {
 
   <div id="faq" data-section="faq">
       <FaqBase
+      className="w-full max-w-full"
+      containerClassName="w-full max-w-full"
       textboxLayout="split-description"
       useInvertedBackground={true}
       faqs={[
@@ -135,7 +137,9 @@ export default function LandingPage() {
 
   <div id="contact" data-section="contact">
       <ContactSplitForm
-      useInvertedBackground={false}
+      className="w-full max-w-full"
+      containerClassName="w-full max-w-full"
+      useInvertedBackground={true}
       title="LET'S BUILD TOGETHER"
       description="Reach out to discuss your infrastructure requirements with our specialist team."
       inputs={[
@@ -150,6 +154,8 @@ export default function LandingPage() {
 
   <div id="footer" data-section="footer">
       <FooterBaseReveal
+      className="w-full max-w-full"
+      wrapperClassName="w-full max-w-full"
       logoText="WARRIOR GROUP"
       columns={[
         { title: "Corporate", items: [{ label: "About", href: "#" }, { label: "Careers", href: "#" }] },
@@ -161,4 +167,4 @@ export default function LandingPage() {
       </ReactLenis>
     </ThemeProvider>
   );
-}
+}

src/app/styles/base.css

@@ -11,7 +11,7 @@ html {
 body {
   background-color: var(--background);
   color: var(--foreground);
-  font-family: var(--font-open-sans), sans-serif;
+  font-family: var(--font-body);
   position: relative;
   min-height: 100vh;
   overscroll-behavior: none;
@@ -24,5 +24,5 @@ h3,
 h4,
 h5,
 h6 {
-  font-family: var(--font-open-sans), sans-serif;
+  font-family: var(--font-headings);
 }