/* ==========================================================
   Astro Insights
   Dormant Landing Page
   ========================================================== */

/* Google Fonts */

@import url('https://fonts.googleapis.com/css2?family=Cinzel:wght@400;500;600&family=Lato:wght@300;400;700&display=swap');

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

html,
body{
    height:100%;
}

body{

    font-family:"Lato", Arial, Helvetica, sans-serif;
    font-size:1.1rem;
    line-height:1.8;

    color:#f5f5f5;

    background:
        linear-gradient(
            rgba(10,10,18,.55),
            rgba(10,10,18,.75)
        ),
        url("images/background.jpg");

    background-size:cover;
    background-position:center;
    background-repeat:no-repeat;
    background-attachment:fixed;
}

/* ---------------------------------------------------------- */

.wrapper{

    min-height:100vh;

    display:flex;
    justify-content:center;
    align-items:center;

    padding:40px;
}

/* ---------------------------------------------------------- */

.panel{

    max-width:760px;

    text-align:center;

    padding:70px 65px;

    background:rgba(8,8,20,.45);

    border:1px solid rgba(255,255,255,.12);

    border-radius:18px;

    backdrop-filter:blur(8px);

    box-shadow:
        0 0 40px rgba(0,0,0,.35);
}

/* ---------------------------------------------------------- */

.logo{

    width:250px;

    margin:0 auto 35px auto;

    display:block;
}

/* ---------------------------------------------------------- */

h1{

    font-family:"Cinzel", serif;

    font-size:3.2rem;

    font-weight:500;

    letter-spacing:3px;

    margin-bottom:10px;

    color:#ffffff;
}

h2{

    font-family:"Cinzel", serif;

    font-size:1.2rem;

    font-weight:400;

    letter-spacing:2px;

    color:#d7d1bb;

    margin-bottom:40px;

    text-transform:uppercase;
}

/* ---------------------------------------------------------- */

p{

    margin-bottom:24px;

    color:#ececec;
}

/* ---------------------------------------------------------- */

.button{

    display:inline-block;

    margin-top:18px;

    padding:15px 34px;

    background:#8A9271;

    color:white;

    text-decoration:none;

    border-radius:40px;

    transition:all .3s ease;

    font-weight:700;

    letter-spacing:.5px;
}

.button:hover{

    background:#70785d;

    transform:translateY(-2px);

    box-shadow:0 10px 25px rgba(0,0,0,.35);
}

/* ---------------------------------------------------------- */

footer{

    margin-top:60px;

    font-size:.9rem;

    color:#cccccc;
}

footer small{

    display:block;

    margin-top:15px;

    opacity:.7;
}

/* ---------------------------------------------------------- */

@media (max-width:800px){

    .panel{

        padding:45px 35px;
    }

    h1{

        font-size:2.4rem;
    }

    h2{

        font-size:1rem;
    }

    body{

        font-size:1rem;
    }

}