header{padding-block:var(--spacing-h);width:100%;background-color:var(--white);box-shadow:var(--shadow);z-index:9999;border-top-left-radius:var(--border-radius);border-top-right-radius:var(--border-radius);transition:transform .3s ease,opacity .3s ease}header.hide{transform:translateY(-100%);opacity:0}header .container{display:flex;justify-content:space-between;align-items:center;position:relative}header .container .page-title{display:none}header .container .logo a{cursor:pointer}header .container .logo a img{width:35px;height:35px}header .container nav{display:flex}header .container nav .nav-links{display:flex;align-items:center;gap:var(--spacing)}header .container nav .nav-links li a{text-transform:capitalize;color:var(--font-color);transition:var(--transition)}header .container nav .nav-links li a:hover{color:var(--primary-color)}header .container nav .cta{margin-left:var(--spacing-3x)}header .container nav .cta .btn{padding-block:var(--spacing-h)}header .container .menu{display:none}@media screen and (max-width:768px){header{position:fixed;top:0}header .container .logo{visibility:visible}header .container .logo a{cursor:pointer}header .container .logo a img{width:28px;height:28px}header .container .page-title{display:block;text-transform:capitalize;font-size:var(--font-size-lg);font-weight:700;color:var(--font-color-h)}header .container nav{display:none}header .container .menu{display:grid;place-items:center;border-radius:100%;width:30px;height:30px;background-color:var(--light-gray);cursor:pointer}header .container .menu img{width:33px;height:33px;-o-object-fit:cover;object-fit:cover;border-radius:100%;box-shadow:var(--shadow)}}.back-button{display:grid;place-items:center;border-radius:100%;width:32px;height:32px;background-color:var(--light-gray);cursor:pointer}