:root {
    --main-color: #196130;
    --secondary-color:#612C14;
  }



body,html{
    box-sizing: border-box;
    margin:0;
    padding:0;
    font-size:18px;
    font-family: 'Montserrat', sans-serif;
}
img{
    width:100%;
}
h1{
    font-size:3.5rem;
}
h2{
    font-size:2.8rem;
}
.maincontent{
    max-width:100%;
    padding:0;
    margin:0;
}
.maincontent_wrapper{
    padding-top:0;
}
.title{
    color:var(--main-color);
    position: relative;
    background-color:#ececec;
    margin-bottom:20px;
    padding:1.5%;
    max-width:80%;
    clip-path: polygon(0% 0%, 90% 0%,  100% 100%, 0% 100%);
}

.subtitle{
    color:var(--secondary-color);
    font-weight:600;
}
.hero{
    position: relative;
    height:clamp(500px,35vw, 75vh);
}

.hero-bg{
    position: absolute;
    top:0;
    left:0;
    height:100%;
    width:100%;
    
     background-image:linear-gradient(rgba(0,0,0,0.2)0%, rgba(0,0,0,0.2)100%), url('/imageserver/Reusable/union-corrugating22/clay.jpeg'); 
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    clip-path: polygon(0% 0%, 100% 0%, 100% 75%, 0% 100%);
}
.hero-clip{
    position: absolute;
    bottom:0;
    left:0;
    height:100%;
    width:100%;
    background-color:var(--main-color);
    clip-path: polygon(100% 75%, 100% 80%, 0% 100%);
}
#hero-logo{
    position: absolute;
    max-width:200px;
    margin:2%;
}
.hero-content{
    position: absolute;
    top:0;
    left:20%;
    display:grid;
    align-items: center;
    height:100%;
    width:100%;
    color:#fff;
}
.hero-panel{
    position: absolute;
    max-width:clamp(600px,55vw,1000px);
    bottom:-10%;
    right:10%;
    filter:drop-shadow(3px 3px 3px rgba(0,0,0,0.3));
}
.section1{
    padding: 2% 5%;
    
}
#sec1-wrapper{
    max-width:1400px;
    margin:0 auto;
}
#sec1-wrapper p{
    max-width:1200px;
}
.grid-4060{
    display:grid;
    max-width:1400px;
    margin:2% auto;
    gap:30px;
    grid-template-columns: .4fr .6fr;
}
.main-product-img{
    place-self: center;
    margin:0 auto;
    max-width:600px;
}
.main-product-img p{ 
    font-weight:700;
}
@media screen and (max-width:992px) {
    .grid-4060{
        display:block;
    }
}