:root {
  --primary: #2ecc71;
  --dark: #1a1a2e;
  --light: #f1f1f1;
  --card-shadow: rgba(0,0,0,0.2);
}

/* BASE */
* { box-sizing:border-box; margin:0; padding:0; }
body { font-family:'Poppins',sans-serif; background:#f9fafb; color:#111; }
a { text-decoration:none; color:inherit; transition:0.3s; }

/* NAVBAR */
.navbar {
  display:flex;
  align-items:center;
  justify-content:space-between; /* logo left, nav right */
  padding:0.75rem 1rem;
  position:relative;
  flex-wrap:wrap;
  background: var(--light);
  box-shadow: 0 2px 6px rgba(0,0,0,0.1);
}

.logo {
  display:flex;
  align-items:center;
}

.logo img { height:40px; width:40px; border-radius:50%; margin-right:0.5rem; }
.logo-text { font-family:'Orbitron',sans-serif; font-size:1.25rem; font-weight:700; color:var(--dark); }

.nav-links {
  display:flex;
  gap:2rem;
  align-items:center;
}

.nav-links a {
  color:var(--dark);
  padding:0.5rem 0.75rem;
  transition:0.2s;
}
.nav-links a:hover { background:var(--primary); border-radius:3px; }

/* HAMBURGER */
.hamburger { display:none; font-size:1.5rem; cursor:pointer; color:var(--dark); }

/* CONTACT */
.contact { padding:4rem 1rem; background:var(--light); }
.contact-container {
  max-width:1100px; width:100%; margin:0 auto; display:flex; gap:2rem; flex-wrap:wrap;
  background:#fff; padding:2rem; border-radius:12px; box-shadow:0 8px 20px var(--card-shadow);
}
.contact-info { flex:1 1 300px; }
.contact-info h2 { font-size:2rem; color:var(--dark); margin-bottom:1rem; }
.contact-info p { color:#555; line-height:1.6; margin-bottom:2rem; }
.contact-info .social-links { display:flex; gap:1rem; flex-wrap:wrap; }
.contact-info .social-links a {
  display:flex; align-items:center; justify-content:center; width:45px; height:45px;
  border-radius:50%; background:var(--dark); color:#fff; font-size:1.2rem;
  transition:0.3s; box-shadow:0 4px 10px rgba(0,0,0,0.3);
}
.contact-info .social-links a:hover { background:var(--primary); color:#111; transform:translateY(-4px) scale(1.1); }

/* CONTACT FORM */
.contact-form { flex:1 1 300px; }
.contact-form .form-group { margin-bottom:1.5rem; }
.contact-form input, .contact-form textarea {
  width:100%; max-width:100%; padding:0.9rem 1rem; border:1px solid #ddd; border-radius:8px; outline:none; font-size:1rem;
}
.contact-form input:focus, .contact-form textarea:focus { border-color:var(--primary); box-shadow:0 0 8px rgba(46,204,113,0.3); }
.contact-form button {
  margin-top:0.5rem; padding:0.9rem 1.5rem; border:none; border-radius:8px;
  background:var(--primary); color:#fff; font-size:1rem; font-weight:600; cursor:pointer; width:100%;
}
.contact-form button:hover { background:#27ae60; }

/* RESPONSIVE MOBILE */
@media(max-width:768px){
  .hamburger { display:block; }

  .nav-links {
    position: fixed;
    top: 60px; left:0; right:0;
    background:var(--light);
    display: none;
    flex-direction: row; /* horizontal */
    justify-content: space-around;
    align-items: center;
    padding: 1rem 0;
    z-index: 200;
    flex-wrap: nowrap;
  }
  .nav-links.active { display:flex; }
  .nav-links a { padding:0.5rem 1rem; text-align:center; border-bottom:none; }

  .contact-container { flex-direction:column; padding:1.5rem; gap:1.5rem; }
}

@media(max-width:480px){
  .logo-text{ font-size:1rem; }
  .contact-info h2{ font-size:1.3rem; }
  .contact-form input, .contact-form textarea{ font-size:0.9rem; }
}