:root { --bs-body-font-family: 'Poppins', sans-serif; scroll-behavior:unset;  }

body { font-family: 'Poppins', sans-serif;   overflow-x: hidden; position:relative; }
html { overflow-y: scroll; } 

* { scrollbar-width: thin; scrollbar-color: #71b2ff #fff; } 
b { font-weight:600; }
p { line-height: 1.6; font-size:1.1rem; }

h2 { font-weight:700; line-height: 1.4; margin-bottom:2rem; font-size:3rem;  } 
.section h3 { font-weight:700; line-height: 1.5; }  
h2:not(.h-slogan) { background: #144c8e; background: linear-gradient(to right, #328ffd 0%, #ffed82 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; }
.module-item h5 { background: #144c8e; background: linear-gradient(to right, #5399eb 0%, #dfc630 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; }

#section-how-it-works h2 { max-width:520px; margin-left: auto; margin-right: auto; }

.subline { border-radius:50px; background:#fff; color:#000; font-size:0.9rem; padding:6px 15px 4px 15px; font-weight:600; display:inline-block; position:relative; box-shadow: 0px 2px 10px rgba(0, 0, 0, .05); margin-bottom:30px;  }  
.subline span { color:#317230; font-weight:700; padding-left:20px; }
.subline .icon { height:20px; position:absolute; left:10px; }
.btn { font-weight:500; border-radius:50px;  } 

.nav-link { font-weight:500; position:relative; }
.nav-link:before { display: block; content: ""; position: absolute; height: 3px; width: 0px; border-radius: 2px; background-color: #94c5ff; bottom: 0px; left: 50%; margin-left:0px; transition: all 0.3s ease-out; opacity:0; }
.nav-link.active:before,
.nav-link:hover:before { opacity:1; width:24px; margin-left:-12px; }

header.main { background:#e1f1f5; background: linear-gradient(215deg, #fff 0%, #caecf4 100%); border-radius: 50px;  margin: 80px 50px 50px 50px; overflow:hidden; } 
header .inner { padding:80px 30px; position:relative; } 
header .main-desc { color:#222; line-height:1.8; font-size:1.1rem; margin:3rem 0; }
header .main-desc b { font-weight:600; }

#device-web-wrapper { text-align:center;  }

#home-app-img { transition: all 0.3s ease-out; min-height: 500px; max-width: 260px; }
#home-app-img-warpper {  }
.section-control h3 { margin:1.5rem 0; font-weight:700; }
.section-control ul { font-weight:500; }
.section-control ul li { align-items: center; } 

.section-control .solution p { font-weight:500; line-height: 2; font-size:1.2rem; }

#about h2 { max-width:700px; margin-left: auto; margin-right: auto; }
/*#about .icon { max-height:60px; max-width:60px; width:100%;  }
#about .icon-wrapper { margin-bottom:30px; }
*/
#about:after { content: ""; top:0; width: 1200px; height: 1200px;  background-repeat: no-repeat; background-image: url('../img/dots-b.svg');  background-attachment: scroll;  background-size: 1200px;  background-position: center center; position: absolute;  right: -1000px; z-index: -1; opacity:0.1; -webkit-animation: rotating 100s linear infinite; animation: rotating 100s linear infinite;   } 
#about .device-wrapper { text-align: center; }
#about .device  { max-width:100%; max-height: 480px; position:relative; }
#about .device-phone { border-radius:20px; border:10px solid #caecf463;  }


#teaser-mobile {  position:relative; height:400px;  } 
#teaser-mobile-bell-wrapper { position:absolute; top:230px; left:150px;  width:120px; height:120px; background:#4eb5ce; z-index:3; border-radius:50%; display: flex; justify-content: center; align-items: center; box-shadow: 0 0 50px #4eb5ce82;  }
#teaser-mobile-bell{ width:60px;  }
#teaser-mobile-news {  position:absolute; z-index:2; transform: rotate(-5deg); top:70px; border:14px solid #4eb5ce1a; border-radius:30px;  width:320px;  }
#teaser-mobile-news-wrapper { position:absolute; z-index:2;  }
#teaser-mobile-callendar {  position:absolute; z-index:1; transform: rotate(10deg); left:210px; border:14px solid #4eb5ce1a; border-radius:30px; width:360px;  }
#teaser-mobile-callendar-wrapper { position:absolute; z-index:1;  }
#device-web {  border-radius:30px; border: 14px solid #4eb5ce1a; width:100%; max-width: 550px;  }

.owl-theme .owl-dots .owl-dot.active span, .owl-theme .owl-dots .owl-dot:hover span { background:#71b2ff; }
.owl-theme .owl-dots .owl-dot span { background:#bce1eb; width:16px; height:16px; } 
.owl-theme .owl-nav.disabled+.owl-dots { margin-top: 30px; } 
.owl-theme .owl-dots { margin-top:20px; }

.owl-theme .owl-nav { top: 40%; position: absolute; width: 100%; }
.owl-carousel .owl-nav button.owl-next, .owl-carousel .owl-nav button.owl-prev { position: absolute; height: 50px; width: 50px; font-size: 40px; line-height: 0; color:#bce1eb; border-radius:50%; transition: all 0.25s ease-out;  }

.owl-carousel .owl-nav button.owl-next:hover, .owl-carousel .owl-nav button.owl-prev:hover { background:none; color:#71b2ff; }

.owl-carousel .owl-nav button.owl-prev { left: -70px; } 
.owl-carousel .owl-nav button.owl-next { right: -70px; } 

#app-preview { margin:100px auto 0 auto; }
#app-preview h2 { max-width:500px; text-align:center; margin:0 auto 25px auto; }

#section-how-it-works .icon { max-height:60px; max-width:100px; width:100%;  }

#how-it-works { background: linear-gradient(215deg, #fff 0%, #caecf4 100%); margin: 50px; border-radius: 50px; } 
#how-it-works .subline { width: 100px; display: block; margin: 0 auto 25px auto; color: #317230;     font-weight: 700; z-index:1; }
.section-cta { margin: 50px;  border-radius: 50px; background:#1d3238; color:#fff;  }

.h-slogan { font-weight:600; font-size:3rem; margin-bottom:0rem; line-height: 1.2; }
.h-slogan b { font-weight:700; background: #144c8e; background: linear-gradient(to right, #328ffd 0%, #ffed82 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; } 

.main-slogan-wrapper {  display:flex; gap:30px;  } 
.main-slogan-wrapper .logo { height:170px; }

nav.navbar { background:rgba(255,255,255,.6); position:fixed; top:0; z-index:9; width:100%; transition: all 0.25s ease-out; box-shadow: 0 0 10px rgba(0,0,0,0);  }
nav.navbar.sticky {  background:rgba(255,255,255,.6); backdrop-filter:blur(10px); box-shadow: 0 0 15px rgba(0,0,0,.1);  }
nav.navbar .logo { height:60px; transition: all 0.3s ease-out;  /*transform: scale(3) translate(15px, 50px);  */ } 
nav.navbar.sticky .logo {  transform: scale(1)  translate(0,0); } 
.nav-link { color:#000; margin:0 8px;  }
nav .open-form { padding-left: 20px; padding-right: 20px; background:#000; color:#fff;  } 
nav .open-form i { margin-right:6px;   } 

.section-control {  padding:5rem 0;  color:#000; font-size:16px;  }
.section-control .about-thumb { position:relative; padding-bottom:70px;  } 
.section-control .about-thumb .bg { position: absolute;  bottom: 70px; right: 0; z-index: 1;  width: 465px;    height: 470px; border-radius: 60px;  background: #d7f1f7;   }
.section-control .main-thumb { position: relative; z-index: 3; display: flex; justify-content: end; }
.section-control .main-thumb img { width:100%; max-width:380px; } 
.section-control .icon-wrapper {  width: 140px; height: 140px;   border-radius: 50%; background: #c6e0ff; text-align: center; position: absolute; color: #000; right: 380px; bottom: 40px; z-index: 3; font-size: 60px; justify-content: center; display: flex; align-items: center; box-shadow:0 0 50px #c6e0ff;  } 


.section-control .stars-wrapper { position:relative; z-index:2; } 
.section-control .star { position:absolute; z-index:2; } 
.section-control .star-b { top: 50px; left: 50px; z-index: 2; position: absolute; width: 80px; animation: float 6s ease-in-out infinite;  } 
.section-control .star-y { top: 190px;  left: -20px; z-index: 2; width: 60px; animation: float2 5s ease-in-out infinite; } 


.section-control ul  li { align-items: center; font-size: 1.1rem;  margin-bottom: 10px;   } 
.section-control ul.checked  li {  padding-left:40px; } 

.btn-dark { background-color: #2a2a2a; border-color: #2a2a2a; }
.btn-dark:hover { background-color: #1a1a1a; border-color: #1a1a1a; }

/* Styl dla "wDialogu przywraca kontrolę" */
.feature-card { background-color: #f8f9fa; 	border-radius: 0.5rem; 	padding: 2rem; }
.feature-card-icon { font-size: 2.5rem; color: #6f42c1; /* Fioletowy akcent */ }

/* Placeholder dla obrazków */
.placeholder-image { background-color: #e9ecef; border-radius: 0.5rem; width: 100%; display: flex; align-items: center; justify-content: center; 	color: #6c757d; font-size: 1.2rem; } 

.phone-placeholder img { min-height: 400px; max-width: 200px; margin: auto; }
img.modern { border-radius: 20px;    }
#home-app-img-warpper  {  position:relative; width: 260px;  margin: auto; } 
#home-app-img-warpper:before { content: ""; position: absolute; inset: -16px; /* grubość 'outline' */  border-radius: 30px;  background: #ffffff8f; /* biała przezroczystość */
  backdrop-filter: blur(20px);  z-index: -1; /* za obrazkiem */ }

.app-placeholder { min-height: 300px; }

/* Styl dla diagramu "Jak to działa" */
.diagrams-steps { position:relative;  gap:15px; } 
.diagram-step { text-align: center; flex: 0 0 28%; }
.diagram-step .icon { margin:2rem 0; }
.diagram-step .desc { font-size:0.9rem; color:#1d3238; } 
.diagram-box { background-color: #fff;	border: 1px solid #dee2e6; border-radius: 0.5rem; 	padding: 1.5rem; min-width: 120px; }
.diagram-arrow { font-size: 2.5rem; color: #71c2d6; align-self: center; }

#section-modules .row { --bs-gutter-y: 5rem; }

.module-item { text-align:center; display: flex; 	align-items: flex-start; margin-bottom: 1.5rem; padding:25px;  border-radius:30px;  flex-direction: column; align-items: center; gap:15px; height: 100%; background:#caecf4;  transition: all 0.2s ease-out 0s;  } 
.module-item { background: linear-gradient(90deg, #caecf4, #e1f2f6);  background-size: 200% 100%;  background-position: left;}

.module-icon { 	border-radius: 50%; width: 100px; height: 100px; display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; padding: 20px;  transition: all 0.4s ease-out 0s; position: relative; z-index: 1; margin-top: -70px;  background:#fff;  }  
.module-item { transform: scale(1); }
.module-item:hover {  transform: scale(1);    background-position: right;  }

.icon-wrapper { background:#caecf4; margin-bottom:-15px; border-radius: 50%; width: 120px; height: 120px; display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; padding: 20px;  transition: all 0.4s ease-out 0s; position: relative; z-index: 1; }

.module-content h5 { font-weight: 700; margin:10px auto 25px auto;     width: 280px; }
.module-content p { color: #135c6d; margin-bottom: 0; font-weight: 500; transition: all 0.4s ease-out 0s; }
.module-item:hover .module-content p { color: #07313a;   }
.module-icon .icon { width:100%;  max-width: 50px; max-height:50px;  } 

.module-item .module-icon {  transform: scale(1);  }
.module-item:hover .module-icon {  transform: scale(1.1);  }

.module-item .module-icon:before {  transform: rotate(0deg); transition: all 0.4s ease-out 0s; }
.module-item:hover .module-icon:before {  transform: rotate(180deg); }

.row-center { justify-content: center; }

/* Lista korzyści */
.benefits-list { list-style-type: none; padding-left: 0; }
.benefits-list li { position: relative;	padding-left: 30px;	margin-bottom: 0.75rem;	font-size: 1.1rem; }
.benefits-list li i{ 	position: absolute; 	left: 0; top: 4px;	color: #6f42c1; /* Fioletowy akcent */ }
ul.checked { list-style:none; padding-left:0; text-align:left; }

ul.questioned li { background-image: url('../img/icon-question.svg'); background-repeat: no-repeat; background-size: 22px 22px; background-position: 0 2px; padding-left: 35px; margin-bottom: 10px;  min-height: 30px;  font-weight: 500; }
ul.checked li {background-image: url('../img/icon-check.svg'); background-repeat: no-repeat; background-size: 22px 22px; background-position: 0 1px; padding-left: 35px; margin-bottom: 10px;  min-height: 30px;  font-weight: 500; font-size:1.1rem; }

.platform { display: block; width: 100%; position: relative; overflow: hidden; z-index:1; }
.platform__svg { display: block; position: absolute; }
.platform__svg.-first { top: -458px; right: -185px; z-index: -3; }
.platform__desc p { font-size:2.2rem; line-height: 1.6; max-width:800px; }

@media (max-width: 1280px) { .platform__svg.-first { top:-558px; right: -444px; }; }
@media (max-width: 969px) { .platform__svg.-first { right:-534px; }; }
@media (max-width: 770px) { .platform__svg.-first { top:-758px; right: -344px; }; }
.platform__svg.-second { top: -120px; right: 135px; z-index: -2; }
@media (max-width: 770px) { .platform__svg.-second { right:-135px; }; }
@media (max-width: 480px) { .platform__svg.-second { right:-200px; }; }
.platform__svg.-third { top: 0px; right: 135px; z-index: -1; }
@media (max-width: 770px) { .platform__svg.-third { right:0px; }; }

footer { background-color: #77c2d6; color:#fff; padding: 50px 0px 0px 0px;  } 
footer h4.title { font-weight:500; font-size: 1.3rem; margin-bottom: 1rem;  }


.footer { display: block;  width: 100%;  background: linear-gradient(125deg, #49a4ba 0%, #2db3d2 100%);  transition: all 0.2s linear; position:relative;  }
.footer .container { position:relative; z-index:2;  margin:50px auto;  }
.footer .inner_container {  } 

.footer_title { color: #ffffff;  font-weight: 600;  font-size: 1.2rem; margin-bottom:10px;  }
.footer_text { font-weight: 400;  color: #fff;  font-size: 1rem;  line-height: 1.6;  padding:0px; }
.footer_text a { color: #fff;  text-decoration: none;  cursor: pointer;  transition: all 0.2s linear; padding: 3px 0; display: block;  }
.footer_text a:hover { color: #fff;  text-decoration: underline; }
.footer-icon { margin-right:10px; height:22px; float:left;} 
.footer .iso { text-align:center; display:flex; flex-direction: column;   }

.footer .d-flex { flex-wrap: wrap; justify-content: space-between; gap: 30px; }

.copyright { display: block;  width: 100%;  background:rgba(0,0,0,.05);  padding:20px 0px; color:#fff; margin-top: 80px; }
.copyright .inner_container { display: flex;  flex-wrap: wrap;  justify-content: center;  align-items: center; font-weight: 500; gap:0px 20px; }
.copyright_item { display: block;  padding: 4px 8px;  margin: 4px 0px; font-size: 0.9rem; line-height:1.6; text-align:center;  }
.copyright_item:last-child { border-right: 0; }
.copyright_item a { color: #fff;  text-decoration: none;  cursor: pointer;  transition: all 0.2s linear; }
.copyright_item a:hover { color: #fff;  text-decoration: underline; }

.section {  position:relative;  } 

#why-us { overflow: hidden; } 
#why-us_:after { content: ""; top:-1250px;  width: 100%; height: 1500px;  background-repeat: no-repeat; background-image: url('../img/dots-g.svg');  background-attachment: scroll;  background-size: 80%;  background-position: center center; position: absolute;  left:0; z-index: -1; opacity:0.6;  } 

#features:after { content: ""; top:0;  width: 1200px; height: 1200px;  background-repeat: no-repeat; background-image: url('../img/dots-b.svg');  background-attachment: scroll;  background-size: 1200px;  background-position: center center; position: absolute;  left: -1000px; z-index: -1; opacity:0.1; -webkit-animation: rotating 100s linear infinite; animation: rotating 100s linear infinite; } 


#contact-:after { content: ""; top:0; width: 100%; height: 1200px;  background-repeat: no-repeat; background-image: url('../img/dots-g.svg');  background-attachment: scroll;  background-size: 50%;  background-position: top  center; position: absolute;  left: 0; z-index: -1; opacity:0.6;  }  

#advantages { padding:100px 50px; background:linear-gradient(215deg, #fff 0%, #caecf4 100%); position: relative;  z-index: 0; background-attachment: fixed;  margin:50px 50px 0 50px; border-radius: 50px; overflow:hidden;  }   
#download h2 { width:330px; margin:0 auto 40px auto; }

#download {  margin-top:100px; padding:100px 0;  font-weight:500; } 
#download .container { z-index:2; position:relative; }
#download-bg { position:absolute; top:0; width:100%; height:100%; left:0;  background-repeat: no-repeat; background-image: url('../img/pol2.png'); background-attachment: scroll;  background-size: 550px;   background-position: center center;  }

.subline.blue,
#download .subline { background-color: #71b2ff; color: #fff; }

#download .download-wrapper { margin:50px 0; } 
#download .download { margin:10px; opacity:1;  }

#fp-nav {  position: fixed;  z-index: 100;  margin-top: -150px;  top: 50%; opacity: 1; -webkit-transform: translate3d(0,0,0); right:10px;}
.fp-slidesNav{ position: absolute; z-index: 4; left: 50%; opacity: 1;}
#fp-nav ul,.fp-slidesNav ul {  margin: 0;  padding: 0;}
#fp-nav ul li  { background: rgba(0, 0, 0, 0) none repeat scroll 0 0 !important; display: block; height: auto !important; margin: 6px 0; opacity: 1; padding: 10px; position: relative; width: auto !important;}
#fp-nav ul li a span::before { background: #71b2ff none repeat scroll 0 0; border: 2px solid #71b2ff; border-radius: 50%; bottom: 0; content: ""; display: inline-block;  left: 0; margin: 0 auto; position: absolute; right: 0; top: 0; transform: scale(0.4); transition: all 0.4s ease-out 0s; width: 12px; height: 12px; }
#fp-nav ul li a span::after { background: #71b2ff none repeat scroll 0 0; content: ""; display: none; transition: all 0.4s ease 0s; width: 2px;}
#fp-nav ul li a.active span::before { background: rgba(0, 0, 0, 0) none repeat scroll 0 0; transform: scale(1);}
#fp-nav ul li a.active span::after { display: block;}

#fp-nav ul li .fp-tooltip { position: absolute; top: -2px; color: #71b2ff; font-size: 14px; font-family: arial, helvetica, sans-serif; white-space: nowrap; max-width: 220px; overflow: hidden; display: block; opacity: 0; width: 0; cursor: pointer;}
#fp-nav ul li:hover .fp-tooltip,
#fp-nav.fp-show-active a.active + .fp-tooltip { -webkit-transition: opacity 0.2s ease-in; transition: opacity 0.2s ease-in; width: auto; opacity: 1;}
#fp-nav ul li .fp-tooltip.right { right: 20px;}
#fp-nav ul li .fp-tooltip.left { left: 20px;}


.screen_frame_img img {
    max-height: 500px;
    width: auto!important;
    height: auto;
    object-fit: contain;  /* dzięki temu obraz nigdy się nie przytnie */
    display: block;
    margin: 0 auto; /* wycentrowanie */
    border-radius:20px; border:10px solid #4eb5ce1a;
}

.section-cta { position:relative; overflow: hidden; } 
.section-cta > * { z-index:2; position:relative; }
.section-cta .btn { font-weight:600; } 
.section-cta:after { background-image: url('../img/bg2.jpg'); background-attachment: fixed;  background-size: 100%;   background-position: center center; content:""; position:absolute; left:0; top:0; width:100%; height:100%; z-index:1; opacity:1; mix-blend-mode: multiply;  } 


.btn { position:relative;  } 

.btn.btn-bordered-white {
    background: transparent none repeat scroll 0 0;
    border: 2px solid #fff;
    padding: 11px 30px;
}

.btn.btn-bordered-white:hover,
.btn.btn-bordered-white:focus {
    border-color: transparent;
    outline: 0 none;
}

.btn.btn-bordered-white:after {
    background: rgba(0, 0, 0, 0) -webkit-linear-gradient(left, #00c9fd 0%, #81ee8e 100%) repeat scroll 0 0;
    background: rgba(0, 0, 0, 0) linear-gradient(to right, #00c9fd 0%, #81ee8e 100%) repeat scroll 0 0;
    border-radius: 100px;
    content: "";
    height: calc(100% + 4px);
    left: -2px;
    opacity: 0;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    position: absolute;
    top: -2px;
    -webkit-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
    width: calc(100% + 4px);
    z-index: -1;
}

.btn.btn-bordered-white:hover:after,
.btn.btn-bordered-white:focus:after {
    opacity: 1;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
}

.btn.btn-bordered-grad {
    background: transparent none repeat scroll 0 0;
    color: #2b323f;
    padding:10px 20px;
}

.btn.btn-bordered-grad:hover,
.btn.btn-bordered-grad:focus {
    color: #fff;
}

.btn.btn-bordered-grad:before {
    background: rgba(0, 0, 0, 0) linear-gradient(to right, #328ffd 0%, #ffed82 100%) repeat scroll 0 0;
    border-radius: 100px;
    content: "";
    height: calc(100% + 4px);
    left: -2px;
    position: absolute;
    top: -2px;
    -webkit-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
    width: calc(100% + 4px);
    z-index: -2;
}

.btn.btn-bordered-grad:after {
    
    border-radius: 100px;
    content: "";
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    -webkit-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
    width: 100%;
    z-index: -1;
}

.btn.btn-bordered-grad:hover:after,
.btn.btn-bordered-grad:focus:after {
    opacity: 0;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
}

header .btn.btn-bordered-grad:after {  background: #caecf4  none repeat scroll 0 0; } 

#contact .btn.btn-bordered-grad:after {  background: #caecf4  none repeat scroll 0 0; } 
#contact .btn.btn-bordered-grad {  font-size:1.3rem; font-weight:600; } 

.box { display: flex; width: 100%; flex-wrap: wrap; justify-content: space-between; align-items: stretch; gap: 50px; }
.box__item { display: flex; flex-direction: column; width: calc(50% - 25px); position: relative; justify-content: center; }

.box__item.left { width: calc(55% - 25px); }
.box__item.right { width: calc(45% - 25px); }

.box.photo-left .box__item.left { width: calc(45% - 25px); }
.box.photo-left .box__item.right { width: calc(55% - 25px); }


/* Contact */ 
#contact { margin:100px 0 0 0; }
#blur { position:absolute; width:100%; height:100%; z-index:999; left:0; top:0; filter:blur(0px); transition: all 0.5s ease-out; }
#blur.active {  filter:blur(30px);  }


.contact-city { box-shadow: 0 0 30px #49a4ba22; } 
#contact-form-modal h3 { margin:0 0 25px 0; text-align:center; font-weight: 600; }
.contact.section { overflow: hidden; padding-bottom:0px; position: relative; padding-top:180px; }
.contact__content { width: 80%; max-width: 1170px; margin: 0 auto; position: relative; display: flex;  padding: 50px 100px 50px 0; border-radius: 20px; background: #e1f2f6; background:linear-gradient(90deg, #caecf4, #e1f2f6);  }

.contact__imageBox { flex-shrink: 0; width: 50%; margin-left: -60px; position:relative; top:-100px; }
.contact__imageBox .box { background: #2db3d2 ; position: absolute; right:100px; 	bottom: -100px; width:220px; height:220px; display: flex; justify-content: center; border-radius: 30px; }

.contact img { max-width: 100%;     border-radius: 30px; }
.contact__textContainer { display: flex; flex-direction: column; margin-left: 60px; padding-top: 20px; }
.contact__title { font-size: 3.2rem; line-height: 1.4; font-weight: 600; color: #000000; margin-bottom: 37px; }

.contact__text { font-size: 1.2rem; line-height:1.6; font-weight: normal; color: #000000; margin-bottom: 30px; }

.contact__mail { width: 100%; padding: 10px 0; padding-left: 20px; margin-bottom:0px;  border-radius: 12px; font-size: 1.3rem; color: #000; font-weight: 600; }
.contact__number i, 
.contact__mail i { margin-right: 10px; }
.contact__mail a { color: #000; text-decoration: none; }

.contact__number {  width: 100%; margin-bottom: 10px; padding: 10px 0; padding-left: 20px;  font-size: 1.3rem; line-height:1.6; color: #fff; font-weight: 600;  }
.contact__number a { color: #000; text-decoration: none; }

.contact__form {  width: 100%; }
.contact__form i { margin-right: 10px; }
.contact__form a { color: #fff; text-decoration: none; }

#contact-us-section p { font-size:3rem; margin-bottom: 50px; font-weight:bold; } 
#contact-us-section { text-align:center; width:100%; margin:100px 0 100px 0;}


#contact-form-modal { position:fixed; z-index:9999; background:#caecf4; border-radius:30px; box-shadow:0 0 50px rgba(0,0,0,0.2); padding:30px; width: calc(100% - 25px); margin: 0 25px; max-width:600px; height:600px; padding: 20px 30px;  visibility: hidden; opacity:0; transform: translateY(100%) scale(1);   transition: all .5s cubic-bezier(0.38, 0.03, 0.07, 1); } 
#contact-form-modal-wrapper.active #contact-form-modal { opacity:1; visibility:visible; transform: translateY(0) scale(1); } 

#contact-form-modal p { font-size:13px; } 

#contact-form-modal-inner { height:530px; width:100%;  overflow-y: auto; position:relative; padding: 5px 20px 0px 5px; margin:20px 0 0 0; }

#contact-form-modal .close { position:absolute; top:-25px; right:-25px; border-radius:50%; width:50px; height:50px; padding:0; font-size:1.3rem;  background:#71b2ff; color:#fff; } 
#contact-form-modal .close i { margin:0; }

#contact-form-modal-wrapper { position:fixed; width:100%; height:100%; z-index:999; left:0; top:0; background:rgba(0,0,0,0.3); opacity:0; visibility:hidden;  transition: all 0.5s ease-out; display: flex; align-items: center; justify-content: center;  }
#contact-form-modal-wrapper.active { opacity:1; visibility:visible;  }
#submit .spinner.spinner-border { display: none; }

.contact_item { display: block; position: relative; width: 100%; }
.contact_input_label { display: block; position: absolute; top: 18px; left: 20px; font-size: 0.9rem; line-height: 1.6; color: #808080; font-weight: 400; margin: 0; transition: all 0.2s ease-out; }
.contact_input_label.top { top: 5px; font-size: 0.8rem; }
.contact_input { padding: 22px 20px 8px 20px;  outline: 2px solid rgba(255,255,255,0);  margin-bottom: 20px;  border: 1px solid #dedede;  width: 100%;  font-size: 1rem;  line-height: 1.4;  border-radius: 8px;  transition: all 0.2s linear; }

.contact_input:focus, .contact_textarea:focus  { outline: 2px solid #71b2ff ; } 

.contact_input.-formError { border-color: #e27676; }
.contact_textarea {   padding: 22px 20px 8px 20px;  margin-bottom: 30px;  border: 1px solid #dedede;  width: 100%;  font-size: 1rem;  line-height: 1.5;  height: 212px;  border-radius: 8px;  resize: none;  outline: 2px solid rgba(255,255,255,0);   transition: all 0.2s linear; }

.contact_textarea.-formError {  border-color: #e27676; }
.contact_radioPlace { display: flex; align-items: center; padding-bottom: 25px; flex-wrap: wrap;  gap: 15px; }
.contact_radio:last-child { margin-right: 0px; }
.contact_hidden { position: absolute; z-index: -1; visibility: hidden; }
.contact_hidden:checked + .contact_label:before { background-color: #71b2ff; border: 1px solid #71b2ff; }
.contact_hidden:checked + .contact_label_agree:before { background-color: #71b2ff;   border: 1px solid #71b2ff; }
.contact_label { display: flex; align-items: center; font-size: 1rem; font-weight: 500; cursor: pointer; } 
.contact_label:before { content: "•"; display: flex; align-items: center; justify-content: center; height: 25px; width: 25px; min-height: 25px; min-width: 25px; font-size: 40px;  color: #ffffff;  border-radius: 50%; background-color: #ffffff; border: 1px solid #dedede; margin-right: 12px; transition: all 0.2s linear; }

.contact_checkbox .contact_label:before { border-radius:3px; content: " ✓ ";   }

.contact_agree { padding-bottom: 10px; }
.contact_label_agree { display: flex; align-items: center; font-size: 0.8rem; font-weight: 400; line-height: 1.4; cursor: pointer;} 
.contact_label_agree:before {  content:"✓"; display: flex;  align-self: flex-start;  align-items: center;  justify-content: center;  height: 30px;  width: 30px;  font-size: 26px;
  min-height: 30px;  min-width: 30px;  color: #ffffff;  border-radius: 4px;  background-color: #ffffff;  border: 1px solid #dedede;  margin-right: 12px;  transition: all 0.2s linear; }

.contact_label_agree:before { content: "✓"; font-size: 18px; }
.contact_label_agree a { text-decoration: underline; }
.contact_label_agree a:hover { text-decoration: none; color: inherit; }
.contact_hidden.-formError + .contact_label:before { border-color: #e27676;}
.contact_hidden.-formError + .contact_label_agree:before { border-color: #e27676; }
.contact_button {   display: block;  width: max-content;  font-size: 18px;  font-weight: 600;  padding: 10px 50px;  border-radius: 100px;  margin: 10px auto 0 auto; } 
.contact_button:hover { text-decoration: none; }
.contact_sent { display: flex;  flex-direction: column;  justify-content: center;  align-items: center;  text-align: center;  position: absolute; height: calc(100% - 10px);  width: calc(100% - 10px);  opacity: 0;  transform: scale(0);  z-index: -1;   transition: all 0.5s cubic-bezier(0, 0.65, 0, 1); }
.contact_sent.active {  opacity: 1;  transform: scale(1);  z-index: auto;}
.contact_sent_icon {  width: 100%;  max-width: 64px;  max-height: 64px;  margin-bottom: 8px;  position: relative; }
.contact_sent_icon:after {  content: ""; position: absolute;  top: 0;  left: 10px;  background-color: #b6d7ff; width: 100%; height: 100%; border-radius: 50%; z-index: -1; } 
.contact_sent_text { font-size: 1.6rem; line-height: 1.5;}
.contact_sent_text span { font-size: 2rem; font-weight: 600; }

/* Responsive */

@media (max-width: 1100px) { 
    .contact__imageBox { margin-left: -45px; }
    .contact__title { font-size: 3em; } 
    .contact__content { padding: 40px 90px 30px 0; }
}

@media (max-width: 970px) { 
    .contact__textContainer { margin-left: 0; } 
    .contact.section { margin-top:120px; }     
    .contact__content { flex-direction: column; align-items: center; margin-bottom: 50px; padding: 0 50px 30px; }
    .contact__number { font-size: 1.3rem; line-height:1.6; } 
    .contact__imageBox .box { width:120px!important; height:120px!important; padding:30px; }
    .contact__imageBox { margin-top: -80px; margin-left: 0; width: 80%; } 
    .contact__mail { font-size: 1.3rem; line-height:1.6; }
}

@media (max-width: 969px) { .contact__text { font-size: 1.3rem; line-height:1.6; } }
@media (max-width: 940px) { #contact-us-section { margin-top:0px; } }

@media (max-width: 600px) { 
    .contact__imageBox { width: 100%; } 
    .contact__content { width:90%; }
    .contact__mail { font-size: 1.2rem; }
    #contact-form-modal .close { right:-5px;}
    #contact-form-modal { border-radius:20px; padding: 15px 15px; }
}



#contact-form-modal-wrapper { position:fixed; width:100%; height:100%; z-index:999; left:0; top:0; background:#37c8e788; opacity:0; visibility:hidden;  transition: all 0.5s ease-out; display: flex; align-items: center; justify-content: center; backdrop-filter: blur(10px); }
#contact-form-modal-wrapper.active { opacity:1; visibility:visible;  }
#submit .spinner.spinner-border { display: none; }

.navbar-toggler { border:0px;  }

footer .download { opacity:0.5; }


.trustUs__content { width: 80%; max-width: 1170px; margin: 200px auto 0 auto; display: flex; flex-direction: column; align-items: center; }
.trustUs__title {   margin-bottom: 120px; }
.trustUs__itemsBox { display: flex; justify-content: space-between; margin-bottom: 100px; width: 100%; }
.trustUs__item { display: flex; flex-direction: column; align-items: center; width: 33.33%; }
.trustUs__number {  font-size: 5rem; line-height: 9rem; font-weight: 700; color: #1d3238; position: relative; margin-bottom: 60px; }
.trustUs__number svg { position: absolute; top: -75px; z-index: -1; }
.trustUs__number svg.-first { left: -63px; }
.trustUs__number svg.-second { left: -78px; }
.trustUs__number svg.-third { left: -78px; }
.trustUs__text {  font-size: 1.1rem; font-weight: 400; color: #1d1e1d; text-align: center;  line-height:1.8;   max-width: 360px; }

@media (max-width: 930px) { .trustUs__itemsBox { flex-direction:column; align-items: center; margin-bottom: 0px; }; }
@media (max-width: 970px) { .trustUs__item { margin-bottom:130px; width: 100%; }; .trustUs__item:last-child { margin-bottom:0px; width: 100%; };  }
@media (max-width: 969px) { .trustUs__number { font-size:4rem; line-height: 5.4rem; text-align: center; }; }
@media (max-width: 1300px) { .trustUs__number { margin-bottom:70px; }; }
@media (max-width: 1050px) { .trustUs__number { margin-bottom:110px; }; }
@media (max-width: 970px) { .trustUs__number { margin-bottom:70px; }; }
@media (max-width: 970px) { .trustUs__number svg { transform:scale(0.85); top: -110px; }; }
@media (max-width: 1050px) { .trustUs__number svg.-first { left:-90px; }; }
@media (max-width: 970px) { .trustUs__number svg.-first { left:-120px; }; }
@media (max-width: 970px) { .trustUs__number svg.-second { left:-110px; }; }
@media (max-width: 970px) { .trustUs__number svg.-third { left:-105px; }; }


@-webkit-keyframes rotating /* Safari and Chrome */ {  from {   -webkit-transform: rotate(0deg);  transform: rotate(0deg);  } to {  -webkit-transform: rotate(360deg); transform: rotate(360deg); } }

@keyframes rotating { from { -webkit-transform: rotate(0deg); transform: rotate(0deg); } to { -webkit-transform: rotate(360deg); transform: rotate(360deg); } }

.rotating {
  -webkit-animation: rotating 2s linear infinite;
  -moz-animation: rotating 2s linear infinite;
  -ms-animation: rotating 2s linear infinite;
  -o-animation: rotating 2s linear infinite;
  animation: rotating 2s linear infinite;
}


@keyframes float { 0% { ransform: translatey(0px) scale(1); } 50% { transform: translatey(-20px)  scale(0.9) ; } 100% { transform: translatey(0px)  scale(1); } }
@keyframes float2 { 0% { ransform: translatey(0px)  scale(1); } 50% { transform: translatey(-30px) scale(0.85) ; } 100% { transform: translatey(0px)  scale(1) ; } }

#city-bg { width:100%; text-align:center; width:100%; height:460px; display:block; overflow:hidden; }
#city-bg img { margin:auto; bottom:-120px;  width: 800px; position: relative;  bottom: -160px;   }

/* Responsive */
@media (max-width: 1500px) { 
header .home-text { }
}

@media (max-width: 1199px) { 
    .main-slogan-wrapper { flex-direction: column; align-items: start; }
    header .main-desc { margin:1rem 0; }
    header .subline { margin-bottom:10px; }
    #city-bg { height:300px; }
    #city-bg img { width:700px; bottom: -38px;  }
    header .inner { padding:50px 15px; }
    #about:after,
    #features:after { display:none; }
    #teaser-mobile { transform: scale(0.8);  }
 }


@media (max-width: 991px) { 
    header.main { margin: 80px 25px 25px 25px; } 
    #advantages,
    #how-it-works { margin:0 25px; }
    .home-app { display:none; }
    header .inner { padding:30px 15px; }
    #fp-nav { right:2px;  }

    .trustUs__content { margin-top:10px; width:100%; }
    .nav-link:before { left:0px; }
    .nav-link.active:before, .nav-link:hover:before { margin-left:0px; }
    .diagram-arrow { position:absolute; top:35px;  }
    .diagram-arrow.arrow1 { left:30%; }
    .diagram-arrow.arrow2 { left:60%; }
    #how-it-works .container { width:100%; max-width:100%;  }
    .section-control .about-thumb .bg { width:100%; height:300px; }
    .section-control .icon-wrapper { left:50%; right:unset; margin-left:-70px; }
}

@media (max-width: 768px) { 
    .h-slogan, h2{ font-size:2rem; }
    #city-bg { height:200px; }
    #city-bg img { width:420px; bottom: -44px;  } 
    header .subline { border-radius:15px; }

    #app-preview { margin-top:0px; }
    #advantages,
    #how-it-works,
    header.main { border-radius:20px; }
    #download-bg { background-size:80%;  }
    #how-it-works .bi-arrow-right { transform: rotate(90deg); position:relative; left:unset; top:unset;  }
    #advantages { padding:50px 25px; }
    .modules-wrapper { --bs-gutter-x: 0rem; --bs-gutter-y:0;  } 
    .modules-wrapper .module-item { margin-top:25px;  height:250px; }
    #fp-nav { display:none; }
}

@media (max-width: 480px) { 
    #about { text-align:center; }
    .h-slogan, h2 { font-size: 1.8rem; }
    .h-slogan { margin:auto; }
    h2 { text-align:center; line-height:1.3; }
    .section-control {  padding:3rem 5px; }
    header.main { margin: 80px 15px 15px 15px; } 
    header .inner { padding: 20px 5px; }
    #about { padding:0 5px; }
    .module-item { margin-bottom:5px; }
    #advantages, #how-it-works { margin:0 15px; }
    #advantages { padding: 30px 5px 5px 5px; } 
    #download { margin-top:0px; }
    .contact__content { padding:30px 20px; } 
    .contact.section { padding-bottom:0; }  
    footer { padding-top:15px; }
    .copyright { margin-top:20px;  }
    .footer .container { margin:0 auto; }
    .section-control .main-thumb img { max-width:250px; }
    .section-control .about-thumb .bg { width:100%; }
    .section-control .icon-wrapper { z-index:3; left:50%; margin-left:-70px; bottom:0px;  }
    .section-control .about-thumb .bg { height:250px; }
    .trustUs__title { margin-bottom: 100px;     }
    header .subline { display: flex; flex-direction: column; }
    #teaser-mobile { transform: scale(0.5) translateX(-30%); width: 100%; position: relative; height: 220px;  }

    .contact__form { text-align:center; }

    .main-slogan-wrapper .logo { margin:auto;  }
    .trustUs__item { margin-bottom:100px; }

    #contact { margin-top:0px; }
    .contact__number,
    .contact__mail { padding:0 0 10px 0; font-size:1.1rem; }

     header .main-desc, .trustUs__text, #contact .btn.btn-bordered-grad, p, .lead, ul.checked li { font-size:1rem; }
    .diagram-step .desc {  margin-bottom:0px;  } 
    .footer .inner_container { padding: 0 25px; }
    .contact__content { width: auto; margin: 0 15px; }

    #download { padding:50px 0 30px 0; }
    nav.navbar {  backdrop-filter:blur(10px);  }

}

@media (min-width: 768px) {
    .modules-wrapper.owl-carousel .col-12 {
        width: unset !important;
    }
}