@import"https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&family=Roboto:wght@300;400;500;600;700&display=swap";

.mat-typography {
    font: 400 14px/20px Roboto,Helvetica Neue,sans-serif;
    letter-spacing: normal
}

@charset "UTF-8";

:root {
    --bs-blue: #0d6efd;
    --bs-indigo: #6610f2;
    --bs-purple: #6f42c1;
    --bs-pink: #d63384;
    --bs-red: #dc3545;
    --bs-orange: #fd7e14;
    --bs-yellow: #ffc107;
    --bs-green: #198754;
    --bs-teal: #20c997;
    --bs-cyan: #0dcaf0;
    --bs-black: #000;
    --bs-white: #fff;
    --bs-gray: #6c757d;
    --bs-gray-dark: #343a40;
    --bs-gray-100: #f8f9fa;
    --bs-gray-200: #e9ecef;
    --bs-gray-300: #dee2e6;
    --bs-gray-400: #ced4da;
    --bs-gray-500: #adb5bd;
    --bs-gray-600: #6c757d;
    --bs-gray-700: #495057;
    --bs-gray-800: #343a40;
    --bs-gray-900: #212529;
    --bs-primary: #0d6efd;
    --bs-secondary: #6c757d;
    --bs-success: #198754;
    --bs-info: #0dcaf0;
    --bs-warning: #ffc107;
    --bs-danger: #dc3545;
    --bs-light: #f8f9fa;
    --bs-dark: #212529;
    --bs-primary-rgb: 13, 110, 253;
    --bs-secondary-rgb: 108, 117, 125;
    --bs-success-rgb: 25, 135, 84;
    --bs-info-rgb: 13, 202, 240;
    --bs-warning-rgb: 255, 193, 7;
    --bs-danger-rgb: 220, 53, 69;
    --bs-light-rgb: 248, 249, 250;
    --bs-dark-rgb: 33, 37, 41;
    --bs-white-rgb: 255, 255, 255;
    --bs-black-rgb: 0, 0, 0;
    --bs-body-color-rgb: 33, 37, 41;
    --bs-body-bg-rgb: 255, 255, 255;
    --bs-font-sans-serif: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", "Liberation Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
    --bs-font-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
    --bs-gradient: linear-gradient(180deg, rgba(255, 255, 255, .15), rgba(255, 255, 255, 0));
    --bs-body-font-family: var(--bs-font-sans-serif);
    --bs-body-font-size: 1rem;
    --bs-body-font-weight: 400;
    --bs-body-line-height: 1.5;
    --bs-body-color: #212529;
    --bs-body-bg: #fff;
    --bs-border-width: 1px;
    --bs-border-style: solid;
    --bs-border-color: #dee2e6;
    --bs-border-color-translucent: rgba(0, 0, 0, .175);
    --bs-border-radius: .375rem;
    --bs-border-radius-sm: .25rem;
    --bs-border-radius-lg: .5rem;
    --bs-border-radius-xl: 1rem;
    --bs-border-radius-2xl: 2rem;
    --bs-border-radius-pill: 50rem;
    --bs-heading-color:;
    --bs-link-color: #0d6efd;
    --bs-link-hover-color: #0a58ca;
    --bs-code-color: #d63384;
    --bs-highlight-bg: #fff3cd
}

*, *:before, *:after {
    box-sizing: border-box
}

@media (prefers-reduced-motion: no-preference) {
    :root {
        scroll-behavior: smooth
    }
}

body {
    margin: 0;
    font-family: var(--bs-body-font-family);
    font-size: var(--bs-body-font-size);
    font-weight: var(--bs-body-font-weight);
    line-height: var(--bs-body-line-height);
    color: var(--bs-body-color);
    text-align: var(--bs-body-text-align);
    background-color: var(--bs-body-bg);
    -webkit-text-size-adjust: 100%;
    -webkit-tap-highlight-color: rgba(0,0,0,0)
}

*, :before, :after {
    box-sizing: border-box;
    border-width: 0;
    border-style: solid;
    border-color: #e5e7eb
}

:before, :after {
    --tw-content: ""
}

html {
    line-height: 1.5;
    -webkit-text-size-adjust: 100%;
    tab-size: 4;
    font-family: ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans,sans-serif,"Apple Color Emoji","Segoe UI Emoji",Segoe UI Symbol,"Noto Color Emoji";
    font-feature-settings: normal;
    font-variation-settings: normal
}

body {
    margin: 0;
    line-height: inherit
}

*, :before, :after {
    --tw-border-spacing-x: 0;
    --tw-border-spacing-y: 0;
    --tw-translate-x: 0;
    --tw-translate-y: 0;
    --tw-rotate: 0;
    --tw-skew-x: 0;
    --tw-skew-y: 0;
    --tw-scale-x: 1;
    --tw-scale-y: 1;
    --tw-pan-x:;
    --tw-pan-y:;
    --tw-pinch-zoom:;
    --tw-scroll-snap-strictness: proximity;
    --tw-gradient-from-position:;
    --tw-gradient-via-position:;
    --tw-gradient-to-position:;
    --tw-ordinal:;
    --tw-slashed-zero:;
    --tw-numeric-figure:;
    --tw-numeric-spacing:;
    --tw-numeric-fraction:;
    --tw-ring-inset:;
    --tw-ring-offset-width: 0px;
    --tw-ring-offset-color: #fff;
    --tw-ring-color: rgb(59 130 246 / .5);
    --tw-ring-offset-shadow: 0 0 #0000;
    --tw-ring-shadow: 0 0 #0000;
    --tw-shadow: 0 0 #0000;
    --tw-shadow-colored: 0 0 #0000;
    --tw-blur:;
    --tw-brightness:;
    --tw-contrast:;
    --tw-grayscale:;
    --tw-hue-rotate:;
    --tw-invert:;
    --tw-saturate:;
    --tw-sepia:;
    --tw-drop-shadow:;
    --tw-backdrop-blur:;
    --tw-backdrop-brightness:;
    --tw-backdrop-contrast:;
    --tw-backdrop-grayscale:;
    --tw-backdrop-hue-rotate:;
    --tw-backdrop-invert:;
    --tw-backdrop-opacity:;
    --tw-backdrop-saturate:;
    --tw-backdrop-sepia:
}

html, body {
    height: 100vh;
    margin: 0;
    padding: 0;
    overflow-x: hidden
}

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box
}

</style > <link rel="stylesheet" href="styles.462bb01611abb24d.css" media="all" onload="this.media='all'" > <noscript > <link rel="stylesheet" href="styles.462bb01611abb24d.css" > </noscript > <style type="text/css" > </style > <style > .circle-run[_ngcontent-ufk-c2] {
    position: relative;
    animation-name: _ngcontent-ufk-c2_run1;
    animation-duration: 20s;
    animation-iteration-count: infinite;
    overflow-x: hidden
}

@keyframes _ngcontent-ufk-c2_run1 {
    0% {
        left: 0;
        top: 0
    }

    25% {
        left: 100%;
        top: 0
    }

    50% {
        left: 100%;
        top: 350px
    }

    70% {
        left: 0;
        top: 340px
    }

    to {
        left: 0;
        top: 0
    }
}

.circle-run2[_ngcontent-ufk-c2] {
    position: relative;
    animation-name: _ngcontent-ufk-c2_run2;
    animation-duration: 5s;
    animation-iteration-count: infinite;
    width: 230px
}

@keyframes _ngcontent-ufk-c2_run2 {
    0% {
        left: -45px;
        top: 225px
    }

    50% {
        left: -45px;
        top: 250px
    }

    to {
        left: -45px;
        top: 225px
    }
}

.circle-run3[_ngcontent-ufk-c2] {
    position: relative;
    animation-name: _ngcontent-ufk-c2_run3;
    animation-duration: 5s;
    animation-iteration-count: infinite
}

@keyframes _ngcontent-ufk-c2_run3 {
    0% {
        left: 0;
        top: 0
    }

    50% {
        left: 0;
        top: 40px
    }

    to {
        left: 0;
        top: 0
    }
}

.circle-run4[_ngcontent-ufk-c2] {
    position: relative;
    animation-name: _ngcontent-ufk-c2_run4;
    animation-duration: 60s;
    animation-iteration-count: infinite;
    width: 230px
}

@keyframes _ngcontent-ufk-c2_run4 {
    0% {
        left: -200px;
        top: 0;
        transform: rotate(36deg)
    }

    50% {
        left: 1500px;
        top: 100px;
        transform: rotate(36deg)
    }

    60% {
        left: 1500px;
        top: 550px;
        transform: rotate(36deg)
    }

    to {
        left: -200px;
        top: 550px;
        transform: rotate(36deg)
    }
}

.global-heading[_ngcontent-ufk-c2] {
    line-height: 130%;
    position: relative;
    padding-bottom: 16px;
    margin-bottom: 35px
}

    .global-heading[_ngcontent-ufk-c2]:before {
        content: "";
        position: absolute;
        width: 120px;
        height: 2px;
        background-color: #00f;
        left: 0;
        bottom: 0
    }

.feature-img[_ngcontent-ufk-c2] {
    width: 100%;
    height: 400px;
    object-fit: cover
}

.sidenav[_ngcontent-ufk-c2] {
    position: fixed;
    top: 0;
    right: 0;
    background: white;
    z-index: 999999;
    height: 100vh;
    width: 300px;
    box-shadow: 0 10px 15px -3px #0000001a,0 4px 6px -4px #0000001a;
    padding: 20px;
    transition: transform .3s ease-in-out
}

.sidenav.active[_ngcontent-ufk-c2] {
    transform: translate(0)
}

.features-list[_ngcontent-ufk-c2] {
    gap: 40px !important
}

.statistical-list[_ngcontent-ufk-c2] {
    gap: 80px !important
}

.statistical-content[_ngcontent-ufk-c2] {
    margin-top: 0
}

.mobile-left[_ngcontent-ufk-c2] {
    width: 228px;
    transform: translate(89px,22px);
    z-index: -11;
    opacity: .5;
    height: 420px
}

.mobile-right[_ngcontent-ufk-c2] {
    width: 225px;
    transform: translate(-75px,22px);
    z-index: -11;
    opacity: .5;
    height: 425px
}

.mobile-main[_ngcontent-ufk-c2] {
    width: 225px;
    height: 464px
}

.form-trial[_ngcontent-ufk-c2] {
    width: 500px
}

.bg-cover[_ngcontent-ufk-c2] {
    background-size: 100% !important;
    background-position: center center !important;
    background-repeat: no-repeat !important;
    -webkit-background-size: cover !important;
    -moz-background-size: cover !important;
    -o-background-size: cover !important;
    image-rendering: -webkit-optimize-contrast
}

@media screen and (max-width: 992px) {
    .mobile-left[_ngcontent-ufk-c2] {
        height: 300px
    }

    .mobile-right[_ngcontent-ufk-c2] {
        transform: translate(-80px,22px);
        height: 300px
    }

    .mobile-main[_ngcontent-ufk-c2] {
        width: 200px;
        height: 340px
    }

    .circle-run[_ngcontent-ufk-c2] {
        position: relative;
        animation-name: run1small;
        animation-duration: 20s;
        animation-iteration-count: infinite;
        overflow-x: hidden
    }

    @keyframes run1small {
        0% {
            left: 0;
            top: 0
        }

        25% {
            left: 90%;
            top: 0
        }

        50% {
            left: 90%;
            top: 250px
        }

        70% {
            left: 0;
            top: 240px
        }

        to {
            left: 0;
            top: 0
        }
    }

    .circle-run2[_ngcontent-ufk-c2] {
        position: relative;
        animation-name: run2small;
        animation-duration: 5s;
        animation-iteration-count: infinite;
        width: 230p
    }

    @keyframes run2small {
        0% {
            left: 20px;
            top: 200px
        }

        50% {
            left: 20px;
            top: 280px
        }

        to {
            left: 20px;
            top: 200px
        }
    }

    .statistical-list[_ngcontent-ufk-c2] {
        gap: 40px !important
    }

    .mobile2[_ngcontent-ufk-c2] {
        width: 165px
    }
}

@media screen and (max-width: 780px) {
    .statistical-list[_ngcontent-ufk-c2] {
        gap: 0px !important
    }

    .statistical-content[_ngcontent-ufk-c2] {
        margin-top: 40px
    }

    .form-trial[_ngcontent-ufk-c2] {
        width: 100%
    }
}

@media screen and (max-width: 640px) {
    .circle-run2[_ngcontent-ufk-c2] {
        position: relative;
        animation-name: run2small;
        animation-duration: 5s;
        animation-iteration-count: infinite;
        width: 230p
    }

    @keyframes run2small {
        0% {
            left: 20px;
            top: 480px
        }

        50% {
            left: 20px;
            top: 520px
        }

        to {
            left: 20px;
            top: 480px
        }
    }

    .features-list[_ngcontent-ufk-c2] {
        gap: 0px !important
    }
}

@media screen and (max-width: 390px) {
    .btn-register[_ngcontent-ufk-c2] {
        width: 100%
    }

    .btn-more[_ngcontent-ufk-c2] {
        margin-top: 20px;
        width: 100%
    }
}
