/* ===== OFFCANVAS OVERLAY ===== */
 #offcanvas-overlay {
     position: fixed;
     inset: 0;
     background: rgba(0, 0, 0, 0.75);
     z-index: 9998;
     display: none;
 }

 /* ===== OFFCANVAS MENU ===== */
 #offcanvas-menu {
     position: fixed;
     top: 0;
     left: -280px;
     width: 280px;
     height: 100vh;

     background: linear-gradient(180deg, #050000, #140000, #000);
     z-index: 9999;
     padding-top: 70px;

     transition: left 0.35s ease;
 }

 /* MENU ABERTO */
 #offcanvas-menu.open {
     left: 0;
 }

 #offcanvas-overlay.open {
     display: block;
 }

 /* FECHAR */
 .offcanvas-close {
     position: absolute;
     top: 15px;
     right: 15px;

     background: none;
     border: none;
     color: #fff;
     font-size: 22px;
     cursor: pointer;

     text-shadow: 0 0 8px red;
 }

 /* LINKS */
 .offcanvas-links {
     list-style: none;
     padding: 0;
     margin: 0;
 }

 .offcanvas-links li {
     padding: 16px 24px;
     border-bottom: 1px solid rgba(255, 0, 0, 0.2);
 }

 .offcanvas-links a {
     color: #fff;
     text-decoration: none;
     font-weight: 600;
     letter-spacing: 1px;
     text-shadow: 0 0 6px red;
 }

 .offcanvas-links a:hover {
     color: #ff2a2a;
     text-shadow: 0 0 12px red;
 }

 /* BODY LOCK */
 body.menu-open {
     overflow: hidden;
 }

 #menuhambu,
 button[aria-label="Abrir login"] {
     text-shadow: 0 0 6px red;
 }