.menu-toggle {
               position: absolute;
               right: 21px;
               top: 0px;
               width: 65px;
               height: 55px;
               border: 0;
               background: transparent;
               cursor: pointer;
               z-index: 60;
               }
               .menu-toggle__box {
               display:block;
               width:100%;
               height:100%;
               border:2px solid #222;
               box-sizing: border-box;
               border-radius:4px;
               }
               /* скрываем меню по умолчанию */
               .main-menu { display: none; }
               .main-menu.open { display: block; }
               /* простая стилизация списка */
               .menu-list { list-style:none; margin:0; padding:0; display:flex; gap:1rem; flex-wrap:wrap; }
               .menu-item a { text-decoration:none; padding:6px 8px; display:inline-block; }
               .submenu { display:none; position:absolute; background:#fff; padding:8px; box-shadow:0 2px 8px rgba(0,0,0,.12); }
               .menu-item.has-children:hover .submenu { display:block; }
               /* container & basics */
               .offcanvas-menu {
               position: fixed;
               top: 0;
               right: 0;
               height: 100vh;
               width: 320px;              /* change width if needed */
               max-width: 90%;
               background: #111;          /* dark background — change if needed */
               color: #fff;
               z-index: 1200;
               transform: translateX(100%); /* hidden by default (off-screen to right) */
               transition: transform 0.32s cubic-bezier(.2,.8,.2,1);
               box-shadow: -12px 0 40px rgba(0,0,0,0.4);
               display: flex;
               flex-direction: column;
               overflow-y: auto;
               will-change: transform;
               }
               /* When open */
               .offcanvas-menu.open {
               transform: translateX(0);
               }
               /* inner layout */
               .offcanvas-inner { display:flex; flex-direction:column; min-height:100vh; }
               .offcanvas-header {
               display:flex;
               align-items:center;
               justify-content:space-between;
               padding:18px;
               border-bottom: 1px solid rgba(255,255,255,0.04);
               }
               .offcanvas-logo img { max-height:46px; display:block; }
               .site-name { font-weight:600; color:#fff; }
               .offcanvas-close {
               background:transparent;
               border:0;
               width:44px;
               height:44px;
               display:inline-flex;
               align-items:center;
               justify-content:center;
               cursor:pointer;
               }
               /* menu body */
               .offcanvas-body { padding:12px 18px; flex:1 1 auto; overflow:auto; }
               .menu-list { list-style:none; margin:0; padding:0; display:block; }
               .menu-item { margin:8px 0; }
               .menu-item > a { color:#fff; text-decoration:none; font-size:16px; display:block; padding:8px 6px; }
               .menu-item > a:hover { opacity:.9; }
               /* submenu (simple) */
               .menu-item.has-children > .submenu { margin-left:10px; margin-top:6px; padding-left:10px; border-left:1px solid rgba(255,255,255,0.04); }
               .submenu a { font-size:14px; color:#ddd; }
               /* footer */
               .offcanvas-footer { padding:12px 18px; border-top:1px solid rgba(255,255,255,0.04); }
               .phone-link { color:#fff; text-decoration:none; font-weight:600; }
               /* overlay */
               .offcanvas-overlay {
               position: fixed;
               inset: 0; /* top:0; right:0; bottom:0; left:0; */
               background: rgba(0,0,0,0.45);
               z-index: 1100;
               opacity: 0;
               visibility: hidden;
               transition: opacity .28s ease;
               }
               /* overlay visible */
               .offcanvas-overlay.open { opacity: 1; visibility: visible; }
               /* small screens adjustments */
               @media(min-width: 992px){
               /* If you want menu to be always visible on wide screens — change here.
               Currently it stays offcanvas on all sizes. */
               }