* {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale
}

body {
    background: #fff !important;
    overflow-x: hidden
}

.bannerslider {
    position: relative !important;
    margin-bottom: 0 !important;
    min-height: 90vh !important;
    overflow: hidden !important;
    display: flex !important;
    align-items: center !important;
    background: #0b1d30 !important
}

.bannerslider video {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center center !important;
    opacity: .75 !important;
    filter: none !important
}

.bannerslider::before { content: none !important; display: none !important }

.bannerslider::after {
    content: '' !important;
    position: absolute !important;
    inset: 0 !important;
    background: linear-gradient(180deg, rgba(11, 29, 48, 0) 0%, rgba(11, 29, 48, .35) 100%) !important;
    pointer-events: none !important;
    z-index: 1 !important
}

.captionheader {
    position: relative !important;
    z-index: 3 !important;
    padding: 0 !important
}

.captionheader::after {
    content: none !important;
    display: none !important;
    background: none !important;
    background-image: none !important
}

.captionheader .container {
    padding-top: 0 !important;
    padding-left: clamp(40px, 8vw, 168px) !important
}

@media(max-width:640px) {
    .captionheader .container {
        padding-left: 20px !important;
        padding-right: 20px !important
    }
}

.captionheader h1 {
    font-family: 'Plus Jakarta Sans', sans-serif !important;
    font-size: clamp(2rem, 4.2vw, 3.5rem) !important;
    font-weight: 700 !important;
    line-height: 1.08 !important;
    letter-spacing: -.03em !important;
    color: #fff !important;
    max-width: 920px !important;
    hyphens: none !important;
    -webkit-hyphens: none !important;
    overflow-wrap: normal !important;
    word-break: normal !important
}

.captionheader .row > .col-lg-6 {
    flex: 0 0 auto !important;
    width: 72% !important;
    max-width: 920px !important
}

@media(max-width:992px) {
    .captionheader .row > .col-lg-6 { width: 100% !important }
}

.captionheader h1 span {
    font-size: inherit !important;
    font-weight: inherit !important;
    line-height: inherit !important;
    letter-spacing: inherit !important;
    color: #7ec8f0 !important;
    -webkit-text-fill-color: #7ec8f0 !important;
    background: none !important
}

.buildfaster {
    padding: 100px 0 80px !important;
    background: #f5f5f7 !important
}

.buildfaster .container {
    max-width: 1080px !important
}

.videofaster {
    border-radius: 20px !important;
    overflow: hidden !important;
    position: relative !important;
    margin-right: 0 !important;
    border: 1px solid rgba(0, 0, 0, .08) !important;
    box-shadow: 0 1px 2px rgba(0, 0, 0, .04), 0 8px 32px rgba(0, 0, 0, .06) !important
}

.videofaster video {
    display: block !important;
    width: 100% !important;
    height: auto !important
}

.homevideofaster {
    position: absolute !important;
    inset: 0 !important;
    display: flex !important;
    align-items: flex-end !important;
    justify-content: space-between !important;
    gap: 24px !important;
    background: linear-gradient(180deg, transparent 0%, transparent 40%, rgba(4, 14, 26, .7) 100%) !important;
    padding: 40px 36px 36px !important
}

.homevideofaster h3 {
    font-family: 'Plus Jakarta Sans', sans-serif !important;
    font-weight: 700 !important;
    font-size: clamp(1.2rem, 2.2vw, 1.8rem) !important;
    letter-spacing: -.02em !important;
    color: #fff !important;
    text-transform: none !important;
    line-height: 1.25 !important;
    max-width: 460px !important;
    margin: 0 !important;
    text-shadow: 0 2px 12px rgba(0, 0, 0, .55) !important
}

.overvid {
    flex-shrink: 0 !important;
    margin: 0 !important
}

.overlayimg {
    border-radius: 10px !important;
    box-shadow: 0 4px 16px rgba(0, 0, 0, .2) !important;
    max-height: 300px !important;
    width: auto !important;
    display: block !important
}

.context {
    overflow: visible !important
}

.ethicdiv {
    gap: 56px !important;
    padding: 0 20px !important;
    align-items: flex-start !important;
    position: relative !important;
    z-index: 5 !important
}

.area {
    background: #0b1d30 !important;
    min-height: 72vh !important
}

.ethichead h4 {
    font-family: 'Plus Jakarta Sans', sans-serif !important;
    font-size: clamp(2rem, 3.8vw, 3rem) !important;
    font-weight: 700 !important;
    letter-spacing: -.03em !important;
    line-height: 1.08 !important;
    text-align: left !important;
    color: #fff !important
}

.ethichead h4 span {
    color: #7ec8f0 !important
}

.ethicp p {
    font-family: 'Plus Jakarta Sans', sans-serif !important;
    font-size: clamp(.92rem, 1.5vw, 1.05rem) !important;
    line-height: 1.8 !important;
    color: rgba(255, 255, 255, .6) !important;
    padding-right: 0 !important
}

a.btn.btn-primary.mbtn,
.mbtn {
    background: #0071e3 !important;
    border: none !important;
    border-radius: 980px !important;
    padding: 14px 30px !important;
    font-family: 'Plus Jakarta Sans', sans-serif !important;
    font-weight: 600 !important;
    font-size: 15px !important;
    color: #fff !important;
    box-shadow: none !important;
    transition: background .2s !important;
    text-decoration: none !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    line-height: 1.2 !important;
    position: relative !important;
    z-index: 10 !important;
    cursor: pointer !important
}

a.btn.btn-primary.mbtn:hover,
.mbtn:hover {
    background: #0077ed !important;
    transform: none !important;
    box-shadow: none !important
}

.circles li {
    background: rgba(255, 255, 255, .035) !important;
    border-radius: 50% !important;
    border: none !important
}

section:has(#wemake) {
    padding: 100px 0 80px !important;
    background: #fff !important
}

section:has(#wemake) .container {
    max-width: 1080px !important
}

#wemake {
    margin-bottom: 48px !important
}

#wemake h4.wemake {
    font-family: 'Plus Jakarta Sans', sans-serif !important;
    font-size: clamp(1.8rem, 3.2vw, 2.5rem) !important;
    font-weight: 700 !important;
    letter-spacing: -.03em !important;
    color: #1d1d1f !important;
    margin-bottom: 8px !important
}

#wemake p {
    font-family: 'Plus Jakarta Sans', sans-serif !important;
    color: #86868b !important;
    font-size: 1rem !important
}

.maincontainer {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 20px !important
}

.maincontainer figure {
    margin: 0 !important;
    border-radius: 14px !important;
    overflow: hidden !important;
    background: #fff !important;
    border: 1px solid #e8e8ed !important;
    box-shadow: none !important;
    transition: border-color .25s, box-shadow .35s ease, transform .35s ease !important;
    display: flex !important;
    flex-direction: column !important;
    cursor: pointer !important
}

.maincontainer figure:hover {
    transform: translateY(-3px) !important;
    border-color: #d2d2d7 !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, .04), 0 12px 32px rgba(0, 0, 0, .05) !important
}

.maincontainer .imgseccont {
    height: 200px !important;
    overflow: hidden !important
}

.maincontainer .imgseccont img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    transition: transform .6s cubic-bezier(.25, .1, .25, 1) !important
}

.maincontainer figure:hover .imgseccont img {
    transform: scale(1.03) !important
}

.maincontainer figcaption {
    padding: 22px 24px 24px !important;
    flex: 1 !important;
    display: flex !important;
    flex-direction: column !important
}

.maincontainer figcaption a.cases {
    text-decoration: none !important;
    font-family: 'Plus Jakarta Sans', sans-serif !important;
    font-weight: 500 !important;
    color: #0071e3 !important;
    font-size: .82rem !important;
    display: flex !important;
    flex-direction: column !important;
    flex: 1 !important
}

.maincontainer figcaption a.cases:hover {
    color: #0077ed !important
}

.maincontainer figcaption .cases p {
    font-family: 'Plus Jakarta Sans', sans-serif !important;
    color: #1d1d1f !important;
    font-size: .87rem !important;
    line-height: 1.5 !important;
    margin-bottom: 14px !important;
    flex: 1 !important;
    font-weight: 400 !important
}

body main section.disfact {
    background: #0b1d30 !important;
    padding: 96px 0 !important;
    overflow: hidden !important;
    text-align: center !important
}

body main section.disfact::before,
body main section.disfact::after {
    display: none !important
}

body main section.disfact .container {
    max-width: 960px !important
}

body main section.disfact .col-lg-12>h4 {
    font-family: 'Plus Jakarta Sans', sans-serif !important;
    font-size: clamp(1.5rem, 2.5vw, 2rem) !important;
    font-weight: 600 !important;
    letter-spacing: -.01em !important;
    color: rgba(255, 255, 255, .45) !important;
    text-align: center !important;
    margin-bottom: 56px !important;
    text-transform: uppercase !important;
    letter-spacing: .06em !important;
    font-size: .8rem !important
}

body main section.disfact .boxfact {
    text-align: center !important;
    padding: 24px 12px !important;
    border-radius: 0 !important;
    background: transparent !important;
    border: none !important;
    margin-bottom: 0 !important
}

body main section.disfact .boxfact:hover {
    transform: none !important;
    box-shadow: none !important;
    background: transparent !important
}

body main section.disfact h5.factnumber {
    font-family: 'Plus Jakarta Sans', sans-serif !important;
    font-size: clamp(2.8rem, 5vw, 4rem) !important;
    font-weight: 700 !important;
    letter-spacing: -.04em !important;
    color: #fff !important;
    -webkit-text-fill-color: #fff !important;
    background: none !important;
    background-clip: unset !important;
    -webkit-background-clip: unset !important;
    margin-bottom: 8px !important;
    line-height: 1 !important
}

body main section.disfact .boxfact p {
    font-family: 'Plus Jakarta Sans', sans-serif !important;
    color: rgba(255, 255, 255, .35) !important;
    font-size: .78rem !important;
    font-weight: 400 !important;
    margin: 0 !important;
    letter-spacing: .02em !important;
    text-transform: uppercase !important
}

.oursolution {
    padding: 100px 0 !important;
    background: #f5f5f7 !important
}

.oursolution .container {
    max-width: 1080px !important
}

.solutionvideo {
    align-items: center !important
}

.oursolution h4 {
    font-family: 'Plus Jakarta Sans', sans-serif !important;
    font-size: clamp(1.8rem, 3.2vw, 2.5rem) !important;
    font-weight: 700 !important;
    letter-spacing: -.03em !important;
    color: #1d1d1f !important;
    margin-bottom: 16px !important
}

.oursolution p {
    font-family: 'Plus Jakarta Sans', sans-serif !important;
    color: #6e6e73 !important;
    font-size: .98rem !important;
    line-height: 1.7 !important;
    margin-bottom: 28px !important
}

.oursolution .btn-primary {
    background: #0071e3 !important;
    border: none !important;
    border-radius: 980px !important;
    padding: 14px 30px !important;
    font-family: 'Plus Jakarta Sans', sans-serif !important;
    font-weight: 600 !important;
    font-size: 15px !important;
    box-shadow: none !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-decoration: none !important;
    color: #fff !important;
    transition: background .2s !important
}

.oursolution .btn-primary:hover {
    background: #0077ed !important;
    transform: none !important;
    box-shadow: none !important
}

.rc {
    display: flex !important;
    justify-content: center !important
}

.rc video,
.video-circle {
    border-radius: 16px !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, .04), 0 12px 48px rgba(0, 0, 0, .06) !important;
    max-width: 100% !important;
    height: auto !important
}

body main footer.darkfooter {
    background: #111113 !important;
    padding: 0 !important;
    overflow: hidden !important
}

body main footer.darkfooter>.container {
    padding-top: 64px !important;
    padding-bottom: 0 !important
}

body main footer.darkfooter>.container>.row {
    padding-bottom: 40px !important;
    border-bottom: 1px solid rgba(255, 255, 255, .07) !important
}

body main footer.darkfooter h6 {
    font-family: 'Plus Jakarta Sans', sans-serif !important;
    font-weight: 600 !important;
    font-size: .68rem !important;
    letter-spacing: .1em !important;
    text-transform: uppercase !important;
    color: rgba(255, 255, 255, .35) !important;
    margin-bottom: 20px !important
}

body main footer.darkfooter ul.fotnab {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important
}

body main footer.darkfooter ul.fotnab li {
    margin-bottom: 10px !important
}

body main footer.darkfooter ul.fotnab li a {
    font-family: 'Plus Jakarta Sans', sans-serif !important;
    color: rgba(255, 255, 255, .6) !important;
    font-size: .86rem !important;
    text-decoration: none !important;
    transition: color .15s !important;
    font-weight: 400 !important
}

body main footer.darkfooter ul.fotnab li a:hover {
    color: #fff !important
}

body main footer.darkfooter div[style*="display:flex"] {
    gap: 16px !important;
    padding-top: 24px !important;
    align-items: center !important
}

body main footer.darkfooter a img {
    opacity: .5 !important;
    transition: opacity .15s !important;
    filter: none !important;
    vertical-align: middle !important
}

body main footer.darkfooter a:hover img {
    opacity: .85 !important;
    filter: none !important;
    transform: none !important
}

body main footer.darkfooter .fotcopy,
body main .fotcopy {
    padding: 20px 0 !important;
    margin-top: 0 !important
}

body main footer.darkfooter .fotcopy p,
body main .fotcopy p {
    font-family: 'Plus Jakarta Sans', sans-serif !important;
    color: rgba(255, 255, 255, .2) !important;
    font-size: .72rem !important;
    margin: 0 !important
}

.circles {
    position: absolute !important;
    inset: 0 !important;
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
    overflow: hidden !important
}

.circles li {
    position: absolute !important;
    display: block !important;
    list-style: none !important;
    animation: animate 25s linear infinite !important;
    bottom: -150px !important
}

.circles li:nth-child(1) {
    left: 25%;
    width: 80px;
    height: 80px;
    animation-delay: 0s
}

.circles li:nth-child(2) {
    left: 10%;
    width: 20px;
    height: 20px;
    animation-delay: 2s;
    animation-duration: 12s
}

.circles li:nth-child(3) {
    left: 70%;
    width: 20px;
    height: 20px;
    animation-delay: 4s
}

.circles li:nth-child(4) {
    left: 40%;
    width: 60px;
    height: 60px;
    animation-delay: 0s;
    animation-duration: 18s
}

.circles li:nth-child(5) {
    left: 65%;
    width: 20px;
    height: 20px;
    animation-delay: 0s
}

.circles li:nth-child(6) {
    left: 75%;
    width: 110px;
    height: 110px;
    animation-delay: 3s
}

.circles li:nth-child(7) {
    left: 35%;
    width: 150px;
    height: 150px;
    animation-delay: 7s
}

.circles li:nth-child(8) {
    left: 50%;
    width: 25px;
    height: 25px;
    animation-delay: 15s;
    animation-duration: 45s
}

.circles li:nth-child(9) {
    left: 20%;
    width: 15px;
    height: 15px;
    animation-delay: 2s;
    animation-duration: 35s
}

.circles li:nth-child(10) {
    left: 85%;
    width: 150px;
    height: 150px;
    animation-delay: 0s;
    animation-duration: 11s
}

@keyframes animate {
    0% {
        transform: translateY(0) rotate(0deg);
        opacity: 1;
        border-radius: 0
    }

    100% {
        transform: translateY(-1000px) rotate(720deg);
        opacity: 0;
        border-radius: 50%
    }
}

.sr-up {
    transform: translateY(48px)
}

.sr-left {
    transform: translateX(-40px)
}

.sr-right {
    transform: translateX(40px)
}

.sr-scale {
    transform: scale(.92);
    transform-origin: center
}

.sr-d4 {
    transition-delay: .32s
}

.sr-d5 {
    transition-delay: .4s
}

@media(max-width:992px) {
    .maincontainer {
        grid-template-columns: repeat(2, 1fr) !important
    }

    body>main {
        padding-top: 66px !important
    }

    .solutionvideo {
        gap: 40px !important
    }

    .rc video,
    .video-circle {
        width: 100% !important;
        height: auto !important
    }

    .buildfaster {
        padding: 60px 0 48px !important
    }

    .oursolution {
        padding: 60px 0 !important
    }
}

@media(max-width:640px) {
    .maincontainer {
        grid-template-columns: 1fr !important;
        gap: 16px !important
    }

    .bannerslider {
        min-height: 70vh !important
    }

    .captionheader h1 {
        font-size: 1.65rem !important;
        max-width: 100% !important;
        line-height: 1.15 !important
    }

    .ethicdiv {
        flex-direction: column !important;
        gap: 20px !important;
        text-align: center !important;
        padding: 0 !important
    }

    .ethichead,
    .ethicp {
        width: 100% !important
    }

    .ethichead h4 {
        text-align: center !important;
        font-size: 1.6rem !important
    }

    .ethicp p {
        font-size: .9rem !important;
        text-align: center !important
    }

    .context .ethicdiv {
        top: 28vh !important
    }

    .area {
        min-height: 58vh !important
    }

    a.btn.btn-primary.mbtn,
    .mbtn {
        padding: 12px 24px !important;
        font-size: 14px !important
    }

    .maincontainer .imgseccont {
        height: 180px !important
    }

    .maincontainer figcaption {
        padding: 18px 18px 20px !important
    }

    .solutionvideo {
        flex-direction: column !important
    }

    .rc video,
    .solutionvideo .video-circle {
        width: 100% !important;
        height: auto !important;
        max-height: 400px !important;
        object-fit: cover !important
    }

    .homenav .nav .nav-item .nav-link {
        font-size: 13px !important;
        padding: 6px 10px !important
    }

    #mainlogo img.logo1 {
        height: 24px !important
    }

    #mainlogo img.logo2 {
        height: 18px !important
    }

    .buildfaster {
        padding: 48px 0 36px !important
    }

    .videofaster {
        border-radius: 14px !important
    }

    .homevideofaster {
        padding: 20px 18px 18px !important;
        flex-direction: column !important;
        align-items: flex-start !important;
        justify-content: flex-end !important;
        gap: 14px !important
    }

    .homevideofaster h3 {
        font-size: 1.1rem !important;
        max-width: 100% !important
    }

    .overlayimg {
        max-height: 170px !important
    }

    .disfact {
        padding: 56px 0 !important
    }

    .disfact h4 {
        margin-bottom: 32px !important
    }

    h5.factnumber {
        font-size: 2rem !important
    }

    .oursolution {
        padding: 48px 0 56px !important
    }

    .darkfooter>.container {
        padding-top: 40px !important
    }
}

@media(max-width:400px) {
    .captionheader h1 {
        font-size: 1.35rem !important
    }

    .bannerslider {
        min-height: 60vh !important
    }

    h5.factnumber {
        font-size: 1.8rem !important
    }

    .maincontainer .imgseccont {
        height: 160px !important
    }
}

.area {
    display: flex !important;
    align-items: center !important;
    position: relative !important;
}

.area-container {
    position: relative !important;
    z-index: 5 !important;
}