/* Reset */
* { margin:0; padding:0; box-sizing:border-box; }
body { font-family: 'Inter', sans-serif; background:#0a0a0a; color:#fff; line-height:1.6; scroll-behavior:smooth; }

/* Navbar */
.navbar { position:fixed; top:0; width:100%; background:rgba(20,20,20,0.9); padding:1rem 2rem; backdrop-filter:blur(10px); z-index:1000; border-bottom:1px solid #222; }
.nav-container { display:flex; justify-content:flex-end; align-items:center; max-width:1100px; margin:0 auto; }
nav ul { display:flex; gap:2rem; list-style:none; }
nav ul li a { color:#fff; text-decoration:none; font-weight:600; padding:6px 10px; border-radius:6px; transition:0.3s; }
nav ul li a:hover, nav ul li a.active { color:#0ff; background: rgba(0,255,255,0.1); }

/* Hero Section */
.hero {
  height:100vh;
  min-height:100vh;
  display:flex;
  justify-content:center;
  align-items:center;
  text-align:center;
  padding:0 2rem;
  position:relative;
  background: linear-gradient(to bottom, rgba(0,0,0,0.8), rgba(0,0,0,0.3)), url('../assets/banner.jpg') center/cover no-repeat fixed;
}
.hero-content h1 {
  font-size:3rem;
  color:#0ff;
  text-shadow:0 0 20px #0ff,0 0 40px #0ff55;
  margin-bottom:0.5rem;
}
.hero-subheading {
  font-size:1.4rem;
  font-weight:500;
  color:#fff;
  margin-bottom:1rem;
  letter-spacing:0.5px;
  line-height:1.5;
  text-shadow: 0 0 10px rgba(0,255,255,0.8), 0 0 20px rgba(0,255,255,0.5), 0 0 30px rgba(0,255,255,0.3);
}
.hero-accent { width:100px; height:3px; margin:0.5rem auto 2rem auto; background: linear-gradient(to right, #0ff, #00ffaa); border-radius:2px; box-shadow:0 0 15px #0ff,0 0 30px #00ffaa; }
.btn { padding:14px 32px; background:#0ff; color:#000; border-radius:12px; font-weight:700; text-decoration:none; box-shadow:0 0 25px #0ff80,0 0 50px #0ff40; transition:0.3s; cursor:pointer; }
.btn:hover { transform:translateY(-3px); box-shadow:0 0 50px #0ffaa,0 0 100px #0ff60; }

/* Sections */
section { padding:6rem 2rem; } /* removed min-height for About, Services, Contact */

/* Headings */
h2 { font-size:2rem; color:#0ff; margin-bottom:1rem; text-align:center; }

/* Services */
.services-container { display:flex; flex-wrap:wrap; gap:2rem; justify-content:center; }
.service-card { background:#111; padding:2rem; border-radius:16px; flex:1 1 280px; box-shadow:0 0 10px #000; }
.service-card h3 { color:#0ff; margin-bottom:1rem; }
.service-card p { color:#ccc; }

/* About */
.about p { max-width:800px; margin:0 auto; color:#ccc; text-align:center; }

/* Contact */
.contact-form { max-width:500px; margin:0 auto; display:flex; flex-direction:column; gap:1.5rem; }
.input-group { display:flex; flex-direction:column; }
.input-group label { margin-bottom:6px; color:#0ff; font-weight:600; }
.contact-form input, .contact-form textarea { padding:14px; border-radius:12px; border:none; outline:none; background:#111; color:#fff; }
.contact-form button { padding:14px 32px; background:#0ff; color:#000; border-radius:12px; font-weight:700; cursor:pointer; }
.contact-info { max-width:500px; margin:0 auto 2rem auto; color:#ccc; }
.contact-info a { color:#0ff; text-decoration:none; }
.contact-info a:hover { text-decoration:underline; }
.contact-info ul { list-style:disc; margin-left:1.5rem; }

/* Footer */
footer { text-align:center; padding:2rem; background:#0f0f0f; border-top:1px solid #222; font-size:0.9rem; color:#ccc; }

/* Fade-in animations */
.fade-in { opacity:0; transform:translateY(30px); transition:1s ease-out; }
.appear { opacity:1; transform:translateY(0); }