@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&family=Oswald:wght@200..700&display=swap');

*{
    padding: 0;
    margin: 0;
    box-sizing: border-box;
    font-family: 'Inter', serif;
    -webkit-tap-highlight-color: transparent;
    scroll-behavior: smooth;
}
:root{
    --black:#0e0419;
    --text:#272727;
    --white:#fff;
    --bgGrey:#fcfcfc;
    --green:#209b91;
    --primary:#20889b;
    
}
::selection {
    background-color: var(--green);
    color: var(--white)
}

::-moz-selection {
    background-color: var(--green);
    color: var(--white)
}
body.noscroll{overflow-y: hidden;}
ul{list-style: none;}
a{text-decoration: none;}
.flex{display:flex;align-items: center}
.flex.jcc{justify-content: center;}
.flex.jcsb{justify-content: space-between;}
.flex.fdc{flex-direction: column;}
.flex.jcs{justify-content: flex-start;}
body{width: 100vw;overflow-x:hidden;background: var(--bgGrey);max-width:100vw;overflow-x:hidden}
button{outline:none;border: none;cursor: pointer;transition: 300ms ease;}

/* navbar styles */
.menuBg, .menuToggle{display:none}
nav{position:relative;background:none;padding:1.2rem;transition:300ms ease;z-index:3;margin:0 auto;background:var(--white);border-bottom: 1px solid #eee;}
.logo{height:2rem}
.navUl{display: flex;text-transform: uppercase;}
.navLi{position:relative;padding:.5rem 1rem;transition:300ms ease;font-size: 84%;}
.navLi.active{color:var(--green)}
.navLi::after{content:'';position:absolute;bottom:-2px;width:100%;height:1px;background:var(--black);left:50%;transform:translate(-50%,-50%) scaleX(0);transform-origin: center;transition:300ms ease}
.navLi:hover::after{transform:translate(-50%,-50%) scaleX(.8)}
.navLi.active::after{background:var(--green);pointer-events: none;transform:translate(-50%,-50%) scaleX(.8)}
nav.fix{position:fixed;top:0;left:0;height:auto;z-index:10;transition:300ms ease;width:100vw;animation:slideDown 300ms ease}

section.hero{height: 105vh;position:relative;display: flex;align-items: center;justify-content: center;}
.hero_bg{position:absolute;top:50%;left:50%;transform: translate(-50%,-50%);height: 100%;width: 100%;object-fit: cover;}
.hero_content{position:relative;z-index:2;color:var(--white);width: 80%;}
.hero_p{font-size: 200%;}
.hero_head{font-size: 400%;font-family: 'Oswald',Arial, Helvetica, sans-serif;font-weight: 500;text-transform: uppercase;width: 40%;line-height: 120%;margin:.3rem 0 1rem 0}
.hero_link{background:var(--white);display: flex;align-items: center;justify-content: start;padding:.5rem;border-radius: 2rem;width: fit-content;color:var(--green);gap:.5rem;transition: 300ms ease;}
.hero_link:hover{filter:brightness(110%)}
.hero_link span{font-family: 'Oswald',Arial, Helvetica, sans-serif;font-size: 120%;text-transform: uppercase;margin-left: .7rem;font-weight: 500;}
.ico_wrap{color:var(--white);background:var(--green);display: grid;place-items: center;border-radius: 1.5rem;padding:.3rem .8rem;font-size: 120%;transition: 300ms ease;}

section.about_us{height:90vh;overflow: hidden;}
.section_grid{display: grid;grid-template-columns: 1fr 1fr}
.section_content{padding:2rem;display: flex;align-items: flex-start;flex-direction: column;justify-content: center;width: 84%;margin:0 0 0 auto}
.section_vector{overflow: hidden;display: flex;align-items: flex-end;justify-content: flex-end;}
.sv_img{height: 100%;width: auto;width: 70%;}
.section_head, .solution_name{font-family: 'Oswald',Arial, Helvetica, sans-serif;font-size: 240%;text-transform: uppercase;font-weight: 500;}
.section_head span{color:var(--green);font-family: 'Oswald',Arial, Helvetica, sans-serif}
.section_p{font-size:120%;margin:1rem 0}
.hero_link.section_link{background:var(--green);color:var(--white)}
.hero_link.section_link .ico_wrap{color:var(--green);background:var(--white)}

.mission_grid{display: grid;grid-template-columns: 40% 1fr;}
section.mission .section_content{margin:0 auto 0 0}
section.mission .section_head{font-size: 210%;font-weight: 400;}
.mgv{height: 80%;}
.mgv_{display: flex;align-items: center;justify-content: flex-start;}
.bmg{display: none;}

.wtr_grid{display: grid;grid-template-columns: 1fr 35% 1fr;gap:4rem}
.wtr_section{display: flex;align-items: center;justify-content: center;flex-direction: column;text-align: center;}
.wtr_img_wrap{width: 100%;overflow: hidden;align-items: center;justify-content: center;height: 80vh;position:relative}
.wtr_img_wrap.lft::after, .wtr_img_wrap.lft::before, .wtr_img_wrap.rgt::after, .wtr_img_wrap.rgt::before{position:absolute;background:var(--bgGrey);z-index:2;content:'';width:200%;height: 30vh;transform: translate(-50%,-50%);}
.wtr_img_wrap.lft::before{top:-28%;transform: rotate(15deg);left:-50%}
.wtr_img_wrap.lft::after{bottom:-28%;transform: rotate(-15deg);left:-50%}

.wtr_img_wrap.rgt::before{top:-28%;transform: rotate(-15deg);left:-50%}
.wtr_img_wrap.rgt::after{bottom:-28%;transform: rotate(15deg);left:-50%}

.wtr_img_wrap img{width: 100%;object-fit: cover;height: 100%;}
section.os{padding:4rem 0}
.solutions_grid{display: grid;grid-template-columns: repeat(5,1fr);gap:1rem;width: 80%;margin:2rem auto}
.solution_card{background:var(--green);border-radius: 1rem;color:var(--white);transition:300ms ease}
.solution_img_wrap{border-top-right-radius: 1rem;border-top-left-radius: 1rem;overflow: hidden;height: 28vh;}
.solution_img{width: 100%;object-fit: cover;transition:300ms ease;height: 100%;}
.solution_card{position:relative;overflow: hidden}
.solution_card.full{height: 100%;padding-bottom: 2.5rem;}
.solution_detail{padding:1rem}
.solution_name{font-size: 130%;margin-bottom: .2rem;}
.solution_decription{font-size: 80%;}
/* .solution_card:hover{transform: scale(1.02);} */

footer{background:var(--white)}
.footer_top{background:var(--primary);position:relative;overflow: hidden;display: flex;align-items: center;justify-content: center;height: 100vh;}
.footer_top .section_content{width: 40%;color:var(--white);margin:0 auto;text-align: center;align-items: center;justify-content: center;position:relative;z-index:2}
.footer_left_img{position:absolute;left: 0;bottom:0;height: 80%;}
.footer_right_img{position:absolute;right: 0;bottom:-2%;height: 80%;}
.footer_fence{position:absolute;bottom:0;height: 12%}
.footer_fence.f1{left:0%}
.footer_fence.f2{right:0%}
.footer_fence.f3{left:20%}
.footer_fence.f4{left:46%}
.ftr_rail{position:absolute;height: 14%;bottom:12%}
img.mbo{display: none;}
.footer_bottom{display: flex;align-items: center;justify-content: center;padding:3rem 0}
.ftr_logo_wrap{width: 15%;display: flex;align-items: center;justify-content: flex-start;}
.footer_menu{width: 65%;display: flex;align-items: flex-start;flex-direction: column;justify-content: center;}
.footer_logo{height: 2.5rem;}
.footer_menu_ul{display: flex;align-items: center;justify-content: flex-start}
.ftrlia{text-transform: uppercase;padding:1rem;transition:300ms ease;font-size: 90%;}
.footer_menu_ul li:not(:first-child){border-left: 1px solid #ccc;}
.footer_menu_ul li:first-child .ftrlia{padding-left: 0}
.ftrlia:hover{color:var(--green)}
.fbbd{width: 100%;border-top:1px solid var(--green);padding-top: .5rem;margin-top: .5rem;}
.cpyrgt{color:var(--green)}
.sm_ul{display: flex;align-items: center;justify-content: flex-end;}
.smlia{padding:.4rem;transition:300ms ease;font-size: 150%;}
.smlia:hover{color:var(--green)}
li a{color:var(--black)}

.about_more{position:relative;margin-top: -10vh}
.am_grid{display: grid;grid-template-columns: repeat(3,1fr);gap:1rem;width: 80%;margin:0 auto;margin-bottom: -10vh;}
.am_card{background:var(--white);border-radius: .5rem;z-index:3;padding:2rem}
.amg_div{background:var(--green);padding:10rem 0;width:80%;margin:0 auto;color:var(--white)}
section.about_us.aup{height: 80vh;background:var(--bgGrey)}
body:has(.aup){background:var(--green)}
.am_card .section_p{font-size: 90%;}
.am_card_icon{height: 2rem;}
.amg_div .section_head{font-size: 200%;}
.amg_div .section_p{width: 60%;}
.am_img{position:absolute;bottom:0;right:0;height: 60%;}
.about_us.aup .section_content .section_p{margin-bottom: 8rem;}
body:has(.aup) section.os{background:var(--white)}
.imc_grid{margin:4rem auto;width: 80%;display: flex;flex-wrap: wrap;gap:1.5rem;align-items: center;justify-content: center;}
.im_card{background:#f6f6f6;border-radius: 1rem;align-items: center;justify-content: center;position:relative;overflow: hidden;padding:2rem;width: 30%;}
.im_card .section_p{width: 80%;}
.imc_img{position:absolute;bottom:0;right:0;height: 40%;}
.im_card:nth-of-type(1), .im_card:nth-of-type(2){width: 34%;}

.os_top{background:var(--green);color:var(--white)}
.os_top_img{height: 70vh;width: 100%;object-fit: cover;margin-top: -10%;}
.os_top .section_head{padding-top: 5%;}
.twwo_card{width:31.5%;min-height: 64vh}
.twwo_card:nth-of-type(1), .twwo_card:nth-of-type(2){width:48.5%}
.twwo_img_wrap{overflow: hidden;height: 40vh;border-radius: .5rem;}
.twwo_img{height: 100%;width: 100%;object-fit: cover;}
.twwo_card .section_head{margin:1rem 0 -.8rem 0;font-size: 160%;}
.twwo_card .section_p{font-size: 100%;width: 90%;}

.use_cases{background:var(--green);color:var(--white);margin-top: 2rem;}
.use_case{display:flex;justify-content: space-between;align-items: center;margin:0 auto;padding:2rem 10vw;border-bottom:1px solid var(--bgGrey)}
.use_case .section_head{width: 28%;font-size: 160%;font-weight: 400;}
.use_case .section_p{width: 70%}

.section_top, .sectors_grid{width:80%;margin:0 auto}
section.targeted_sectors{padding:4rem 0}
.sectors_grid{display: grid;grid-template-columns: 1fr 1fr;gap:2rem;margin:2rem auto}
.sector .section_head{font-size: 160%;}
.markets_grid.tio{display: grid;grid-template-columns: 1fr 1fr;gap:2rem;}
.sector:has(.tio){grid-column: span 2;}
.markets_grid{padding:2rem 0}
/* .region_card{padding:2rem;background:#eee;border-radius: ;} */
.markets_grid .im_card{width:100%}
.markets_grid .im_card .am_card_icon{height: 5rem;}
.region_name{font-size:120%;margin:1rem 0 .5rem 0;font-weight: 500;}
.places span{font-weight: 500;text-decoration: underline;}
.places{font-size: 100%;}

section.contact_us{background:var(--primary);color:var(--white);height:100vh;position:relative;display: flex;align-items: center;justify-content: center;overflow: hidden;}
.cntct_bg_img{position:absolute;bottom:0;right:0;width: 100%;height: auto;}
.cu_div{width: 80%;margin-top: -10rem;}
.cu_div .section_p{width:42%;font-size: 100%;}
.cu_div .section_head{font-size: 240%;}
.section_head.cu_sh{text-transform: none;font-size: 170%;font-weight: 400;margin-bottom: -.8rem;}
.cu_det_grid{display: grid;grid-template-columns: 1fr 1fr;width: 40%;margin-top: -.5rem}
.cu_det_grid .section_p{width: 100%;line-height: 140%;font-size: 95%}
.cu_det_grid a{color:var(--white);transition: 500ms ease;}
.cu_det_grid a:hover{text-decoration: underline;}

.solution_card::after{content:'';position:absolute;bottom:0;left:0;width: 100%;height: 15%;z-index:2;background:linear-gradient(to top, var(--green) 0%,var(--green) 60%, rgba(0,0,0,0) 100%);pointer-events: none}
.solution_card{position:relative;overflow: hidden;height: 52vh;}
.solution_card.full{height: 100%;padding-bottom: 2.5rem;}
.solution_card.full::after{display: none;}
.tmspan{display: inline-block;position: absolute;bottom:1rem;right:1rem;z-index:3;cursor: pointer;transition: 300ms ease;font-weight: 500;font-size: 80%;}
.tmspan:hover{color:var(--yellow)}



@keyframes scroll {
    0%{transform: translateX(184.6%);}
    100%{transform: translateX(-184.6%);}
}
@keyframes scroll2 {
    0%{transform: translateX(84.6%);}
    100%{transform: translateX(-284.6%);}
}

@keyframes scroll3 {
    0%{transform: translateX(188.5%);}
    100%{transform: translateX(-188.5%);}
}
@keyframes scroll4 {
    0%{transform: translateX(88.5%);}
    100%{transform: translateX(-288.5%);}
}

@media (max-width:900px){
    ::-webkit-scrollbar {height: 0px;width: 0px;}
    nav{max-width: 100vw;overflow-x: hidden;}
    nav.fix{padding:1rem .7rem}
    .menuToggle{display:block;background:none;outline:none;border:none;color:var(--black);cursor:pointer;font-size:180%;margin-top: -5px;}
    .menuBg{position: fixed;top:0;left:0;height:100vh;width:100vw;background:rgba(0,0,0,.1);z-index:7;backdrop-filter: blur(2px);transition:300ms ease;opacity: 0;}
    .navUl{position: fixed;top:0;left:-100vw;height:100vh;width:70vw;background:var(--white);flex-direction: column;z-index:10;padding-top: 70px;transition:300ms ease}
    .logo{height: 1.5rem;}
    .navLi::after{display: none;}
    .navLi:not(:last-child){border-bottom: 1px solid rgba(180, 180, 180, 0.1)}
    .navLi{display: block;width: 90%;font-size: 150%;margin-bottom: 1rem;}
    .nav.show .menuBg{display:block;opacity:1;transition:300ms ease}
    .nav.show .navUl{left:0}
    nav .btn{margin-top: 15px;margin-left: 15%}
    .nav{padding:15px 0;width: 90%}

    section.hero{height: 60vh}
    .hero_content{width: 86%;}
    .hero_p{font-size: 150%;}
    .hero_head{font-size: 250%;width: 100%;}
    .hero_link{padding:6px}
    .hero_link span{font-size: 120%;margin-left: .5rem;}
    .ico_wrap{color:var(--white);background:var(--green);display: grid;place-items: center;border-radius: 1.5rem;padding:.3rem .5rem;font-size: 110%;transition: 300ms ease}

    section.about_us{height:auto;}
    .section_grid{grid-template-columns: 1fr}
    .section_content{padding:2rem;width: 100%;margin:0 auto}
    .sv_img{width: 100%;}
    .section_head{font-size: 200%}
    .section_p{font-size:100%;margin:.5rem 0 1rem 0}

    .mission_grid{grid-template-columns: 40% 1fr;gap:0;position:relative;margin-top:4rem}
    section.mission .section_content{margin:0;}
    section.mission .section_head{font-size: 130%;text-align: center;margin-left: -50px;margin-top: 20px;}
    section.mission .section_p{display: none;}
    .mgv{height: 80%;position:absolute}
    section.mission .section_p.bmg{display: block;text-align: center;width: 90%;margin:10px auto;font-size: 85%;margin-bottom: 4rem;}
    section.mission {margin:0;padding:0}

    .wtr_grid{grid-template-columns: 1fr}
    .wtr_section{display: flex;align-items: center;justify-content: center;flex-direction: column;text-align: center;width: 90%;margin:0 auto}
    .wtr_img_wrap{display: flex;align-items: center;height: 70vh;}
    .wtr_img_wrap:nth-of-type(1){justify-content: flex-start;}
    .wtr_img_wrap.scnd{justify-content: flex-end;}
    .wtr_img_wrap img{width: 80%}
    .wtr_section .section_p{font-size: 90%;}

    .solutions_grid{display: flex;align-items: flex-start;justify-content: flex-start;flex-wrap: nowrap;overflow-x: auto;width: 100%;}
    .solution_card{flex: 0 0 60%;min-height: 42vh;height: 42vh;}
    .solution_card:nth-of-type(1){margin-left: 1.5rem;}
    .solution_card:last-of-type{margin-right: 1.5rem;}
    .solution_img_wrap{height: 20vh;}
    .solution_name{font-size: 110%;margin-bottom: .2rem;}

    img.dto{display: none}
    .footer_bottom{flex-direction: column;}
    .ftr_logo_wrap{width:100%;justify-content: center;}
    .footer_menu{width: 85%}
    .footer_logo{height: 2.5rem;margin-bottom: 2rem;}
    .ftrlia{font-size: 65%;padding:5px}
    .footer_menu_ul{justify-content: space-between;width: 100%;}
    .cpyrgt{font-size: 60%;}
    .smlia{padding:.4rem;font-size: 100%;}
    .footer_top .section_content{width: 90%;margin-top: 4rem;}
    .footer_top .section_content .section_head{font-size: 140%;}
    .footer_top .section_content .section_p{font-size: 80%;}

    img.mbo{display: block;position:absolute;width: 100%;height: auto;max-width: 100vw;}
    .ftr_right_img{bottom:-2%}
    .ftr_left_img{top:3%}
    .footer_top{height: 130vh;}
    .ftr_left_line{top:33%}

    .about_more{margin-top: 4vh;overflow: hidden;}
    .am_grid{grid-template-columns: 1fr;width: 90%}
    .amg_div{width: 100%;padding:8rem 2rem}
    .amg_div .section_head{font-size: 180%;}
    .amg_div .section_p{width: 100%;}
    .am_img{position:absolute;bottom:0;right:0;height: 15%;}
    body:has(.aup) section.about_us{height: auto;}
    body:has(.aup){background:var(--bgGrey)}
    .am_card{background:#f5fffe;border:1px solid #eee}
    .about_us.aup .section_content .section_p{margin-bottom: 0;}
    .imc_grid{margin:2rem auto;width: 90%;gap:1rem;justify-content: flex-start;}
    .im_card{padding:1rem}
    .imc_img{height: 30%;}
    .im_card:nth-of-type(1), .im_card:nth-of-type(2), .im_card{width: 45%;}
    .im_card .section_p{font-size: 80%;width: 90%;min-height: 12vh;}

    .os_top_img{height: 16vh}
    .twwo_card:nth-of-type(1), .twwo_card:nth-of-type(2), .twwo_card{width:100%;min-height: 45vh}
    .twwo_img_wrap{height: 26vh}
    .twwo_card .section_head{margin:1rem 0 0 0;font-size: 160%;}
    .twwo_card .section_p{font-size: 90%;margin-bottom: 2rem;}

    body:has(.os_top) .section_head{font-size: 150%;}

    .use_case{flex-direction: column;padding:2rem 1.2rem}
    .use_case .section_head{width: 100%}
    .use_case .section_p{width: 100%}

    .section_top, .sectors_grid{width:90%}
    section.targeted_sectors{padding:2rem 0}
    .sectors_grid{grid-template-columns: 1fr;gap:2rem;margin:1rem auto}
    .sector .section_head{transform: scale(.9);margin-left: -5%;margin-bottom: -16px;}
    .markets_grid.tio{grid-template-columns: 1fr;gap:1rem}
    .sector:has(.tio){grid-column: span 1;}
    .markets_grid .im_card{width:100%}
    .markets_grid .im_card .am_card_icon{height: 4rem;}
    .places{font-size: 70%;}
    .region_name{font-size:120%;}

    section.contact_us{height:80vh}
    .cu_div{width: 90%;margin-top: -4rem}
    .cu_div .section_p{width:100%;font-size: 90%;}
    .cu_div .section_head{font-size: 180%;}
    .section_head.cu_sh{font-size: 120%;margin-bottom: 0;}
    .cu_det_grid{width: 100%}
    .cu_det_grid .section_p{font-size: 80%}

}
@keyframes rotate {
    0%{transform: rotate(0deg);}
    50%{transform: rotate(360deg);}
    100%{transform: rotate(0deg);}
}
@keyframes slideDown {
    0%{top:-100px}
    100%{top:0}
}
@keyframes slideUp {
    0%{bottom:-100px}
    100%{bottom:0}
}
@keyframes bs_slide {
    0%{opacity:0;margin-bottom: -150px;}
    100%{opacity:1;margin-bottom: 0;}
}
@keyframes bs_slide2 {
    0%{opacity:0;transform: translateY(100px);}
    100%{opacity:1;transform: translateY(0);}
}
@keyframes bs_slide1 {
    0%{margin-bottom: -100vh;}
    100%{margin-bottom: 0;}
}
@keyframes smoothbounceball{ 
    0% { transform:translate(-50%,-50%) scale(.9); filter: brightness(80%);} 
    100% { transform: translate(-50%,-50%) scale(1); filter: brightness(120%);} 
} 
@keyframes zoom {
    0%{transform: translate(-50%,-50%) scale(0);}
    100%{transform: translate(-50%,-50%) scale(1);}
}
@keyframes grow {
    0%{transform: translateY(-50%) scale(0); opacity:0;}
    100%{transform: translateY(-50%) scale(1);opacity: 1;}
}
@keyframes smallBall {
    0%{margin-left:0;transform: scale(0);opacity: 0;}
    50%{margin-left:-50px;transform: scale(.8); width:180px;border-radius: 50px;opacity: 1;}
    100%{margin-left:0;width:100px;}
}
@keyframes sbImg {
    0%{opacity: 0; right:-100px}
    50%{opacity: 1; right:-100px}
    100%{opacity: 1; right:11px}
}
@keyframes cmAn {
    0%{opacity: 0; transform:scale(0)}
    60%{opacity: 0; transform:scale(0)}
    70%{opacity: 1; transform:scale(1)}
    100%{opacity: 1; transform:scale(1)}
}
@keyframes slideSDbefore {
    0%{transform: scale(0);left:-50px}
    50%{transform: scale(0);}
    100%{transform: scale(2);left:0}
}
@keyframes slideSDbefore1 {
    0%{transform: scale(0);right:-50px;bottom:-50px}
    50%{transform: scale(0);bottom:0}
    100%{transform: scale(2);right:0;bottom:0}
}
@keyframes slidejksd {
    0%{opacity:0;margin-bottom: -200px;}
    80%{opacity:0;margin-bottom: -200px;}
    100%{opacity:1;margin-bottom: 0;}
}