Feat/robert

assets/sass/_variables.scss

@@ -2,4 +2,17 @@ body {
   --bs-light-rgb: 219, 224, 229;
   --pagefind-ui-scale: 1;
   --pagefind-ui-text: #000;
+  --link-default: #BA3D12;
+  --link-hovered: #8F2501;
+  --link-special: #000000;
+  --bg-default: #FFFFFF;
+  --bg-neutral: #EBE9E1;
+  --bg-accent: #FFD900;
+  --bg-accent2: #DABA00;
+  --color-onDark: #FFFFFF;
+  --color-onLight: #000000;
+  --border-radius-s: .4rem;
+  --border-radius-m: .8rem;
+  --border-radius-l: 1.2rem;
+  --pagefind-ui-border-radius: var(--border-radius-l);
 }

assets/sass/content.scss

@@ -1,4 +1,4 @@
 .updateDate {
     font-size: 1.3rem;
-    margin-bottom: 5px;
+    margin-bottom: 1.6rem;
 }

assets/sass/footer.scss

@@ -3,11 +3,31 @@
     margin-bottom: 2rem;
 }
 
-.o-footer div {
+.o-footer__links {
     display: flex;
-    justify-content: flex-end;
+    justify-content: normal;
+    flex-flow: column;
+
+    @include media-breakpoint-up(md) {
+        justify-content: flex-end;
+        flex-flow: row;
+    }
 }
 
 .o-footer__link {
-    margin-left: 1.6rem;
+    margin-left: 0;
+    margin-right: 1.6rem;
+    text-decoration: underline;
+    color: var(--link-special);
+    font-weight: 700;
+
+    &:hover,
+    &:focus {
+        color: var(--link-hovered);
+    }
+
+    @include media-breakpoint-up(md) {
+        margin-left: 1.6rem;
+        margin-right: 0;
+    }
 }

assets/sass/form.scss

@@ -1,20 +1,35 @@
 .m-form {
   margin-bottom: 1.6rem;
 
-  .row>* {
+  .row > label {
     padding: 0;
   }
 
   input[type=text], input[type=email], select, textarea {
     width: 100%;
     margin-bottom: 1.6rem;
+    border-radius: var(--border-radius-m);
+    border-width: .2rem;
+    border-color: var(--color-onLight);
+    padding: 1.2rem;
 
     @include media-breakpoint-up(md) {
       width: 50%;
     }
   }
   input[type=submit] {
     width: auto;
-    padding: 0 1rem;
+    padding: 1.2rem 2.4rem;
+    background-color: var(--bg-accent);
+    color: var(--color-onLight);
+    border: none;
+    border-radius: var(--border-radius-m);
+    transition: background-color .3s ease;
+    font-weight: 700;
+
+    &:hover,
+    &:focus {
+      background-color: var(--bg-accent2);
+    }
   }
 }

assets/sass/headings.scss

@@ -3,25 +3,33 @@ h1 {
   line-height: 1.25;
   font-weight: 700;
   margin-bottom: 2rem;
+  text-wrap: balance;
 }
 
 h2 {
   font-size: 2.4rem;
   line-height: 1.25;
-  margin-bottom: 1.6rem;
+  margin-bottom: 1.2rem;
   font-weight: 700;
+  text-wrap: balance;
 }
 
 h3 {
   font-size: 2rem;
   line-height: 1.25;
-  margin-bottom: 1.4rem;
+  margin-bottom: 1rem;
   font-weight: 700;
+  text-wrap: balance;
 }
 
 h4 {
   font-size: 1.8rem;
   line-height: 1.25;
-  margin-bottom: 1.2rem;
+  margin-bottom: 1rem;
   font-weight: 700;
+  text-wrap: balance;
+}
+
+h2:has(+ .updateDate) {
+  margin-bottom: .4rem;
 }

assets/sass/navigation.scss

@@ -1,3 +1,9 @@
+#header {
+  position: sticky;
+  top: 0;
+  box-shadow: 0 .4rem 1rem 0 rgba(0,0,0,.1);
+}
+
 .o-header {
   display: flex;
   justify-content: space-between;
@@ -43,21 +49,27 @@
 
 .o-header__logo {
   display: flex;
-  padding: 1rem;
   margin: .3rem;
   position: relative;
+  text-decoration: none;
 
   h1 {
-    position: absolute;
-    top: 1.6rem;
-    left: 1.7rem;
     margin: 0;
-    font-size: 1.5rem;
-    color: black;
+    font-size: 2.4rem;
+    color: var(--link-special);
+    font-weight: 700;
+    align-self: center;
+    text-wrap-mode: nowrap;
+
+    &:hover,
+    &:focus {
+      color: var(--link-hovered);
+      text-decoration: underline;
+    }
   }
 
   img {
-    width: 8rem;
+    width: 5rem;
   }
 }
 
@@ -75,9 +87,9 @@
   padding: 1rem;
   margin: .3rem;
   pointer-events: none;
-  background-color: gainsboro;
-  border-radius: .4rem;
-  color: black;
+  background-color: var(--bg-neutral);
+  border-radius: var(--border-radius-s);
+  color: var(--color-onDark);
 
   &:focus {
     opacity: 1;
@@ -111,7 +123,7 @@
 
   &:hover,
   &:focus {
-    color: red;
+    color: var(--link-hovered);
   }
 
   span {
@@ -145,7 +157,7 @@
     flex-direction: column;
     background-color: white;
     box-shadow: 0 .4rem 1rem 0 rgba(0,0,0,.1);
-    border-radius: .4rem;
+    border-radius: var(--border-radius-s);
   }
 
   &.o-header__item-countries--open {

assets/sass/stage.scss

@@ -7,7 +7,7 @@
     max-width: 1320px;
 
     img {
-        border-radius: 0 0 1rem 1rem;
+        border-radius: 0 0 var(--border-radius-l) var(--border-radius-l);
     }
 }
 
@@ -30,6 +30,12 @@
         width: 60%;
     }
 
+    .pagefind-ui__search-input,
+    .pagefind-ui__message,
+    .pagefind-ui__search-clear {
+        font-family: "Roboto", Arial, Helvetica, sans-serif;
+    }
+
     .pagefind-ui__search-input {
         z-index: 3;
         outline: .2rem solid transparent;
@@ -44,7 +50,7 @@
         z-index: 3;
         height: auto;
         padding: 1rem;
-        top: .7rem;
+        top: 1rem;
         margin-right: .7rem;
     }
 
@@ -54,7 +60,7 @@
 
     .pagefind-ui__drawer {
         background-color: white;
-        padding: 0 1rem;
+        padding: 0 1rem 1rem 1rem;
         overscroll-behavior: contain;
         height: 35rem;
         overflow-y: scroll;
@@ -67,15 +73,43 @@
         border-bottom-right-radius: var(--pagefind-ui-border-radius);
     }
 
+    .pagefind-ui__result-link {
+        color: var(--link-default);
+        text-decoration: underline;
+
+        &:hover,
+        &:focus {
+            color: var(--link-hovered);
+        }
+    }
+
+    .pagefind-ui__result-link:hover,
+    .pagefind-ui__result-link:focus {
+        color: var(--link-hovered);
+    }
+
     .pagefind-ui__result-link:focus {
         outline: .2rem solid orange;
         outline-offset: .1rem;
-        border-radius: .4rem;
+        border-radius: var(--border-radius-s);
     }
 
     .pagefind-ui__result-link::before {
         top: -.2rem;
     }
+
+    .pagefind-ui--reset mark {
+        background-color: var(--bg-accent);
+    }
+
+    .pagefind-ui__button {
+        background-color: var(--bg-accent);
+
+        &:hover,
+        &:focus {
+            background-color: var(--bg-accent2);
+        }
+    }
 }
 
 .curtain {