add color palette 🎨

web/src/components/layout/header.module.scss

@@ -21,4 +21,8 @@
     display: flex;
     gap: var(--spacing-sitepadding);
   }
+
+  a {
+    font-weight: 500;
+  }
 }

web/src/css/base.scss

@@ -73,12 +73,13 @@ h6 {
 
 button {
   border-radius: 10rem;
-  background: var(--color-text);
+  background: var(--color-cta);
-  color: var(--color-background);
+  color: var(--color-text);
   border: none;
   padding: 1rem 1.5rem;
   font-family: inherit;
   font-size: inherit;
+  font-weight: 500;
   cursor: pointer;
 
   &:hover {

web/src/css/variables.scss

@@ -7,8 +7,21 @@
   --font-size-lead: 1.4rem;
 
   // colors
-  --color-text: #333;
+
-  --color-background: #eee;
+  // color palette
+  --color-deepBrick: rgb(114, 3, 40);
+  --color-neufPink: rgb(205, 150, 171);
+  --color-betongGray: rgb(229, 226, 215);
+  --color-goldenOrange: rgb(255, 105, 21);
+  --color-goldenBeige: rgb(248, 188, 144);
+  --color-chateauBlue: rgb(10, 15, 109);
+  --color-white: #fff;
+  --color-black: rgb(22, 21, 22);
+
+  // colors in use
+  --color-text: var(--color-chateauBlue);
+  --color-background: var(--color-betongGray);
+  --color-cta: var(--color-goldenOrange);
 
   // spacing
   --spacing-sitepadding: 2rem;