:root{

--text-primary:#f1ede7;
--text-secondary:#cfc8c1;
--text-hover:#ffffff;

}

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

html,body{
height:100%;
}

body{

font-family:'Roboto', sans-serif;

background-image:linear-gradient(
to right bottom,
#303030,
#34323d,
#39354a,
#3e3657,
#443864
);

color:var(--text-primary);

display:flex;
flex-direction:column;

-webkit-font-smoothing:antialiased;
-moz-osx-font-smoothing:grayscale;

}

.container{

flex:1;

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

text-align:center;

}

.center{
max-width:720px;
padding:20px;
}

.logo{

width:420px;
max-width:85vw;
height:auto;

margin-bottom:40px;

}

.tagline h1{

font-family:"Trajan Pro", serif;

font-weight:400;

font-size:32px;

letter-spacing:2px;

margin-bottom:12px;

}

.tagline p{

font-size:18px;

color:var(--text-secondary);

letter-spacing:0.5px;

}

.footer{

display:flex;

justify-content:space-between;

padding:40px 60px;

font-family:"Trajan Pro", serif;

letter-spacing:2px;

}

.footer a{

color:var(--text-primary);

text-decoration:none;

font-size:14px;

transition:0.25s;

}

.footer a:hover{

color:var(--text-hover);

text-decoration:underline;

text-underline-offset:4px;

}

@media (max-width:768px){

.logo{
width:280px;
}

.tagline h1{
font-size:24px;
}

.tagline p{
font-size:16px;
}

.footer{
padding:30px 30px;
}

}