body { background: #000; color: #fff; overflow-x: hidden; }
/* Серый низ тянется до конца окна, чтобы под ним не оставалось чёрной полосы */
.page { min-height: 100vh; display: flex; flex-direction: column; }
.bottom { flex: 1; }

.top {
  position: relative;
  padding: 56px 0 120px;
  overflow: hidden;
}
/* Размытое свечение в правом верхнем углу, как на оригинале */
/* Большое пятно как на Tilda: центр правее заголовка, фиолетовый слева, синий и бирюзовый справа */
.top__glow {
  position: absolute;
  top: -633px;
  left: calc(50% + 258px - 800px);
  width: 1600px;
  height: 1500px;
  background:
    radial-gradient(closest-side at 30% 59%, rgba(110, 40, 255, .95), transparent 80%),
    radial-gradient(closest-side at 58% 47%, rgba(30, 60, 255, .95), transparent 75%),
    radial-gradient(closest-side at 80% 54%, rgba(0, 170, 230, .85), transparent 70%);
  filter: blur(80px);
  pointer-events: none;
}
.top__inner { position: relative; }
.top__title {
  max-width: 880px;
  font-size: 100px;
  font-weight: 800;
  line-height: 1;
}
.top__sub {
  max-width: 1040px;
  margin-top: 12px;
  color: #0ca4d6;
  font-size: 50px;
  font-weight: 600;
  line-height: 1.35;
  letter-spacing: -1px;
}
.top__label {
  margin: 63px 0 20px 20px;
  color: #6d6d6d;
  font-size: 40px;
  font-weight: 600;
  line-height: 1.55;
}
/* Стрелки вынесены левее колонки текста, как на Tilda */
.perks { display: grid; gap: 34px; margin-left: -27px; }
.perks li { display: flex; align-items: flex-start; gap: 17px; }
.perks img { flex: 0 0 25px; width: 25px; margin-top: -9px; }
.perks p {
  color: #989898;
  font-size: 40px;
  line-height: 1.55;
  letter-spacing: -1px;
}
.perks strong { font-weight: 400; }

.bottom {
  position: relative;
  padding: 70px 0 80px;
  background: #e7e7e7;
  color: #000;
  /* Скруглённый «холм», как ellipse-шейп на Tilda */
  border-radius: 50% 50% 0 0 / 120px 120px 0 0;
  margin-top: -40px;
}
.bottom__inner { text-align: center; }
.bottom__author {
  max-width: 760px;
  margin: 0 auto 40px;
  font-size: 40px;
  line-height: 1.3;
  letter-spacing: -1px;
}
.bottom__author b { font-weight: 700; }
.bottom__btn { min-width: 420px; min-height: 96px; font-size: 30px; }

@media (max-width: 960px) {
  .top__title { font-size: 72px; }
  .top__sub { font-size: 36px; }
  .top__label { font-size: 32px; }
  .perks p { font-size: 30px; }
  .bottom__author { font-size: 32px; }
}

@media (max-width: 640px) {
  .top { padding: 40px 0 90px; }
  .top__title { font-size: clamp(30px, 9.6vw, 46px); overflow-wrap: anywhere; hyphens: auto; }
  .top__sub { font-size: 24px; letter-spacing: 0; }
  .top__label { margin: 48px 0 16px; font-size: 26px; }
  .perks { gap: 24px; margin-left: 0; }
  .perks p { font-size: 20px; letter-spacing: 0; }
  .perks img { flex-basis: 18px; width: 18px; margin-top: 2px; }
  .bottom { border-radius: 50% 50% 0 0 / 50px 50px 0 0; padding: 50px 0 60px; }
  .bottom__author { font-size: 22px; letter-spacing: 0; }
  .bottom__btn { min-width: 0; width: 100%; min-height: 72px; font-size: 22px; }
}
