@charset "UTF-8";
/* Сетка точек (перенос DotsGrid лендинга). Кадр 998.43 × 746.04, кружок 53.82 — всё в долях кадра,
   поэтому сетка тянется за шириной, которую задаёт родитель. Точки-span (координаты --x / --y, проценты) —
   вариант без JS; с JS (--canvas) они скрыты, волну рисует canvas во весь блок. Цвет — currentColor. */
.dots-grid {
  position: relative;
  width: 100%;
  aspect-ratio: 998.4277/746.0373;
  color: var(--color-green);
}
.dots-grid__dot {
  position: absolute;
  top: calc(var(--y) * 1%);
  left: calc(var(--x) * 1%);
  width: 5.3903352241%;
  aspect-ratio: 1;
  border-radius: 50%;
  background-color: currentColor;
}
.dots-grid--canvas .dots-grid__dot {
  display: none;
}
.dots-grid__canvas {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}