/*
Theme Name: Hawk Galaxy Theme
Theme URI: http://hawkmedia.ca/
Author: Hawk Media
Author URI: http://hawkmedia.ca/
Description: Responsive, Retina-ready, Elementor and WooCommerce compatible theme with sticky header, custom colors, and moving galaxy background.
Version: 1.0
License: GNU General Public License v2 or later
Text Domain: hawk-galaxy
*/

body {
    margin: 0;
    font-family: 'Arial', sans-serif;
    background: #000000;
    color: #c5c6c3;
}

a {
    color: #dda853;
    text-decoration: none;
}

a:hover {
    color: #064663;
}
/* ============================
   GALAXY BACKGROUND
============================ */
#galaxy-bg {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: -1;
    background: radial-gradient(ellipse at bottom, #0a0a1a 0%, #000000 100%);
    overflow: hidden;
}

/* Stars */
#galaxy-bg .star {
    position: absolute;
    background: #ffffff;
    border-radius: 30%;
    opacity: 0.8;
    animation: twinkle 4s infinite ease-in-out;
}

#galaxy-bg .star:nth-child(1) {
    width: 2px; height: 2px;
    top: 10%; left: 20%;
}

#galaxy-bg .star:nth-child(2) {
    width: 1.5px; height: 1.5px;
    top: 50%; left: 70%;
}

#galaxy-bg .star:nth-child(3) {
    width: 3px; height: 3px;
    top: 80%; left: 40%;
}

/* Twinkle animation */
@keyframes twinkle {
    0%, 100% { opacity: 0.2; }
    50% { opacity: 1; }
}

/* Planets */
#galaxy-bg .planet {
    position: absolute;
    border-radius: 50%;
    opacity: 0.9;
    animation: planetMove linear infinite;
}

#galaxy-bg .planet1 {
    width: 30px; height: 30px;
    background: radial-gradient(circle, #dda853 0%, #c5c6c3 100%);
    top: 20%; left: -60px;
    animation-duration: 80s;
}

#galaxy-bg .planet2 {
    width: 50px; height: 50px;
    background: radial-gradient(circle, #064663 0%, #000000 100%);
    top: 60%; left: -80px;
    animation-duration: 120s;
}

#galaxy-bg .planet3 {
    width: 25px; height: 25px;
    background: radial-gradient(circle, #252427 0%, #000000 100%);
    top: 40%; left: -50px;
    animation-duration: 100s;
}

/* Planet movement */
@keyframes planetMove {
    0% { transform: translateX(0) translateY(0) rotate(0deg); }
    100% { transform: translateX(120vw) translateY(10px) rotate(360deg); }
}