.header{color:#fff;z-index:1000;background:#111;justify-content:space-between;align-items:center;width:100%;padding:1rem 10px;transition:background .3s,padding .3s;display:flex}.header.scrolled{background:#000;padding:.7rem 2rem;box-shadow:0 2px 8px rgba(0,0,0,.4)}.logos{color:#ff4c4c;font-size:1.5rem;font-weight:700;text-decoration:none}.nav-lists{gap:1.5rem;list-style:none;display:flex}.nav-links{color:#fff;font-size:1rem;text-decoration:none;transition:color .3s}.nav-links:hover{color:#ff4c4c}.hamburger{cursor:pointer;flex-direction:column;gap:5px;display:none}.hamburger span{background:#fff;border-radius:3px;width:25px;height:3px;transition:all .3s}@media (max-width:768px){.nav-lists{background:#111;flex-direction:column;justify-content:center;align-items:center;gap:2rem;width:70%;height:100vh;transition:right .3s ease-in-out;position:fixed;top:0;right:-100%}.nav-lists.active{right:0}.hamburger{display:flex}}.hamburger.active span:first-child{transform:rotate(45deg)translate(5px,5px)}.hamburger.active span:nth-child(2){opacity:0}.hamburger.active span:nth-child(3){transform:rotate(-45deg)translate(6px,-6px)}
