add background colours

site/layouts/partials/contact.html

@@ -1,4 +1,4 @@
-<article id="contact" class="l-relative l-screen-min-full">
+<article id="contact" class="l-relative l-screen-min-full contact-bg">
   <div class="l-wrapper">
     <h2>Contact</h2>
     <form action="https://mailthis.to/remailthis" method="POST" encType="multipart/form-data">

site/layouts/partials/services.html

@@ -1,4 +1,4 @@
-<article id="services" class="l-relative l-screen-min-full">
+<article id="services" class="l-relative l-screen-min-full services-bg">
   <div class="l-wrapper">
     <h2>Services</h2>
     <ul>

src/css/main.css

@@ -73,6 +73,18 @@ html.is-animating .transition-fade {
   background-color: var(--primary-500);
 }
 
+// services
+
+.services-bg {
+  background-color: var(--accent-primary-100);
+}
+
+// contact
+
+.contact-bg {
+  background-color: var(--primary-100);
+}
+
 // global
 
 .site-title {