header & menu small

assets/css/partials/_site-header.scss

@@ -40,9 +40,25 @@
     flex-grow: 2;
     svg{
       width: 100px;
+      @media #{$small}{
+        width: 80px;
+      }
     }
   }
 
+  .title-page{
+    display: none;
+    flex-grow: 2;
+    text-align: left;
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    text-transform: uppercase;
+    font-size: var(--fs-small);
+    line-height: 2;
+   
+  }
+
   ul{
     list-style-type: none;
     display: flex;
@@ -52,6 +68,20 @@
   }
 
 
+  #theme-toggle{
+    width: var(--h-block);
+    height: var(--h-block);
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    svg{
+      width: 18px;
+      position: relative;
+      top: -2px;
+    
+    }
+  }
+
   #lang-toggle{
     display: flex;
     gap: 1ch;
@@ -83,6 +113,26 @@
 
   .site-header__inner{
     border-bottom: var(--border-light);
+
+    #nav-highlight li:not(.soutenir){
+      display: none;
+    }
+    #site-title {
+      @media #{$small-up}{
+      flex-grow: 0;
+      width: calc((100vw - var(--max-w-content))/2 - var(--padding-body)*2);
+      } 
+      @media #{$medium}{
+        width: calc(var(--banner-medium) - var(--padding-body));
+      } 
+    } 
+    
+    .title-page{
+      @media #{$small-up}{
+       display: block;
+      }
+      flex-grow: 2;
+    }
   }
 
   & ~ main{
@@ -96,3 +146,5 @@
     display: none;
   }
 }
+
+

assets/css/partials/_site-menu.scss

@@ -1,6 +1,7 @@
 #site-menu{
     position: fixed;
     width: var(--menu-w);
+    @media #{$small}{ width: 100vw; }
     height: calc(100dvh - var(--header-h));
     height: calc(100vh - var(--header-h));
     top: var(--header-h);
@@ -96,6 +97,7 @@ body.menu-open{
     }
     #site-menu{
         right: 0;
+
     }
 
     #menu-toggle{