/*
Theme Name: Logica24
Theme URI: 
Author: Marcus
Author URI: 
Description: Тема WordPress, разработанная специально для компании "Логика процессов"
Version: 9
License: GPL2
*/
html {
  scroll-behavior: smooth;
}
.grecaptcha-badge {
	width: 0 !important;
}
a {
	color: #00aefe;
	text-decoration: none;
	transition: 0.2s;
}
body {
    font-family: 'Montserrat',sans-serif;
    margin: 0;
    padding: 0;
    background: #f2f2f2;
}
p {
    display: block;
    margin-block-start: 0;
    margin-block-end: 1em;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
    unicode-bidi: isolate;
}
p:last-of-type {
    margin-block-end: 0;
}

@font-face {
	font-family: 'Montserrat';
	font-display: swap;
	src: url('./fonts/Montserrat-Light.eot');
	src: local('Montserrat Light'), local('Montserrat-Light'),
		url('./fonts/Montserrat-Light.eot?#iefix') format('embedded-opentype'),
		url('./fonts/Montserrat-Light.woff') format('woff'),
		url('./fonts/Montserrat-Light.ttf') format('truetype');
	font-weight: 300;
	font-style: normal;
}

@font-face {
	font-family: 'Montserrat';
	font-display: swap;
	src: url('./fonts/Montserrat-MediumItalic.eot');
	src: local('Montserrat Medium Italic'), local('Montserrat-MediumItalic'),
		url('./fonts/Montserrat-MediumItalic.eot?#iefix') format('embedded-opentype'),
		url('./fonts/Montserrat-MediumItalic.woff') format('woff'),
		url('./fonts/Montserrat-MediumItalic.ttf') format('truetype');
	font-weight: 500;
	font-style: italic;
}

@font-face {
	font-family: 'Montserrat';
	font-display: swap;
	src: url('./fonts/Montserrat-Thin.eot');
	src: local('Montserrat Thin'), local('Montserrat-Thin'),
		url('./fonts/Montserrat-Thin.eot?#iefix') format('embedded-opentype'),
		url('./fonts/Montserrat-Thin.woff') format('woff'),
		url('./fonts/Montserrat-Thin.ttf') format('truetype');
	font-weight: 100;
	font-style: normal;
}

@font-face {
	font-family: 'Montserrat';
	font-display: swap;
	src: url('./fonts/Montserrat-ExtraLightItalic.eot');
	src: local('Montserrat ExtraLight Italic'), local('Montserrat-ExtraLightItalic'),
		url('./fonts/Montserrat-ExtraLightItalic.eot?#iefix') format('embedded-opentype'),
		url('./fonts/Montserrat-ExtraLightItalic.woff') format('woff'),
		url('./fonts/Montserrat-ExtraLightItalic.ttf') format('truetype');
	font-weight: 200;
	font-style: italic;
}

@font-face {
	font-family: 'Montserrat';
	font-display: swap;
	src: url('./fonts/Montserrat-BoldItalic.eot');
	src: local('Montserrat Bold Italic'), local('Montserrat-BoldItalic'),
		url('./fonts/Montserrat-BoldItalic.eot?#iefix') format('embedded-opentype'),
		url('./fonts/Montserrat-BoldItalic.woff') format('woff'),
		url('./fonts/Montserrat-BoldItalic.ttf') format('truetype');
	font-weight: bold;
	font-style: italic;
}

@font-face {
	font-family: 'Montserrat';
	font-display: swap;
	src: url('./fonts/Montserrat-SemiBold.eot');
	src: local('Montserrat SemiBold'), local('Montserrat-SemiBold'),
		url('./fonts/Montserrat-SemiBold.eot?#iefix') format('embedded-opentype'),
		url('./fonts/Montserrat-SemiBold.woff') format('woff'),
		url('./fonts/Montserrat-SemiBold.ttf') format('truetype');
	font-weight: 600;
	font-style: normal;
}

@font-face {
	font-family: 'Montserrat';
	font-display: swap;
	src: url('./fonts/Montserrat-ExtraLight.eot');
	src: local('Montserrat ExtraLight'), local('Montserrat-ExtraLight'),
		url('./fonts/Montserrat-ExtraLight.eot?#iefix') format('embedded-opentype'),
		url('./fonts/Montserrat-ExtraLight.woff') format('woff'),
		url('./fonts/Montserrat-ExtraLight.ttf') format('truetype');
	font-weight: 200;
	font-style: normal;
}

@font-face {
	font-family: 'Montserrat';
	font-display: swap;
	src: url('./fonts/Montserrat-ExtraBoldItalic.eot');
	src: local('Montserrat ExtraBold Italic'), local('Montserrat-ExtraBoldItalic'),
		url('./fonts/Montserrat-ExtraBoldItalic.eot?#iefix') format('embedded-opentype'),
		url('./fonts/Montserrat-ExtraBoldItalic.woff') format('woff'),
		url('./fonts/Montserrat-ExtraBoldItalic.ttf') format('truetype');
	font-weight: 800;
	font-style: italic;
}

@font-face {
	font-family: 'Montserrat';
	font-display: swap;
	src: url('./fonts/Montserrat-Italic.eot');
	src: local('Montserrat Italic'), local('Montserrat-Italic'),
		url('./fonts/Montserrat-Italic.eot?#iefix') format('embedded-opentype'),
		url('./fonts/Montserrat-Italic.woff') format('woff'),
		url('./fonts/Montserrat-Italic.ttf') format('truetype');
	font-weight: normal;
	font-style: italic;
}

@font-face {
	font-family: 'Montserrat';
	font-display: swap;
	src: url('./fonts/Montserrat-Bold.eot');
	src: local('Montserrat Bold'), local('Montserrat-Bold'),
		url('./fonts/Montserrat-Bold.eot?#iefix') format('embedded-opentype'),
		url('./fonts/Montserrat-Bold.woff') format('woff'),
		url('./fonts/Montserrat-Bold.ttf') format('truetype');
	font-weight: bold;
	font-style: normal;
}

@font-face {
	font-family: 'Montserrat';
	font-display: swap;
	src: url('./fonts/Montserrat-LightItalic.eot');
	src: local('Montserrat Light Italic'), local('Montserrat-LightItalic'),
		url('./fonts/Montserrat-LightItalic.eot?#iefix') format('embedded-opentype'),
		url('./fonts/Montserrat-LightItalic.woff') format('woff'),
		url('./fonts/Montserrat-LightItalic.ttf') format('truetype');
	font-weight: 300;
	font-style: italic;
}

@font-face {
	font-family: 'Montserrat';
	font-display: swap;
	src: url('./fonts/Montserrat-BlackItalic.eot');
	src: local('Montserrat Black Italic'), local('Montserrat-BlackItalic'),
		url('./fonts/Montserrat-BlackItalic.eot?#iefix') format('embedded-opentype'),
		url('./fonts/Montserrat-BlackItalic.woff') format('woff'),
		url('./fonts/Montserrat-BlackItalic.ttf') format('truetype');
	font-weight: 900;
	font-style: italic;
}

@font-face {
	font-family: 'Montserrat';
	font-display: swap;
	src: url('./fonts/Montserrat-SemiBoldItalic.eot');
	src: local('Montserrat SemiBold Italic'), local('Montserrat-SemiBoldItalic'),
		url('./fonts/Montserrat-SemiBoldItalic.eot?#iefix') format('embedded-opentype'),
		url('./fonts/Montserrat-SemiBoldItalic.woff') format('woff'),
		url('./fonts/Montserrat-SemiBoldItalic.ttf') format('truetype');
	font-weight: 600;
	font-style: italic;
}

@font-face {
	font-family: 'Montserrat';
	src: url('./fonts/Montserrat-Regular.eot');
	src: local('Montserrat Regular'), local('Montserrat-Regular'),
		url('./fonts/Montserrat-Regular.eot?#iefix') format('embedded-opentype'),
		url('./fonts/Montserrat-Regular.woff') format('woff'),
		url('./fonts/Montserrat-Regular.ttf') format('truetype');
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: 'Montserrat';
	font-display: swap;
	src: url('./fonts/Montserrat-Medium.eot');
	src: local('Montserrat Medium'), local('Montserrat-Medium'),
		url('./fonts/Montserrat-Medium.eot?#iefix') format('embedded-opentype'),
		url('./fonts/Montserrat-Medium.woff') format('woff'),
		url('./fonts/Montserrat-Medium.ttf') format('truetype');
	font-weight: 500;
	font-style: normal;
}

@font-face {
	font-family: 'Montserrat';
	font-display: swap;
	src: url('./fonts/Montserrat-ExtraBold.eot');
	src: local('Montserrat ExtraBold'), local('Montserrat-ExtraBold'),
		url('./fonts/Montserrat-ExtraBold.eot?#iefix') format('embedded-opentype'),
		url('./fonts/Montserrat-ExtraBold.woff') format('woff'),
		url('./fonts/Montserrat-ExtraBold.ttf') format('truetype');
	font-weight: 800;
	font-style: normal;
}

@font-face {
	font-family: 'Montserrat';
	font-display: swap;
	src: url('./fonts/Montserrat-Black.eot');
	src: local('Montserrat Black'), local('Montserrat-Black'),
		url('./fonts/Montserrat-Black.eot?#iefix') format('embedded-opentype'),
		url('./fonts/Montserrat-Black.woff') format('woff'),
		url('./fonts/Montserrat-Black.ttf') format('truetype');
	font-weight: 900;
	font-style: normal;
}

@font-face {
	font-family: 'Montserrat';
	font-display: swap;
	src: url('./fonts/Montserrat-ThinItalic.eot');
	src: local('Montserrat Thin Italic'), local('Montserrat-ThinItalic'),
		url('./fonts/Montserrat-ThinItalic.eot?#iefix') format('embedded-opentype'),
		url('./fonts/Montserrat-ThinItalic.woff') format('woff'),
		url('./fonts/Montserrat-ThinItalic.ttf') format('truetype');
	font-weight: 100;
	font-style: italic;
}

/* Обертка hero-блока */
.hero-block {
    position: relative;
    height: 650px;
    width: 100%;
    background: radial-gradient(circle at center, #0067bf 0%, #003a8c 40%, #002873 100%);
    display: flex;
    align-items: flex-start;
    justify-content: center;
}

/* Фиксированная шапка */
.main-header {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 999;
    background: transparent; /* полупрозрачный фон */
    padding: 15px 20px;
    transition: background 0.3s ease, top 0.3s ease;
	box-sizing: border-box;
}
.mob-header {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 999;
    background: transparent; /* полупрозрачный фон */
    padding: 15px 0;
    transition: background 0.3s ease, top 0.3s ease;
	display: none;
}

.main-header.scrolled {
    background: rgb(17 50 88 / 95%);
    box-shadow: 0 7px 9.5px 0.5px rgb(0 98 186 / 48%);
}
.mob-header.scrolled {
    background: rgb(17 50 88 / 95%);
    box-shadow: 0 7px 9.5px 0.5px rgb(0 98 186 / 48%);
}

.container {
    width: 100%;
    max-width: 1600px;
    margin: 0 auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
    color: white;
}
.container-menu-desktop {
    width: 100%;
    max-width: 1600px;
    margin: 0 auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
    color: white;
}
.container-menu-mob {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    color: white;
}
.logo  {
    display: flex;
    max-width: 400px;
    align-items: center;
}
.logo img {
    max-height: 120px;
    min-height: 60px;
}
.logo .logo-name {
    font-size: 1.6vw;
    font-weight: 600;
	line-height: 1;
}
.logo h1 {
    color: white;
    font-size: 24px;
    margin: 0;
}

.main-nav .menu {
    list-style: none;
    display: flex;
	flex-wrap: wrap;
    margin: 0;
}

.main-nav .menu li {
    display: inline;
	margin-right: 30px;
	margin-bottom: 10px;
}
.main-nav .menu li:last-of-type {
	margin-right: 0;
}

.main-nav .menu li a {
    color: white;
    text-decoration: none;
    font-weight: bold;
    transition: color 0.2s ease;
	font-size: 1.1vw;
}

.main-nav .menu li a:hover {
    color: #57aeff;
}
.content {
    max-width: 1600px;
    margin: 0 auto;
}
section {
	scroll-margin-top: 90px;
}
.dark-block  {
    background: #10315a;
	padding: 80px 20px;
	color: #ffffff;
}
.white-block  {
    background: #ffffff;
	padding: 80px 20px;
	color: #002974;
}
.gray-block {
    background: #2f4c6f;
    padding: 80px 20px;
    color: #fff;
}
.title-section {
    font-size: 50px;
    font-weight: 700;
    margin-bottom: 40px;
}
.main-block-services {
    display: flex;
    flex-wrap: wrap;
    margin: -10px;
    justify-content: center;
}
.main-block-services .block-service-layout {
    padding: 10px;
	width: calc(100% / 3 - 20px);
	display: flex;
    flex-direction: column;
}
.main-block-services .block-service-layout .block-service {
    border-radius: 10px;
    padding: 30px;
    text-align: center;
	transition: 0.2s;
	flex: 1;
}
.block-layout:hover {
    box-shadow: 0 0px 3.5px 4.5px rgb(0 98 186 / 48%);
}
.main-block-services .block-service-layout .block-service .block-service-img img {
    max-height: 150px;
    width: auto;
}
.main-block-services .block-service-layout .block-service .block-service-name {
    font-size: 22px;
    font-weight: 600;
    margin-top: 18px;
}
footer {
    background: rgb(17 49 89);
    background: linear-gradient(90deg, rgb(17 49 89) 0%, rgba(0, 101, 189, 1) 50%, rgb(17 49 89) 100%);
}
footer .footer {
    padding: 30px 20px;
    color: #fff;
}
.block-mob-nav {
	display: none;
    position: fixed;
    width: 100%;
    height: 100%;
    right: -100%;
    top: 0;
    z-index: 999;
    background: #10315a;
	transition: right 0.4s ease-in-out;
}
.title-block-nav {
    background: #0a203d;
    padding: 10px 15px;
    color: #fff;
	display: flex;
    justify-content: space-between;
    align-items: center;
}
.title-block-nav .menu-head-close .fa {
    font-size: 25px;
}
.block-mob-nav.active {
	right: 0;
}

.block-mob-nav .main-nav .menu li {
    padding: 12px 12px 12px 40px;
    border-bottom: 1px solid #164279;
}
.block-mob-nav .main-nav ul.menu {
    padding: 0;
}
.info-block {
    font-size: 20px;
    font-weight: 400;
    box-shadow: 0 0px 17.5px 7.5px rgb(0 98 186 / 48%);
    padding: 30px;
    border-radius: 10px;
	background: #10315a;
}
.main-block-experience .block-experience {
    /* background: #2f4c6f; */
    padding: 17px 15px;
    border-radius: 10px;
    margin-bottom: 10px;
	transition: 0.2s;
}
.main-block-experience .block-experience:hover {
    box-shadow: 0 0px 3.5px 4.5px rgb(0 98 186 / 48%);
}
.main-block-experience .block-experience .block-service-name {
    font-size: 20px;
    font-weight: 500;
	position: relative;
	padding-left: 35px;
}
.main-block-experience .block-experience .block-service-name:before {
    content: "\f00c";
    font: normal normal normal 14px / 1 FontAwesome;
    font-size: 28px;
    color: #00aefe;
    position: absolute;
    left: 0;
    top: -4px;
}
.main-block-contacts {
	display: flex;
	flex-wrap: wrap;
	background: #2f4c6f;
	border-radius: 10px;
	padding: 20px;
}
.block-contacts {
	width: 50%;
	padding: 35px 80px;
	position: relative;
	box-sizing: border-box;
}
.block-contacts .line {
	margin-bottom: 20px;
}
.block-contacts .line:last-of-type {
	margin-bottom: 0;
}
.block-contacts .contact-phone {
	font-size: 25px;
	font-weight: 600;
	position: relative;
	padding-left: 25px;
	z-index: 9;
}
.block-contacts .contact-phone a {
	color: #fff;
	text-decoration: none;
	transition: 0.2s;
}
.block-contacts .contact-phone a:hover {
	color: #00aefe;
}
.block-contacts .contact-phone a:before {
	content: "\f10b";
	font: normal normal normal 14px / 1 FontAwesome;
	font-size: 28px;
	position: absolute;
	left: 0;
	top: 0;
}
.block-contacts .contact-email {
	font-size: 25px;
	font-weight: 600;
	position: relative;
	padding-left: 25px;
	z-index: 9;
}
.block-contacts .contact-email a {
	color: #fff;
	text-decoration: none;
	transition: 0.2s;
}
.block-contacts .contact-email a:hover {
	color: #00aefe;
}
.block-contacts .contact-email a:before {
	content: "\f0e0";
	font: normal normal normal 14px / 1 FontAwesome;
	font-size: 15px;
	position: absolute;
	left: 0;
	top: 7px;
}
.block-contacts .contact-social {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	margin-top: 50px;
}
.block-contacts .contact-social .contact-social-icon {
	margin-right: 40px;
	z-index: 9;
}
.block-contacts .contact-social .contact-social-icon:last-of-type {
	margin-right: 0;
}
.block-contacts .contact-social .contact-social-icon a .fa {
	color: #fff;
	text-decoration: none;
	transition: 0.2s;
}
.block-contacts .contact-social .contact-social-icon a .fa:hover {
	background: #00aefe;
}
.block-contacts .contact-social .contact-social-icon .fa-vk {
	font-size: 40px;
	border: 1px solid #00aefe;
	border-radius: 50%;
	width: 70px;
	height: 70px;
	display: flex;
	justify-content: center;
	align-items: center;
	background: rgb(35 101 147);
}
.block-contacts .contact-social .contact-social-icon .fa-paper-plane-o {
	font-size: 40px;
	border: 1px solid #00aefe;
	border-radius: 50%;
	width: 70px;
	height: 70px;
	display: flex;
	justify-content: center;
	align-items: center;
	background: rgb(35 101 147);
}
.block-contacts .img-fon-block {
	position: absolute;
	top: 50%;
	right: 70px;
	-webkit-transform: translate(0%, -50%);
	-ms-transform: translate(0%,-50%);
	transform: translate(0%, -50%);
	opacity: 0.2;
}
.block-contacts .img-fon-block img {
	max-height: 240px;
}
.main-block-contacts .title-block {
	font-size: 30px;
	font-weight: 600;
	margin-bottom: 35px;
}
.main-block-contacts .block-form {
	width: 50%;
	padding: 35px 80px;
	position: relative;
	box-sizing: border-box;
	border-left: 1px solid #3a5e89;
}
.main-block-contacts .block-form .contact-form {
	width: 60%;
	display: block;
}
.main-block-contacts .block-form .contact-form .contact-form-input {
	position: relative;
}
.main-block-contacts .block-form .contact-form .contact-form-input input,
.main-block-contacts .block-form .contact-form .contact-form-input textarea {
	width: 100%;
	border: 1px solid #01abfa;
	padding: 10px;
	border-radius: 10px;
	background: #236593;
	color: #fff;
	margin-bottom: 10px;
	z-index: 9;
	position: relative;
	box-sizing: border-box;
}
.main-block-contacts .block-form .contact-form .contact-form-input textarea {
	height: 100px;
}
.main-block-contacts .block-form .contact-form .contact-form-input input::placeholder,
.main-block-contacts .block-form .contact-form .contact-form-input textarea::placeholder {
	color: #0184c1;
}
.main-block-contacts .block-form .contact-form .contact-form-input input:focus,
.main-block-contacts .block-form .contact-form .contact-form-input textarea:focus {
	border: 1px solid #01abfa;
	outline: 0;
	box-shadow: 0 0px 4.5px 4.5px rgb(0 98 186 / 48%);
}
.main-block-contacts .block-form .contact-form .contact-form-submit input[type="submit" i] {
	appearance: auto;
	user-select: none;
	text-align: center;
	cursor: pointer;
	box-sizing: border-box;
	background-color: #236593;
	color: #fff;
	white-space: pre;
	padding-block: 0;
	padding-inline: 0;
	border: 1px solid #04a6f3;
	padding: 10px 25px;
	border-radius: 10px;
	font-size: 20px;
	transition: 0.2s;
}
.main-block-contacts .block-form .contact-form .contact-form-submit input[type="submit" i]:disabled {
	opacity: 0.2;
	cursor: no-drop;
}
.main-block-contacts .block-form .contact-form-policy .wpcf7-list-item {
	display: inline-block;
	margin: 0;
	margin-bottom: 10px;
}
.main-block-contacts .block-form .contact-form .contact-form-submit input[type="submit" i]:hover {
	background-color: #04a6f3;
}
.main-block-contacts .block-form .contact-form .wpcf7-not-valid-tip {
	color: #fff;
	font-size: 12px;
	font-weight: normal;
	display: block;
	position: absolute;
	z-index: 999;
	top: -9px;
	left: 0px;
	background: #500000;
	width: 100%;
	padding: 12px 13px;
	opacity: 0.7;
	border-radius: 10px;
	box-sizing: border-box;
}
/*.main-block-contacts .block-form .wpcf7 form.invalid .wpcf7-response-output {*/
/*	display: none;*/
/*}*/
.wpcf7 {
	position: relative;
}
.wpcf7 form .wpcf7-response-output {
	margin: 0;
	padding: 0.2em 1em;
	border: 2px solid #00a0d2;
	position: absolute;
	top: 50%;
	left: 50%;
	-webkit-transform: translate(-50%, -50%);
	-ms-transform: translate(-50%,-50%);
	transform: translate(-50%, -50%);
	background: rgb(16 49 90 / 57%);
	width: 100%;
	height: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
	border: 0;
	transition: 0.4s;
	z-index: 999;
}
.block-form .img-fon-block-form {
	position: absolute;
	top: 50%;
	right: 70px;
	-webkit-transform: translate(0%, -50%);
	-ms-transform: translate(0%,-50%);
	transform: translate(0%, -50%);
	opacity: 0.2;
}
.block-form .img-fon-block-form img {
	max-height: 130px;
}
#scrollTopBtn {
	position: fixed;
	bottom: 30px;
	right: 30px;
	z-index: 9999;
	display: none;
	background-color: #00aefe;
	color: white;
	border: none;
	padding: 12px 16px;
	font-size: 18px;
	border-radius: 8px;
	cursor: pointer;
	box-shadow: 0 4px 6px rgba(0,0,0,0.3);
	transition: opacity 0.3s ease;
}

#scrollTopBtn:hover {
	background-color: #1e3b58;
}

.logo-penrose-wrapper {
	text-align: center;
	margin: 0;
	position: absolute;
	top: 50%;
	left: 50%;
	-webkit-transform: translate(-50%, -50%);
	-ms-transform: translate(-50%,-50%);
	transform: translate(-50%, -50%);
}

.logo-text {
	font-size: 30px;
	font-weight: bold;
	margin-bottom: 15px;
	color: #fff;
	transition: opacity 0.5s ease;
}

.logo-text {
	position: absolute;
	top: 0;
	left: 50%;
	-webkit-transform: translate(-50%,-50%);
    -ms-transform: translate(-50%,-50%);
        transform: translate(-50%,-50%);
    min-width: 700px;
}

.code-pattern-bg {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	pointer-events: none;
	background: repeating-linear-gradient(
			0deg,
			rgba(255, 255, 255, 0.015) 0px,
			rgba(255, 255, 255, 0.015) 1px,
			transparent 1px,
			transparent 20px
	),
	repeating-linear-gradient(
			90deg,
			rgba(255, 255, 255, 0.015) 0px,
			rgba(255, 255, 255, 0.015) 1px,
			transparent 1px,
			transparent 20px
	);
	animation: bgScroll 40s linear infinite;
	z-index: 0;
}

@keyframes bgScroll {
	0% { background-position: 0 0; }
	100% { background-position: 1000px 1000px; }
}

#matrixCanvas {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 0;
	opacity: 0.2;
}

.logo-penrose img {
	width: 400px;
	transition: transform 1s ease;
	margin-top: 40px;
}

.main-block-cooperation {
    display: flex;
    flex-wrap: wrap;
    margin: -10px;
	justify-content: center;
}
.main-block-cooperation .block-cooperation-layout {
    padding: 10px;
	width: calc(100% / 5 - 20px);
	display: flex;
    flex-direction: column;
}
.main-block-cooperation .block-cooperation-layout a {
    display: flex;
    justify-content: center;
    align-items: center;
}
.main-block-cooperation .block-cooperation-layout .block-cooperation {
    border-radius: 10px;
    padding: 30px;
    text-align: center;
	/* background: #10315a; */
	transition: 0.2s;
	flex: 1;
}
.main-block-cooperation .block-cooperation-layout .block-cooperation .block-cooperation-img {
    background: #ffffff;
    border-radius: 10px;
	padding: 10px;
}
.main-block-cooperation .block-cooperation-layout .block-cooperation:hover {
    box-shadow: 0 0px 3.5px 4.5px rgb(0 98 186 / 48%);
}
.main-block-cooperation .block-cooperation-layout .block-cooperation .block-cooperation-img img {
    max-height: 150px;
	width: auto;
}
.main-block-cooperation .block-cooperation-layout .block-cooperation .block-cooperation-name {
    font-size: 18px;
    font-weight: 600;
    margin-top: 18px;
    color: #fff;
}
.main-block-cooperation .block-cooperation-layout .block-cooperation .block-cooperation-text {
    font-size: 14px;
    color: #7f91a7;
    margin-top: 10px;
}
.main-block-cooperation .block-cooperation-layout .block-cooperation .block-cooperation-link {
    display: flex;
    justify-content: center;
    margin-top: 15px;
    font-size: 14px;
}
.main-block-cooperation .block-cooperation-layout .block-cooperation .block-cooperation-link a {
    padding: 8px 12px;
    border-radius: 10px;
    color: #fff;
    width: fit-content;
}
.main-block-cooperation .block-cooperation-layout .block-cooperation .block-cooperation-link a:hover {
    background: #00aefe;
}
.main-block-cooperation .block-cooperation-layout .block-cooperation .block-cooperation-link a .fa {
    margin-left: 8px;
}
.header-contacts-block {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
	flex-direction: column;
	min-width: 202px;
}
.header-contacts-block .contact-phone {
	position: relative;
    font-size: 1.1vw;
    font-weight: 800;
	padding-left: 15px;
}
.header-contacts-block .contact-phone a {
    color: #fff;
	transition: 0.2s;
}
.header-contacts-block .contact-phone a:hover {
	color: #00aefe;
}
.header-contacts-block .contact-phone a:before {
	content: "\f10b";
	font: normal normal normal 14px / 1 FontAwesome;
	font-size: 20px;
	position: absolute;
	left: 0;
	top: 0;
}
.header-contacts-block .contact-social {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
	margin-top: 10px;
}
.header-contacts-block .contact-social .contact-social-icon {
    margin-right: 15px;
}
.header-contacts-block .contact-social .contact-social-icon .fa {
    font-size: 1.4vw;
    color: #fff;
	transition: 0.2s;
}
.header-contacts-block .contact-social .contact-social-icon .fa:hover {
    color: #00aefe;
}
.header-contacts-block .contact-social .contact-social-icon:last-of-type {
    margin-right: 0;
}
.bloc_mob-contancts {
    margin-top: 40px;
}
.hero-block-footer {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 99999999;
    /* display: none; */
    background: radial-gradient(circle at center, #0067bf 0%, #003a8c 40%, #002873 100%);
}
.hero-block-footer .logo-penrose {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%,-50%);
    transform: translate(-50%, -50%);
}
@keyframes spinY {
  from {
    transform: rotateY(0deg);
  }
  to {
    transform: rotateY(360deg);
  }
}

#penroseLogoPreloader img {
  animation: spinY 2s linear infinite;
  transform-style: preserve-3d;
}
.logo-name-subname {
    margin-left: 10px;
    text-align: center;
}
.logo-name-subname .logo-subname {
    font-size: 0.8vw;
    margin-top: 4px;
}

.modal-overlay {
    position: fixed;
    top: 0; left: 0;
    width: 100%; height: 100%;
    background: rgba(0,0,0,0.6);
    display: flex;
    justify-content: center;
    align-items: center;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.4s ease;
    z-index: 9999;
}
.modal-overlay.active {
    visibility: visible;
}
.modal-content {
    background: #fff;
    padding: 30px;
    max-width: 600px;
    width: 90%;
    border-radius: 8px;
    position: relative;
    max-height: 80vh;
    overflow-y: auto;
	transform: translateY(-20px);
    transition: transform 0.4s ease;
}
.modal-overlay.active .modal-content {
    transform: translateY(0);
}
.close-modal {
    position: absolute;
    right: 15px;
    top: 10px;
    cursor: pointer;
    font-size: 24px;
    color: #333;
}
.main-block-teams {
    display: flex;
    flex-wrap: wrap;
    margin: -10px;
    justify-content: center;
}
.main-block-teams .block-team-layout {
    padding: 10px;
    width: calc(100% / 3 - 20px);
    display: flex;
    flex-direction: column;
}
.main-block-teams .block-team-layout .block-team {
    border-radius: 10px;
    padding: 30px;
    text-align: center;
    transition: 0.2s;
    flex: 1;
}
.dark-block .block-layout {
    background: #2f4c6f;
}
.dark-block a.block-layout {
    background: #10315a;
}
.gray-block .block-layout {
    background: #10315a;
}
.gray-block a.block-layout {
    background: #2f4c6f;
}
.main-block-teams .block-team-img img {
    max-height: 280px;
    width: auto;
    border-radius: 100%;
    box-shadow: 0 0px 20px 16px rgb(0 98 186 / 48%);
}
.main-block-teams .block-team-name {
    margin: 10px 0;
    font-size: 22px;
    font-weight: 600;
    color: #00aefe;
}
.main-block-teams .block-team-post {
    color: #b0c5df;
}
.main-block-projects {
    display: flex;
    flex-wrap: wrap;
    margin: -10px;
    justify-content: center;
}
.main-block-projects .block-projects-layout {
    padding: 10px;
    width: calc(100% / 3 - 20px);
    display: flex;
    flex-direction: column;
}
.main-block-projects .block-project {
    border-radius: 10px;
    padding: 30px;
    text-align: center;
    transition: 0.2s;
    flex: 1;
    position: relative;
}
.main-block-projects .block-project-img {
    display: flex;
    align-items: center;
    justify-content: center;
    background: #fff;
    border-radius: 10px;
    padding: 17px;
    min-height: 125px;
}
.main-block-projects .block-project-img img {
    max-width: 200px;
    height: auto;
}
.main-block-projects .block-project-name {
    font-size: 30px;
    font-weight: 600;
    margin-bottom: 15px;
    color: #00aefe;
}
.main-block-projects .block-project-text {
    text-align: left;
    margin: 20px 0 60px 0;
    line-height: 1.3;
}
.main-block-projects .bottom-buttons {
    display: flex;
    justify-content: space-between;
    position: absolute;
    bottom: 40px;
    left: 0;
    padding: 0 30px;
    width: -webkit-fill-available;
}
.main-block-projects .bottom-buttons a {
    padding: 7px 10px;
    border-radius: 10px;
    color: #fff;
    cursor: pointer;
}
.main-block-projects .bottom-buttons a:hover {
    background: #00aefe;
}
.main-block-projects .modal-info-project {
    color: #000;
}
.no-scroll {
    overflow: hidden;
}
.main-block-projects .close {
    color: #000;
    font-size: 30px;
    position: absolute;
    right: 10px;
    top: 0;
    cursor: pointer;
}
.main-block-projects .block-project-text .list-check {
    margin-top: 20px;
}
.main-block-projects .block-project-text .check {
    position: relative;
    padding-left: 20px;
}
.main-block-projects .block-project-text .check:before {
    content: "\f00c";
    font: normal normal normal 14px / 1 FontAwesome;
    font-size: 15px;
    color: #00aefe;
    position: absolute;
    left: 0;
    top: 0;
}
.footer .company-info {
    margin-top: 10px;
    color: #7b94c6;
}
.main-block-contacts .block-form .feedback-form .input input,
.main-block-contacts .block-form .feedback-form .input textarea {
    width: 100%;
    border: 1px solid #01abfa;
    padding: 10px;
    border-radius: 10px;
    background: #236593;
    color: #fff;
    margin-bottom: 10px;
    z-index: 9;
    position: relative;
    box-sizing: border-box;
}
.main-block-contacts .block-form .feedback-form .input input.error-input,
.main-block-contacts .block-form .feedback-form .input textarea.error-input {
    border: 1px solid #813131;
    background: rgb(147 35 34 / 45%);
}
.main-block-contacts .block-form .feedback-form .input input::placeholder,
.main-block-contacts .block-form .feedback-form .input textarea::placeholder {
	color: #0184c1;
}
.main-block-contacts .block-form .feedback-form .input input:focus,
.main-block-contacts .block-form .feedback-form .input textarea:focus {
    border: 1px solid #01abfa;
    outline: 0;
    box-shadow: 0 0px 4.5px 4.5px rgb(0 98 186 / 48%);
}
.feedback-form button[type="submit" i] {
    appearance: auto;
    user-select: none;
    text-align: center;
    cursor: pointer;
    box-sizing: border-box;
    background-color: #236593;
    color: #fff;
    white-space: pre;
    padding-block: 0;
    padding-inline: 0;
    border: 1px solid #04a6f3;
    padding: 10px 25px;
    border-radius: 10px;
    font-size: 20px;
    transition: 0.2s;
    margin-top: 15px;
}
.feedback-form button[type="submit" i]:disabled {
    opacity: 0.2;
    cursor: no-drop;
}
#formModal .modal-content {
    border: 1px solid #01abfa;
    padding: 20px 15px;
    border-radius: 10px;
    background: rgb(35 147 64);
    text-align: center;
}
#formModal .modal-content.error-modal {
    background: rgb(147 35 35);
}
#formModal .close-modal {
    position: absolute;
    right: 8px;
    top: 0px;
    cursor: pointer;
    font-size: 24px;
    color: #ffffff;
}
form .icon-check {
    --check-mark-color: #00aefe !important;
    top: 40% !important;
    right: 10px !important;
    width: 13px !important;
    height: 5px !important;
    z-index: 9;
}
.logo-penrose-wrapper .video-preloader {
    max-width: 550px;
}

@media screen and (max-width: 1024px) {
    .main-nav .menu li a {
        font-size: 18px;
    }
    .header-contacts-block .contact-phone {
        font-size: 24px;
    }
    .header-contacts-block .contact-social .contact-social-icon .fa {
        font-size: 30px;
    }
	#scrollTopBtn:hover {
    	background-color: #00aefe;
	}
	.main-header {
    	display: none;
	}
	.container-menu-desktop {
    	display: none;
	}
	.block-mob-nav {
		display: block;
	}
	.main-nav {
    	z-index: 99;
    	position: relative;
	}
	.main-nav .menu {
    	flex-direction: column;
    	gap: 0;
	}
	.mob-header {
    	padding: 15px 20px;
    	width: -webkit-fill-available;
    	display: block;
	}
	.menu-icon-mob .fa {
    	font-size: 50px;
    	margin-top: 5px;
	}
	.main-block-cooperation .block-cooperation-layout {
    	width: calc(100% / 4 - 20px);
	}
	.main-block-contacts .block-form .wpcf7  {
		width: 100%;
	}
	.dark-block {
    	padding: 50px 20px;
	}
	.white-block {
    	padding: 50px 20px;
	}
	.gray-block {
    	padding: 50px 20px;
	}
	footer .footer {
    	padding: 30px 20px;
	}
	.main-block-contacts .block-form .contact-form {
        width: 100%;
    }
}

@media screen and (max-width: 980px) {
	.main-block-cooperation .block-cooperation-layout {
    	width: calc(100% / 3 - 20px);
	}
	.main-block-projects .block-projects-layout {
        width: calc(100% / 1 - 20px);
    }
    .main-block-projects .bottom-buttons a {
        font-size: 10px;
    }
	.dark-block {
    	padding: 50px 20px;
	}
	.white-block {
    	padding: 50px 20px;
	}
	.gray-block {
    	padding: 50px 20px;
	}
	footer .footer {
    	padding: 30px 20px;
	}
	.main-header {
    	width: -webkit-fill-available;
    	padding: 15px 20px;
	}
	.info-block {
    	font-size: 18px;
	}
	.main-block-services .block-service-layout .block-service .block-service-name {
    	font-size: 16px;
	}
	.main-block-services .block-service-layout .block-service .block-service-img img {
    	max-height: 80px;
	}
	.title-section {
    	font-size: 35px;
	}

	.main-block-experience .block-experience .block-service-name {
    	font-size: 18px;
	}
	.block-contacts {
		width: 100%;
		padding: 20px 20px;
	}
	.main-block-contacts .block-form {
		width: 100%;
		padding: 20px 20px;
		border-left: 0;
		border-top: 1px solid #3a5e89;
	}
	.main-block-contacts .title-block {
		font-size: 20px;
    	z-index: 9;
        position: relative;
	}
	.block-contacts .contact-phone {
		font-size: 22px;
	}
	.block-contacts .contact-email {
		font-size: 22px;
	}
	.block-contacts .line {
		margin-bottom: 15px;
	}
	.block-contacts .contact-social {
		margin-top: 20px;
	}
	.main-block-contacts .block-form .contact-form {
		width: 100%;
	}
	#scrollTopBtn {
		bottom: 38px;
		right: 12px;
	}
	.logo-penrose img {
		width: 200px;
	}
	.logo-text {
		font-size: 22px;
		min-width: auto;
		width: 100%;
		padding: 0 20px;
	}
	.logo-penrose-wrapper .video-preloader {
        max-width: 350px;
        bottom: -40px;
        position: relative;
    }
	.hero-block {
		height: 440px;
	}
	.main-block-teams .block-team-layout {
        width: calc(100% / 2 - 20px);
    }
}

@media screen and (max-width: 768px) {
	.main-block-contacts .block-form .contact-form {
        width: 55%;
    }
}

@media screen and (max-width: 480px) {
	.main-block-services .block-service-layout {
    	padding: 10px;
    	width: calc(100% / 2 - 20px);
	}
	.main-block-cooperation .block-cooperation-layout {
    	padding: 10px;
		width: calc(100% / 2 - 20px);
	}
	.dark-block {
    	padding: 50px 20px;
	}
	.white-block {
    	padding: 50px 20px;
	}
	.gray-block {
    	padding: 50px 20px;
	}
	.main-block-services .block-service-layout .block-service {
    	padding: 25px 15px;
	}
	footer .footer {
    	padding: 30px 20px;
	}
	.logo img {
    	max-height: 80px;
    	min-height: 35px;
	}
	.logo {
    	max-width: 270px;
	}
	.logo .logo-name {
    	font-size: 20px;
	}
	.logo-name-subname .logo-subname {
    	font-size: 9px;
	}
	.menu-icon-mob .fa {
    	font-size: 33px;
    	margin-top: 5px;
	}
	.main-block-cooperation .block-cooperation-layout {
        width: calc(100% / 1 - 20px);
    }
	.main-block-contacts .block-form .contact-form {
        width: 100%;
    }
	.block-form .img-fon-block-form {
    	top: 15px;
    	left: 30%;
    	-webkit-transform: translate(-50%, 0%);
    	-ms-transform: translate(-50%,0%);
    	transform: translate(-50%, 0%);
	}
	.main-block-teams .block-team-layout {
        width: calc(100% / 1 - 20px);
    }
}