/* NAV */
nav { position: fixed; top: 0; left: 0; right: 0; z-index: 100; display: flex; align-items: center; gap: 32px; height: 64px; padding: 0 5vw; background: rgba(255,255,255,.95); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); border-bottom: 1px solid var(--grey-100); transition: box-shadow var(--transition); }
nav.scrolled { box-shadow: var(--shadow-sm); }
.nav-logo { display: flex; align-items: center; gap: 8px; font-family: 'DM Sans', sans-serif; font-weight: 700; font-size: 1.2rem; color: var(--anthracite); letter-spacing: -.5px; flex-shrink: 0; }
.nav-logo .logo-icon { width: 32px; height: 32px; border-radius: var(--radius-sm); display: block; }
.nav-links { display: flex; gap: 24px; align-items: center; }
.nav-link { font-size: .875rem; font-weight: 500; color: var(--grey-700); padding: 4px 0; border-bottom: 2px solid transparent; white-space: nowrap; transition: color var(--transition), border-color var(--transition); }
.nav-link:hover { color: var(--anthracite); }
.nav-link.active { color: var(--anthracite); border-bottom-color: var(--sky); font-weight: 600; }
.nav-right { display: flex; align-items: center; gap: 12px; margin-left: auto; flex-shrink: 0; }
.nav-lang { font-size: .8rem; font-weight: 700; letter-spacing: .5px; color: var(--grey-700); padding: 5px 9px; border-radius: 6px; border: 1px solid var(--grey-300); white-space: nowrap; transition: color var(--transition), border-color var(--transition); }
.nav-lang:hover { color: var(--anthracite); border-color: var(--anthracite); }
.nav-login { font-size: .8rem; font-weight: 500; color: var(--grey-700); white-space: nowrap; transition: color var(--transition); }
.nav-login:hover { color: var(--anthracite); }
.nav-cta { background: var(--green); color: var(--white); padding: 9px 18px; border-radius: var(--radius-sm); font-weight: 600; font-size: .875rem; white-space: nowrap; transition: background var(--transition), transform var(--transition); }
.nav-cta:hover { background: #4e9446; transform: translateY(-1px); }

/* BURGER */
.nav-burger { display: none; flex-direction: column; justify-content: center; align-items: center; gap: 5px; width: 36px; height: 36px; padding: 0; background: none; border: none; cursor: pointer; border-radius: 6px; transition: background var(--transition); flex-shrink: 0; }
.nav-burger:hover { background: var(--grey-100); }
.nav-burger span { display: block; width: 20px; height: 2px; background: var(--anthracite); border-radius: 2px; transition: transform .25s ease, opacity .25s ease; }
.nav-burger.open span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.nav-burger.open span:nth-child(2) { opacity: 0; transform: scaleX(0); }
.nav-burger.open span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

/* MOBILE DRAWER */
.nav-mobile-menu { display: none; position: fixed; top: 64px; left: 0; right: 0; z-index: 99; background: #fff; border-bottom: 1px solid var(--grey-100); box-shadow: 0 8px 24px rgba(43,45,66,.1); padding: 8px 5vw 20px; flex-direction: column; }
.nav-mobile-menu.open { display: flex; }
.nav-mobile-link { font-size: 1rem; font-weight: 500; color: var(--grey-700); padding: 14px 0; border-bottom: 1px solid var(--grey-100); transition: color var(--transition); }
.nav-mobile-link.active { color: var(--anthracite); font-weight: 600; }
.nav-mobile-link:hover { color: var(--anthracite); }
.nav-mobile-footer { display: flex; align-items: center; justify-content: space-between; padding-top: 16px; }
.nav-mobile-lang { font-size: .85rem; font-weight: 700; color: var(--grey-700); padding: 7px 12px; border-radius: 6px; border: 1px solid var(--grey-300); }
.nav-mobile-cta { background: var(--green); color: var(--white); padding: 9px 18px; border-radius: var(--radius-sm); font-weight: 600; font-size: .875rem; }

/* SECTION SEPARATORS */
.nav-sep { font-size: .85rem; color: var(--grey-400); padding: 0 2px; user-select: none; }
.nav-mobile-section { font-size: .75rem; font-weight: 700; text-transform: uppercase; letter-spacing: .5px; color: var(--grey-500); padding: 16px 0 4px; }
.nav-mobile-divider { height: 1px; background: var(--grey-200); margin: 8px 0; }

@media (max-width: 900px) {
  .nav-links { display: none; }
  .nav-lang { display: none; }
  .nav-login { display: none; }
  .nav-cta { display: none; }
  .nav-burger { display: flex; }
}
@media (max-width: 600px) {
  .nav-logo .logo-icon { width: 28px; height: 28px; }
}