.menu{position:relative}
.menu__przelacznik{display:grid;place-items:center;list-style:none;cursor:pointer;width:46px;
  min-height:46px;border:1px solid var(--kolor-obwodki);border-radius:var(--promien);
  background:var(--kolor-karty);font-family:var(--font-naglowek);font-weight:600;
  font-size:.9rem;color:var(--kolor-tekstu);letter-spacing:.04em}
.menu__przelacznik::-webkit-details-marker{display:none}
.menu__przelacznik:hover{background:var(--kolor-tla)}
.menu__przelacznik:focus-visible{outline:3px solid var(--kolor-fokusu);outline-offset:2px}
.menu__przelacznik svg{width:20px;height:20px;stroke-width:2}
.menu[open] .menu__przelacznik{background:var(--kolor-akcentu);border-color:var(--kolor-akcentu-hover);
  color:var(--kolor-tekstu-na-akcencie)}
.menu[open] .menu__przelacznik:focus-visible{outline-color:var(--kolor-tekstu)}
.menu__lista{list-style:none;margin:0;padding:0}
.menu__lista a{display:flex;align-items:center;min-height:46px;padding:.7rem 1rem;
  text-decoration:none;font-family:var(--font-naglowek);font-weight:600;font-size:.88rem;
  letter-spacing:.1em;text-transform:uppercase;color:var(--kolor-tekstu);
  border-bottom:1px solid var(--kolor-linii)}
.menu__lista a:hover,.menu__lista a:focus-visible{color:var(--kolor-linku);background:var(--kolor-tla)}
.menu:not([open]) .menu__lista{display:none}
.menu[open] .menu__lista{position:absolute;right:0;top:calc(100% + .5rem);min-width:13rem;z-index:5;
  background:var(--kolor-karty);border:1px solid var(--kolor-linii);
  border-top:3px solid var(--kolor-akcentu);box-shadow:var(--cien-komponentu)}
.menu--bez-mobile{display:none}
@media (min-width:992px){
  .menu{flex:none}
  .menu--bez-mobile{display:block}
  .menu--bez-desktop{display:none}
  .menu__przelacznik{display:none}
  .menu::details-content{content-visibility:visible;block-size:auto;display:contents}
  .menu:not([open]) .menu__lista,.menu[open] .menu__lista{display:flex;position:static;min-width:0;
    border:0;box-shadow:none;background:none}
  .menu__lista a{border-bottom:0;padding:1.4rem .95rem;position:relative}
  .menu__lista a::after{content:"";position:absolute;left:.95rem;right:.95rem;bottom:1rem;
    height:3px;background:var(--kolor-akcentu);transform:scaleX(0);transform-origin:left;
    transition:transform .18s ease}
  .menu__lista a:hover::after,.menu__lista a:focus-visible::after,
  .menu__lista a[aria-current="page"]::after{transform:scaleX(1)}
}
@media (prefers-reduced-motion:reduce){.menu__lista a::after{transition:none}}
