.navbar{position:fixed;top:0;left:0;right:0;z-index:2000;background:rgba(10,10,15,0.92);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border-bottom:1px solid rgba(255,255,255,0.06);transition:all 0.3s ease}
.navbar.scrolled{background:rgba(10,10,15,0.98);box-shadow:0 4px 24px rgba(0,0,0,0.4)}
.nav-inner{display:flex;align-items:center;justify-content:space-between;height:64px;padding:0 20px;max-width:1200px;margin:0 auto;gap:16px}
.nav-brand{font-family:'Space Grotesk',sans-serif;font-size:1.3rem;font-weight:700;color:#ffffff;letter-spacing:-0.02em;z-index:2002;position:relative;flex-shrink:0;text-decoration:none}
.nav-brand span{color:#06b6d4}
.nav-links{display:none;position:fixed;top:0;left:0;right:0;bottom:0;width:100vw;height:100vh;background:#0a0a0f;flex-direction:column;align-items:flex-start;justify-content:center;padding:0 40px;gap:0;z-index:1999;overflow:hidden}
.nav-links.open{display:flex}
.nav-link{font-family:'Space Grotesk',sans-serif;font-size:1.6rem;font-weight:600;color:rgba(255,255,255,0.85);padding:14px 0;width:100%;text-align:left;border-bottom:1px solid rgba(255,255,255,0.07);border-radius:0;transition:all 0.3s ease;text-decoration:none;display:block;white-space:nowrap}
.nav-link:hover,.nav-link.active{color:#06b6d4}
.nav-menu-cta{margin-top:28px;width:100%}
.nav-menu-cta a{display:flex;align-items:center;justify-content:center;gap:9px;width:100%;padding:15px;background:#25D366;color:#ffffff;font-family:'Space Grotesk',sans-serif;font-size:1rem;font-weight:700;border-radius:10px;text-decoration:none;transition:all 0.3s ease}
.nav-menu-cta a:hover{background:#1db954}
.nav-right{display:flex;align-items:center;gap:10px;z-index:2002;position:relative;flex-shrink:0}
.nav-wa{display:none;align-items:center;gap:7px;background:#25D366;color:#ffffff;font-family:'Space Grotesk',sans-serif;font-size:0.82rem;font-weight:600;padding:9px 16px;border-radius:10px;transition:all 0.3s ease;white-space:nowrap;text-decoration:none}
.nav-wa:hover{background:#1db954}
.hamburger{display:flex;flex-direction:column;gap:5px;background:none;border:none;cursor:pointer;padding:10px;z-index:2002;position:relative;min-width:44px;min-height:44px;align-items:center;justify-content:center}
.hamburger span{display:block;width:22px;height:2px;background:#ffffff;border-radius:2px;transition:all 0.3s ease;pointer-events:none}
.hamburger.open span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.hamburger.open span:nth-child(2){opacity:0;transform:scaleX(0)}
.hamburger.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
@media(min-width:900px){
  .nav-links{display:flex!important;position:static;flex-direction:row;background:none;gap:8px;padding:0;overflow:visible;z-index:auto;align-items:center;justify-content:flex-start;width:auto;height:auto}
  .nav-link{font-size:0.88rem;padding:8px 14px;width:auto;border-bottom:none;border-radius:8px;white-space:nowrap}
  .nav-link:hover,.nav-link.active{background:rgba(6,182,212,0.08);color:#06b6d4}
  .nav-menu-cta{display:none}
  .nav-wa{display:flex}
  .hamburger{display:none}
}
@media(max-height:680px){
  .nav-link{font-size:1.3rem;padding:11px 0}
  .nav-menu-cta{margin-top:18px}
}

/* Force sr reveal for left/right animated elements */
.sr.left { transform: translateX(-28px); }
.sr.right { transform: translateX(28px); }
.sr.in { opacity: 1 !important; transform: translate(0) !important; }