:root {
    --body: #111115;
    --white: #fff;
    --black: #07070b;
    --grey: #1d1c20;
    --primary: #005eff;
    --secondary: #9207ff;
    --orange: #f65428;
    --green: #25cd90;
    --yellow: #f1a62d;
    --red: #ff1010;
    --border: #2e323a;
    --text: #a9a9a9;
    --subtitle: #e3dffa;
    --primary-bg: #005eff61;
    --green-bg: #08291d;
    --yellow-bg: #39270f;
    --red-bg: #390f0f
}

@keyframes animation_gradient {
    0% {
        background-position: 50% 0
    }

    50% {
        background-position: 50% 100%
    }

    to {
        background-position: 50% 0
    }
}

@font-face {
    font-display: "swap";
    font-family: Black;
    src: url(Black.4QzjdqcX.ttf)
}

@font-face {
    font-display: "swap";
    font-family: ExtraBold;
    src: url(ExtraBold.CDFMnH8p.ttf)
}

@font-face {
    font-display: "swap";
    font-family: Bold;
    src: url(Bold.D06Q8vI1.ttf)
}

@font-face {
    font-display: "swap";
    font-family: SemiBold;
    src: url(SemiBold.CBzrVkeR.ttf)
}

@font-face {
    font-display: "swap";
    font-family: Medium;
    src: url(Medium.CM3QUBJn.ttf)
}

@font-face {
    font-display: "swap";
    font-family: Regular;
    src: url(Regular.B1DbiccC.ttf)
}

.section_hero {
    padding-top: 60px;
    position: relative
}

.section_hero:before {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100' height='100'%3E%3Cpath fill='rgba(0,0,0,0.1)' fill-rule='evenodd' d='M96 95h4v1h-4v4h-1v-4h-9v4h-1v-4h-9v4h-1v-4h-9v4h-1v-4h-9v4h-1v-4h-9v4h-1v-4h-9v4h-1v-4h-9v4h-1v-4h-9v4h-1v-4H0v-1h15v-9H0v-1h15v-9H0v-1h15v-9H0v-1h15v-9H0v-1h15v-9H0v-1h15v-9H0v-1h15v-9H0v-1h15v-9H0v-1h15V0h1v15h9V0h1v15h9V0h1v15h9V0h1v15h9V0h1v15h9V0h1v15h9V0h1v15h9V0h1v15h9V0h1v15h4v1h-4v9h4v1h-4v9h4v1h-4v9h4v1h-4v9h4v1h-4v9h4v1h-4v9h4v1h-4v9h4v1h-4Zm-1 0v-9h-9v9Zm-10 0v-9h-9v9Zm-10 0v-9h-9v9Zm-10 0v-9h-9v9Zm-10 0v-9h-9v9Zm-10 0v-9h-9v9Zm-10 0v-9h-9v9Zm-10 0v-9h-9v9Zm-9-10h9v-9h-9Zm10 0h9v-9h-9Zm10 0h9v-9h-9Zm10 0h9v-9h-9Zm10 0h9v-9h-9Zm10 0h9v-9h-9Zm10 0h9v-9h-9Zm10 0h9v-9h-9Zm9-10v-9h-9v9Zm-10 0v-9h-9v9Zm-10 0v-9h-9v9Zm-10 0v-9h-9v9Zm-10 0v-9h-9v9Zm-10 0v-9h-9v9Zm-10 0v-9h-9v9Zm-10 0v-9h-9v9Zm-9-10h9v-9h-9Zm10 0h9v-9h-9Zm10 0h9v-9h-9Zm10 0h9v-9h-9Zm10 0h9v-9h-9Zm10 0h9v-9h-9Zm10 0h9v-9h-9Zm10 0h9v-9h-9Zm9-10v-9h-9v9Zm-10 0v-9h-9v9Zm-10 0v-9h-9v9Zm-10 0v-9h-9v9Zm-10 0v-9h-9v9Zm-10 0v-9h-9v9Zm-10 0v-9h-9v9Zm-10 0v-9h-9v9Zm-9-10h9v-9h-9Zm10 0h9v-9h-9Zm10 0h9v-9h-9Zm10 0h9v-9h-9Zm10 0h9v-9h-9Zm10 0h9v-9h-9Zm10 0h9v-9h-9Zm10 0h9v-9h-9Zm9-10v-9h-9v9Zm-10 0v-9h-9v9Zm-10 0v-9h-9v9Zm-10 0v-9h-9v9Zm-10 0v-9h-9v9Zm-10 0v-9h-9v9Zm-10 0v-9h-9v9Zm-10 0v-9h-9v9Zm-9-10h9v-9h-9Zm10 0h9v-9h-9Zm10 0h9v-9h-9Zm10 0h9v-9h-9Zm10 0h9v-9h-9Zm10 0h9v-9h-9Zm10 0h9v-9h-9Zm10 0h9v-9h-9Z' data-name='Path 3' opacity='.5'/%3E%3Cpath fill='rgba(0,0,0,0.1)' fill-rule='evenodd' d='M6 5V0H5v5H0v1h5v94h1V6h94V5Z' data-name='Path 4'/%3E%3C/svg%3E");
    content: "";
    filter: invert(1);
    height: 80vh;
    -webkit-mask-image: linear-gradient(0deg,transparent,#fff 50%);
    mask-image: linear-gradient(0deg,transparent,#fff 50%);
    opacity: .4;
    position: absolute;
    top: 0;
    width: 100%
}

.section_hero .logo {
    left: 30px;
    position: absolute;
    top: 30px
}

.section_hero .partners {
    gap: 40px;
    position: absolute;
    right: 30px;
    top: 30px
}

.section_hero .partners .producthunt {
    width: 120px
}

.section_hero .partners .producthunt svg {
    color: var(--white)
}

.section_hero .partners .scaleway {
    gap: 6px
}

.section_hero .partners .scaleway p {
    font-family: Medium,system-ui,sans-serif;
    font-size: 12px;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    color: var(--white)
}

.section_hero .partners .scaleway svg {
    color: var(--white);
    width: 120px
}

.section_hero h1 {
    font-family: Black,system-ui,sans-serif;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    color: var(--white);
    font-size: clamp(30px,5vw,75px);
    text-align: center
}

.section_hero h1 span {
    background: linear-gradient(-45deg,#23a6d5,#3d4ef2);
    -webkit-background-clip: text;
    color: #3d4ef2;
    position: relative;
    -webkit-text-fill-color: transparent
}

.section_hero h1.lang_de {
    font-size: clamp(30px,5vw,70px)
}

.section_hero h1.lang_en {
    max-width: 1090px
}

.section_hero h1.lang_es,.section_hero h1.lang_pt,.section_hero h1.lang_ru,.section_hero h1.lang_tr,.section_hero h1.lang_vi {
    font-size: clamp(30px,4vw,60px)
}

.section_hero .underline {
    bottom: -30px;
    position: absolute;
    right: 0;
    width: 300px
}

.section_hero .underline.lang_ar {
    left: 0;
    right: unset
}

.section_hero h2 {
    color: var(--subtitle);
    font-size: 20px;
    line-height: 26px;
    margin-top: 40px;
    max-width: 720px;
    text-align: center
}

.section_hero .gradient {
    left: 0;
    pointer-events: none;
    position: absolute;
    right: 0;
    top: 0;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
    z-index: 2
}

.section_hero .gradient div {
    background-image: radial-gradient(at 27% 37%,#3a8bfd 0,transparent 0),radial-gradient(at 97% 21%,#72fe7d 0,transparent 50%),radial-gradient(at 52% 99%,#fd3a4e 0,transparent 50%),radial-gradient(at 10% 29%,#855afc 0,transparent 50%),radial-gradient(at 97% 96%,#e4c795 0,transparent 50%),radial-gradient(at 33% 50%,#8ca8e8 0,transparent 50%),radial-gradient(at 79% 53%,#eea5ba 0,transparent 50%);
    cursor: pointer;
    filter: blur(100px) saturate(150%);
    height: 200px;
    opacity: .3;
    width: 50%
}

@media only screen and (max-width: 970px) {
    .section_hero .logo,.section_hero .partners {
        display:none
    }

    .section_hero .underline {
        width: 200px
    }

    .section_hero h2 {
        font-size: 16px;
        line-height: 22px
    }
}
