.hamburger{display:none;flex-direction:column;cursor:pointer;padding:10px;background:none;border:none;outline:none}.hamburger .bar{width:25px;height:3px;background-color:#000;margin:3px 0;transition:.3s;border-radius:2px}.hamburger.active .bar:nth-child(1){transform:translateY(8px) rotate(45deg)}.hamburger.active .bar:nth-child(2){opacity:0}.hamburger.active .bar:nth-child(3){transform:translateY(-8px) rotate(-45deg)}.nav-menu{display:flex;list-style:none;margin:0;padding:0;gap:30px}.nav-menu .nav-link{text-decoration:none;color:#333;font-weight:500;transition:color .3s ease;position:relative}.nav-menu .nav-link:hover,.nav-menu .nav-link.active{color:#000}.nav-menu .nav-link:after{content:"";position:absolute;bottom:-5px;left:0;width:0;height:2px;background:#000;transition:width .3s ease}.nav-menu .nav-link:hover:after,.nav-menu .nav-link.active:after{width:100%}@media (max-width: 768px){.hamburger{display:flex}.nav-menu{position:fixed;left:-100%;top:70px;flex-direction:column;background-color:#fff;width:100%;height:calc(100vh - 70px);justify-content:flex-start;align-items:center;transition:left .3s ease;box-shadow:0 10px 27px #00000026;padding:20px 0;z-index:1000;overflow-y:auto}.nav-menu.active{left:0}.nav-menu .nav-item{margin:15px 0}.nav-menu .nav-link{font-size:18px;padding:15px 20px;display:block;text-align:center;width:100%}.nav-menu .nav-link:hover{background-color:#f8f9fa}.nav-menu .nav-link:after{display:none}}@media (max-width: 480px){.hamburger{padding:8px}.hamburger .bar{width:22px;height:2px}.nav-menu{top:60px;height:calc(100vh - 60px)}}