/* ===========================
   СБРОС СТИЛЕЙ
=========================== */

*{
    margin:0;
    padding:0;
    box-sizing:border-box;
}

/* ===========================
   ОСНОВНЫЕ НАСТРОЙКИ
=========================== */

html,
body{

    width:100%;
    height:100%;

    font-family:"Segoe UI", Arial, sans-serif;

    background:#050816;

    color:white;

    overflow:hidden;

}

/* ===========================
   ЗАТЕМНЕНИЕ ПОВЕРХ ФОНА
=========================== */

.overlay{

    position:fixed;

    inset:0;

    background:linear-gradient(
        rgba(5,8,22,.15),
        rgba(5,8,22,.55)
    );

    z-index:1;

}

/* ===========================
   ГЛАВНЫЙ КОНТЕЙНЕР
=========================== */

.container{

    position:relative;

    z-index:2;

    width:100%;
    height:100vh;

    display:flex;

    flex-direction:column;

    justify-content:center;

    align-items:center;

    text-align:center;

    padding:30px;

}

/* ==========================================
   ЛОГОТИП NORDIT
========================================== */

.logo{

    font-size:120px;

    font-weight:700;

    letter-spacing:-5px;

    margin-bottom:45px;

    user-select:none;

    transition:.35s;

    cursor:default;

}

.logo:hover{

    transform:scale(1.03);

}

.white{

    color:#ffffff;

    text-shadow:
        0 0 10px rgba(255,255,255,.4),
        0 0 30px rgba(255,255,255,.15);

}

.blue{

    color:#1EA7FF;

    text-shadow:
        0 0 10px #1EA7FF,
        0 0 25px #1EA7FF,
        0 0 50px rgba(30,167,255,.55);

}

/* ===========================
   ЗАГОЛОВОК
=========================== */

h1{

    font-size:54px;

    margin-bottom:18px;

    font-weight:700;

}

/* ===========================
   ПОДЗАГОЛОВОК
=========================== */

h2{

    color:#59AFFF;

    font-size:28px;

    font-weight:300;

    margin-bottom:35px;

}

/* ===========================
   ОСНОВНОЙ ТЕКСТ
=========================== */

p{

    max-width:850px;

    font-size:21px;

    line-height:36px;

    color:#d8d8d8;

    margin-bottom:18px;

}

/* ===========================
   НАДПИСЬ "СКОРО"
=========================== */

.launch{

    margin-top:35px;

    color:#56AEFF;

    font-size:30px;

    font-weight:bold;

    letter-spacing:1px;

    text-shadow:0 0 15px rgba(86,174,255,.35);

}

/* ===========================
   БЛАГОДАРНОСТЬ
=========================== */

.thanks{

    margin-top:25px;

    color:#CFCFCF;

    font-size:20px;

    line-height:34px;

}

/* ===========================
   НИЖНИЙ ТЕКСТ
=========================== */

footer{

    position:fixed;

    bottom:25px;

    width:100%;

    text-align:center;

    color:#8a8a8a;

    font-size:15px;

    line-height:28px;

    z-index:2;

}

/* ===========================
   АДАПТАЦИЯ ДЛЯ ТЕЛЕФОНОВ
=========================== */

@media (max-width:768px){

    .container{

        padding:20px;

    }

    .logo{

        font-size:70px;

        letter-spacing:-2px;

        margin-bottom:35px;

    }

    h1{

        font-size:34px;

        margin-bottom:15px;

    }

    h2{

        font-size:22px;

        margin-bottom:25px;

    }

    p{

        font-size:18px;

        line-height:30px;

        max-width:100%;

    }

    .launch{

        font-size:22px;

        margin-top:25px;

    }

    .thanks{

        font-size:18px;

        line-height:28px;

    }

    footer{

        position:relative;

        bottom:auto;

        margin-top:40px;

        padding-bottom:20px;

        font-size:13px;

        line-height:22px;

    }

}

/* ==========================================
   ЖИВОЙ ФОН
========================================== */

.background{

    position:fixed;

    inset:0;

    overflow:hidden;

    z-index:0;

}

.blur{

    position:absolute;

    border-radius:50%;

    filter:blur(120px);

    opacity:.25;

}

.blur1{

    width:550px;

    height:550px;

    background:#0077ff;

    top:-120px;

    left:-150px;

    animation:moveOne 18s infinite alternate ease-in-out;

}

.blur2{

    width:650px;

    height:650px;

    background:#00c3ff;

    right:-200px;

    bottom:-150px;

    animation:moveTwo 20s infinite alternate ease-in-out;

}

@keyframes moveOne{

    from{

        transform:translate(0,0);

    }

    to{

        transform:translate(140px,90px);

    }

}

@keyframes moveTwo{

    from{

        transform:translate(0,0);

    }

    to{

        transform:translate(-140px,-90px);

    }

}