header {
  display: grid; grid-template-columns: 1fr 1.5fr; 
  height: 7.5dvw;
  padding: 0 var(--screen_padding);
}
#lbl_nav_close, #lbl_nav_open{display: none}
header>a{display: flex; align-content: center; align-items: center; padding: 0; height: 7.5dvw; text-decoration: none}
header>a>img{height: 5dvw; width: auto;}
header>a>p{ text-decoration: none; font-size: 3dvw; font-family: "Chakra Petch"; font-weight: bold; color: #222}

header [class^="menu-menu"]{display: flex;  justify-content: end; height: 7dvw;padding: 0}
header [class^="menu-menu"] ul{display: flex; gap:1dvw;list-style-type: none; height: 7dvw;padding: 0}
header [class^="menu-menu"] ul li{display: flex; height: 7dvw; align-items: center;padding: 0}
header [class^="menu-menu"] a{text-decoration: none; font-size: 1.5dvw; height: 2dvw; line-height: 3dvw;padding: 0 2dvw; color: #222}
header [class^="menu-menu"] a:hover{background-color: #ccc}
h1, h2, h3, h4, h5, h6{
 font-size: 3dvw;
  margin-top: 2dvw; margin-bottom: 1dvw;
  line-height: 3dvw;
  font-weight: 600;
}
h2{font-size: 2dvw;line-height: 2.5dvw;}
h3{font-size: 1.25dvw; line-height: 1.5dvw;}
main{display: block; padding: 0 14dvw; margin-top: 5dvw}
main{padding: 0 var(--screen_padding); margin-top: 10dvw}
#hero{
  display: flex;
  align-items: center;
  justify-content:  center;
  height: 100dvh;
  position: relative;
  z-index: 0;
  filter: drop-shadow(-1px 1px 1px #444); 
  padding: var(--screen_padding);
}
.slogan{
  display: block; 
  position: relative;
  z-index: 1;
  border: none;
  background-color: #fff;
  
}
#hero img{width: 100%; height: auto}
#hero img:last-of-type{position: absolute; width: 40%}
#hero .slogan.side_left{clip-path: polygon(30% 0%, 100% 0, 100% 100%, 10% 100%); width: 80dvw; z-index: 2;text-align: right; padding: 0dvw 7dvw 0dvw 10dvw ; bottom: 0; right: 0; position: absolute; box-shadow: 2px 2px 8px #000; }
#hero .slogan h1{font-size: 2dvw; line-height: 6dvw; margin: 0}


.services h2{width: 100dvw; text-align: center; font-size: 4dvw}
.services img{width: 100%;}
.services>div{
  display: grid; grid-template-columns: 1fr 3fr;grid-gap: 2dvw ;padding: 0; margin: auto;align-items: center;align-content: center;justify-content: center;justify-items: center
}
.services>div>img:first-of-type{
  margin: 0; padding: 0;
  grid-column: 1/1;
  transform: rotate(-90deg);
  align-self: center;
  width: 80%;
}
.services>div>img:last-of-type{
  left: 5.5%; top: 28%; width: 10%
}
.services>div :where(p,h3){
  margin: 0; padding: 0; 
  font-size: 2.5dvw; line-height: 4dvw;margin: 0; text-align: left; font-weight: 100;
}
.services>div>div>h3{font-size: 3dvw;  font-weight: bold;}

.advantages{display: grid; grid-template-columns: 1fr 3fr; grid-gap: 3dvw;}
.advantages h3{
  font-size: 3dvw; padding: 0; padding-left: 1dvw; margin: 0
}
.advantages p{font-size: 1.5dvw; line-height: 2dvw; margin:  3dvw 0 ; }
.advantages>div>p:not(.a, .b, .c){font-size: 2.5dvw; line-height: 4dvw; font-weight: 100}
.advantages h3:before{
  content: '';
  display: block; border: solid; position: absolute; width: 11%;; left: 0; top: 0; height: 4.25dvw;z-index: -1; color: #ccc; background-color: #ccc;top: -100%
}
.triangle{position: relative; padding: 0;display: flex; }
.triangle>img{width: 100%; height: auto;margin:0 auto;position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%)}
.triangle :where(.a, .b, .c){font-family: Chakra Petch;;font-weight: bold; font-size: 4dvw;}
.triangle>.a{transform: rotate(-60deg); top:40%; left: -8% ;position: absolute;color: #e0cb15;}
.triangle>.b{transform: rotate(60deg); top:40%; right: -9%; position: absolute;color: #3cc583;}
.triangle>.c{text-align: center; margin-top: 165%; margin-left: 50%; transform: translateX(-50%); color: #92bd39;}

.advantages h3.a:before{color: #e0cb15; background-color: #e0cb15;width: 55%;}
.advantages h3.b:before{color: #3cc583; background-color: #3cc583;width: 75%;}
.advantages h3.c:before{color: #92bd39; background-color: #92bd39;width: 95%;}

.home_about h2 {
  text-align: center;
}

.post_thumbnails{margin-top: 5dvw; margin-bottom: 5dvw}

.post_thumbnails h2,
.home_about p{font-size: 1.5dvw; line-height: 2dvw; margin-bottom: 1dvw}


footer{
  display: grid; grid-template-columns: 1fr 1fr 1fr; padding: 2dvw 14dvw
}

footer *, footer div *{font-size: 1dvw; padding: 0; line-height: 2dvw}

#cookie-consent-banner :where(h3,p, label, strong, select, option, button, div){font-size: 1.25dvw; line-height:  1.5dvw; margin: 0; padding: 0;}
#cookie-consent-banner>.cookie-consent-buttons>button{padding: 1dvw 2.45dvw; margin: 2dvw 0}