/* ===========================
   HERO
=========================== */

.hero{

    height:100vh;

    display:flex;

    justify-content:center;

    align-items:center;

    text-align:center;

    position:relative;

    overflow:hidden;

    background:
    linear-gradient(
    rgba(5,12,22,.80),
    rgba(5,12,22,.95)
    ),
    url("../images/hero.jpg");

    background-size:cover;

    background-position:center;

}

.hero::before{

    content:"";

    position:absolute;

    width:700px;

    height:700px;

    background:#0d6efd;

    border-radius:50%;

    filter:blur(180px);

    opacity:.15;

    top:-200px;

    right:-150px;

}

.hero h1{

    font-size:72px;

    font-weight:800;

    line-height:1.1;

    margin-bottom:25px;

    color:white;

    text-shadow:
    0 10px 40px rgba(0,0,0,.5);

}

.hero p{

    font-size:22px;

    color:#cbd5e1;

    line-height:1.8;

    margin:auto;

    max-width:750px;

}

.hero button{

    margin-top:40px;

    padding:18px 45px;

    background:#0d6efd;

    color:white;

    border:none;

    border-radius:100px;

    font-size:18px;

    font-weight:600;

    cursor:pointer;

    transition:.35s;

    box-shadow:
    0 15px 40px rgba(13,110,253,.35);

}

.hero button:hover{

    transform:translateY(-6px);

    background:#ff9800;

}

.hero-content{

    position:relative;

    z-index:10;

    max-width:900px;

    padding:20px;

}

.tagline{

    color:#0d6efd;

    letter-spacing:4px;

    font-size:15px;

    font-weight:600;

    margin-bottom:20px;

}