/* CSS Document */
/*-----------------------------------------------------------------------------
Prototype Version:  2.4
*/
/* Table of Contents
-----------------------------------------------------------------------------
1. Clean Base
2. Base Typography
3. Images
4. Links
5. Forms
6. Tables
7. Framework
*/

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

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

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

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

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

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

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

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


:root{  
    --body-font: 'Bariol';
    --primery-color:#0D247C;
    --white-color: #fff;
    --dark-color: #0D247C;
    --pink-color: #EF2A82;
    --light-color: #8794BA;
}
/* 1. Create a Clean Base
------------------------------------------------------------------------------*/
html, body, br, hr, div, span, a, object, iframe, ul, ol, dl, li, dt, dd, h1, h2, h3, h4, h5, h6, p, blockquote, q, address,
small, big, cite, dfn, ins, del, i, em, b, strong, sup, sub, strike, pre, code, samp, kbd, var, tt, form, fieldset, legend, label,input, textarea, option, .nobox 
{background: transparent; border: 0; font-size: 100%; margin: 0; outline: 0; padding: 0; vertical-align: baseline;}

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section, main {display: block;}
blockquote, q {quotes: none;}
blockquote {margin:60px 0; padding: 0 40px 0 5px; font-size:32px; color: var(--regal-blue-color); line-height: 48px; letter-spacing: -0.16px; border-right:4px solid var(--salmon-color);}
br {height: 0;}
ul, ol, dl, li {margin:0; padding:0;}
ul, ol {margin:0 15px 0 0;}
html, body{ -webkit-appearance:none; border:none; -webkit-text-size-adjust:none;}
ul {list-style-type: none}
ul li {position: relative;}
ul li:before { position: absolute; right: -15px; top: 8px; width: 6px; height:6px; background-color: #030E23; border-radius: 50%; content: ""; }

/* 2. Define Base Typography
------------------------------------------------------------------------------*/
body{padding: 0;margin: 0;font-family: var(--body-font); font-size:24px; font-weight:400; color: var(--primery-color); line-height:29px; letter-spacing:0; box-sizing: border-box; overflow-x: hidden; text-align: start; background-color:#F9FAFA;}
*, *:after, *:before {box-sizing: border-box;}
.bg-cover {background-size: cover; background-position: center; background-repeat: no-repeat;}
.bg-cover > img {opacity: 0; width: 100%;}
/* Create the Default Headers  */
h1,.h1, h2,.h2, h3,.h3, h4,.h4, h5,.h5, h6,.h6 {margin: 0; font-family: var(--heading-font); font-weight: 300;line-height:1; }
/* Specific Header Settings */
h1,.h1 {font-size:50px; font-weight:700;}
h2,.h2 {font-size:48px; font-weight:700;}
h3,.h3 {font-size:32px; font-weight:700;}
h4,.h4 {font-size:26px; font-weight:700;}
h5,.h5 {font-size:22px; font-weight:700;}
h6,.h6 {font-size:20px; font-weight:700;}

/* Create the Default Paragraphs */
p {margin-bottom:24px;}
p:last-child {margin-bottom: 0;}
/* Other Typo */
strong {font-family: var(--bold-font);}
hr {border:0 #030E23 solid; border-top-width: 2px; clear: both; height: 0;}
ol {list-style: decimal;}
/* 3. Images
------------------------------------------------------------------------------*/
/* Remove border around linked images */
img {max-width: 100%; border: 0; border-style: none; height: auto;}
/* 4. Links
------------------------------------------------------------------------------*/   
/* Default Link Types */
a {color: #000000; text-decoration:none;transition: 0.5s; display: inline-block;}

/* 5. Forms
------------------------------------------------------------------------------*/
#full_wrapper {}
.button, a.button, button, html input[type="button"], input[type="reset"], input[type="submit"] {margin:0;  padding:17px 25px 17px 25px;  border-radius:25px; background-color:var(--pink-color); border:0;display: inline-flex; align-items: center; vertical-align: middle; font-family: var(--body-font); font-weight:400;color: var(--white-color); font-size:16px; line-height:1; outline: none;box-shadow:none;text-align: center;text-decoration: none;-webkit-transition: 0.4s all;transition: 0.4s all; overflow: hidden; position: relative;z-index: 1; text-transform: none; letter-spacing:0; cursor: pointer; transform: none; text-align: center; justify-content: center;}
.button:hover, a.button:hover, button:hover, html input[type="button"]:hover, input[type="reset"]:hover, input[type="submit"]:hover {background-color:#002fe5; color:var(--salmon-color);} 



input[type="search"], input[type="text"], input[type="date"], input[type="email"], input[type="password"], input[type="tel"], input[type="number"], textarea, select {margin: 0 0 0 0;  padding:16px 16px 16px; font-family: var(--body-font); border-radius:8px; background-color:var(--white-color); border: 0; border: 1px solid #E8E8E8; display: inline-block; vertical-align: middle; font-weight:300;color:#03224B; font-size:16px; line-height:20px; position: relative;outline: none;box-shadow: none;text-align: start;text-decoration: none;-webkit-transition: 0.3s ease-in-out;transition: 0.3s ease-in-out; overflow: hidden; position: relative;z-index: 1; text-transform: none; letter-spacing:0;  width: 100%; text-align:start;}
select {padding: 14px 8px 14px;}
.button.no-rotate:hover span img {transform: none;}


input::-webkit-input-placeholder {color:#C0C2C9;opacity:1;}
input:-moz-placeholder {color:#C0C2C9; opacity:1;}
input::-moz-placeholder {color: #C0C2C9; opacity:1;}
input:-ms-input-placeholder {color: #C0C2C9;opacity:1;}
textarea::-webkit-input-placeholder {color: #C0C2C9; opacity:1;}
textarea:-moz-placeholder {color:#C0C2C9; opacity:1;}
textarea::-moz-placeholder {color: #C0C2C9; opacity:1;}
textarea:-ms-input-placeholder {color: #C0C2C9;opacity:1;}
/* Removes fieldset borders. even on Opea 7 */
fieldset {border: 1px solid transparent;} 
/* 6. Tables
------------------------------------------------------------------------------*/
/* Table Fixes */
table {border-spacing: 0; border-collapse: collapse;}
td {text-align: start; font-weight: normal;}
/* 7. Framework
------------------------------------------------------------------------------*/
/* container */
.container{max-width: 1485px; width: 100%; padding-left: 15px; padding-right: 15px; margin: 0 auto;}
.row{display: flex;flex-wrap: wrap; margin-left: -15px; margin-right: -15px;}
.col-12,.col-11,.col-10,.col-9,.col-8,.col-7,.col-6,.col-5,.col-4,.col-3,.col-2,.col-1{position: relative; width: 100%; padding-right: 15px; padding-left: 15px; }
.col-12 {max-width: 100%;}
.col-11 {max-width: 91.66666667%;}
.col-10 {max-width: 83.33333333%;}
.col-9 {max-width: 75%;}
.col-8 {max-width: 66.66666667%;}
.col-7 {max-width: 58.33333333%;}
.col-6 {max-width: 50%;}
.col-5 {max-width: 41.66666667%;}
.col-4 {max-width: 33.33333333%;}
.col-3 {max-width: 25%;}
.col-2 {max-width: 16.66666667%;}
.col-1 {max-width: 8.33333333%;} 
.d-flex{ display:flex;}
.flex-wrap{flex-wrap:wrap;}
.justify-content-start{justify-content:flex-start;}
.justify-content-center{justify-content:center;}
.justify-content-end{justify-content:flex-end;}
.justify-content-between{justify-content:space-between;}
.align-items-start{align-items: flex-start;}
.align-items-center{align-items: center;}
.align-items-end{align-items: flex-end;}
.row-reverse{flex-direction: row-reverse;}
.text-center{text-align: center;}
.text-left{text-align: start;}
.text-right{text-align: end;}
.font-light {font-weight: 300;}

.site-header {position: absolute; top:50px; left: 0; width: 100%; z-index: 9;}
.site-header .container {max-width:1210px;}
.site-header .logo {line-height: 0;}
.logo svg {width: 100%;}
.banner { margin: 0; padding: 0; height: 798px; position: relative; overflow: hidden; display: flex ; align-items: center; justify-content: center; }
.banner::before { position: absolute; left: 0; top: 0; width: 100%; height: 100%; content: ""; background: radial-gradient(circle, rgba(24, 66, 226, 1) -30%, rgba(13, 36, 124, 1) 60%); clip-path: polygon(0 0, 100% 0, 100% calc(100% - 254px), 0% calc(100% - 20px)); }
.banner::after { content: ""; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background-color: #EF2A82; clip-path: polygon(0 calc(100% - 21px), 100% calc(100% - 254px), 100% calc(100% - 233px), 0% 100%); z-index: 1; }
.banner-circle { position: absolute; right: 0; bottom: 11.8%; line-height: 0; z-index: 1; /*width: 56.25%;*/ }
.banner-shape { position: absolute; right: 0; bottom: 18.8%; line-height: 0; mix-blend-mode: screen; z-index: 1; /*width: 43.012%;*/ }

main {position: relative;}
.content-shape1 {position: absolute; top: 6.6%; right: 0; pointer-events: none;}
.content-shape2 {position: absolute; top:43%; left: 0; pointer-events: none;}
.content-shape3 {position: absolute; right: 0; top:48%; pointer-events: none;}
.banner .container {max-width:1210px; position: relative; z-index: 2;}
.banner-content { margin: 0; padding: 0; width: 100%; display: flex ; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; }
.banner-desc {margin: 0; padding: 0; max-width: 670px; width: 100%; color: var(--white-color); line-height: 150%;}
.banner-desc h1 {margin: 0 0 15px 0; line-height: 120%;}
.banner-desc p {margin: 0 0 50px 0;}
.banner-desc .button {min-width: 238px;}
.banner-image { margin: 0 0 0 0; padding: 0; max-width: 446px; width: 100%; transform: translateY(40px);}
.only-text {margin: 0; padding:10px 0 55px 0; text-align: center; font-size: 32px; line-height: 150%; color:#03224B;}
.only-text .container {max-width:1090px;}

.key-features {margin: 0; padding:55px 0 75px 0;position: relative;}
.key-features h2 {margin: 0 0 40px 0; text-align: center;}
.key-features-inner {margin: 0 -12px; padding: 0; display: flex; flex-wrap: wrap;}
.key-features-item {margin: 0; padding:24px 12px; max-width: 33.33%; width: 100%; display: flex; flex-direction: column;}
.key-features-item-inner {margin: 0; padding:30px 23px 30px; display: flex; flex-direction: column; flex: 1; box-shadow: 0 16px 58px rgba(30,35,41,0.1); background-color:#FEFEFE; color: var(--light-color); border-radius: 8px;}
.key-features-img {margin: 0 0 20px 0; padding: 83% 0 0 0;width: 100%; display: flex; justify-content: center; align-items: flex-start; line-height: 0; position: relative;}
.key-features-img img {position: absolute; left: 0; right: 0; margin: auto; top: 0; max-width: 100%; max-height: 100%; object-fit: contain;}
.key-features-item-inner h3 {margin: 0 0 16px 0; padding: 0; color:#172755; line-height:150%;}

.key-properties {margin: 0; padding:75px 0 0 0; position: relative; z-index: 2;}
.key-properties h2 {margin:0 0 65px 0; padding:0; line-height: 150%; text-align: center;}
.key-properties-inner {margin: 0; padding:38px 120px; background-color: var(--white-color); box-shadow: 0 16px 58px rgba(30,35,41,0.1); border-radius: 8px;}
.key-properties-item {margin: 0; padding:16px 0; display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid var(--primery-color);}
.key-properties-item:first-child .key-properties-parameters {font-size: 40px; color: var(--pink-color);}
.key-properties-item:first-child .key-properties-name {font-size: 40px; font-weight: 700; color: var(--pink-color);}
.key-properties-item:last-child {border: 0;}
.key-properties-parameters {margin: 0; padding: 0; color: var(--primery-color); font-size:32px; font-weight: 700; line-height: 150%; width: 50%;}
.key-properties-name {margin: 0; padding: 0; color: var(--primery-color); font-size:32px; font-weight: 400; line-height: 150%; width: 50%;}

.product-main {margin:-80px 0 0 0; padding:265px 0 78px 0; position: relative; overflow: hidden;}
.product-main::before { position: absolute; left: 0; top: 0; width: 100%; height: 100%; content: ""; background: radial-gradient(circle, rgba(24, 66, 226, 1) -380%, rgba(13, 36, 124, 1) 100%); clip-path: polygon(0 254px, 100% 0, 100% 100%, 0% 100%);}
.product-main::after { content: ""; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background-color: #EF2A82; clip-path: polygon(0 234px, 100% 0%, 100% 20px, 0 254px); z-index: 1; }
.product-shape {margin: 0; position: absolute; top: 150px; left: 0; width: 100%; z-index: 1; line-height: 0; mix-blend-mode: screen;}
.product-shape img {width: 100%;}
.product-main .container {position: relative; z-index: 1;}
.product-inner {margin: 0 -60px; padding: 0; display: flex; flex-wrap: wrap; color: var(--white-color); font-weight: 400;}
.product-item {margin: 0; padding: 0 60px; max-width: 33.33%; width: 100%;}
.product-item-img {margin: 0 0 40px 0; padding: 0; height:304px; display: flex; align-items: flex-end; justify-content: center;}
.product-inner h2 {margin: 0 0 8px 0; padding: 0; font-weight: 700; line-height: 150%;}
.product-inner p {margin: 0; padding: 0; font-size: 32px; line-height: 150%;}
.product-item:first-child .product-item-img {align-items: flex-end; justify-content: flex-end;}
.product-item:first-child .product-item-img-inner {margin-left: -50vw; width: calc(100% + 50vw - 736px); text-align: right;}
.product-item:first-child .product-item-img-inner img {width: 100%;}

.technology {margin: 0; padding:42px 0 160px 0; position: relative; overflow: hidden;}
.technology-shape {position: absolute; margin: 0 auto; left: 0; right: 0; top:12%; max-width: 936px; width: 100%;}
.technology .container {position: relative;}
.technology h2 {margin: 0 0 64px 0; text-align: center; line-height: 120%;}
.technology-inner {margin: 0; padding: 0; display: flex; flex-wrap: wrap; justify-content: center;}
.technology-item {margin: 0; padding: 0 75px; max-width:468px; width: 100%; text-align:center; font-size: 24px; line-height: 120%;}
.technology-item h3 {margin:0 0 8px 0; padding: 0 10px; line-height: 120%;}
.technology-item-icon {margin: 0 auto 31px; padding: 0; width: 50px; height: 50px;}
.technology-item-icon img {width: 100%; height: 100%; object-fit: contain;}

.mass-production {margin: 0; padding: 0; position: relative; z-index: 2;}
.mass-production-inner {margin: 0 auto; padding:28px 0; max-width: 1110px; width: 100%; border-radius: 40px; display: flex; align-items: center; flex-wrap: wrap; justify-content: space-between; background: linear-gradient(-14deg, rgba(128,84,255,1) 0%, rgba(255,152,152,1) 100%);}
.mass-production-desc {margin: 0; padding: 0 0 0 93px; max-width:556px; width: 100%; color: var(--white-color); font-size: 32px; line-height: 150%;}
.mass-production-desc h2 {margin: 0 0 24px 0; padding: 0; font-size: 40px; font-weight: 700; line-height: 120%;}
.mass-production-img {margin: 0; padding: 0; line-height: 0; max-width: 554px; width: 100%;}
.mass-production-img img {width: 100%;}

footer {margin:-323px 0 0 0; padding:95px 0 110px 0; background-color:#0D247C; position: relative; overflow: hidden;}
.footer-inner {margin: 0 auto; padding: 0; display: flex; flex-wrap: wrap; justify-content: space-between;max-width: 1110px; width: 100%;}
.footer-img {margin: 0; padding: 0; max-width:542px; width: 100%; line-height: 0;position: absolute; top: -157px; left: 0;}
.footer-desc {margin: 0; padding:266px 0 0 0; max-width:443px; width: 100%; color: var(--white-color); font-size: 18px; line-height: 150%;}
.footer-desc h2 {margin: 0; padding: 0; line-height: 150%;}
.footer-desc p {margin: 0 0 10px 0;}
.footer-desc a {color: var(--white-color);}

.footer-logo {margin: 0; padding: 0; position: absolute; right:48px; bottom:30px; line-height: 0;}
.footer-logo a {line-height: 0;}
.footer-logo svg {width: 100%;}

.footer-form { margin: 0; padding: 266px 0 0 65px; max-width: 506px; width: 100%; }
.footer-form form {position: relative;}
.footer-form h2 {color: var(--white-color); line-height: 150%;}
.form-row {margin: 0 0 16px 0;}
.form-row label {margin: 0 0 8px 0; padding: 0; display: block; color: var(--white-color); font-size:16px; font-weight:300; line-height: 22px;}
.form-btn {margin:24px 0 0 0; position: relative; width: 120px;}
.form-btn::after { content: ""; position: absolute; top: 19px; right: 30px; width: 12px; height: 12px; border-right: 2px solid #090909; border-bottom: 2px solid #090909; z-index: 1; transform: rotate(-45deg); transition: all 0.5s; pointer-events: none;}
.form-btn input { background-color:#E8E8E8; color: #0D247C; font-size: 16px; font-weight: 400;text-align: left; width: 100%;}
.form-btn input:hover {background-color: var(--pink-color); color: #fff;}
.form-btn:has(input:hover):after {border-color: var(--white-color);}

.error404 footer, .page-template-thankyou-page footer {margin: 0; padding-top:40px;}
.error404 .footer-inner, .page-template-thankyou-page.footer-inner {align-items: center;}
.error404 .footer-desc, .page-template-thankyou-page.footer-desc {padding-top: 0;}
.page_not_found-section, .thankyou-contant-section {padding:200px 0 40px 0;background-color: #0D247C; color:#fff; text-align:center;}
.page-not-found, .thankyou-content { max-width: 490px; margin: 0 auto; font-size: 20px; line-height: 130%; }

.wpcf7-response-output {display: block !important; position: absolute; left: 0; bottom: 2px; color: #fff; font-size: 16px; line-height: 140%; font-weight: 700; padding: 0 0 0 135px !important; width: 100%; border: 0 !important; margin: 0 !important;}
.wpcf7-spinner { position: absolute; left: -30px !important; margin: 0; bottom: 10px !important; background-color: rgba(255, 255, 255, 0.3); }
.footer-form .form-row input {background-position:calc(100% - 16px) center;}
.footer-form .form-row input.has_value {background-image: url('../images/check.svg');  background-repeat: no-repeat;}