responcive: home quite ok

web/themes/custom/materiotheme/assets/scripts/main.js

@@ -147,7 +147,7 @@ import { MA } from 'vuejs/api/ma-axios'
         document.querySelector('body').classList.remove(...classes_to_rm)
         // add new path classes to body
         const classes = []
-        if (to.path == '/') {
+        if (to.name == 'home') {
           classes.push('path-home')
         } else {
           const path_parts = to.path

web/themes/custom/materiotheme/assets/styles/main.scss

@@ -440,7 +440,7 @@ header[role="banner"]{
     }
     @include col-mediaquery-max(3){
       flex-direction: column-reverse;
-      // justify-content: flex-start;
+      justify-content:center;
       #block-pagetitle{
         width: max-content;
       }
@@ -453,12 +453,21 @@ header[role="banner"]{
   #block-pagetitle{
     // float: left;
     padding:1em 0;
+
+    @include col-mediaquery-max(3){
+	    body.path-frontpage &, body.path-home & {
+	      display: none;
+	    }
+		}
     h2{
       margin:0;
       font-size: 1.512em;
       text-transform: capitalize;
       font-weight: 300;
 
+	    body.path-home & {
+	      display: none;
+	    }
       body:not(.path-home) & {
         padding:0.5em 1em;
       }
@@ -637,6 +646,9 @@ article.node--type-frontpage{
   %front-col-field__label{
     font-size: 3.5em;
     line-height: 1;
+		@include col-mediaquery-max(3){
+			font-size: 2em;
+		}
   }
   %front-col-description{
     font-size: 0.9em;
@@ -650,6 +662,11 @@ article.node--type-frontpage{
       width:80%;
       margin: 0 auto;
       text-align: center;
+			@include col-mediaquery-max(3){
+				width:auto;
+				padding:0 1em;
+				text-align: left;
+			}
       .field__label{
         @extend %front-col-field__label;
       }
@@ -700,6 +717,20 @@ article.node--type-frontpage{
       box-sizing: border-box;
       padding: 1em 0.5em;
     }
+		@include col-mediaquery-max(3){
+			flex-direction: column;
+	    >div:nth-child(1){
+	      flex: 0 0 auto;
+	      // box-sizing: border-box;
+	      // padding: 1em;
+	    }
+	    >div:nth-child(2){
+	      // flex: 1 1 auto;
+	      // box-sizing: border-box;
+	      // padding: 1em 0.5em;
+	    }
+		}
+
   }
 
   >h2{
@@ -719,6 +750,9 @@ article.node--type-frontpage{
             flex: 0 0 $column_width * 2;
             padding:1em;
           }
+					@include col-mediaquery-max(3){
+						display: none;
+					}
         }
       }
       &.home-database{
@@ -952,6 +986,16 @@ article.node--type-frontpage{
               }
             }
           }
+
+					@include col-mediaquery-max(3){
+						max-height: 386px;
+						ul{
+							justify-content: space-around;
+							li{
+								flex: 0 3 45%;
+							}
+						}
+					}
         }
       }
       &.home-pricing{