/* Rozwijane "Oferta" w menu desktopowym (05.10.2026, decyzja Olimpii: krotsze menu).
   Program, INTUstarter i Sesje 1:1 schowane pod jednym punktem. Czysty CSS: otwiera sie
   na hover i na focus (Tab), bez JS. Menu mobilne zostaje plaska lista - tam nie ma problemu
   z szerokoscia. Kazda strona ma wlasny CSS dla `.nav a`, wiec ten plik styluje tylko
   to, czego tamte reguly nie znaja: kontener, panel i linki w panelu. */
.nav-oferta { position: relative; display: inline-flex; align-items: center; }
.nav-oferta-chev { display: inline-block; margin-left: 4px; font-size: .7em; transition: transform .25s ease; }
.nav-oferta:hover .nav-oferta-chev,
.nav-oferta:focus-within .nav-oferta-chev { transform: rotate(180deg); }
.nav-oferta-menu {
  position: absolute; top: 100%; left: 50%; z-index: 1000;
  display: flex; flex-direction: column; min-width: 190px; padding: 8px;
  background: #fff; border: 1px solid rgba(219, 169, 75, .3); border-radius: 14px;
  box-shadow: 0 22px 44px -22px rgba(58, 42, 90, .45);
  opacity: 0; visibility: hidden; transform: translate(-50%, 10px);
  transition: opacity .2s ease, transform .2s ease, visibility .2s;
}
/* most nad szczelina miedzy przyciskiem a panelem - inaczej hover gubi sie po drodze */
.nav-oferta-menu::before { content: ""; position: absolute; left: 0; right: 0; top: -14px; height: 14px; }
.nav-oferta:hover .nav-oferta-menu,
.nav-oferta:focus-within .nav-oferta-menu { opacity: 1; visibility: visible; transform: translate(-50%, 4px); }
.nav .nav-oferta-menu a {
  display: block; margin: 0; padding: 10px 14px; border-radius: 9px; white-space: nowrap;
  color: var(--color-dark, #2f2940); text-align: left;
}
.nav .nav-oferta-menu a::after { display: none; }
.nav .nav-oferta-menu a:hover,
.nav .nav-oferta-menu a:focus-visible { background: #f5f0fa; color: var(--color-ultraviolet, #645394); }