.section-hero {


    display: flex;


    padding-top: var(--header-comp);


    background-color: var(--bg-l-green);


    text-align: center;


    flex-flow: column;


}





.section-hero.sm .section-hero-container {


    padding-block: var(--tb-val-m);


}





.section-hero.big .section-hero-container {


    padding-block: 124px var(--tb-val-xl);


}





.section-hero-bg {


    display: block;


    position: absolute;


    top: 0;


    left: 0;


    width: 100%;


    height: 100%;


    -o-object-fit: cover;


    object-fit: cover;


    -o-object-position: center center;


    object-position: center center;


    z-index: 0;


}





.section-hero-container {


    position: relative;


    margin-block: auto;


    padding-block: var(--tb-val-m) var(--tb-val-l);


    padding-inline: var(--p-inline);


}





.section-hero-info {


    margin-inline: auto;


    max-width: 1125px;


}





.section-hero-desc {


    /* max-width: 900px; */


    margin-top: 40px;


}


@media screen and (max-width: 1600px) {


    .section-hero-info {


        max-width: 890px;


    }


}





@media (max-width: 1440px) {


    .section-hero-desc {


        margin: 40px auto 0;


        max-width: 850px;


    }


}





.section-hero-btns {


    display: flex;


    margin-top: 70px;


    justify-content: center;


    align-items: center;


    gap: 20px;


}





.section-hero-half {


    text-align: left;


}





.section-hero-half-container {


    display: flex;


    padding-block: 30px var(--tb-val-l);


    padding-inline: var(--p-inline);


    justify-content: space-between;


    align-items: center;


    gap: 20px;


}





.section-hero-half-info {


    max-width: 676px;


}





.section-hero-half-media {


    position: relative;


    margin-right: 65px;


    width: 100%;


    max-width: 611px;


}





.section-hero-half-media-ball {


    position: absolute;


    animation: float 4s ease-in-out 0s infinite normal none running;


}





.section-hero-half-media-ball.one {


    top: 10px;


    left: 163px;


}





.section-hero-half-media-ball.two {


    right: 0;


    bottom: 0;


    animation-duration: 6s;


}





@media screen and (max-width: 1440px) {


    .section-hero.big .section-hero-container {


        padding-top: 70px;


    }





    .section-hero-desc {


        margin-top: 20px;


    }





    .section-hero-btns {


        margin-top: 60px;


    }





    .section-hero-half-container {


        padding-top: 68px;


    }





    .section-hero-half-info {


        max-width: 509px;


    }





    .section-hero-half-media {


        margin-right: 60px;


        max-width: 446px;


    }





    .section-hero-half-media-bg {


        max-width: 360px;


    }





    .section-hero-half-media-ball.one {


        left: 120px;


        max-width: 108px;


    }





    .section-hero-half-media-ball.two {


        max-width: 248px;


    }


}





@media screen and (max-width: 1024px) {


    .section-hero.big .section-hero-container {


        padding-block: 176px 242px;


    }





    .section-hero-info {


        max-width: 512px;


    }





    .section-hero-desc {


        margin-top: 16px;


    }





    .section-hero-btns {


        margin-top: 32px;


    }





    .section-hero-half-container {


        display: grid;


        padding-top: 48px;


        grid-template-columns: repeat(2, 1fr);


    }





    .section-hero-half-media {


        margin-right: 0;


    }





    .section-hero-half-media-bg {


        max-width: 270px;


    }





    .section-hero-half-media-ball.one {


        left: 89px;


        max-width: 81px;


    }





    .section-hero-half-media-ball.two {


        max-width: 187px;


    }


}





@media screen and (max-width: 552px) {


    .section-hero.big .section-hero-container {


        padding-block: 60px 80px;


    }





    .section-hero br:not(.dh) {


        display: none;


    }





    .section-hero-btns {


        gap: 16px;


    }





    .section-hero-half-container {


        padding-top: 32px;


        grid-template-columns: 1fr;


        gap: 40px;


    }





    .section-hero-half-info {


        max-width: 100%;


    }





    .section-hero-half-media-bg {


        margin-left: 50px;


        max-width: 192px;


    }





    .section-hero-half-media-ball.one {


        left: 113px;


        max-width: 58px;


    }





    .section-hero-half-media-ball.two {


        max-width: 133px;


    }


}





.page-template-blogpage .section-hero-btns .btn-def {


    padding: 9px 20px;


    font-size: 17px;


}





.page-template-blogpage .section-hero-btns .border {


    background-color: rgba(255, 255, 255, 0.7);


    border: 1px solid var(--acc-l-line-green);


}





.page-template-blogpage .section-hero-btns {


    margin-top: 60px;


}





@media screen and (max-width: 1024px) {


    .page-template-blogpage .section-hero-info {


        max-width: none;


    }





    .page-template-blogpage .section-desc{


        max-width: 512px;


    }


    .page-template-blogpage .section-heading-xl{


        max-width: 512px;


        margin: 0 auto;


    }





    .page-template-blogpage .section-hero-container{


        padding-inline: 0;


        /* padding: 32px 0 42px; */


    }


    .page-template-blogpage .section-hero-btns {


        justify-content: start;


        padding: 0 40px 10px;


        margin-top: 32px;


        gap: 16px;


        overflow-x: auto;





    }


}











@media screen and (max-width: 552px){


    .page-template-blogpage .section-desc{


        padding-inline: 20px;


    }


    .page-template-blogpage .section-heading-xl{


        padding-inline: 20px;


    }


    .page-template-blogpage .section-hero-btns{


        padding: 0 15px 10px;


    }


}