nav {
  position: fixed; top: 0; width: 100%; z-index: 200;
  display: flex; align-items: center; justify-content: space-between;
  padding: 0 3rem; height: 60px;
  background: rgba(255,255,255,0.95); backdrop-filter: blur(12px);
  border-bottom: 1px solid var(--gris2);
}
.nav-logo { font-family: 'Bebas Neue', sans-serif; font-size: 1.4rem; letter-spacing: 0.08em; color: var(--negro); }
.nav-logo em { font-style: normal; color: var(--rojo); }
.nav-links { display: flex; gap: 2.5rem; list-style: none; }
.nav-links a { color: var(--gris); text-decoration: none; font-size: 0.78rem; font-weight: 500; letter-spacing: 0.1em; text-transform: uppercase; transition: color 0.2s; }
.nav-links a:hover { color: var(--rojo); }
.nav-cta { background: var(--rojo); color: var(--blanco); font-size: 0.78rem; font-weight: 600; letter-spacing: 0.1em; text-transform: uppercase; padding: 0.5rem 1.4rem; border-radius: 2px; text-decoration: none; transition: background 0.2s; }
.nav-cta:hover { background: var(--rojo-dark); }

/* HAMBURGER */
.nav-hamburger {
  display: none; flex-direction: column; justify-content: center; gap: 5px;
  background: none; border: none; cursor: pointer; padding: 4px;
}
.nav-hamburger span {
  display: block; width: 24px; height: 2px;
  background: var(--negro); border-radius: 2px;
  transition: transform 0.3s, opacity 0.3s;
}
.nav-hamburger.active span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.nav-hamburger.active span:nth-child(2) { opacity: 0; }
.nav-hamburger.active span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

/* MENÚ MÓVIL */
.nav-mobile {
  display: none;
  position: fixed; top: 60px; left: 0; right: 0; z-index: 199;
  background: rgba(255,255,255,0.98); backdrop-filter: blur(12px);
  border-bottom: 1px solid var(--gris2);
  flex-direction: column; padding: 1.5rem 2rem; gap: 1.25rem;
}
.nav-mobile.active { display: flex; }
.nav-mobile a { color: var(--gris); text-decoration: none; font-size: 0.9rem; font-weight: 500; letter-spacing: 0.1em; text-transform: uppercase; transition: color 0.2s; }
.nav-mobile a:hover { color: var(--rojo); }
.nav-mobile .nav-cta { text-align: center; margin-top: 0.5rem; }
