/* Wspólne dla /cennik i /wycena (czesci/oferta.php): lista „W cenie — zawsze" — pięć grup
   zwiniętych do nagłówka z ikoną (Jakub 30.10), bez kart — włoskowe linie. Siatka, nie łam
   kolumnowy: rozwinięcie grupy nie przerzuca pozostałych między kolumnami. Tylko układ;
   wartości z tokenów system.css. */
.of-lista-cen { display: grid; gap: 0 var(--o-7); align-items: start; }
/* dwie kolumny, nie trzy: przy trzech nazwy grup łamały się, a rozwinięta lista szła wąskim słupkiem */
@media (min-width: 700px) { .of-lista-cen { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.of-grupa { border-top: 1px solid var(--tafla-linia, var(--linia)); }
.of-grupa summary {
  display: flex; align-items: center; gap: var(--o-3);
  padding: var(--o-3) 0;
  cursor: pointer;
  list-style: none;
}
.of-grupa summary::-webkit-details-marker { display: none; }
.of-grupa :is(h2, h3) { flex: 1; font-size: var(--r-2); font-weight: var(--w-tekst); letter-spacing: 0; color: var(--tafla-tekst, var(--tekst)); }
.of-grupa-ikona { flex: none; width: 22px; height: 22px; color: var(--tafla-akcent, var(--akcent)); }
.of-grupa-ile { color: var(--tafla-tekst-2, var(--tekst-2)); }
.of-grupa-strzalka { flex: none; width: 18px; height: 18px; color: var(--tafla-tekst-2, var(--tekst-2)); transition: transform .3s var(--e-lagodna); }
.of-grupa[open] .of-grupa-strzalka { transform: rotate(180deg); }
.of-grupa summary:hover :is(h2, h3) { color: var(--tekst); }
.of-grupa ul { margin: 0 0 var(--o-4); padding: 0 0 0 calc(22px + var(--o-3)); list-style: none; }
.of-grupa li { padding: 7px 0; border-top: 1px solid var(--tafla-linia, var(--linia)); color: var(--tafla-tekst-2, var(--tekst-2)); font-size: var(--r-0-5); line-height: 1.5; text-wrap: pretty; }