/* ═══════════════════════════════════════════════════════════════════════
   MODUŁ NIESTANDARDOWY · SINUSOIDA

   Moduł dostaje z CMS-a pusty `<div id="sinusoida">` i sam wstawia w niego
   płótno. Wysokość i barwy da się przestawić zmiennymi — bez ruszania kodu,
   z arkusza motywu albo ze wzorca wsadu:

       .sinusoida { --sin-wysokosc: 320px; --sin-kolor: #b9935a; }

   Nazwy klas zaczynają się od `sinusoida`, żeby nie zderzyły się z niczym
   w motywie.
   ═══════════════════════════════════════════════════════════════════════ */

.sinusoida {
  position: relative;
  width: 100%;
  height: var(--sin-wysokosc, 220px);
  overflow: hidden;
}

/* Płótno wypełnia kontener. Rozdzielczość ustawia skrypt (mnożnik gęstości
   ekranu), tutaj tylko rozmiar wyświetlania. */
.sinusoida__plotno {
  display: block;
  width: 100%;
  height: 100%;
}

/* Zapasowy komunikat, gdy przeglądarka nie da rady z płótnem. Widoczny
   tylko wtedy — skrypt go usuwa razem z podmianą zawartości. */
.sinusoida__zapas {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
  color: var(--sin-kolor, #1583ff);
  font: 400 13px/1.4 system-ui, sans-serif;
  opacity: .6;
}
