html { scroll-behavior: smooth; }
body {
    background-color: #0f0f0f;
    background-image: 
        linear-gradient(rgba(0, 255, 204, 0.05) 1px, transparent 1px),
        linear-gradient(90deg, rgba(0, 255, 204, 0.05) 1px, transparent 1px);
    background-size: 30px 30px;
    font-family: 'Segoe UI', sans-serif;
    color: white;
    margin: 0;
    text-align: center;
}

/* Navbar */
.navbar { display: flex; justify-content: space-between; padding: 15px 50px; background: #111; position: sticky; top: 0; z-index: 100; border-bottom: 1px solid #00ffcc; }
.navbar ul { display: flex; list-style: none; gap: 30px; margin: 0; }
.navbar a { color: white; text-decoration: none; font-weight: bold; }
.navbar a:hover { color: #00ffcc; }

/* Header */
header { padding: 60px 20px; }
h1 { font-size: 4rem; color: #00ffcc; text-shadow: 0 0 15px #00ffcc; margin: 0; }

/* Gallery & Cards */
.gallery { display: flex; flex-wrap: wrap; justify-content: center; gap: 30px; padding: 60px 20px; max-width: 1200px; margin: 0 auto; }
.pc-card { background: #1a1a1a; border: 1px solid #333; border-radius: 15px; padding: 20px; width: 300px; transition: 0.3s; box-sizing: border-box; }

/* Forces Budget Beast to the top row alone */
.pc-card:first-child { flex: 0 0 100%; max-width: 500px; margin-bottom: 20px; }

.pc-card:hover { transform: translateY(-10px); border-color: #00ffcc; box-shadow: 0 0 25px #00ffcc66; }
.pc-card img { width: 100%; border-radius: 10px; }
.specs { color: #aaa; font-size: 0.9rem; min-height: 40px; margin: 15px 0; }
.price-tag { font-size: 1.8rem; color: #00ffcc; font-weight: bold; margin-bottom: 15px; }

/* About & Contact */
.about-section, .contact-section { padding: 80px 20px; max-width: 800px; margin: 0 auto; }
.about-content { background: rgba(255, 255, 255, 0.05); padding: 30px; border-radius: 15px; border: 1px solid #333; line-height: 1.6; }

button, .contact-btn {
    background: #00ffcc;
    color: black;
    border: none;
    padding: 12px 30px;
    border-radius: 5px;
    font-weight: bold;
    cursor: pointer;
    text-decoration: none;