html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}

body{
    font-family: "Manrope", sans-serif;
    color: #212935;
}
*{
    --assets: #008f99;
    --primary--700: #006675;
    --white: #fff;
    --grey:#e6e7ea;
    --greY-800: #131925;
}
.container{
    max-width: 1400px;
    width: 90%;
    margin: 0 auto;
    padding:0 30px;
    box-sizing: border-box;
}
img{
    display: block;
    width: 100%;
}
.logo{
    max-width: 200px;
}
.leng::before{
    content: "";
    display: block;
    width: 30px;
    height: 30px;
    background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg width='100%25' height='100%25' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M12 2.25C10.0716 2.25 8.18657 2.82183 6.58319 3.89317C4.97982 4.96451 3.73013 6.48726 2.99218 8.26884C2.25422 10.0504 2.06114 12.0108 2.43735 13.9021C2.81355 15.7934 3.74215 17.5307 5.10571 18.8943C6.46928 20.2579 8.20656 21.1865 10.0979 21.5627C11.9892 21.9389 13.9496 21.7458 15.7312 21.0078C17.5127 20.2699 19.0355 19.0202 20.1068 17.4168C21.1782 15.8134 21.75 13.9284 21.75 12C21.7473 9.41498 20.7192 6.93661 18.8913 5.10872C17.0634 3.28084 14.585 2.25273 12 2.25ZM9.52782 15.75H14.4722C13.9688 17.4694 13.125 19.0191 12 20.2397C10.875 19.0191 10.0313 17.4694 9.52782 15.75ZM9.1875 14.25C8.93876 12.7603 8.93876 11.2397 9.1875 9.75H14.8125C15.0613 11.2397 15.0613 12.7603 14.8125 14.25H9.1875ZM3.75 12C3.74935 11.2392 3.85442 10.4819 4.06219 9.75H7.66782C7.44407 11.2417 7.44407 12.7583 7.66782 14.25H4.06219C3.85442 13.5181 3.74935 12.7608 3.75 12ZM14.4722 8.25H9.52782C10.0313 6.53062 10.875 4.98094 12 3.76031C13.125 4.98094 13.9688 6.53062 14.4722 8.25ZM16.3322 9.75H19.9378C20.3541 11.2211 20.3541 12.7789 19.9378 14.25H16.3322C16.5559 12.7583 16.5559 11.2417 16.3322 9.75ZM19.3472 8.25H16.0256C15.6429 6.74392 15.0001 5.31623 14.1263 4.03125C15.2427 4.33127 16.2839 4.86162 17.1831 5.58818C18.0823 6.31475 18.8194 7.22146 19.3472 8.25ZM9.87375 4.03125C8.9999 5.31623 8.35713 6.74392 7.97438 8.25H4.65282C5.18056 7.22146 5.91772 6.31475 6.81689 5.58818C7.71606 4.86162 8.75733 4.33127 9.87375 4.03125ZM4.65282 15.75H7.97438C8.35713 17.2561 8.9999 18.6838 9.87375 19.9688C8.75733 19.6687 7.71606 19.1384 6.81689 18.4118C5.91772 17.6852 5.18056 16.7785 4.65282 15.75ZM14.1263 19.9688C15.0001 18.6838 15.6429 17.2561 16.0256 15.75H19.3472C18.8194 16.7785 18.0823 17.6852 17.1831 18.4118C16.2839 19.1384 15.2427 19.6687 14.1263 19.9688Z' fill='currentcolor'%3e%3c/path%3e%3c/svg%3e");
    background-size: contain;
    background-position: center;
}
.first_screen>div{
    padding: 50px;
    margin-top: 30px;
    background-image:linear-gradient(100deg, #0192ab0d, #00b0a678);
    border-radius: 10px;
    border: 1px solid var(--grey);
}
.container_th{
    padding: 60px;
    background-image:linear-gradient(100deg, #0192ab0d, #00b0a678);
    border-radius: 10px;
    border: 1px solid var(--grey);
    text-align: center;
    margin: auto;
}
.wrapper_th .logo{
    margin: 0 auto 20px;
}
.wrapper_th{
    height: 100vh;
    display: flex;
    align-items: center;
    background: var(--grey);
    justify-content: center;
}
.container_th .img_f{
    max-width: 400px;
    margin: 0 auto;
}
.container_th p{
    max-width: 800px;
    margin: 20px auto;
}
header{
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 30px;
    margin: 0 0 100px;
}
.nav{
    display: flex;
    gap: 30px;
}
.nav a{
    text-decoration: none;
    color: #3b4454;
    font-weight: 800;
    font-size: 18px; 
}
.leng{
    display: flex;
    align-items: center;
    gap: 8px;
    text-decoration: none;
    font-size: 18px;
    color: #3b4454;
}
h1{
    font-size: 34px;
    font-weight: 800;
    margin: 0 0 30px;
    line-height: 1.3;
}
h1 span{
    color: var(--assets);
}
p{
    font-size: 18px;
    line-height: 1.4;
}
.first_screen p{
    font-weight: 500;
    margin: 0 0 10px;
}
.first_body{
    display: grid;
    grid-template-columns: 1.3fr 1fr;
}
.toform{
    background: var(--greY-800); 
    font-size: 20px;
    font-weight: 700;
    line-height: 1.1;
    color: var(--white);
    text-decoration: none;
    padding: 10px 20px;
    border-radius: 8px;
    display: flex;
    align-items: center;
    gap: 20px;
    width: 100%;
    max-width: 240px;
    justify-content: center;
    text-align: center;
    margin: 40px 0;
    box-sizing: border-box;
    padding-right: 60px;
    transition: all .4s linear;
}
.toform img{
    width: 30px;
}
.toform:hover{
    background: var(--primary--700); 
}
.energo_block>div{
    margin: 60px auto;
    padding: 80px 150px;
    background: #01483db5;
    position: relative;
    border-radius: 10px;
    border: 1px solid var(--primary--700);
    color: #fff;
}
.energo_block>div::before{
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
    background: url(./img/en.jpg) no-repeat;
    background-size: cover;
    background-position: center;
}
h2{
    font-size: 28px;
    font-weight: 800;
    margin: 0 0 30px;
    text-align: center;
    line-height: 1.3;
}
.energo_block p{
    font-size: 20px;
    font-weight: 500;
}
.whay_we{
    padding: 60px 0;
    background-image: linear-gradient(100deg, #0192ab, #00b0a6);
    margin-bottom: 60px;
}
.whay_we ul{
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
}
.whay_we li{
    padding: 20px;
    border: 2px solid var(--primary--700);
    border-radius: 10px;
}
.icon{
    width: 80px;
    min-width: 80px;
    height: 80px;
    border-radius: 50%;
    background: var(--primary--700);
    padding: 10px;
}
.grid_i{
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 20px;
    margin-bottom: 20px;
}
.grid_i span{
    font-size: 42px;
    color: #fff;
    font-weight: 800;
}
.whay_we li p{
    font-weight: 600;
    text-align: center;
}
.content_f li>span{
    font-family: "Lilita One", sans-serif;
    font-size: 30px;
    font-weight: 500;
    width: 50px;
    height: 50px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #00b0a6;
    position: absolute;
    top: 10px;
    left: 10px;
    border: 1px solid #212935;
}
.inwest>div{
    padding: 50px; 
    background: #01483dc5;
    position: relative;
    border-radius: 10px;
    overflow: hidden;
    color: #fff;
} 
.inwest>div::before{
    content:"";
    display: block;
    width: 100%;
    height: 100%;
    background: url(./img/file_2170202.jpg ) no-repeat;
    background-size: cover;
    position: absolute;
    top: 0px;
    left: 0px;
    z-index: -1;
}
.content_f li{
    background:linear-gradient(100deg, #00242a54, #11312f3d);
    backdrop-filter: blur(10px);
    padding: 40px 30px 30px 50px;
    border: 2px solid #ffffffb0;
    border-radius: 10px;
    position: relative;
    width: 30%;
}
.content_f{
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 20px;
}
.content_f h4{
    font-size: 26px;
    padding-left: 30px;
    font-weight: 600;
    margin: 0 0 15px;
    text-shadow: 0 1px 3px #131925;
}
.img_content{
    max-width: 400px;
}
.num_block>div{
    padding: 50px;
    margin:60px auto 0;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 40px;
}
.icon_d{
    width: 50px;
    min-width: 50px;
    height: 50px;
    border-radius: 50%;
    background: #006675;
    padding: 10px;
    box-sizing: border-box;
}
.text_doc h3{
    color: #006675;
    font-weight: 600;
    font-size: 24px;
    margin: 0 0 10px;
}
.list_do li{
    display: flex;
    gap: 10px;
    margin: 0 0 20px;
    max-width: 600px;
}
.list_do li p{
    font-weight: 600;
}
.num_block h2{
    text-align: left;
}
.num_block .toform{
    margin: 0 auto 60px;
}
.in_block>div{
    padding: 50px;
    border-radius: 10px;
    background-image: linear-gradient(100deg, #0192ab0d, #00b0a678);
    border-radius: 10px;
    border: 1px solid var(--grey);
}
.inv_img{
    height: 200px;
    border-radius: 10px;
    overflow: hidden;
}
.inv_img img{
    max-width: 1000px;
    max-height: 1000px;
    height: 100%;
    object-fit: cover;
    object-position: center;
}
.list_inv{
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
}
.list_inv li{
    border: 1px solid var(--assets);
    border-radius: 10px;
    background: var(--grey);
    padding-bottom: 10px;
}
.list_inv h3{
    font-size: 22px;
    font-weight: 600;
    color: #131925;
    margin: 10px;
}
.list_inv p{
    text-align: center;
    font-size: 30px;
    font-weight: 900;
    color: #006675;
}
.list_inv p span{
    font-size: 16px;
    display: block;
    text-align: center;
}
.group_block>div{
    padding: 50px;
    margin: 60px auto;
    background: #ecf9f9;
    border: 1px solid #00adb2;
    border-radius: 10px;
    color: #006675;
}
.img_group{
    max-width: 300px;
}
.group_block h2{
    text-align: left;
    margin: 0 0 20px;
    font-size: 26px;
}
.grid_group{
    display: flex;
    gap: 60px;
    align-items: center;
    justify-content: space-between;
}
.group_partner{
    min-width: 320px;
}
.group_partner .toform{
    background-color: #008f99;
    margin: 30px 0 0;
}
.type_block>div{
    padding: 50px;
    margin: 60px auto;
    background-image: linear-gradient(100deg, #0192ab0d, #00b0a678);
    border-radius: 10px;
    border: 1px solid var(--grey);
}
.type_container{
    padding: 20px;
    background: linear-gradient(100deg, #0192ab, #00b0a6);
    color: #fff;
    border-radius: 10px;
}
.type_container h3{
    font-size: 22px;
    font-weight: 600;
    margin: 0 0 20px;
    color: #131925;
}
.type_items{
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 30px;
}
.type_items li{
    padding: 10px;
    background: #ffffffd7;
    color: #006675;
    padding-left: 60px;
    border-radius: 10px;
    position: relative;
}
.type_items li::before{
    content: "";
    display: block;
    width: 40px;
    height: 40px;
    position: absolute;
    left: 10px;
    top: 13px;
    background: url(./img/ar.svg) no-repeat;
    background-size: contain;
}
.type_items li:not(:last-child){
    margin: 0 0 10px;
}
.type_items li p{
    color: #131925;
    font-size: 14px;
    display: inline-block;
}
.type_items li span{
    font-size: 20px;
    color: #006675;
    font-weight: 600; 
    display: inline-block;
}
.swiper {
    width: 100%;
    height: 100%;
  }

  .swiper-slide { 
    font-size: 18px;
    background: #fff;
    display: flex;
    width: 340px;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    border-radius: 10px;
    overflow: hidden;
    border: 1px solid #131925;
  }

  .swiper-slide img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
  .img_slid{
    height: 200px;
    width: 100%;
  }
  .img_slid  img{
    display: block;
    max-width: 1000px;
    max-height: 1000px;
    height: 100%;
    width: 100%;
    object-fit: cover;
    object-position: center;
  }
  .local{
    font-size: 10px;
    padding:4px 10px;
    border: 1px solid #006675;
    border-radius: 10px ;
    text-align: center;
    display: inline-block;
  }
  .top_people img{
    width: 100px;
  }
  .top_people p{
    font-size: 12px;
    line-height: 1;
  }
  .top_people p span{
    font-weight: 600;
    color: #006675;
    display: block;
    text-align: left;
  }
  .top_people{
    display: flex;
    gap: 10px;
  }
  .top{
    display: flex;
    align-items: center;
    justify-content: space-between;
  }
  .all_block{
    padding: 20px;
  }
  .name{
    font-weight: 800;
    font-size: 20px;
    color: #011a1e;
    margin: 20px 0;
  }
  .more_info{
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 10px;
  }
  .more_info{
    padding-bottom: 20px;
    border-bottom: 2px solid #006675;
  }
  .more_info li{
    padding: 10px;
    background: var(--grey);
    border-radius: 10px;
    box-sizing: border-box;
  }
  .more_info li span{
    font-size: 14px;
    color: #006675;
    font-weight: 600;
    margin: 0 0 10px;
    display: block;
  }
  .more_info li p{ 
    font-weight: 900;
    font-size: 14px;
  }
  p.more_info{
    display: block;
    padding: 10px;
    margin-top: 10px; 
    border: 0;
    font-size: 14px;
    background:linear-gradient(100deg, #0192ab0d, #00b0a678);
  }
  .object_block{
    padding: 60px 0;
    width: 100%;
    box-sizing: border-box;
    background: #e3fde9;
    position: relative;
  }
  .objects-mask {
    z-index: 40;
    background-image: linear-gradient(90deg, #e3fde900, #e3fde9 80%);
    margin-left: 32em;
    position: absolute;
    inset: 0% 0 0% 50%;
  }
  .objects-mask.is-left {
    background-image: linear-gradient(90deg, #e3fde9 20%, #e3fde900);
    width: auto;
    margin-left: 0;
    margin-right: 32em;
    left: 0;
    right: 50%;
}
.navidat>div{
    width: 50px;
    z-index: 200;
    padding: 10px;
    height: 50px;
    border-radius: 50%;
    background: #006675;
    display: flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
}
.navidat>div path{
    stroke: #fff;
    fill: #fff;
}
.navidat{
    display: flex;
    justify-content: center;
    gap: 30px;
    margin-top: 30px;
}
.form_block>div{
    margin: 60px auto;
    padding: 60px;
    background: linear-gradient(100deg, #0192ab, #00b0a6);
    border-radius: 10px;
    border: 1px solid #006675;
}
.form_contain h2{
    color: #fff;
}
.form_contain form{
    max-width: 400px;
    margin: 0 auto;
}
.form_contain input{
    display: block;
    width: 100%;
    padding: 14px;
    border-radius: 10px;
    border: none;
    font-size: 16px;
    margin: 0 0 10px;
    box-sizing: border-box;
    outline: #008f99;
}
.form_contain button{
    font-size: 18px;
    padding: 14px;
    display: block;
    width: 100%;
    box-sizing: border-box;
    background: #013740;
    border-radius: 10px;
    font-weight: 600;
    color: #fff;
    cursor: pointer;
    transition: all .3s linear;
    border: 1px solid #212935;
}
.form_contain button:hover{
    background: #006675;
}
.form_contain p{
    font-size: 13px;
    color: #fff;
    margin-top: 10px;
}
html{
    scroll-behavior: smooth;
}
.pop_up_form{
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    background: #00657592;
    display: none;
    align-items: center;
    justify-content: center;
}
.pop_up_form.show{
    display: flex;
}
.pop_up_form .pop_up_con{
    max-width: 400px;
    padding: 30px 20px;
    width: 100%;
    width: 90%;
    box-sizing: border-box;
    background-color: #fff;
    color: #006675;
    border-radius: 10px;
    box-shadow: 0 10px 20px #006675;
}
.pop_up_form .pop_up_con input{
    background: var(--grey);
}
.pop_up_form .pop_up_con h2{
    color: #006675;
    font-size: 18px;
    text-align: left;
    margin: 0 0 20px;
}
.pop_up_form .pop_up_con p{
    color: #011a1e;
}
.wrapper>div{
    opacity: 0;
    transform: translateY(20px);
    transition: opacity 0.5s ease-out, transform 0.6s ease-out;
}
.wrapper>div.visible {
    opacity: 1;
    transform: translateY(0);
    transition-delay: var(--animation-delay);
  }
.close{
    font-weight: 900;
    text-decoration: none;
    font-size: 26px; 
    margin-left: auto;
    display: block;
    color: #006675;
    width: 20px;
}
.faq-section {
    max-width: 800px;
    margin: 20px auto; 
    border-radius: 5px; 
}

.faq-section h1 {
    text-align: center;
    margin-bottom: 20px;
    color: #333;
}
.faq_block>div{
    padding: 60px;
    background: #ecf9f9;
    border: 1px solid #00adb2;
    border-radius: 10px;
}
.accordion {
    border-top: 1px solid #ccc;
}

.accordion-item {
    border: 1px solid #008f99;
    margin: 0 0 14px;
}

.accordion-header {
    width: 100%;
    padding: 15px;
    text-align: left;
    background: #008f99;
    color: white;
    border: none;
    outline: none;
    cursor: pointer;
    font-size: 16px;
    transition: background 0.3s;
}

.accordion-header:hover {
    background: #00adb2;
}

.accordion-content {
    display: none;
    padding: 15px;
    background: #f9f9f9;
    font-size: 14px;
    color: #333;
}
.accordion-content li{
    list-style: decimal;
    font-size: 16px;
    margin: 0 0 10px;
}
.accordion-content p {
    margin: 0;
}

.accordion-content ul {
    margin: 10px 0 0 20px;
}
footer{
    background: #1c2129;
    margin-top: 60px;
    padding: 20px 0;
    display: block;
}
.footer_bottom{
    margin-top: 30px;
    padding-top: 10px;
    border-top: 1px solid #dfd9d97f;
}
.footer_bottom div{
    color: #ffffffac;
}
.footer_bottom a{
    color: #008f99;
}
.footer_bottom {
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.top_foot{
    display: flex;
    gap: 40px;
    justify-content: space-between;
}
.top_foot p{
    color: #ffffff92;
    font-size: 13px;
}
@media screen and (max-width:1200px) {
    .icon {
        width: 50px;
        min-width: 50px;
        height: 50px;
    }
    .whay_we li{
        padding: 10px;
    }
    .grid_i span{
        font-size: 32px;
    }
    .content_f li{
        padding: 26px;
    }
    .content_f h4{
        padding-left: 40px;
        font-size: 22px;
    }
    .content_f li{
        width: 43%;
    }
    .list_inv p{
        font-size: 22px;
    }
    .inv_img{
        height: 160px;
    }
    .list_inv{
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
    }
    .list_inv li{
        width: 40%;
    }
}
@media screen and (max-width:992px) {
    .container{
        padding: 30px !important;
    }
    .logo{
        max-width: 150px;
    }
    .nav a{
        font-size: 14px;
    }
    .leng{
        font-size: 16px;
    }
    p{
        font-size: 16px;
    }
    .first_body{
        gap: 30px;
    }
    .num_block>div{
        flex-direction: column-reverse;
    }
    .num_block h2{
        text-align: center;
    }
}
@media screen and (max-width:840px) {
    .first_body{
        display: flex;
        flex-direction: column;
    }
    .whay_we ul, .list_inv, .content_f {
        display: flex;
        flex-direction: column;
        max-width: 400px;
        margin: 0 auto;
    }
    .list_inv li{
        width: 100%;
    }
    .grid_group{
        flex-direction: column;
    }
    .type_items{
        display: flex;
        flex-direction: column;
    }
    .content_f li{
        width: 100%;
        box-sizing: border-box;
    }
}
@media screen and (max-width:700px){
    .nav{
        display: none;
    }
    .container{
        padding: 16px !important;
    }
    header{
        margin: 0 0 40px;
    }
    h1{
        font-size: 30px;
        margin: 0 0 20px;
    }
    .toform{
        margin: 30px auto;
    }
    .top_foot{
        flex-direction: column;
        gap: 20px;
    }
    .text_doc h3{
        font-size: 20px;
    }
    .wrapper .container{
        width: 95%;
    }
    .footer_bottom{
        flex-direction: column-reverse;
        align-items: start;
        gap: 10px;
    }
    .object_block{
        padding-left: 10px;
        padding-right: 10px;
        width: 100%;
        box-sizing: border-box;
    }
    .form_contain h2{
        font-size: 24px;
    }
    .grid_group{
        gap: 30px;
    }
    .group_block h2{
        font-size: 22px;
    }
    .first_screen>div{
        margin-top: 10px;
    }
    
}