/* István 11714 (2026-10-10): hamburger-menu hover, variant A (animated icons on a gold disc), from the approved sample
   store/lapszabo-menu-minta (Anton). Every rule is under .drawer.mh; the moving highlight is .mhl (the sample's .hl clashed
   with the header's own .hl). Behaviour: src/menu.js. */
.drawer.mh{--sor:52px;--kor:38px;--tol:50px;--ki:44px;overflow:visible;padding-top:10px;padding-bottom:16px}
.drawer.mh>a,.drawer.mh>details>summary{position:relative;z-index:1;display:flex;align-items:center;min-height:var(--sor);padding:0;box-sizing:border-box}
.drawer.mh>a .tx,.drawer.mh>details>summary .tx{display:inline-block;transition:transform .42s cubic-bezier(.34,1.3,.5,1),color .25s}
.drawer.mh>a.akt .tx,.drawer.mh>details>summary.akt .tx{transform:translateX(var(--tol));color:#fff}
.drawer.mh>a.on .tx,.drawer.mh summary a.dd-p.on .tx{color:var(--ok)}
.drawer.mh summary a.dd-p{display:flex;align-items:center;min-height:var(--sor)}
.drawer.mh details a{position:relative;z-index:1}
.drawer.mh details a:hover{color:var(--ok)}
/* the shared moving highlight: sticks out past the right edge of the menu ("tab") */
.drawer.mh .mhl{position:absolute;left:22px;top:0;height:var(--sor);width:calc(100% - 22px + var(--ki));border-radius:calc(var(--sor)/2);
  background:#2A2F38;box-shadow:0 10px 26px -12px rgba(0,0,0,.7);opacity:0;transform-origin:left center;pointer-events:none;z-index:0;will-change:transform,opacity,height}
.drawer.mh .ik{position:absolute;left:7px;top:50%;width:var(--kor);height:var(--kor);margin-top:calc(var(--kor)/-2);border-radius:50%;display:grid;place-items:center;overflow:hidden;
  background:var(--ok);color:var(--an)}
.drawer.mh .ik svg{position:absolute;width:20px;height:20px;stroke-width:1.8;overflow:visible}
.drawer.mh .ik svg *{transform-box:fill-box;transform-origin:center}
@media(max-width:760px){
  .drawer.mh{--ki:0px;--tol:46px}
  .drawer.mh .mhl{left:6px;width:calc(100% - 12px)}
}
@media(prefers-reduced-motion:reduce){.drawer.mh>a .tx,.drawer.mh>details>summary .tx{transition:none}}
