/* ============================= */
/* AZONIX FONT */
/* ============================= */

@font-face {
    font-family: 'Azonix';
    src: url('../fonts/Azonix.otf') format('opentype');
    font-weight: normal;
    font-style: normal;
}



/* ============================= */
/* GLOBAL */
/* ============================= */

body{
margin:0;
color:white;
font-family:'Caudex', serif;
background:black;
overflow-x:hidden;
}



/* ============================= */
/* NAVBAR */
/* ============================= */

.navbar{

position:fixed;
top:0;
left:0;

width:100%;

display:flex;
justify-content:center;

background:rgba(0,0,0,0.6);
backdrop-filter:blur(10px);

z-index:1000;

}




/* NAVBAR INNER */

.navbar-inner{

width:100%;
max-width:1400px;

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

padding:18px 40px;

}



/* ============================= */
/* LOGO */
/* ============================= */

.logo{

display:flex;
align-items:center;

text-decoration:none;
color:white;

gap:22px;

margin-left:-12px;

flex-shrink:0;

}


/* ICON */

.logo-icon{

height:64px;

}


/* ASTER TEXT */

.logo-text{

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

font-size:30px;

letter-spacing:8px;

font-weight:normal;

}



/* ============================= */
/* NAV LINKS */
/* ============================= */

.nav-links{

display:flex;
align-items:center;

gap:28px;

}

.nav-links a{

font-weight:700;     /* makes text bold */

letter-spacing:1px;

color:white;

text-decoration:none;

font-size:16px;

transition:opacity .25s ease;

}

.nav-links a:hover{
opacity:.65;
}



/* ============================= */
/* FOOTER */
/* ============================= */

.site-footer{

background:linear-gradient(
to top,
rgba(11,14,26,0.9),
rgba(11,14,26,0.55),
rgba(11,14,26,0.25)
);

backdrop-filter:blur(6px);

padding:40px 10% 30px;

color:white;

}



/* FOOTER TOP */

.footer-top{

display:flex;
justify-content:space-between;

margin-bottom:40px;

}

.footer-contact,
.footer-follow{

width:260px;

}

.footer-contact h3,
.footer-follow h3{

font-style:italic;
font-weight:500;

margin-bottom:5px;

}

.footer-contact hr,
.footer-follow hr{

width:120px;

border:0;
height:1px;

background:white;

margin:6px 0 14px;

opacity:.5;

}



/* SOCIAL ICONS */

.social-icons img{

width:22px;

margin-right:16px;

opacity:.85;

transition:all .3s ease;

}

.social-icons img:hover{

opacity:1;
transform:scale(1.1);

}



/* FOOTER CENTER */

.footer-bottom{

text-align:center;

}

.footer-logo{

width:24px;
margin-bottom:10px;
opacity:.9;

}

.footer-bottom p{

margin:4px 0;
font-size:15px;

}



/* ============================= */
/* RESPONSIVE NAVBAR */
/* ============================= */

@media (max-width:1200px){

.nav-links{
gap:20px;
}

}

@media (max-width:1000px){

.nav-links{
gap:16px;
}

.nav-links a{
font-size:13px;
}

}

@media (max-width:800px){

.nav-links{
gap:12px;
}

.logo-text{
font-size:26px;
}

}