/*
  Раскладка по координатам, как в Zero Block Тильды.
  У секции .z задана высота --h, у элемента .z__el — --l, --t, --w (левый край,
  верх, ширина) в единицах макета. Единица --u:
  - на компьютере (от 480px) — ширина окна / 1200, всё масштабируется вместе с окном;
  - на телефоне — 1px, колонка 320px по центру.
*/
.zero-page {
  container-type: inline-size;
}

.z {
  --u: calc(100cqw / 1200);
  position: relative;
  height: calc(var(--h) * var(--u));
  overflow-x: clip;
}
.z__grid {
  position: relative;
  height: 100%;
}
.z__el {
  position: absolute;
  left: calc(var(--l) * var(--u));
  top: calc(var(--t) * var(--u));
  width: calc(var(--w) * var(--u));
  margin: 0;
}

/* Подпись над заголовком секции: Company, Our Apps, названия приложений. */
.label {
  font-size: calc(12 * var(--u));
  font-weight: 700;
  line-height: 1.55;
  letter-spacing: calc(0.5 * var(--u));
  color: #000;
}

.btn {
  display: flex;
  align-items: center;
  justify-content: center;
  height: calc(var(--bh) * var(--u));
  border-radius: 100px;
  font-size: calc(var(--fs) * var(--u));
  font-weight: 700;
  letter-spacing: calc(var(--ls) * var(--u));
  line-height: 1.55;
  text-transform: uppercase;
  text-decoration: none;
  transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out;
}
.btn--solid {
  background: #000;
  color: #fff;
  font-weight: 500;
}
.btn--outline {
  border: calc(2 * var(--u)) solid #08090d;
  color: #08090d;
}
.btn--outline:hover {
  background: #08090d;
  color: #fff;
}
.btn--white {
  border-color: #fff;
  color: #fff;
}
.btn--white:hover {
  background: #fff;
  color: #08090d;
}

@media (min-width: 480px) {
  br.m,
  .only-m {
    display: none;
  }
}

@media (max-width: 479px) {
  .z {
    --u: 1px;
  }
  .z__grid {
    width: 320px;
    margin: 0 auto;
  }
  br.d,
  .only-d {
    display: none;
  }
}