@charset "UTF-8";

/*
Theme Name: Main
Description: Make by developers
Requires at least: 5.3
Tested up to: 6.0
Requires PHP: 7.4
Version: 1.0 
*/

:root{
    --color-main: #000;
    --color-second: #001B93;
    --homepage-change-speed: 0.4s;
}

@font-face {
    font-family: Loos;
    font-weight: 400;
    src: url(/wp-content/themes/main/fonts/loos-wide-regular.otf);
}

@font-face {
    font-family: Loos;
    font-weight: 600;
    src: url(/wp-content/themes/main/fonts/loos-wide-medium.otf);
}


*{
    font-family: Loos;
}

html, body{
    padding: 0;
    margin: 0;
	overflow-x: hidden;
}


@keyframes rotate {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}
@keyframes rotate_right {
    from { transform: rotate(360deg); }
    to { transform: rotate(0deg); }
}

h1, h2, h3, h4, h5, h6, p, a, ul, li{
    margin: 0;
    padding: 0;
    list-style-type: none;
}

a{
    text-decoration: none;
    color: var(--color-main);
}

h2{
	font-weight: 400;
	font-size: clamp(79px, 4.688vw, 90px);
	line-height: 115%;
}

.container{
    padding-inline: 40px;
    margin: 0 auto;
}

.header-top{
    padding-top: 40px;
    display: flex;
    position: relative;
    z-index: 10;
}

.mb-160{
    margin-bottom: 160px;
}


.page-header .header-top-content,
.page-header .logo_wrapper, 
.page-header .header-content{
    background: #f4f7fc;
}

.header-top-content{
    display: flex;
    position: relative;
    /*overflow: hidden;*/
    justify-content: space-between;
    border-top-left-radius: 50px;
    border-top-right-radius: 50px;
    flex: 1;
    z-index: 10;
}

.white_bg {
    padding: 28px 53px 25px 14px;
    z-index: 2;
}

.header-top-right{
    display: flex;
    align-items: center;
    gap: 80px;
}

.header-top-content{
    padding-top: 0px;
    padding-inline: 21px;
    align-items: center;
}

.logo_wrapper{
    display: flex;
    position: relative;
}

.white_bg{
    background-color: #fff;
    border-bottom-right-radius: 50px;
}

.header-nav ul {
    display: flex;
    align-items: center;
    gap: 55px;
    padding: 22px 61px;
    background-color: #fff;
    border-radius: 50px;
    font-weight: 400;
    box-shadow: 3px 3px 3px 0px #001B930D;
}

.header-nav a{
    font-size: clamp(18px, 1.4vw, 25px);
    color: var(--color-second);
}



.header-phone,
.header-mail{
    font-size: clamp(16px, 0.99vw, 19px);
    font-weight: 400;
}

.header-phone a,
.header-mail a{
    color: var(--color-second);
}

.header-search{
    padding: 8px 20px;
    border: 1px var(--color-second) solid;
    border-radius: 30px;
    display: flex;
    align-items: center;
    cursor: pointer;
}

/*.header-content{

    border-top-right-radius: 0;
    padding: 30px;
    padding-top: 97px;
    padding-bottom: 105px;
    position: relative;
    overflow: hidden;
    min-height: 580px;
}*/

.header-content-image{
    position: absolute;
    right: -427px;
    bottom: -427px;
    width: 1541px;
    height: 1541px;
    animation: rotate_right 60s infinite linear; 
}
 
.header-content-wrapper{
    max-width: 986px;
    position: relative;
    z-index: 1;
}

.header-content-wrapper h1{
    font-size: 70px;
    font-weight: 400; 
    margin-bottom: 30px;
}

.header-content-wrapper h1 span{
    color: var(--color-second);
}

.header-card{
    border-radius: 30px;
    background: #FFFFFF80;
    display: flex;
    gap: 5px;
    align-items: center;
    padding-right: 16px;
    padding-left: 8px;
    max-width: 947px;
    box-sizing: border-box;
    margin-bottom: 50px;
}

.header-card p{
    color: var(--color-second);
    font-weight: 400;
    font-size: 22px;
    line-height: 135%;
}

.buttons_wrapper{
    display: flex;
    gap: 20px;
}

.btn{
    padding: 19px 36px;
    border-radius: 50px;
    width: fit-content;
    border: 0;
    cursor: pointer;
    font-size: clamp(19px,1.146vw, 22px);
    font-weight: 500;
}

.btn-blue{
    color: #fff;
    background-color: var(--color-second);
}

.btn-white{
    background-color: #fff;
    color: var(--color-second);
}

.homepage .header-content{
    height: 750px;
    box-sizing: border-box;
}

.homepage .white_bg,
.homepage .header-nav,
.homepage .header-top-right,
.homepage .header-content-wrapper{
    position: relative;
    z-index: 2;
}

.home-dark .header-phone a, .home-dark .header-mail a{
    color: #fff;
}

.home-dark .header-search{
    filter: brightness(0) invert(1);
}

.homepage .header-content-wrapper{
    position: absolute;
    right: 40px;
    top: 75px;
    display: flex;
    gap: 30px;
    flex-direction: column;
}

.header-content-card{
    background-color: #fff;
    border-radius: 30px;
    width: 610px;
    padding: 35px 45px;
    box-sizing: border-box;
}

.header-content-card h2,
.header-content-card p{
    color: var(--color-second);
}

.header-content-card h2{
    font-size: 45px;
}

.header-content-card p{
    font-size: 28px;
}

.header-card-title{
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 55px;
}

/* white img */

.homepage .header-content:after{
    content: '';
    position: absolute;
    display: block;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    z-index: 1;
    background: url(./images/home-white.svg);
    background-color: #f9fbfd;
    background-size: 1840px 850px;
    background-position: bottom;
}

.homepage .logo_wrapper:after{
    content: '';
    position: absolute;
    display: block;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    z-index: 1;
    background: url(./images/home-white.svg);
    background-color: #f9fbfd;
    background-size: 1840px 850px;
    background-position: top left;
}

.homepage .header-top-content:after{
    content: '';
    display: none;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    background: url(./images/home-white.svg);
    background-color: #f9fbfd;
    background-size: 1840px 850px;
    background-position: top right;
}

/* dark img */

.homepage .header-content::before{
    content: '';
    position: absolute;
    display: block;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    z-index: 0;
    background: url(./images/home-dark.svg);
    background-color: #f9fbfd;
    background-size: 1840px 850px;
    background-position: bottom;
}

.homepage .logo_wrapper:before{
    content: '';
    position: absolute;
    display: block;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    z-index: 0;
    background: url(./images/home-dark.svg);
    background-color: #f9fbfd;
    background-size: 1840px 850px;
    background-position: top left;
}

.homepage .header-top-content:before{
    content: '';
    display: none;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 0;
    background: url(./images/home-dark.svg);
    background-color: #f9fbfd;
    background-size: 1840px 850px;
    background-position: top right;
}

/* end dark img */

.home-white .header-content::after,
.home-white .logo_wrapper::after,
.home-white .header-top-content::after{
    z-index: 1;
    animation: show_homepage var(--homepage-change-speed) forwards;
}

.home-dark .header-content::before,
.home-dark .logo_wrapper::before,
.home-dark .header-top-content::before{
    z-index: 1;
    animation: show_homepage var(--homepage-change-speed) forwards;
}

@keyframes show_homepage {
    from { opacity: 0; }
    to { opacity: 1; }
}

.home-dark .header-content::after,
.home-dark .logo_wrapper::after,
.home-dark .header-top-content::after{
    z-index: 0;
}

.home-white .header-content::before,
.home-white .logo_wrapper::before,
.home-white .header-top-content::before{
    z-index: 0;
}



.homepage{
    position: absolute;
    width: 100%;
    opacity: 1;
}

.home-dark .dark-icons{
    display: block;
}

.home-white .white-icons{
    display: block;
}

.icons{
    position: relative;
    display: none;
    top: -97px;
    z-index: 2;
}

.icons > div{
    position: absolute;
}

.dark-icon-1 { top: 73px; left: 70px }
.dark-icon-2 { top: 500px; left: 80px }
.dark-icon-3 { top: 170px; left: 220px }
.dark-icon-4 { top: 70px; left: 660px }
.dark-icon-5 { top: 300px; left: 780px }

.white-icon-1 { top: 70px; left: 110px }
.white-icon-2 { top: 30px; left: 700px }
.white-icon-3 { top: 190px; left: 900px }
.white-icon-4 { top: 330px; left: 190px }
.white-icon-5 { top: 550px; left: 50px }



.info_top_title{
    flex: 1;
}

.info_top_title h2{
    max-width: 845px;
    padding-top: 12px;
    padding-bottom: 48px;
}

.info_top_title span{
	color: var(--color-second);
}

.info_top_list{
    padding-top: 35px;
    padding-right: 75px;
    padding-left: 100px;
    width: 832px;
    box-sizing: border-box;
    background-color: #f8f9fb;
    border-top-left-radius: 50px;
    border-top-right-radius: 50px;
} 

.info_top{
    display: flex;
    height: 370px;
}  

.info_top ul{
    display: flex;
    flex-direction: column;
    gap: 30px;
}

.info_top ul li{
    font-weight: 400;
    width: 682px;
    max-width: 100%;
    font-size: 23px;
    line-height: 135%;
    position: relative;
    color: #001B93;
}
.info_top ul li:after{
    content: '';
    left: -40px;
    top: 4px;
    width: 17px;
    height: 17px;
    display: block;
    position: absolute;
    background-color: #63BDD0;
    border-radius: 50%;
}

.info_cards_wrapper{
    padding-top: 110px;
    padding-bottom: 60px;
    padding-inline: 20px;
    border-radius: 50px;
    box-sizing: border-box;
    border-top-right-radius: 0;
    background-color: #f8f9fb;
    display: grid; 
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
    gap: 20px;
}

.info_card{
    padding-block: 80px;
    padding-left: 35px;
    padding-right: 50px;
    box-sizing: border-box;
    display: flex;
    gap: 50px;
    flex-direction: column;
    background: #FFFFFFB2;
    backdrop-filter: blur(30px);
    box-shadow: 3px 3px 3px 0px #001B930D; 
    border-radius: 30px;
    color: #001B93;
    font-size: 22px;
}

.info_card img{
    width: fit-content;
    height: 120px;
    object-fit: contain;
}

.faq h2{
    margin-bottom: 40px;
}

.faq .container > p{
    font-weight: 400;
    font-size: clamp(27px, 1.823vw, 35px);
    line-height: 100%;
    margin-bottom: 40px;
}
.faq .faq-quest{
    padding: 38px;
    box-sizing: border-box;
    border-radius: 30px;
    border: 2px solid var(--color-second);
    cursor: pointer;
    overflow: hidden;
    position: relative;
    interpolate-size: allow-keywords;
}
.faq .faq-quest:not(:last-child){
    margin-bottom: 20px;
}
.faq-title{
    display: flex;
    justify-content: space-between;
    gap: 20px;
    color: var(--color-second);
    font-weight: 500;
    font-size: clamp(27px, 1.823vw, 35px);
    line-height: 100%;
}

.faq-title .faq_btn{
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    transition: .4s;
}

.faq-title .faq_btn:after,
.faq-title .faq_btn:before{
    content: '';
    display: block;
    width: 36px;
    height: 4px;
    background-color: var(--color-second);
    border-radius: 4px;
    position: absolute;
}

.faq-title .faq_btn:before{
    transform: rotate(90deg);
}

.faq-answer{

    color: var(--color-second);
    font-weight: 400;
    font-size: 23px;
    line-height: 165%;
    block-size: 0;
    transition: block-size 0.4s, content-visibility 0.4s allow-discrete;
}

.faq-quest:after{
    content: '';
    display: block;
    height: 38px;
    width: 100%;
    position: absolute;
    bottom: 0;
    left: 0;
    background: #fff;
}

.faq-quest.open .faq-answer{
    block-size: auto;
}

.faq-quest.open .faq_btn{
    transform: rotate(45deg);
}

.faq-quest.close .faq-answer,
.faq-quest .faq-answer{
    margin-top: 0;
}

.faq-quest.open .faq-answer{
    padding-top: 15px;
}

.blue{
    color: var(--color-second);
}
.bold{
    font-weight: 700;
}

.footer-figure{
    background-color: rgb(232, 239, 248);
    clip-path: url(#clipPathContact);
    width: 100%;
    height: auto;
    border-bottom-left-radius: 50px;
    border-bottom-right-radius: 50px;
}

.footer-wrapper{
    position: relative;
}

.footer-wrapper h2{
    position: absolute;
    left: 0;
    top: -20px;
    width: 100%;
    max-width: 42.479vw;
}

.footer-top{
    display: flex;
    justify-content: flex-end;
    gap: 125px;
    margin-bottom: 107px;
}

.footer-top img{
    max-width: 150px;
    height: auto;
    object-fit: contain;
    transform: scale(3.5);
    animation: scale_footer_topaz 4s infinite linear; 
}

@keyframes scale_footer_topaz {
    from { transform: scale(3.5); }
    50% { transform: scale(3.3); }
    to { transform: scale(3.5); }
}

.footer-top-content{
    width: 642px;
    padding-top: 40px;
    padding-right: 27px;
}

.footer-top-content p{
    font-size: clamp(27px, 1.823vw, 35px);
    color: var(--color-second);
}

.goto_bot{
    display: flex;
    gap: 12px;
    align-items: center;
    margin-top: 20px;
    font-size: 22px;
    font-weight: 500;
    color: var(--color-second);
}

.footer-form{
    padding-inline: 30px;
    display: flex;
    gap: 35px;
    flex-direction: column;
    position: relative;
    z-index: 1;
    padding-bottom: 30px;
}

.form-field input{
    padding-block: 26px;
    padding-inline: 50px;
    font-size: 22px;
    border: 0;
    border-radius: 50px;
    font-weight: 360;
    color: var(--color-second);
}
.form-field input::placeholder {
    font-weight: 360;
    color: var(--color-second);
}

.form-fields-wrapper{
    display: flex;
    gap: 20px;
    align-items: center;
}

.form-field{
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 21px;
}

.form-field p{
    font-size: 22px;
    color: var(--color-second);
    font-weight: 400;
}

.form-checkbox{
    display: flex;
    gap: 15px;
}

#policy{
    display: none;
}

.checkbox_box{
    border: 2.45px solid #001B9380;
    border-radius: 50%;
    width: 19px;
    height: 19px;
    padding: 2px;
    box-sizing: border-box;
}

#policy:checked ~ .checkbox_box:after{
    content: '';
    display: block;
    border-radius: 50%;
    height: 100%;
    background-color: #001B9380;
}

.footer-bottom{
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-block: 50px;
}

.footer-bottom .logo{
    padding: 0;
}
 
.footer-nav{
    display: flex;
    align-items: center;
    gap: 2.565vw;
    padding: 22px 61px;
    background: #EAF2FF8C;
    border-radius: 50px;
    font-weight: 400;
}

.footer-nav a{
    color: var(--color-second);
}

.footer-social{
    display: flex;
    gap: 22px;
    align-items: center;
}

.footer-social a{
    display: flex;
    align-items: center;
}

.footer-social img{
    transition: .4s;
}

.social-devider{
    border: 3px solid #63BDD0;
    height: 47px;
    width: 0;
}

.footer-social img:hover,
.goto_top:hover{
    transform: scale(1.2);
} 

.services{
	position: relative;
}

.services > .container > p{
	margin-top: 40px;
	margin-bottom: 55px;
	font-weight: 400;
    font-size: clamp(27px, 1.823vw, 35px);
	line-height: 100%;
	max-width: 1274px;
}

.service_cards{
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 18px;
}

.service_card{
	padding: 28px;
	border-radius: 40px;
	background: #E8EFF88C;
	backdrop-filter: blur(40px);
	color: var(--color-second);
	min-height: 340px;
	box-sizing: border-box;
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.card-info{
	flex: 1;
}

.card-name{
	margin-bottom: 10px;
	font-weight: 400;
    font-size: clamp(27px, 1.823vw, 35px);
	line-height: 100%;
}

.service_card p{
	font-weight: 400;
	font-size: 22px;
	line-height: 125%;
	margin-bottom: 22px;
}

.service_card .tags{
	display: flex;
    flex-wrap: wrap;
    gap: 10px;
	font-weight: 400;
	font-size: 16px;
	line-height: 100%;
}

.service_card .tags div{
	padding: 8px;
	background-color: #fff;
	border-radius: 30px;
}

.services .topaz2,
.services .topaz{
	position: absolute;
	
}

.services .topaz{
	width: 587px;
	right: 121px;
	top: -72px;
	animation: scale_service_topaz 8s infinite linear; 
}

.services .topaz2{
	right: 0;
	top: -213px;
	animation: scale_service_topaz 4s infinite linear; 
}

@keyframes scale_service_topaz {
    from { transform: scale(1); }
    50% { transform: scale(1.1); }
    to { transform: scale(1); }
}

.partners .partners-container{
	padding-inline: 30px;
	padding-top: 45px;
	padding-bottom: 115px;
	backdrop-filter: blur(100px);
	background: #FFFFFF0D;
	border-radius: 30px;
}

.partners-header {
	margin-bottom: 80px;
	display: flex;
	justify-content: space-between;
}

.section-map iframe{
	width: 100%;
    height: 580px;
	border-radius: 30px;
	border: 0;
}


.info {
    position: relative;
}
.info .container {
    position: relative;
    z-index: 2;
}
.info .container:after {
    clip-path: url(#clipPathHr);
    background: #E8EFF8;
    content: '';
    display: block;
    position: absolute;
    height: 100%;
    width: 100%;
    top: 0;
}

@media screen and (max-width: 1024px) {
    .info .container:after {
        clip-path: none;
        background: none;
    }
}

.info_cards_wrapper {
    background: none;
}
.info_top_list, .info_cards {
    position: relative;
    z-index: 2;
    background-color: transparent;
}

.info_top_title h2 {
    padding-right: 20px;
    font-size: clamp(59px, 4.688vw, 90px);
}
.info_top_list {
    padding-left: clamp(50px, 5.208vw, 100px);
    padding-right: clamp(35px, 3.906vw, 75px);
}

.info_top ul li {
    width: auto;
    font-size: clamp(18px, 1.198vw, 23px);
}

.info_card {
    font-size: clamp(16px, 1.146vw, 22px)
}
