/***TOP BANNER***/
@media(min-width: 501px){
    .topbanner.section {
        background-image: url(/wp-content/uploads/2023/09/topbanner-bg.jpg);
        background-size:cover;
        background-position: center;
        background-repeat: no-repeat;
    }
}
@media(max-width:500px){
    .topbanner.section {
        background-color: var(--white)
    }
}
@media(min-width: 801px){
    .topbanner .inner-col{
        background: linear-gradient(90deg, #000000d9 50%, #ffffffd9 50%);
    }
}
.topbanner.section {
    padding: 0;
    overflow:hidden
}
.topbanner .inner-col{
    max-width: 100%;
}
.topbanner .inner-col .bg-col{
    max-width: 1700px;
    width: 100%;
    padding-top: calc(100px + 6%);
    padding-bottom: clamp(32px, 6%, 100px);
    padding-right: 16px;
    padding-left: 16px;
    display:flex;
    flex-wrap: wrap;
}
.topbanner .maintitle {
    text-align:center;
    color: var(--white);
    text-transform:uppercase;
}
.topbanner .span-amintitle {
    display:block;
	font-size: clamp(21px, 3.4vw, 36px);
}
.topbanner .inner-topcpl {
    max-width: 690px;
    padding-right: 52px;
}
.topbanner .subtitle {
    color: var(--primary);
    text-align:center;
    max-width: 600px;
    margin-right: auto;
    margin-left: auto;
}
.topbanner .tp-sep {
    margin: 20px 0;
    height: 3px;
    border: none;
    background-color: var(--primary)
}
.topbanner .badges-col {
    display:flex;
    justify-content:center;
    align-items:flex-end;
    gap: 32px
}
.topbanner .topcol-2 {
    justify-content:center
}
.topbanner .topcol-2 picture{
    display:flex;
    justify-content:center
}
@media (min-width:1025px) and (max-width:1360px) {
.main_hdr .three-quarters-col {transform: scale(0.85);right: -50px;}
}
@media(max-width: 1024px){
.topbanner .inner-col .bg-col {
    padding-top: clamp(55px, 4%, 72px);
}
}
@media(max-width: 800px){
    .topbanner .two-col{width: 100%;}
    .topbanner .inner-col{background:  #000000d9;}
    .topbanner .topcol-2{margin-top: 20px}
    .topbanner .inner-topcpl{padding-right: 0;   margin: 0 auto}
    .topbanner .maintitle {max-width: 475px; margin-left: auto; margin-right: auto;}
}
 img.mobile,  picture.mobile  {display:none}
<p>@media(max-width: 600px){
    img.desktop, picture.desktop {display:none}
    img.mobile, picture.mobile {display:block}
}
<p>@media(max-width: 500px){
.topbanner .topcol-2 img {margin-left: 0;}
}
.topbanner {
    position:relative;
}
.topbanner .logo-cont {
    background-color: white;
    display:flex;
    align-items: center;
    padding: 20px;
    border-radius: 20px 0 0 20px;
    box-shadow: 0 0 20px 0 #00000045;
    position: absolute;
    right: 0;
    bottom: 13%;
    max-width: 780px;
    gap: 10px;
    width: 45%;
}
@media(max-width: 800px){
    .topbanner .logo-cont {
        width: 80%;
        bottom: 5%;
    }
}
@media(max-width: 500px){
    .topbanner .logo-cont {
        width: 100%;
        border-radius: 10px 10px 0 0 ;
        left:0;
        right:0;
        margin:auto;
        padding: 12px;
        bottom:0
    }
}
/***CTA BANNER***/
.ctabanner{
    background-color:var(--primary);
    color:var(--white);
    padding: clamp(20px, 2%, 42px);
}
.ctabanner .ctacol-1{
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    gap: 8px;
}
.ctabanner .maintitle {
    text-transform:uppercase;
    text-align:center;
    margin-bottom: 0;
}
.ctabanner .span-maintitle {
    font-size: clamp(60px, 8vw, 100px);
    font-weight: 500;
    line-height:1;
}
.ctabanner span.h3-style {
    display:block;
    margin-bottom: 0;
}
.ctabanner .subtitle {
    font-size: var(--font-size--big);
    text-transform: uppercase;
    text-align: center;
    font-family: var(--font-family--h6);
    font-weight: 600;
    margin-bottom: 0;
}
.ctabanner .btn-col {
    border-top: 2px solid var(--white);
    display: flex;
    align-items: stretch;
    justify-content: center;
    text-align: center;
}
.ctabanner .btn-col .green-btn {
    background-color: var(--scondary);
    color: var(--white);
    border-radius: 0 0 10px 10px
}
.ctabanner .btn-col .black-btn {
    background-color: var(--black);
    color: var(--white);
    border-radius: 0 0 10px 10px;
    align-items: center;
}
.ctabanner .btn-col .btn:hover{
    opacity: 0.7
}
<p>@media(max-width: 1024px){
    .ctabanner .two-col{
        width: 100%;
        justify-content: center;
    }
    .ctabanner .section-wrap{
        flex-wrap: wrap
    }
}
@media(max-width: 500px){
    .ctabanner .btn-col{
        width: 100%
    }
    .ctabanner .ctacol-1{
        flex-direction:column-reverse
    }
}
.ctabanner .ctacol-2 {
    width: 100%;
}
.ctabanner .btn-col{
    width:100%
}
.ctabanner .btn-col .btn{
    width:350px;
    align-items: center;
}
@media(max-width: 700px){
    .ctabanner .btn-col{
        flex-direction:column;
        align-items:center;
    }
    .ctabanner .btn-col .green-btn{
        border-radius:0
    }
}
<p>/***COMMERCIAL***/
@media(max-width: 500px){
    .commercial-sctn{
        background-color: var(--light-gray)
    }
}
.commercial-sctn {
    padding-top: clamp(32px, 4%, 72px);
}
.commercial-sctn .maintitle{
    text-transform:uppercase;
    margin-bottom: 12px;
    text-align: center;
	max-width: 1200px;
}
.commercial-sctn .span-maintitle{
    text-transform: uppercase;
    color: var(--primary);
    margin-bottom: 16px;
    text-align: center;
}
.commercial-sctn .title-col  p{
    text-align:center;
    font-size: var(--font-size--button);
    max-width: 990px;
    margin-bottom:5%
}
.commercial-sctn .com-cont {
    display:flex;
    flex-wrap:wrap;
    z-index: 9;
}
.commercial-sctn .com-col {
    display:flex;
    width: 50%;
    color: var(--white);
    padding: clamp(20px, 3%, 42px) clamp(20px, 6%, 72px);
}
.commercial-sctn .com-col p{
    margin: 0;
}
.commercial-sctn .com-col-1,
.commercial-sctn .com-col-4{
    background-color: #191919
}
.commercial-sctn .com-col-2,
.commercial-sctn .com-col-3{
    background-color: var(--black)
}
.commercial-sctn .subtitle{
    font-weight: 500;
    color: var(--primary);
    margin-bottom: 0;
}
.commercial-sctn .com-col .icon-col{
    min-width:42px
}
.commercial-sctn .com-col .text-col{
    padding-left: 20px;
    margin-left: 20px;
    border-width: 3px;
    border-style: solid;
    border-image:
    linear-gradient(to bottom, var(--white), var(--primary)) 1 100%;
    border-right: none;
    max-width: 400px
}
.commercial-sctn .com-col-4 p{
    color: var(--primary);
    font-size: clamp(16px, 2.5vw, 32px);
    font-family: var(--font-family--button)
}
.commercial-sctn .com-col-4 p a{
    display:flex;
    align-items: flex-start;
    gap: 8px;
    line-height: 1.2;
}
.commercial-sctn .com-col-1 .span-subtitle{
    max-width: 300px
}
.commercial-sctn .com-col-4 .subtitle {
    max-width: 300px
}
.commercialimg-sctn{
    overflow:visible
}
.commercialimg-sctn .img-col {
    width: 100%;
    margin-top: -33%;
    margin-right: -82%;
    z-index: 8;
}
.commercialimg-sctn .img-col img{
    width: 80%;
    height: 100%;
    object-fit: cover;
    border-left: 4px solid var(--primary);
}
@media(max-width: 1600px){
    .commercialimg-sctn .img-col img{
        width: 70%;
    }
}
@media(max-width: 1440px){
    .commercial-sctn .com-cont{
        width: 80%
    }
    .commercialimg-sctn .img-col {
        margin-right: -67%;
    }
}
@media(max-width: 1024px){
    .commercial-sctn .com-cont{
        width: 100%
    }
    .commercialimg-sctn .img-col {
        margin-right: 0%;
        margin-top: 0;
        display:flex;
        justify-content:center
    }
    .commercialimg-sctn .img-col img {
        width: 100%
    }
}
@media(max-width: 800px){
    .commercial-sctn .com-col{
        width: 100%;
        justify-content: center;
    }
    .commercial-sctn .com-col-3{
        background-color: #191919
    }
    .commercial-sctn .com-col-4{
        background-color: var(--black)
    }
}
@media(max-width: 500px){
    .commercial-sctn .com-col .subtitle{
        max-width: 200px;
        margin-right:auto;
        margin-left:auto
    }
    .commercial-sctn .com-col .span-subtitle{
        margin-right:auto;
        margin-left:auto;
        max-width: 320px;
    }
}
.location {
    display: flex;
    align-items: center;
    gap: 8px;
}
@media(max-width: 800px){
    .map-sctn .btn-col{
        justify-content:center
    }
}
/***WE WORK***/
.wework-sctn .maintitle{
    text-transform:uppercase;
    max-width: 712px;
    text-align:center;
    border-top: 4px solid var(--primary);
    padding-top: 26px;
    margin-bottom: 20px
}
.wework-sctn .span-maintitle{
    color: var(--primary);
    background-color: var(--white);
    z-index: 9;
    padding: 0 32px;
    text-align: center;
}
.wework-sctn .wework-list {
    padding: 52px 32px 5% 32px;
    margin: 0;
    list-style:none;
    display:flex;
    flex-wrap: wrap;
    justify-content: space-between;
    border: 4px solid var(--primary);
    border-bottom: 0;
    margin-top: -48px;
    width: 100%;
}
.wework-sctn .wework-list li{
    width: fit-content;
    color: var(--black)
}
.wework-sctn .wework-list li:nth-child(5){
    width: 309px
}
.wework-sctn .wework-list li:nth-child(6){
    width: 236px
}
.wework-sctn .wework-list li:nth-child(7){
    width: 401px
}
.wework-sctn .wework-list li:nth-child(8){
    width: 236px
}
@media(max-width: 1300px){
    .wework-sctn .wework-list{
        display:block;
        columns: 3 260px;
    }
    .wework-sctn .wework-list li,
    .wework-sctn .wework-list li:nth-child(5),
    .wework-sctn .wework-list li:nth-child(6),
    .wework-sctn .wework-list li:nth-child(7),
    .wework-sctn .wework-list li:nth-child(8){
        width: fit-content;
    }
}
@media(max-width: 900px){
    .wework-sctn .span-maintitle{
        max-width: 500px
    }
    .wework-sctn .maintitle{
        max-width: 500px
    }
}
@media(max-width: 600px){
    .wework-sctn .wework-list li,
    .wework-sctn .wework-list li:nth-child(5),
    .wework-sctn .wework-list li:nth-child(6),
    .wework-sctn .wework-list li:nth-child(7),
    .wework-sctn .wework-list li:nth-child(8){
        width: 306px;
        margin-right: auto;
        margin-left: auto;
        max-width: 100%
    }
    .wework-sctn .span-maintitle{
        max-width: 350px
    }
    .wework-sctn .span-maintitle{
        padding: 0;
        margin: 0 20px
    }
}
<p>/***WHY US***/
@media(min-width: 501px){
    .whyus-sctn{
        background-image: url(/wp-content/uploads/2023/09/whyus-bg-1.jpg);
        background-size: cover;
        background-position: center;
        background-repeat: no-repeat;
    }
}
@media(max-width: 500px){
    .whyus-sctn{
        background-color: #3d3d3c
    }
}
.whyus-sctn{
    padding-top: clamp(32px, 6%, 110px);
    padding-bottom: clamp(32px, 9%, 160px);
    clip-path: polygon(0 0, 100% 0, 100% 90%, 0% 100%);
    color: var(--white)
}
.whyus-sctn .inner-col {
    max-width: 100%;
    justify-content: flex-end;
}
.whyus-sctn .maintitle {
    text-transform: uppercase;
    max-width: 800px;
    margin-right: auto;
    margin-left: auto;
    text-align:center;
    margin-bottom: 8px
}
.whyus-sctn .span-maintitle {
    color: var(--primary);
    text-align: center;
}
.whyus-sctn .whyus-list {
    margin: 0;
    list-style:none;
}
.whyus-sctn .whyus-list li{
    display:flex;
    gap: 8px;
    align-items: center;
}
.whyus-sctn .whyus-list li .icon{
    min-width: 46px
}
.whyus-sctn .text-col {
    max-width: 700px;
}
.whyus-sctn .img-col img{
    max-width: 160%;
    margin-left: -20%;
}
.whyus-sctn .img-col {justify-content:flex-end}
.whyus-sctn {padding-left: 30px;padding-right: 30px;}
@media(max-width: 1200px){
   .whyus-sctn .img-col img{
    margin-left: -10%;
}
}
@media(max-width: 800px){
    .whyus-sctn .text-col{
        width: 100%;
        margin: 0 auto;
    }
    .whyus-sctn .img-col{
        width: 100%
    }
    .whyus-sctn{
        clip-path: polygon(0 0, 100% 0, 100% 97%, 0% 100%);
    }
    .whyus-sctn .whyus-list{
        max-width: 450px;
        margin: 0 auto;
    }
    .whyus-sctn .img-col img{
        width: 140%;
        margin-left: 0;
    }
}
<p>/***GET STARTED***/
@media(min-width: 601px){
    .getstarted-sctn {
        background-image: url(/wp-content/uploads/2023/09/getstarted-bg.jpg);
        background-size: cover;
        background-position:center;
        background-repeat: no-repeat;
    }
    .getstarted-sctn .text-col{
        background-image: url(/wp-content/uploads/2023/09/whyus-lines.png);
        background-size: cover;
        background-repeat: no-repeat;
        background-position: left;
    }
    .getstarted-sctn .img-col {
        padding-top: clamp(72px, 8%, 120px);
    }
}
.getstarted-sctn {
    margin-top: -7%;
    color: var(--white);
}
.getstarted-sctn .inner-col{
    max-width: 1530px;
}
.getstarted-sctn .text-col{
    margin-left: -10%;
    padding-bottom: clamp(32px, 4%, 72px);
    justify-content: center;
}
.getstarted-sctn .img-col{
    justify-content: flex-end;
}
.getstarted-sctn .text-col{
    padding-top: clamp(72px, 8%, 120px);
    justify-content: flex-end;
}
.getstarted-sctn .text-inner {
    max-width: 580px;
    margin-left: auto;
    text-align: center;
}
.getstarted-sctn .maintitle.h1-style {
    text-transform:uppercase;
    margin-top: 20px
}
.getstarted-sctn a.btn{
    text-transform:uppercase;
    color:var(--white);
    font-weight: 600;
    flex-direction:column;
    margin:0 auto;
    padding: 16px 32px;
    border-radius: 50px;
    border: 6px solid;
    font-size: clamp(17px, 2vw, 23px);
}
.getstarted-sctn .btn-greenoutline{
    background-color: var(--primary)
}
.getstarted-sctn .btn-blackoutline{
    background-color: var(--black)
}
.getstarted-sctn .btn-greenoutline:hover{
    background-color: #35bb1770
}
.getstarted-sctn .btn-blackoutline:hover{
    background-color: #00000070
}
.getstarted-sctn .btn-col p{
    margin: 20px 0;
    font-size: var(--font-size--h5);
    line-height: 1;
    text-transform:uppercase;
    font-weight: 600;
    font-family: var(--font-family--button)
}
.getstarted-sctn .btn-col .sm-text {
    font-size: clamp(15px, 1.7vw, 18px);
}
@media(max-width: 1236px){
    .getstarted-sctn .text-inner{
        max-width: 460px
    }
    .getstarted-sctn .text-col{
        margin-left: 0;
    }
    .getstarted-sctn .inner-col {
    justify-content: space-between;
}
}
@media(max-width: 800px){
    .getstarted-sctn .img-col{
        width: 40%
    }
    .getstarted-sctn .text-col{
        width: 60%
    }
}
@media(max-width: 600px){
    .getstarted-sctn {
        background-color: var(--scondary)
    }
    .getstarted-sctn .two-col{
        width: 100%
    }
    .getstarted-sctn .inner-col{
        flex-direction:column-reverse
    }
    .getstarted-sctn .text-inner{
        margin-right: auto;
    }
    .getstarted-sctn .img-col img{
        max-width: 300px
    }
    .getstarted-sctn .img-col{
        display:flex;
        align-items: center;
    }
}
<p>/***REVIEW***/
.review-sctn .inner-col{
    max-width: 1500px;
    justify-content: space-between;
}
.review-sctn .maintitle{
    font-size: var(--font-size--big);
    margin-bottom: 0;
}
.review-sctn .subtitle{
    color: var(--primary)
}
.review-sctn .span-maintitle {
    display:block;
    font-weight: 600;
    font-size: var(--font-size--h6)
}
.review-sctn p{
    color:  var(--black)
}
.review-sctn .name {
    font-weight: 600;
    font-size: clamp(15px, 1.7vw, 20px);
    margin-bottom: 0;
}
.review-sctn .stars {
    color: #5ec847;
    font-size: 30px;
}
.review-sctn .text-col {
    width: 64%;
    z-index:9;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    padding-left: 4%;
    padding-bottom: 20px;
    padding-top: 32px;
}
.review-sctn .img-col {
    width: 80%;
    margin-left: -40%;
    margin-right: -15%
}
.review-sctn .img-col img{
    height: 100%;
    object-fit:cover
}
.review-sctn .review-cont {
    border-top: 6px solid var(--primary);
    flex-direction: row;
    justify-content: space-evenly;
    align-items: stretch;
}
.review-sctn .review-col {
    width: 45%
}
.review-sctn .review-col .text {
    background-color: #cdedcb;
    padding: 32px;
    display: flex;
    flex-wrap: wrap;
    position: relative;
}
.review-sctn .review-col .text::after {
    content:"";
    position:absolute;
    clip-path: polygon(100% 0, 0 0, 50% 100%);
    width: 60px;
    height: 30px;
    background-color: #cdedcb;
    bottom: -28px;
    display:flex;
    justify-content: center;
}
.review-sctn .review-col .text .title {
    font-weight: 600;
    font-size: var(--font-size--h6);
    margin-bottom: 10px
}
.review-sctn .review-col .user {
    display:flex;
    align-items: center;
    margin-top: 36px;
    gap: 16px;
    padding-left: 37px;
}
.review-sctn .review-col .text p:last-child {
    margin: 0;
}
@media(max-width:700px){
    .review-sctn .text-col{
        width: 100%;
        padding: 20px 0;
        text-align: center;
    }
    .review-sctn .img-col{
        width: 100%;
        margin-left: 0;
        margin-right: 0;
    }
    .review-sctn .review-col{
        width: 100%;
    }
    .review-sctn .review-cont{
        flex-wrap:wrap;
        gap: 20px
    }
}
<p>/***CLIENTS***/
.clients-sctn {
    padding-top: clamp(32px, 4%, 52px);
    padding-bottom: clamp(32px, 4%, 72px);
}
.clients-sctn .maintitle{
    font-size: var(--font-size--big);
    display:flex;
    position: relative;
    align-items: center;
    width: 100%;
    justify-content: flex-end;
}
.clients-sctn .inner-col {
    justify-content:flex-end
}
.clients-sctn .maintitle::before{
    content: "";
    height: 4px;
    background-color: var(--primary);
    position: absolute;
    width: 66%;
    left: -22%;
}
.clients-sctn .title-col {
    width: 100%;
    justify-content: flex-end;
    display: flex;
}
.clients-sctn .clients-cont{
    flex-direction:row;
    flex-wrap:wrap;
    gap: 32px;
    justify-content: space-evenly;
}
.clients-sctn .maintitle .kt {
    background-color: var(--white);
    z-index: 1;
}
@media(max-width: 600px){
    .clients-sctn .maintitle{
        justify-content:center;
        text-align:center;
    }
    .clients-sctn .maintitle::before{
        left: 0;
        bottom: -16px;
        width: 100%
    }
    .clients-sctn .clients-cont img{
        width: 20%
    }
}
/***MAP***/
.map-sctn .text-col {
    background-color: var(--black);
    color: var(--white);
    width: 55%;
    clip-path: polygon(0 0, 100% 0, 100% 90%, 0% 100%);
    display: flex;
    align-items: center;
    justify-content: flex-end;
    padding: clamp(32px, 5%, 72px);
    height: 100%;
z-index:9
}
.map-sctn .inner-col{
    max-width: inherit;
    padding: 0;
    justify-content: flex-start;
    align-items: flex-end;
}
.map-sctn.section {
    padding: 0;
    overflow: visible;
}
.map-sctn .img-col {
    width: 100%;
    margin-left: -45%;
    margin-bottom: -5%;
z-index:8
}
.map-sctn .text-inner {
    max-width: 520px;
}
.map-sctn .btn-col {
    display:flex;
    gap: 8px;
    align-items: center;
}
.map-sctn .btn-col .h6-style,
.map-sctn .btn-col .h5-style{
    margin-bottom:0
}
.map-sctn .btn-col p{
    margin:0;
    display:flex;
    align-items: center;
    width: 50%;
    gap: 8px;
}
.map-sctn .btn-col p a{
    color: var(--white);
    font-weight: 400
}
.map-sctn .maintitle {
    text-transform:uppercase;
}
.map-sctn .btn-green {
    background-color: var(--primary);
    color:var(--white);
    border: 3px solid var(--white);
    border-radius: 10px;
    font-weight: 600;
    white-space: nowrap;
    font-size: clamp(20px, 2.5vw, 30px);
    width: 50%;
}
.map-sctn .btn-green:hover{
    opacity: 0.8
}
.map-sctn .btn-col p a:hover{
    color: var(--primary)
}
@media(max-width:1024px){
    .map-sctn .text-col{
        width: 60%
    }
    .map-sctn .img-col{
        margin-left: -55%
    }
}
@media(max-width: 800px){
    .map-sctn .btn-col{
        flex-wrap: wrap;
        gap: 20px;
    }
.map-sctn .img-col {
    z-index: 10;
margin-left: 0;
margin-bottom: -14%;
}
    .map-sctn .btn-col p,
    .map-sctn .btn-green{
        width: 100%
    }
    .map-sctn .desktop{
        display:none;
    }
.map-sctn .text-col {
        clip-path: polygon(0 0, 100% 0, 100% 95%, 0% 100%);
        height: auto;
        width: 100%;
        order: 2;
        padding-top: 52px;
        padding-bottom: 52px;
        text-align: center;
    }
}
@media(min-width: 801px){
    .map-sctn .mobile{
        display:none;
    }
}
@media(max-width: 600px){
    .map-sctn .btn-col p{
        justify-content:center
    }
}
@media(min-width: 801px){
    .map-sctn {
    background-image: url(/wp-content/uploads/2024/05/commercial-bg-2.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    background-position:bottom center
}
}
<p>/***ABOUT***/
.about-sctn .img-col {
    width: 45%;
    position:relative;
    display: flex;
    justify-content: center;
    z-index: 1;
}
.about-sctn .img-col img{
    object-fit: cover;
}
.about-sctn {
    overflow:visible;
    margin-bottom: clamp(32px, 5%, 80px);
}
.about-sctn .text-col {
    display: flex;
    align-items: flex-end;
    text-align: center;
}
.about-sctn .carrier-img {
    position: absolute;
    z-index: 9;
    bottom: -5%;
    left: -18%;
    right: 18%;
}
.about-sctn .maintitle {
    font-size: clamp(22px, 3vw, 36px);
    font-family: var(--font-family--h3);
    font-weight: 800;
}
.about-sctn .span-maintitle {
    display: block;
    color: var(--primary);
    font-size: clamp(18px, 2.2vw, 26px);
    max-width: 615px;
    margin-right: auto;
    margin-left: auto;
}
.about-sctn .btn.btn-green-line {
    border-bottom: 2px solid var(--black);
    padding: 0 8px;
}
.about-sctn .title {
    color: var(--primary);
    font-weight: 700;
    font-size: clamp(16px, 1.9vw, 24px);
}
.about-sctn .text-inner {
    padding: 40px 40px 0 40px
}
@media(max-width: 1440px){
    .about-sctn .carrier-img {
        left: -10%;
    }
}
@media(max-width: 1024px){
    .about-sctn .carrier-img {
        left: 0;
        right: 5%;
    }
}
@media(max-width: 800px){
    .about-sctn {
        margin-top: -2.5%;
    }
    .about-sctn .img-col{
        width: 100%
    }
    .about-sctn .text-col{
        width: 100%;
        text-align:center
    }
    .about-sctn .text-inner {
        padding: 32px 0 20px 0;
max-width: 500px;
    margin-right: auto;
    margin-left: auto;
    }
.about-sctn .btn.btn-green-line{
    margin-right:auto;
    margin-left:auto;
}
}
/***BRANDS***/
.brands-sctn {
  background-color: #212121;
  color: var(--white);
  align-items: center;
  padding-top: 32px;
  overflow: visible;
  width: 100%;
  padding-bottom: 32px;
}
.brands-sctn .title-col {
  background-color: var(--primary);
  border-radius: 20px 20px 0 0;
  padding: 20px;
  width: 100%;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
}
.brands-sctn .maintitle {
  margin: 0;
}
.brands-sctn .others-col {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}
.brands-sctn .others-col p {
  margin-bottom: 0;
  font-family: var(--font-family--button);
  font-size: clamp(16px, 1.8vw, 20px);
}
.brands-sctn .logo-cont {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 32px 20px 0 20px;
  position: relative;
  width: 100%;
  justify-content: space-evenly;
  border-width: 2px;
  border-style: solid;
  border-image: linear-gradient(to bottom, var(--white), var(--black)) 1 100%;
  flex-wrap: wrap;
}
.brands-sctn .logo-cont picture{
  width: 18%
}
@media (max-width: 600px) {
  .brands-sctn .logo-cont picture {
    width: 30%;
  }
}
<p>/***RESIDENTIAL***/
.residential-sctn {
    padding-top: clamp(32px, 6%, 100px);
    padding-bottom: clamp(32px, 6%, 100px)
}
.residential-sctn .maintitle {
    text-transform: uppercase;
    text-align: center;
    font-size: clamp(19px, 2.6vw, 36px);
}
.residential-sctn .residential-cont {
    display:flex;
    justify-content: space-between;
}
.residential-sctn .btn-col {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    margin-top: 32px;
}
.residential-sctn .btn-col p{
    margin: 0;
    text-transform: uppercase;
    font-weight: 700;
    color: var(--primary)
}
.residential-sctn .resi-col p{
    margin: 0
}
.residential-sctn .resi-col{
    position:relative
}
.residential-sctn .subtitle {
    color: var(--primary);
    font-weight: 500;
}
.residential-sctn .resi-col-1{
    border-right: 2px solid  var(--black);
    padding: 32px 32px 32px 0
}
.residential-sctn .resi-col-1::after,
.residential-sctn .resi-col-2::after{
    content:"";
    width: 12px;
    height: 12px;
    background-color: var(--primary);
    position:absolute;
    display: flex;
    border-radius: 50%;
    top: 0;
    right: -7px;
}
.residential-sctn .resi-col-2{
    border-right: 2px solid var(--black);
    padding: 32px
}
.residential-sctn .resi-col-3{
    padding: 32px 0 32px 32px
}
.residential-sctn .btn-col a{
    font-family: var(--font-family--button);
    display: flex;
    justify-content: center;
    width: fit-content;
    padding: 8px 16px;
    font-weight: 900;
    border: 3px solid  var(--black);
    border-radius: 50px;
}
@media(max-width: 800px){
    .residential-sctn .resi-col{
        width:100%;
        padding: 24px;
    }
    .residential-sctn .residential-cont{
        flex-wrap:wrap;
        text-align:center;
    }
    .residential-sctn .resi-col-1,
    .residential-sctn .resi-col-2,
    .residential-sctn .resi-col-3{
        border-bottom: 2px solid var(--black);
        border-right: none;
    }
    .residential-sctn .resi-col-1::after,
    .residential-sctn .resi-col-2::after{
        bottom: -7px;
        top: inherit;
        left: 0;
        right: 0;
        margin: auto;
    }
    .residential-sctn .resi-col-3::after{
        content:"";
        width: 12px;
        height: 12px;
        background-color: var(--primary);
        position:absolute;
        display: flex;
        border-radius: 50%;
        bottom: -7px;
        top: inherit;
        left: 0;
        right: 0;
        margin: auto;
    }
    .residential-sctn .btn-col{
        flex-wrap: wrap;
        text-align: center;
    }
    .residential-sctn .maintitle{
        margin-bottom: 0px
    }
}
<p>/*FAQ Section*/
.faq-sctn {max-width: 1360px; background: black; padding: 60px 35px; color: white; margin-left: auto; margin-right: auto; position: relative;    z-index: 18; overflow: visible;}
.faq-sctn>.section-wrap>div {width: 100%;}
.faq-cont {display: flex;  flex-wrap: wrap; justify-content: space-between;}
.faq-sctn .maintitle {font-weight: 900; font-family: var(--font-family--h1); color: var(--primary); font-size: var(--font-size--h3); margin: 0;}
.faq-sctn .maintitle>.span-maintitle {color: white; font-weight: 400; display: block; font-size: 0.8em;}
.what {position: absolute; font-size: 80px; font-family: var(--font-family--h1); font-weight: 900; background: #0fa43e; line-height: 1; padding: 15px 35px; border-radius: 200px; right: 30px; top: -52px;}
.faq-cont .subtitle {font-size: 16px; margin: 0;}
.faq-cont summary {display: flex;align-items: center;justify-content: space-between; margin-bottom: 5px;}
.faq-cont details[open] > summary:after {content: '-';}
.faq-cont summary::after {content: '+'; font-size: 33px; line-height: 15px;}
.faq-cont details {width: 49%;border-bottom: 2px solid var(--primary);margin-bottom: 16px;padding-bottom: 12px;}
.faq-cont details p {margin: 0;}
@media (max-width: 800px) {
.faq-cont details {width: 100%;}
.what {transform: scale(0.65);}
.faq-sctn {padding: 40px 5%;}
}
@media (max-width: 500px) {
.faq-sctn .maintitle {text-align: center;}
}
<p>/*Blog section*/
.blog-sctn .maintitle {color: black;/* text-transform: uppercase; */font-size: clamp(25px, 4vw, 43px);font-weight: 900;font-family: var(--font-family--h1);line-height: 1.1;}
.blog-sctn .maintitle>span {display: block; font-size: clamp(19px, 4vw, 32px); font-weight: 400;}
.blg-txt {width: 40%;padding-right: 45px;padding-top: 25px;}
.blg-txt, .blg-cnt {display: flex; justify-content: center; flex-direction: column;}
.blog-sctn .section-wrap {align-items: center;}
.blg-cnt {width: 60%;padding-right: 26px;}
.blog-sctn {padding: 60px 30px;overflow-x: hidden;background-color: #e6e9ec;}
.blg-cnt hr {border: 0; border-style: dashed; border-bottom-width: 6px; border-color: var(--primary); background: none; margin-right: -35%;}
.blog-main {width: 100%;margin-bottom: 20px;}
.blog-sctn .maintitle .spe-tle {display: flex;align-items: center;justify-content: center;color: var(--primary);}
.blog-sctn .maintitle .spe-tle::after {content: '';flex-grow: 1;height: 2px;display: block;background-color: var(--primary);margin-left: 15px;margin-right: -22%;}
.blg-txt {padding-right: 0; padding-left: 33px; border-left: 2px solid var(--primary); padding-top: 0;}
@media (max-width: 1024px) {
.blg-cnt {width: 100%; padding: 0; margin-bottom: 35px;}
.blg-cnt .recent-post-list {justify-content: center;}
.blg-txt {padding: 0; width: 100%; border: 0;}
.recent-post-list-tle>li {justify-content: center; text-align:center}
}
@media (max-width: 500px) {
section.blog-sctn.section {padding: 40px 5%;}
.blog-sctn .maintitle {margin: 0; text-align: center;}
.blog-sctn .maintitle .spe-tle::after {display: none;}
}
/*CONTACT*/
.contact-section.section {
	background-color:#4ed042;
	padding-top:calc(13% + 50px);
}
.contact-section .su-tabs {
	background-color:transparent;
	padding: 0;
}
.contact-section h3 {
	text-align: center;
	font-size: clamp(24px, 3vw, 44px);
font-family: var(--font-family--h1);
    font-weight: 700;
}
.contact-section hr {
	margin: 0;
	height: 4px;
	background: #fff;
    margin-left: -64px;
    margin-right: -64px;
}
.contact-section .su-tabs-nav > span {
	min-width:295px;
	text-align:center;
	padding: 8px 15px 3px;
	color:var(--white);
	min-height:auto;
}
.contact-section .su-tabs-nav > span {
	background-color:rgb(0 0 0 / 57%);
	border-top-left-radius: 8px;
    border-top-right-radius: 8px;
}
.contact-section .su-tabs-nav > span:hover {
	background-color:rgb(0 0 0 / 70%);
}
.contact-section  .su-tabs-nav > .su-tabs-current {
	background-color:var(--black);
}
.contact-section .su-tabs-pane {
	background-color: rgb(0 0 0 / 80%);
	color: var(--white);
	padding: 80px 10px;
}
.contact-section .gravity-theme {
	max-width: 52em;
	margin: 0 auto;
}
.contact-section .gfield_radio {
	display: flex;
	flex-flow: wrap;
}
.contact-col-r {
	background: #000;
	color: #fff;
	padding: 50px 20px;
}
.contact-col-r h4 {
	font-family: var(--font-family--h1);
	font-weight: bold;
}
.contact-col-r a:hover {
	color: #fff;
}
.su-tabs-nav {
    display: flex;
}
.contact-section .gform_wrapper.gravity-theme input[type=text] {background: no-repeat; border-width: 0 0 2px 0;}
.contact-section .gform_wrapper.gravity-theme input[type=text]::placeholder {color: white;}
.contact-section textarea {background: rgb(255 255 255 / 25%); border-width: 0 0 2px 0;}
.contact-section textarea::placeholder {color: white;}
fieldset.gfield--type-radio {-ms-grid-column-span: 8!important; grid-column: span 8!important; display: flex!important; width: 100%;    flex-wrap: nowrap; align-items: center; gap: 16px; text-transform: uppercase;}
#field_submit {grid-column: span 4;}
.gform_wrapper.gravity-theme .gfield-choice-input+label {max-width: none;}
.contact-section .gfield_radio {gap: 12px;}
.gfield--type-radio .gfield_label {display: block;}
.contact-section .gform-button {background: black; padding: 7px 10px; border-radius: 10px; border: 2px solid white; text-transform: uppercase; letter-spacing: 1px;}
fieldset.gfield--type-radio>legend {float: left;margin-bottom: 0!important;}
.contact-col-r {font-size: 14px; margin-top: 22px;}
.contact-col-r h4 {font-size: 19px;}
.contact-section .su-tabs {margin: 0;}
.contact-col-r>p:last-of-type {margin: 0;}
.contact-section .three-quarters-col {
    background-color: #000000b3;
    color:var(--white);
    text-align:center;
    padding: 32px
}
@media (min-width:501px){
	.contact-section  .su-tabs-nav > span {
		max-width:295px;
	}
	.contact-section  .su-tabs-nav >.second-tab{
		margin-left:-5px;
	}
	.contact-section {
		background-image: url(/wp-content/uploads/2024/05/contact-home-bg.jpg);
        background-size: cover;
        background-position: center;
        background-repeat: no-repeat;
		clip-path: polygon(0 20%, 100% 0, 100% 100%, 0% 100%);
    	margin-top: -3%;
		box-shadow: inset 0 500vw 0 0 #4ed042d4;
	}
}
@media (max-width: 1100px) {
.contact-section>.section-wrap>.three-quarters-col, .contact-col-r {width: 100%;}
.contact-col-r {text-align: center; max-width: 443px;}
.contact-section{ clip-path: polygon(0 10%, 100% 0, 100% 100%, 0% 100%); }
.contact-section hr{margin-left: 0; margin-right: 0;}
}
@media (max-width: 800px) {
.contact-section .su-tabs-nav > span {max-width: none; border-radius: 0; margin-right: 0;}
.contact-section .su-tabs-nav >.second-tab {margin-left: 0;  margin-right: 0;}
.contact-section .su-tabs-pane {padding: 40px 30px 0 30px;}
section.section.contact-section {padding-left: 0; padding-right: 0;margin-top: -6%;clip-path: polygon(0 2%, 100% 0, 100% 100%, 0% 100%);padding-top: 80px;}
}
@media (max-width: 600px) {
fieldset.gfield--type-radio {-ms-grid-column-span: 12!important; grid-column: span 12!important; justify-content: center;}
#field_submit {grid-column: span 12;}
.contact-section h3 {max-width: 250px; margin-left: auto; margin-right: auto;}
}
@media (max-width: 475px) {
fieldset.gfield--type-radio {flex-direction: column;}
}
/*Audit*/
@media (max-width: 800px) {
.map-sctn .text-col {justify-content: center;}
.map-sctn .btn-col p {justify-content: center;}
.about-sctn .img-col {max-width: 420px;}
.brands-sctn .title-col {max-width: 337px;}
.brands-sctn .logo-cont {border: 0;padding: 0 25px 30px;}
.brands-sctn .logo-cont::before {content: ''; width: 100%; height: 2px; background: rgb(0,0,0); background: linear-gradient(90deg, rgba(0,0,0,1) 0%, rgba(255,255,255,1) 100%);}
.blg-cnt {width: 50%;}
.blg-cnt .recent-post-list {flex-direction: column; gap: 20px;}
.blg-txt {width: 50%; padding-left: 39px;}
.recent-post-list-tle>li {text-align: left;}
.recent-post-list-tle h4 {font-size: 16px;}
.contact-section .su-tabs-nav > span {width: 50%;}
}
@media (max-width: 500px) {
.ctabanner .ctacol-1 {display: inline;}
.ctabanner .span-maintitle {display: none;}
.ctabanner .maintitle::after {content: '?'; padding-left: 5px;}
.ctabanner span.h3-style {display: inline;}
.commercial-sctn .com-col {flex-direction: column; text-align: center;}
.commercial-sctn .com-col .text-col {padding-left: 0; margin-left: 0; border: 0; position: relative; padding-top: 11px; margin-top: 10px;}
.commercial-sctn .com-col .text-col::before {content: ''; width: 100%; height: 2px; background: rgb(53,187,23); background: linear-gradient(90deg, rgba(53,187,23,1) 0%, rgba(255,255,255,1) 100%); position: absolute; left: 0;  top: 0;}
.commercial-sctn .com-col-4 p a {justify-content: center;}
.wework-sctn .wework-list {padding: 57px 20px 5% 20px;}
.wework-sctn .wework-list>li {max-width: 186px!important;}
section.residential-sctn.section {padding-bottom: 54px;}
.contact-section .su-tabs-nav >.second-tab {margin-right: 0;}
.contact-section .su-tabs-nav > span {margin-right: 0; min-width: 1px;}
.su-tabs-nav {display: flex;}
.blg-cnt, .blg-txt {width: 100%; padding-left: 0;}
.recent-post-list-tle>li {justify-content: flex-start;}
}
.commercial-sctn .com-col-4 p a:hover {
    color: var(--white);
}
/*form*/
#gform_fields_1 label{
    display:none;
}
#gform_fields_1 input{
    width: 100%;
    background: rgb(255 255 255 / 25%);
    border-width: 0 0 2px 0;
    color:white!important
}
#gform_fields_1 input::placeholder{
    color:white!important
}
#gform_fields_1 .ginput_container_text,
#gform_fields_1 .ginput_container_phone{
    width: 100%
}
#gform_fields_1{
    display:flex;
    flex-wrap:wrap;
    justify-content: space-between;
}
#gform_fields_1 .gfield--type-phone,
#gform_fields_1 .gfield--type-text {
    width: 33%
}
#field_1_3 {
    padding-right: 0
}
#gform_fields_1 .gfield--type-textarea{
    width: 100%;
    padding-right: 0;
}
input#gform_submit_button_1 {
    width: 100%;
}
.gform_heading{
    display:none;
}
#field_2_8 {
    grid-column: 12 span!important;
    display: flex!important;
    justify-content: center;
    flex-direction:column;
    gap: 0
}
.gf_browser_chrome {
    margin-top: 20px!important;
    max-width: 600px!important;
    width: 100%;
}
.contact-section .gform_wrapper.gravity-theme input[type=tel],
.contact-section .gform_wrapper.gravity-theme input[type=email]{
    background: no-repeat;
    border-width: 0 0 2px 0;
}
.contact-section .gform_wrapper.gravity-theme input[type=tel]::placeholder,
.contact-section .gform_wrapper.gravity-theme input[type=email]::placeholder{
    color: white
}
.contact-section input[type="submit"]{
    background-color:var(--primary);
    font-weight: 700;
    text-transform:uppercase;
    letter-spacing: 2px
}
#gform_fields_2 textarea:focus {
    background-color: transparent
}
#field_2_8 .ginput_container,
#field_2_8  .gfield_radio{
    width: 100%;
    justify-content: center;
}
#field_2_8 .gfield_radio .gchoice{
    width: 46%;
    max-width: 100px
}
@media(max-width: 600px){
    #gform_fields_1 .gfield--type-phone,
    #gform_fields_1 .gfield--type-text{
        width: 100%
    }
}