/* Jedno rozwinięcie całego panelu. Linki nie mają osobnego wejścia ani opóźnień. */
@media(max-width:900px){
  .js .main-nav{display:flex;position:absolute;top:100%;left:0;right:0;width:auto;padding:18px var(--gutter) 28px;border-bottom:1px solid var(--line);box-shadow:0 14px 24px #6046550c;visibility:hidden;pointer-events:none;opacity:1;transform:translateY(-6px);clip-path:inset(0% 0% 100% 0%);transform-origin:top center;max-height:calc(100dvh - var(--menu-header-height,90px) - 8px);overflow-y:auto;overscroll-behavior:contain}
  .js .main-nav.open{visibility:visible;pointer-events:auto;opacity:1;transform:translateY(0);clip-path:inset(0% 0% 0% 0%)}
  .js .main-nav.menu-opening,.js .main-nav.menu-closing{visibility:visible}
  .js .main-nav.menu-closing{pointer-events:none}
  .js .main-nav>a:not(.button){min-height:48px}
  .js .site-header .header-inner .main-nav>a:not(.brand){opacity:1;transform:none;transition:color .16s ease;transition-delay:0s}
  .js .menu-toggle .menu-icon{height:18px;border:0;background:linear-gradient(currentColor,currentColor) center/18px 1px no-repeat;transition:background-size .22s ease}
  .js .menu-toggle .menu-icon:before,.js .menu-toggle .menu-icon:after{content:'';position:absolute;left:0;width:18px;border-top:1px solid currentColor;transform:none;transition:transform .28s cubic-bezier(.22,.65,.3,1)}
  .js .menu-toggle .menu-icon:before{top:4px}
  .js .menu-toggle .menu-icon:after{top:14px}
  .js .menu-toggle[aria-expanded=true] .menu-icon{background-size:0 1px}
  .js .menu-toggle[aria-expanded=true] .menu-icon:before{top:4px;transform:translateY(5px) rotate(45deg)}
  .js .menu-toggle[aria-expanded=true] .menu-icon:after{top:14px;transform:translateY(-5px) rotate(-45deg)}
}
[data-motion=off] .menu-toggle .menu-icon,[data-motion=off] .menu-toggle .menu-icon:before,[data-motion=off] .menu-toggle .menu-icon:after{transition:none!important}
@media(prefers-reduced-motion:reduce){html:not([data-motion=on]) .menu-toggle .menu-icon,html:not([data-motion=on]) .menu-toggle .menu-icon:before,html:not([data-motion=on]) .menu-toggle .menu-icon:after{transition:none!important}}

[data-motion=off] .main-nav>a{transition:none!important}
@media(prefers-reduced-motion:reduce){html:not([data-motion=on]) .main-nav>a{transition:none!important}}

/* CTA pod rozwijanym panelem nie dubluje przycisku menu na ruchomej krawędzi. */
@media(max-width:900px){body:has(.main-nav:is(.open,.menu-opening,.menu-closing)) .hero .actions{opacity:0;pointer-events:none}}