.device-desktop-breakpoint-1920-step-third-step,
.device-desktop-breakpoint-1920-step-third-step * {
  box-sizing: border-box;
}
.onboard-device-desktop-breakpoint-1920-step-third-step {
  display: flex;
  flex-direction: column;
  gap: 24px;
  align-items: flex-start;
  justify-content: flex-start;
  position: relative;
  margin: 10px;
  border-radius: 24px;
  padding: 60px;
  background: var(--color-neutral-grayscale-0, #ffffff);
}
.onboard-_1 {
  display: flex;
  flex-direction: column;
  gap: 24px;
  align-items: center;
  justify-content: flex-start;
  flex-shrink: 0;
  position: relative;
}
.onboard-content {
  display: flex;
  flex-direction: row;
  gap: 16px;
  align-items: flex-start;
  justify-content: center;
  flex-shrink: 0;
  position: relative;
}
.onboard-number-line {
  padding: 0px 31px 0px 31px;
  display: flex;
  flex-direction: column;
  gap: 24px;
  align-items: center;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
.onboard-number-enabled {
  background: var(--color-background-success-50, #e3fe98);
  border-radius: 40px;
  padding: 10px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 56px;
  height: 56px;
  position: relative;
  overflow: hidden;
}
.onboard-check {
  flex-shrink: 0;
  width: 24px;
  height: 24px;
  position: relative;
  overflow: visible;
}
.onboard-divider {
  background: var(--color-neutral-grayscale-100, #e2e3e8);
  display: flex;
  flex-direction: column;
  gap: 0px;
  align-items: flex-start;
  justify-content: center;
  flex: 1;
  width: 1px;
  position: relative;
  overflow: hidden;
}
.onboard-action {
  padding: 0px 0px 20px 0px;
  display: flex;
  flex-direction: column;
  gap: 16px;
  align-items: flex-start;
  justify-content: flex-start;
  flex-shrink: 0;
  width: 520px;
  position: relative;
}
.onboard-step {
  padding: 24px 0px 24px 0px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  align-items: flex-start;
  justify-content: center;
  align-self: stretch;
  flex-shrink: 0;
  height: 56px;
  position: relative;
}
.onboard-typography {
  display: flex;
  flex-direction: column;
  gap: 8px;
  align-items: flex-start;
  justify-content: center;
  flex-shrink: 0;
  position: relative;
}
.onboard-paragraph-3-m {
  color: var(--color-typeface-grayscale-300, #000814);
  text-align: left;
  font-family: var(
    --typescale-paragraph-desktop-3-m-font-family,
    "Inter-SemiBold",
    sans-serif
  );
  font-size: var(--typescale-paragraph-desktop-3-m-font-size, 16px);
  line-height: var(--typescale-paragraph-desktop-3-m-line-height, 24px);
  font-weight: var(--typescale-paragraph-desktop-3-m-font-weight, 600);
  position: relative;
  align-self: stretch;
}
.onboard-content1 {
  display: flex;
  flex-direction: column;
  gap: 64px;
  align-items: flex-start;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
.onboard-content2 {
  display: none;
  flex-direction: column;
  gap: 64px;
  align-items: flex-start;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
.onboard-text {
  display: flex;
  flex-direction: column;
  gap: 16px;
  align-items: flex-start;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
.typography-subheader-desktop-3-l {
  color: var(--color-typeface-grayscale-300, #000814);
  font-family: Inter;
  font-size: 40px;
  font-style: normal;
  font-weight: 600;
  line-height: 48px;
  letter-spacing: -1.6px;
}
.typography-subheader-desktop-3-l-success {
  color: var(--color-typeface-success-300);
  font-family: Inter;
  font-size: 40px;
  font-style: normal;
  font-weight: 600;
  line-height: 48px;
  letter-spacing: -1.6px;
}
.onboard-paragraph-2-m {
  color: var(--color-typeface-grayscale-200, #6d6e82);
  text-align: left;
  font-family: var(
    --typescale-paragraph-desktop-2-m-font-family,
    "Inter-Medium",
    sans-serif
  );
  font-size: var(--typescale-paragraph-desktop-2-m-font-size, 16px);
  line-height: var(--typescale-paragraph-desktop-2-m-line-height, 24px);
  font-weight: var(--typescale-paragraph-desktop-2-m-font-weight, 500);
  position: relative;
  align-self: stretch;
}
.onboard-input {
  background: var(--color-neutral-grayscale-0, #ffffff);
  border-radius: 16px;
  border-style: solid;
  border-color: var(--color-neutral-grayscale-300, #000814);
  border-width: 1px;
  padding: 16px 24px 16px 24px;
  display: flex;
  flex-direction: column;
  gap: 0px;
  align-items: flex-start;
  justify-content: center;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
.onboard-label {
  color: var(--color-typeface-grayscale-200, #6d6e82);
  text-align: left;
  font-family: var(
    --typescale-paragraph-desktop-1-m-font-family,
    "Inter-Regular",
    sans-serif
  );
  font-size: var(--typescale-paragraph-desktop-1-m-font-size, 14px);
  line-height: var(--typescale-paragraph-desktop-1-m-line-height, 24px);
  font-weight: var(--typescale-paragraph-desktop-1-m-font-weight, 400);
  position: relative;
  align-self: stretch;
}
.onboard-text-filled {
  color: var(--color-typeface-grayscale-300, #000814);
  text-align: left;
  font-family: var(
    --typescale-paragraph-desktop-3-m-font-family,
    "Inter-SemiBold",
    sans-serif
  );
  font-size: var(--typescale-paragraph-desktop-3-m-font-size, 16px);
  line-height: var(--typescale-paragraph-desktop-3-m-line-height, 24px);
  font-weight: var(--typescale-paragraph-desktop-3-m-font-weight, 600);
  position: relative;
  align-self: stretch;
}
.onboard-button {
  background: var(--color-neutral-primary-150, #fee400);
  border-radius: 32px;
  border-style: solid;
  border-color: var(--color-neutral-grayscale-300, #000814);
  border-width: 1px;
  padding: 16px 24px 16px 24px;
  display: flex;
  flex-direction: column;
  gap: 0px;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 176px;
  position: relative;
}
.onboard-not-registered-yet {
  color: var(--color-typeface-grayscale-300, #000814);
  text-align: left;
  font-family: var(
    --typescale-action-desktop-normal-font-family,
    "Inter-Bold",
    sans-serif
  );
  font-size: var(--typescale-action-desktop-normal-font-size, 14px);
  line-height: var(--typescale-action-desktop-normal-line-height, 24px);
  font-weight: var(--typescale-action-desktop-normal-font-weight, 700);
  position: relative;
}
.onboard-_2 {
  display: flex;
  flex-direction: column;
  gap: 24px;
  align-items: center;
  justify-content: flex-start;
  flex-shrink: 0;
  position: relative;
}
.onboard-number-line2 {
  padding: 0px 31px 0px 31px;
  display: flex;
  flex-direction: column;
  gap: 24px;
  align-items: center;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
.onboard-check2 {
  flex-shrink: 0;
  width: 24px;
  height: 24px;
  position: relative;
  overflow: visible;
}
.onboard-divider2 {
  background: var(--color-neutral-grayscale-100, #e2e3e8);
  display: flex;
  flex-direction: column;
  gap: 0px;
  align-items: flex-start;
  justify-content: center;
  flex: 1;
  width: 1px;
  position: relative;
  overflow: hidden;
}
.onboard-content3 {
  display: flex;
  flex-direction: column;
  gap: 64px;
  align-items: flex-start;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
.onboard-frame-308 {
  display: flex;
  flex-direction: column;
  gap: 40px;
  align-items: flex-start;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
.onboard-text2 {
  display: flex;
  flex-direction: column;
  gap: 16px;
  align-items: flex-start;
  justify-content: flex-start;
  flex-shrink: 0;
  position: relative;
}
.onboard-results {
  color: var(--color-typeface-grayscale-300, #000814);
  text-align: left;
  font-family: var(
    --typescale-subheader-desktop-3-l-font-family,
    "Inter-SemiBold",
    sans-serif
  );
  font-size: var(--typescale-subheader-desktop-3-l-font-size, 40px);
  line-height: var(--typescale-subheader-desktop-3-l-line-height, 48px);
  font-weight: var(--typescale-subheader-desktop-3-l-font-weight, 600);
  position: relative;
}
.onboard-we-optimized-your-website-what-did-you-think {
  color: var(--color-typeface-grayscale-200, #6d6e82);
  text-align: left;
  font-family: var(
    --typescale-paragraph-desktop-2-m-font-family,
    "Inter-Medium",
    sans-serif
  );
  font-size: var(--typescale-paragraph-desktop-2-m-font-size, 16px);
  line-height: var(--typescale-paragraph-desktop-2-m-line-height, 24px);
  font-weight: var(--typescale-paragraph-desktop-2-m-font-weight, 500);
  position: relative;
}
.onboard-button-group {
  display: flex;
  flex-direction: row;
  gap: 16px;
  align-items: flex-start;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
.onboard-button2 {
  border-radius: 32px;
  padding: 16px 24px 16px 24px;
  display: flex;
  flex-direction: column;
  gap: 0px;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  position: relative;
}
.onboard-not-registered-yet2 {
  color: var(--color-typeface-grayscale-200, #6d6e82);
  text-align: left;
  font-family: var(
    --typescale-action-desktop-normal-font-family,
    "Inter-Bold",
    sans-serif
  );
  font-size: var(--typescale-action-desktop-normal-font-size, 14px);
  line-height: var(--typescale-action-desktop-normal-line-height, 24px);
  font-weight: var(--typescale-action-desktop-normal-font-weight, 700);
  position: relative;
}
.onboard-button3 {
  background: var(--color-neutral-primary-150, #fee400);
  border-radius: 32px;
  border-style: solid;
  border-color: var(--color-neutral-grayscale-300, #000814);
  border-width: 1px;
  padding: 16px 24px 16px 24px;
  display: flex;
  flex-direction: column;
  gap: 0px;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  position: relative;
}
.onboard-results2 {
  display: flex;
  flex-direction: column;
  gap: 24px;
  align-items: flex-start;
  justify-content: flex-start;
  flex-shrink: 0;
  position: relative;
}
.onboard-text3 {
  display: flex;
  flex-direction: row;
  gap: 0px;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  position: relative;
}
.onboard-compare-the-results {
  color: var(--color-typeface-grayscale-300, #000814);
  text-align: left;
  font-family: var(
    --typescale-subheader-desktop-1-l-font-family,
    "Inter-SemiBold",
    sans-serif
  );
  font-size: var(--typescale-subheader-desktop-1-l-font-size, 24px);
  line-height: var(--typescale-subheader-desktop-1-l-line-height, 32px);
  font-weight: var(--typescale-subheader-desktop-1-l-font-weight, 600);
  position: relative;
}
.onboard-table-comparative {
  background: var(--color-neutral-grayscale-0, #ffffff);
  border-radius: 24px;
  border-style: solid;
  border-color: var(--color-neutral-grayscale-100, #e2e3e8);
  border-width: 1px;
  padding: 24px;
  display: flex;
  flex-direction: column;
  gap: 20px;
  align-items: flex-start;
  justify-content: flex-start;
  flex-shrink: 0;
  position: relative;
}
.onboard-rectangle-465 {
  background: var(--color-neutral-success-0);
  border-radius: 0px 23px 23px 0px;
  flex-shrink: 0;
  width: 123px;
  height: 535px;
  position: absolute;
  left: 396px;
  top: 1px;
}
.onboard-results3 {
  display: flex;
  flex-direction: row;
  gap: 16px;
  align-items: flex-start;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  height: 429px;
  position: relative;
}
.onboard-label2 {
  display: flex;
  flex-direction: column;
  gap: 40px;
  align-items: flex-start;
  justify-content: flex-start;
  flex-shrink: 0;
  width: 257px;
  position: relative;
}
.onboard-performance-score {
  color: var(--color-typeface-grayscale-150, #a3a4b3);
  text-align: left;
  font-family: var(
    --typescale-paragraph-desktop-3-m-font-family,
    "Inter-SemiBold",
    sans-serif
  );
  font-size: var(--typescale-paragraph-desktop-3-m-font-size, 16px);
  line-height: var(--typescale-paragraph-desktop-3-m-line-height, 24px);
  font-weight: var(--typescale-paragraph-desktop-3-m-font-weight, 600);
  position: relative;
}
.onboard-structure-score {
  color: var(--color-typeface-grayscale-150, #a3a4b3);
  text-align: left;
  font-family: var(
    --typescale-paragraph-desktop-3-m-font-family,
    "Inter-SemiBold",
    sans-serif
  );
  font-size: var(--typescale-paragraph-desktop-3-m-font-size, 16px);
  line-height: var(--typescale-paragraph-desktop-3-m-line-height, 24px);
  font-weight: var(--typescale-paragraph-desktop-3-m-font-weight, 600);
  position: relative;
}
.onboard-largest-contentful-paint {
  color: var(--color-typeface-grayscale-150, #a3a4b3);
  text-align: left;
  font-family: var(
    --typescale-paragraph-desktop-3-m-font-family,
    "Inter-SemiBold",
    sans-serif
  );
  font-size: var(--typescale-paragraph-desktop-3-m-font-size, 16px);
  line-height: var(--typescale-paragraph-desktop-3-m-line-height, 24px);
  font-weight: var(--typescale-paragraph-desktop-3-m-font-weight, 600);
  position: relative;
}
.onboard-total-blocking-time {
  color: var(--color-typeface-grayscale-150, #a3a4b3);
  text-align: left;
  font-family: var(
    --typescale-paragraph-desktop-3-m-font-family,
    "Inter-SemiBold",
    sans-serif
  );
  font-size: var(--typescale-paragraph-desktop-3-m-font-size, 16px);
  line-height: var(--typescale-paragraph-desktop-3-m-line-height, 24px);
  font-weight: var(--typescale-paragraph-desktop-3-m-font-weight, 600);
  position: relative;
}
.onboard-cumulative-layout-shift {
  color: var(--color-typeface-grayscale-150, #a3a4b3);
  text-align: left;
  font-family: var(
    --typescale-paragraph-desktop-3-m-font-family,
    "Inter-SemiBold",
    sans-serif
  );
  font-size: var(--typescale-paragraph-desktop-3-m-font-size, 16px);
  line-height: var(--typescale-paragraph-desktop-3-m-line-height, 24px);
  font-weight: var(--typescale-paragraph-desktop-3-m-font-weight, 600);
  position: relative;
}
.onboard-total-page-size {
  color: var(--color-typeface-grayscale-150, #a3a4b3);
  text-align: left;
  font-family: var(
    --typescale-paragraph-desktop-3-m-font-family,
    "Inter-SemiBold",
    sans-serif
  );
  font-size: var(--typescale-paragraph-desktop-3-m-font-size, 16px);
  line-height: var(--typescale-paragraph-desktop-3-m-line-height, 24px);
  font-weight: var(--typescale-paragraph-desktop-3-m-font-weight, 600);
  position: relative;
}
.onboard-total-of-requests {
  color: var(--color-typeface-grayscale-150, #a3a4b3);
  text-align: left;
  font-family: var(
    --typescale-paragraph-desktop-3-m-font-family,
    "Inter-SemiBold",
    sans-serif
  );
  font-size: var(--typescale-paragraph-desktop-3-m-font-size, 16px);
  line-height: var(--typescale-paragraph-desktop-3-m-line-height, 24px);
  font-weight: var(--typescale-paragraph-desktop-3-m-font-weight, 600);
  position: relative;
}
.onboard-result {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  justify-content: space-between;
  flex-shrink: 0;
  width: 199px;
  position: relative;
}
.onboard-frame-290 {
  display: flex;
  flex-direction: column;
  gap: 40px;
  align-items: center;
  justify-content: flex-start;
  flex-shrink: 0;
  position: relative;
}
.onboard-_15 {
  color: var(--color-typeface-danger-150, #ff3333);
  text-align: right;
  font-family: var(
    --typescale-paragraph-desktop-3-m-font-family,
    "Inter-SemiBold",
    sans-serif
  );
  font-size: var(--typescale-paragraph-desktop-3-m-font-size, 16px);
  line-height: var(--typescale-paragraph-desktop-3-m-line-height, 24px);
  font-weight: var(--typescale-paragraph-desktop-3-m-font-weight, 600);
  position: relative;
}
.onboard-_20 {
  color: var(--color-typeface-grayscale-300, #000814);
  text-align: right;
  font-family: var(
    --typescale-paragraph-desktop-3-m-font-family,
    "Inter-SemiBold",
    sans-serif
  );
  font-size: var(--typescale-paragraph-desktop-3-m-font-size, 16px);
  line-height: var(--typescale-paragraph-desktop-3-m-line-height, 24px);
  font-weight: var(--typescale-paragraph-desktop-3-m-font-weight, 600);
  position: relative;
}
.onboard-_75 {
  color: var(--color-typeface-grayscale-300, #000814);
  text-align: right;
  font-family: var(
    --typescale-paragraph-desktop-3-m-font-family,
    "Inter-SemiBold",
    sans-serif
  );
  font-size: var(--typescale-paragraph-desktop-3-m-font-size, 16px);
  line-height: var(--typescale-paragraph-desktop-3-m-line-height, 24px);
  font-weight: var(--typescale-paragraph-desktop-3-m-font-weight, 600);
  position: relative;
}
.onboard-_3-5-s {
  color: var(--color-typeface-grayscale-300, #000814);
  text-align: right;
  font-family: var(
    --typescale-paragraph-desktop-3-m-font-family,
    "Inter-SemiBold",
    sans-serif
  );
  font-size: var(--typescale-paragraph-desktop-3-m-font-size, 16px);
  line-height: var(--typescale-paragraph-desktop-3-m-line-height, 24px);
  font-weight: var(--typescale-paragraph-desktop-3-m-font-weight, 600);
  position: relative;
}
.onboard-_1-00 {
  color: var(--color-typeface-grayscale-300, #000814);
  text-align: right;
  font-family: var(
    --typescale-paragraph-desktop-3-m-font-family,
    "Inter-SemiBold",
    sans-serif
  );
  font-size: var(--typescale-paragraph-desktop-3-m-font-size, 16px);
  line-height: var(--typescale-paragraph-desktop-3-m-line-height, 24px);
  font-weight: var(--typescale-paragraph-desktop-3-m-font-weight, 600);
  position: relative;
}
.onboard-_6-50-mb {
  color: var(--color-typeface-grayscale-300, #000814);
  text-align: right;
  font-family: var(
    --typescale-paragraph-desktop-3-m-font-family,
    "Inter-SemiBold",
    sans-serif
  );
  font-size: var(--typescale-paragraph-desktop-3-m-font-size, 16px);
  line-height: var(--typescale-paragraph-desktop-3-m-line-height, 24px);
  font-weight: var(--typescale-paragraph-desktop-3-m-font-weight, 600);
  position: relative;
}
.onboard-_140 {
  color: var(--color-typeface-grayscale-300, #000814);
  text-align: right;
  font-family: var(
    --typescale-paragraph-desktop-3-m-font-family,
    "Inter-SemiBold",
    sans-serif
  );
  font-size: var(--typescale-paragraph-desktop-3-m-font-size, 16px);
  line-height: var(--typescale-paragraph-desktop-3-m-line-height, 24px);
  font-weight: var(--typescale-paragraph-desktop-3-m-font-weight, 600);
  position: relative;
}
.onboard-_752 {
  color: var(--color-typeface-success-250, #709900);
  text-align: right;
  font-family: var(
    --typescale-paragraph-desktop-3-m-font-family,
    "Inter-SemiBold",
    sans-serif
  );
  font-size: var(--typescale-paragraph-desktop-3-m-font-size, 16px);
  line-height: var(--typescale-paragraph-desktop-3-m-line-height, 24px);
  font-weight: var(--typescale-paragraph-desktop-3-m-font-weight, 600);
  position: relative;
}
.onboard-_70 {
  color: var(--color-typeface-grayscale-300, #000814);
  text-align: right;
  font-family: var(
    --typescale-paragraph-desktop-3-m-font-family,
    "Inter-SemiBold",
    sans-serif
  );
  font-size: var(--typescale-paragraph-desktop-3-m-font-size, 16px);
  line-height: var(--typescale-paragraph-desktop-3-m-line-height, 24px);
  font-weight: var(--typescale-paragraph-desktop-3-m-font-weight, 600);
  position: relative;
}
.onboard-_82 {
  color: var(--color-typeface-grayscale-300, #000814);
  text-align: right;
  font-family: var(
    --typescale-paragraph-desktop-3-m-font-family,
    "Inter-SemiBold",
    sans-serif
  );
  font-size: var(--typescale-paragraph-desktop-3-m-font-size, 16px);
  line-height: var(--typescale-paragraph-desktop-3-m-line-height, 24px);
  font-weight: var(--typescale-paragraph-desktop-3-m-font-weight, 600);
  position: relative;
}
.onboard-_2-0-s {
  color: var(--color-typeface-grayscale-300, #000814);
  text-align: right;
  font-family: var(
    --typescale-paragraph-desktop-3-m-font-family,
    "Inter-SemiBold",
    sans-serif
  );
  font-size: var(--typescale-paragraph-desktop-3-m-font-size, 16px);
  line-height: var(--typescale-paragraph-desktop-3-m-line-height, 24px);
  font-weight: var(--typescale-paragraph-desktop-3-m-font-weight, 600);
  position: relative;
}
.onboard-_0-03 {
  color: var(--color-typeface-grayscale-300, #000814);
  text-align: right;
  font-family: var(
    --typescale-paragraph-desktop-3-m-font-family,
    "Inter-SemiBold",
    sans-serif
  );
  font-size: var(--typescale-paragraph-desktop-3-m-font-size, 16px);
  line-height: var(--typescale-paragraph-desktop-3-m-line-height, 24px);
  font-weight: var(--typescale-paragraph-desktop-3-m-font-weight, 600);
  position: relative;
}
.onboard-_3-00-mb {
  color: var(--color-typeface-grayscale-300, #000814);
  text-align: right;
  font-family: var(
    --typescale-paragraph-desktop-3-m-font-family,
    "Inter-SemiBold",
    sans-serif
  );
  font-size: var(--typescale-paragraph-desktop-3-m-font-size, 16px);
  line-height: var(--typescale-paragraph-desktop-3-m-line-height, 24px);
  font-weight: var(--typescale-paragraph-desktop-3-m-font-weight, 600);
  position: relative;
}
.onboard-_80 {
  color: var(--color-typeface-grayscale-300, #000814);
  text-align: right;
  font-family: var(
    --typescale-paragraph-desktop-3-m-font-family,
    "Inter-SemiBold",
    sans-serif
  );
  font-size: var(--typescale-paragraph-desktop-3-m-font-size, 16px);
  line-height: var(--typescale-paragraph-desktop-3-m-line-height, 24px);
  font-weight: var(--typescale-paragraph-desktop-3-m-font-weight, 600);
  position: relative;
}
.onboard-line-div {
  background: var(--color-neutral-grayscale-100, #e2e3e8);
  display: flex;
  flex-direction: column;
  gap: 10px;
  align-items: flex-start;
  justify-content: flex-start;
  flex-shrink: 0;
  width: 518px;
  height: 1px;
  position: absolute;
  left: -23px;
  top: 44px;
  overflow: hidden;
}
.onboard-line-div2 {
  background: var(--color-neutral-grayscale-100, #e2e3e8);
  display: flex;
  flex-direction: column;
  gap: 10px;
  align-items: flex-start;
  justify-content: flex-start;
  flex-shrink: 0;
  width: 518px;
  height: 1px;
  position: absolute;
  left: -23px;
  top: 108px;
  overflow: hidden;
}
.onboard-line-div3 {
  background: var(--color-neutral-grayscale-100, #e2e3e8);
  display: flex;
  flex-direction: column;
  gap: 10px;
  align-items: flex-start;
  justify-content: flex-start;
  flex-shrink: 0;
  width: 518px;
  height: 1px;
  position: absolute;
  left: -23px;
  top: 172px;
  overflow: hidden;
}
.onboard-line-div4 {
  background: var(--color-neutral-grayscale-100, #e2e3e8);
  display: flex;
  flex-direction: column;
  gap: 10px;
  align-items: flex-start;
  justify-content: flex-start;
  flex-shrink: 0;
  width: 518px;
  height: 1px;
  position: absolute;
  left: -23px;
  top: 236px;
  overflow: hidden;
}
.onboard-line-div5 {
  background: var(--color-neutral-grayscale-100, #e2e3e8);
  display: flex;
  flex-direction: column;
  gap: 10px;
  align-items: flex-start;
  justify-content: flex-start;
  flex-shrink: 0;
  width: 518px;
  height: 1px;
  position: absolute;
  left: -23px;
  top: 300px;
  overflow: hidden;
}
.onboard-line-div6 {
  background: var(--color-neutral-grayscale-100, #e2e3e8);
  display: flex;
  flex-direction: column;
  gap: 10px;
  align-items: flex-start;
  justify-content: flex-start;
  flex-shrink: 0;
  width: 518px;
  height: 1px;
  position: absolute;
  left: -23px;
  top: 364px;
  overflow: hidden;
}
.onboard-line-div7 {
  background: var(--color-neutral-grayscale-100, #e2e3e8);
  display: flex;
  flex-direction: column;
  gap: 10px;
  align-items: flex-start;
  justify-content: flex-start;
  flex-shrink: 0;
  width: 518px;
  height: 1px;
  position: absolute;
  left: -23px;
  top: 428px;
  overflow: hidden;
}
.onboard-peqi-grade {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  flex-shrink: 0;
  width: 459px;
  position: relative;
}
.onboard-peqi-grade2 {
  color: var(--color-typeface-grayscale-300, #000814);
  text-align: left;
  font-family: var(
    --typescale-subheader-desktop-1-l-font-family,
    "Inter-SemiBold",
    sans-serif
  );
  font-size: var(--typescale-subheader-desktop-1-l-font-size, 24px);
  line-height: var(--typescale-subheader-desktop-1-l-line-height, 32px);
  font-weight: var(--typescale-subheader-desktop-1-l-font-weight, 600);
  position: relative;
  width: 184px;
}
.onboard-before-peqi {
  border-radius: 4px;
  padding: 4px 8px 4px 8px;
  display: flex;
  flex-direction: row;
  gap: 0px;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 40px;
  position: relative;
}
.onboard-d {
  color: white;
  text-align: left;
  font-family: var(
    --typescale-subheader-desktop-1-l-font-family,
    "Inter-SemiBold",
    sans-serif
  );
  font-size: var(--typescale-subheader-desktop-1-l-font-size, 24px);
  line-height: var(--typescale-subheader-desktop-1-l-line-height, 32px);
  font-weight: var(--typescale-subheader-desktop-1-l-font-weight, 600);
  position: relative;
}
.onboard-after-peqi {
  border-radius: 4px;
  padding: 4px 8px 4px 8px;
  display: flex;
  flex-direction: row;
  gap: 0px;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 40px;
  position: relative;
}
.onboard-b {
  color: white;
  text-align: left;
  font-family: var(
    --typescale-subheader-desktop-1-l-font-family,
    "Inter-SemiBold",
    sans-serif
  );
  font-size: var(--typescale-subheader-desktop-1-l-font-size, 24px);
  line-height: var(--typescale-subheader-desktop-1-l-line-height, 32px);
  font-weight: var(--typescale-subheader-desktop-1-l-font-weight, 600);
  position: relative;
}
.onboard-lets-configure-your-dns {
  display: flex;
  flex-direction: column;
  gap: 32px;
  align-items: flex-start;
  justify-content: flex-start;
  flex-shrink: 0;
  position: relative;
}
.onboard-let-s-configure-your-dns {
  color: var(--color-typeface-grayscale-300, #000814);
  text-align: left;
  font-family: var(
    --typescale-subheader-desktop-2-l-font-family,
    "Inter-SemiBold",
    sans-serif
  );
  font-size: var(--typescale-subheader-desktop-2-l-font-size, 32px);
  line-height: var(--typescale-subheader-desktop-2-l-line-height, 40px);
  font-weight: var(--typescale-subheader-desktop-2-l-font-weight, 600);
  position: relative;
}
.onboard-_3 {
  display: flex;
  flex-direction: column;
  gap: 24px;
  align-items: center;
  justify-content: flex-start;
  flex-shrink: 0;
  position: relative;
}
.onboard-number2 {
  padding: 0px 31px 0px 31px;
  display: flex;
  flex-direction: column;
  gap: 24px;
  align-items: center;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
.onboard-number {
  background: var(--color-neutral-grayscale-0, #ffffff);
  border-radius: 40px;
  border-style: solid;
  border-color: var(--color-neutral-grayscale-300, #000814);
  border-width: 1px;
  padding: 10px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 56px;
  height: 56px;
  position: relative;
  overflow: hidden;
}
.onboard-number-disabled {
  background: var(--color-neutral-grayscale-0, #FFF);
  border-radius: 40px;
  border-style: solid;
  border-color: var(--color-neutral-grayscale-100);
  border-width: 1px;
  padding: 10px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 56px;
  height: 56px;
  position: relative;
  overflow: hidden;
}
.onboard-typography2 {
  display: flex;
  flex-direction: column;
  gap: 8px;
  align-items: center;
  justify-content: center;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
.onboard-subheading-1-l {
  color: var(--color-typeface-grayscale-300, #000814);
  text-align: center;
  font-family: var(
    --typescale-subheader-desktop-1-l-font-family,
    "Inter-SemiBold",
    sans-serif
  );
  font-size: var(--typescale-subheader-desktop-1-l-font-size, 24px);
  line-height: var(--typescale-subheader-desktop-1-l-line-height, 32px);
  font-weight: var(--typescale-subheader-desktop-1-l-font-weight, 600);
  position: relative;
  align-self: stretch;
}
.onboard-subheading-1-l-disabled {
  color: var(--color-typeface-grayscale-150, #A3A4B3);
  text-align: center;
  font-family: var(
    --typescale-subheader-desktop-1-l-font-family,
    "Inter-SemiBold",
    sans-serif
  );
  font-size: var(--typescale-subheader-desktop-1-l-font-size, 24px);
  line-height: var(--typescale-subheader-desktop-1-l-line-height, 32px);
  font-weight: var(--typescale-subheader-desktop-1-l-font-weight, 600);
  position: relative;
  align-self: stretch;
}

.typography-subheader-desktop-3-l-disabled {
  color: var(--color-typeface-grayscale-150, #A3A4B3);
  text-align: left;
  font-family: var(
    --typescale-subheader-desktop-3-l-font-family,
    "Inter-SemiBold",
    sans-serif
  );
  font-size: var(--typescale-subheader-desktop-3-l-font-size, 40px);
  line-height: var(--typescale-subheader-desktop-3-l-line-height, 48px);
  font-weight: var(--typescale-subheader-desktop-3-l-font-weight, 600);
  position: relative;
}
.onboard-to-perform-optimizations-on-your-website-point-the-dns-to-your-hosting-provider {
  color: var(--color-typeface-grayscale-200, #6d6e82);
  text-align: left;
  font-family: var(
    --typescale-paragraph-desktop-2-m-font-family,
    "Inter-Medium",
    sans-serif
  );
  font-size: var(--typescale-paragraph-desktop-2-m-font-size, 16px);
  line-height: var(--typescale-paragraph-desktop-2-m-line-height, 24px);
  font-weight: var(--typescale-paragraph-desktop-2-m-font-weight, 500);
  position: relative;
  align-self: stretch;
}
.onboard-input2 {
  background: var(--color-neutral-grayscale-50, #f2f3f7);
  border-radius: 16px;
  border-style: solid;
  border-color: var(--color-neutral-grayscale-100, #e2e3e8);
  border-width: 1px;
  padding: 16px 24px 16px 24px;
  display: flex;
  flex-direction: column;
  gap: 0px;
  align-items: flex-start;
  justify-content: center;
  flex-shrink: 0;
  width: 520px;
  position: relative;
}
.onboard-https-testewebsite-com-br {
  color: var(--color-typeface-grayscale-200, #6d6e82);
  text-align: left;
  font-family: var(
    --typescale-paragraph-desktop-3-m-font-family,
    "Inter-SemiBold",
    sans-serif
  );
  font-size: var(--typescale-paragraph-desktop-3-m-font-size, 16px);
  line-height: var(--typescale-paragraph-desktop-3-m-line-height, 24px);
  font-weight: var(--typescale-paragraph-desktop-3-m-font-weight, 600);
  position: relative;
  align-self: stretch;
}
.onboard-copy-and-paste-this-sub-domains-in-your-hosting-provider {
  color: var(--color-typeface-grayscale-200, #6d6e82);
  text-align: left;
  font-family: var(
    --typescale-paragraph-desktop-2-m-font-family,
    "Inter-Medium",
    sans-serif
  );
  font-size: var(--typescale-paragraph-desktop-2-m-font-size, 16px);
  line-height: var(--typescale-paragraph-desktop-2-m-line-height, 24px);
  font-weight: var(--typescale-paragraph-desktop-2-m-font-weight, 500);
  position: relative;
  align-self: stretch;
}
.onboard-frame-309 {
  display: flex;
  flex-direction: row;
  gap: 16px;
  align-items: flex-start;
  justify-content: flex-start;
  flex-wrap: wrap;
  flex-shrink: 0;
  width: 520px;
  position: relative;
}
.onboard-pill {
  background: var(--color-neutral-grayscale-0, #ffffff);
  border-radius: 24px;
  border-style: solid;
  border-color: var(--color-neutral-grayscale-100, #e2e3e8);
  border-width: 1px;
  padding: 8px 12px 8px 12px;
  display: flex;
  flex-direction: row;
  gap: 4px;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  position: relative;
}
.onboard-copy-simple {
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  position: relative;
  overflow: visible;
}
.onboard-_151-101-193-91 {
  color: var(--color-typeface-grayscale-300, #000814);
  text-align: left;
  font-family: var(
    --typescale-highlight-desktop-default-font-family,
    "Inter-ExtraBold",
    sans-serif
  );
  font-size: var(--typescale-highlight-desktop-default-font-size, 12px);
  line-height: var(--typescale-highlight-desktop-default-line-height, 16px);
  font-weight: var(--typescale-highlight-desktop-default-font-weight, 800);
  position: relative;
}
.onboard-copy-simple2 {
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  position: relative;
  overflow: visible;
}
.onboard-copy-simple3 {
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  position: relative;
  overflow: visible;
}
.onboard-copy-simple4 {
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  position: relative;
  overflow: visible;
}
.onboard-lets-configure-your-dns2 {
  display: flex;
  flex-direction: column;
  gap: 32px;
  align-items: flex-start;
  justify-content: flex-start;
  flex-shrink: 0;
  width: 176px;
  position: relative;
}
.onboard-button4 {
  background: var(--color-neutral-primary-150, #fee400);
  border-radius: 32px;
  border-style: solid;
  border-color: var(--color-neutral-grayscale-300, #000814);
  border-width: 1px;
  padding: 16px 24px 16px 24px;
  display: flex;
  flex-direction: column;
  gap: 0px;
  align-items: center;
  justify-content: center;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}

.onboard-breadcrumb,
.onboard-breadcrumb * {
  box-sizing: border-box;
}
.onboard-breadcrumb {
  display: flex;
  flex-direction: row;
  gap: 4px;
  align-items: flex-start;
  justify-content: flex-start;
  flex-shrink: 0;
  position: relative;
}
.onboard-first-step {
  color: var(--color-typeface-grayscale-150, #a3a4b3);
  text-align: left;
  font-family: var(
    --typescale-paragraph-desktop-1-m-font-family,
    "Inter-Regular",
    sans-serif
  );
  font-size: var(--typescale-paragraph-desktop-1-m-font-size, 14px);
  line-height: var(--typescale-paragraph-desktop-1-m-line-height, 24px);
  font-weight: var(--typescale-paragraph-desktop-1-m-font-weight, 400);
  position: relative;
}
.onboard-div {
  color: var(--color-typeface-grayscale-300, #000814);
  text-align: left;
  font-family: var(
    --typescale-paragraph-desktop-2-m-font-family,
    "Inter-Medium",
    sans-serif
  );
  font-size: var(--typescale-paragraph-desktop-2-m-font-size, 16px);
  line-height: var(--typescale-paragraph-desktop-2-m-line-height, 24px);
  font-weight: var(--typescale-paragraph-desktop-2-m-font-weight, 500);
  position: relative;
}
.onboard-actual {
  color: var(--color-typeface-grayscale-300, #000814);
  text-align: left;
  font-family: var(
    --typescale-action-desktop-normal-font-family,
    "Inter-Bold",
    sans-serif
  );
  font-size: var(--typescale-action-desktop-normal-font-size, 14px);
  line-height: var(--typescale-action-desktop-normal-line-height, 24px);
  font-weight: var(--typescale-action-desktop-normal-font-weight, 700);
  position: relative;
}

.onboard-greeting,
.onboard-greeting * {
  box-sizing: border-box;
}
.onboard-greeting {
  display: flex;
  flex-direction: column;
  gap: 8px;
  align-items: flex-start;
  justify-content: flex-start;
  flex-shrink: 0;
  position: relative;
  padding: 0px 20px 20px 20px;
}
.onboard-typography {
  display: flex;
  flex-direction: column;
  gap: 8px;
  align-items: flex-start;
  justify-content: center;
  flex-shrink: 0;
  position: relative;
}
.onboard-heading-1-xl {
  color: #000814;
  text-align: left;
  font-family: var(
    --typescale-header-desktop-1-xl-font-family,
    "Inter-Bold",
    sans-serif
  );
  font-size: var(--typescale-header-desktop-1-xl-font-size, 40px);
  line-height: var(--typescale-header-desktop-1-xl-line-height, 48px);
  font-weight: var(--typescale-header-desktop-1-xl-font-weight, 700);
  position: relative;
  align-self: stretch;
}
.onboard-heading-1-xl2 {
  color: var(--color-typeface-grayscale-300, #000814);
  font-family: Inter;
  font-size: 40px;
  font-style: normal;
  font-weight: 700;
  line-height: 48px;
  letter-spacing: -1.6px;
}

.image-wavinghand {
  width: 56px;
  height: 56px;
}

.body-right{
  display: flex;
  flex-direction: column;
  margin-left: 104px;

}

.frame-314,
.frame-314 * {
  box-sizing: border-box;
}
.frame-314 {
  background: var(--color-background-grayscale-0, #ffffff);
  border-radius: 24px;
  border-style: solid;
  border-color: var(--color-background-grayscale-100, #e2e3e8);
  border-width: 1px;
  display: flex;
  flex-direction: column;
  gap: 24px;
  align-items: flex-start;
  justify-content: flex-start;
  flex-shrink: 0;
  position: relative;
  width: 100%;
}
.lets-configure-your-dns {
  border-radius: 16px;
  padding: 32px 24px 32px 24px;
  display: flex;
  flex-direction: column;
  gap: 24px;
  align-items: flex-start;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
.coins {
  flex-shrink: 0;
  width: 32px;
  height: 32px;
  position: relative;
  overflow: visible;
}
.frame-313 {
  display: flex;
  flex-direction: column;
  gap: 16px;
  align-items: flex-start;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
.did-you-like-how-your-website-turned-out {
  color: var(--color-typeface-grayscale-250, #2a2b3c);
  text-align: left;
  font-family: var(
    --typescale-subheader-desktop-2l-font-family,
    "Inter-SemiBold",
    sans-serif
  );
  font-size: var(--typescale-subheader-desktop-2l-font-size, 32px);
  line-height: var(--typescale-subheader-desktop-2l-line-height, 40px);
  font-weight: var(--typescale-subheader-desktop-2l-font-weight, 600);
  position: relative;
  align-self: stretch;
}
.choose-a-plan-and-enjoy-everything-peqi-can-offer-you {
  color: var(--color-typeface-grayscale-250, #2a2b3c);
  text-align: left;
  font-family: var(
    --typescale-paragraph-desktop-2m-font-family,
    "Inter-Medium",
    sans-serif
  );
  font-size: var(--typescale-paragraph-desktop-2m-font-size, 16px);
  line-height: var(--typescale-paragraph-desktop-2m-line-height, 24px);
  font-weight: var(--typescale-paragraph-desktop-2m-font-weight, 500);
  position: relative;
  width: 536px;
}
.button {
  background: var(--color-neutral-primary-150, #fee400);
  border-radius: 32px;
  border-style: solid;
  border-color: var(--color-neutral-grayscale-300, #000814);
  border-width: 1px;
  padding: 16px 24px 16px 24px;
  display: flex;
  flex-direction: column;
  gap: 0px;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  position: relative;
}
.not-registered-yet {
  color: var(--color-typeface-grayscale-300, #000814);
  text-align: left;
  font-family: var(
    --typescale-action-desktop-normal-font-family,
    "Inter-Bold",
    sans-serif
  );
  font-size: var(--typescale-action-desktop-normal-font-size, 14px);
  line-height: var(--typescale-action-desktop-normal-line-height, 24px);
  font-weight: var(--typescale-action-desktop-normal-font-weight, 700);
  position: relative;
}

.cards,
.cards * {
  box-sizing: border-box;
}
.cards {
  display: flex;
  flex-direction: row;
  gap: 16px;
  align-items: flex-end;
  justify-content: flex-start;
  flex-shrink: 0;
  position: relative;
}
.plan {
  background: var(--color-neutral-grayscale-0, #ffffff);
  border-radius: 24px;
  border-style: solid;
  border-color: var(--color-neutral-grayscale-100, #e2e3e8);
  border-width: 1px;
  padding: 40px 24px 40px 24px;
  display: flex;
  flex-direction: row;
  gap: 10px;
  align-items: flex-start;
  justify-content: flex-start;
  flex-shrink: 0;
  width: 272px;
  position: relative;
}
.content {
  display: flex;
  flex-direction: column;
  gap: 24px;
  align-items: flex-start;
  justify-content: flex-start;
  flex: 1;
  position: relative;
}
.text {
  display: flex;
  flex-direction: column;
  gap: 24px;
  align-items: center;
  justify-content: center;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
.text2 {
  display: flex;
  flex-direction: column;
  gap: 16px;
  align-items: flex-start;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
.typography {
  display: flex;
  flex-direction: column;
  gap: 8px;
  align-items: flex-start;
  justify-content: center;
  flex-shrink: 0;
  position: relative;
}
.subheading-1-l {
  color: var(--color-typeface-grayscale-300, #000814);
  text-align: left;
  font-family: var(
    --typescale-subheader-desktop-1l-font-family,
    "Inter-SemiBold",
    sans-serif
  );
  font-size: var(--typescale-subheader-desktop-1l-font-size, 24px);
  line-height: var(--typescale-subheader-desktop-1l-line-height, 32px);
  font-weight: var(--typescale-subheader-desktop-1l-font-weight, 600);
  position: relative;
  align-self: stretch;
}
.paragraph-1-m {
  color: var(--color-typeface-grayscale-200, #6d6e82);
  text-align: left;
  font-family: var(
    --typescale-paragraph-desktop-1m-font-family,
    "Inter-Regular",
    sans-serif
  );
  font-size: var(--typescale-paragraph-desktop-1m-font-size, 14px);
  line-height: var(--typescale-paragraph-desktop-1m-line-height, 24px);
  font-weight: var(--typescale-paragraph-desktop-1m-font-weight, 400);
  position: relative;
  align-self: stretch;
}
.price {
  display: flex;
  flex-direction: row;
  gap: 8px;
  align-items: center;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
.value {
  display: flex;
  flex-direction: column;
  gap: 10px;
  align-items: center;
  justify-content: flex-start;
  flex-shrink: 0;
  position: relative;
}
.heading-3-xl {
  color: var(--color-typeface-grayscale-300, #000814);
  font-family: Inter;
  font-size: 48px;
  font-style: normal;
  font-weight: 700;
  line-height: 56px;
  letter-spacing: -1.92px;
}
.text3 {
  padding: 0px 0px 4px 0px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  align-items: center;
  justify-content: flex-end;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
.button {
  background: var(--color-neutral-grayscale-300, #000814);
  border-radius: 32px;
  padding: 12px 20px 12px 20px;
  display: flex;
  flex-direction: column;
  gap: 0px;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  position: relative;
}
.not-registered-yet {
  color: var(--color-typeface-grayscale-0, #ffffff);
  text-align: left;
  font-family: var(
    --typescale-action-desktop-normal-font-family,
    "Inter-Bold",
    sans-serif
  );
  font-size: var(--typescale-action-desktop-normal-font-size, 14px);
  line-height: var(--typescale-action-desktop-normal-line-height, 24px);
  font-weight: var(--typescale-action-desktop-normal-font-weight, 700);
  position: relative;
}
.frame-312 {
  display: flex;
  flex-direction: row;
  gap: 10px;
  align-items: flex-start;
  justify-content: flex-start;
  flex-shrink: 0;
  position: relative;
}
.tag {
  background: var(--color-neutral-success-150, #bcfe00);
  border-radius: 24px;
  border-style: solid;
  border-color: var(--color-neutral-success-150, #bcfe00);
  border-width: 1px;
  padding: 8px 12px 8px 12px;
  display: flex;
  flex-direction: row;
  gap: 4px;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  position: relative;
}
.seal-check {
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  position: relative;
  overflow: visible;
}
.recomended {
  color: var(--color-typeface-grayscale-300, #000814);
  text-align: left;
  font-family: var(
    --typescale-highlight-desktop-default-font-family,
    "Inter-ExtraBold",
    sans-serif
  );
  font-size: var(--typescale-highlight-desktop-default-font-size, 12px);
  line-height: var(--typescale-highlight-desktop-default-line-height, 16px);
  font-weight: var(--typescale-highlight-desktop-default-font-weight, 800);
  position: relative;
}
.button2 {
  background: var(--color-neutral-primary-150, #fee400);
  border-radius: 32px;
  border-style: solid;
  border-color: var(--color-neutral-grayscale-300, #000814);
  border-width: 1px;
  padding: 12px 20px 12px 20px;
  display: flex;
  flex-direction: column;
  gap: 0px;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  position: relative;
}
.not-registered-yet2 {
  color: var(--color-typeface-grayscale-300, #000814);
  text-align: left;
  font-family: var(
    --typescale-action-desktop-normal-font-family,
    "Inter-Bold",
    sans-serif
  );
  font-size: var(--typescale-action-desktop-normal-font-size, 14px);
  line-height: var(--typescale-action-desktop-normal-line-height, 24px);
  font-weight: var(--typescale-action-desktop-normal-font-weight, 700);
  position: relative;
}

.segment-control,
.segment-control * {
  box-sizing: border-box;
}

.segment-control {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  position: relative;
  margin-top: 32px;
}
.monthly,
.yearly {
  border-radius: 12px 0px 0px 12px;
  border-style: solid;
  border-color: var(--color-neutral-grayscale-200, #6d6e82);
  border-width: 1px;
  padding: 8px 24px 8px 24px;
  display: flex;
  flex-direction: row;
  gap: 10px;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  position: relative;
  font-size: 14px;
  font-family: 'Inter';
  font-style: normal;
  font-weight: 700;
  height: 40px;
}
.monthly {
  border-radius: 12px 0px 0px 12px;
}

.yearly {
  margin: 0 0 0 -1px;
  border-radius: 0px 12px 12px 0px;
}

.per-month,
.per-year {
    color: var(--color-typeface-grayscale-200, #6d6e82);
  text-align: left;
  font-family: var(
    --typescale-paragraph-desktop-1m-font-family,
    "Inter-Regular",
    sans-serif
  );
  font-size: var(--typescale-paragraph-desktop-1m-font-size, 14px);
  line-height: var(--typescale-paragraph-desktop-1m-line-height, 24px);
  font-weight: var(--typescale-paragraph-desktop-1m-font-weight, 400);
  position: relative;
  align-self: stretch;
}

.toggle-button {
  display: inline-block;
}

.toggle-input {
  display: none !important;
}

.toggle-label {
  display: flex;
  align-items: center;
  cursor: pointer;
  width: 176px;
  margin-bottom: 40px;
}

.toggle-label > div {
  flex: 1;
  padding: 8px 24px;
  text-align: center;
}

.toggle-label > div:first-child {
  border-radius: 12px 0 0 12px;
}

.toggle-label > div:last-child {
  border-radius: 0 12px 12px 0;
  background-color: var(--color-neutral-grayscale-0, #FFF);
  color: var(--color-neutral-grayscale-300, #000814);
}

.toggle-input:checked + .toggle-label .monthly {
  background-color: var(--color-neutral-grayscale-300, #000814);
  color: var(--color-neutral-grayscale-0, #FFF);
}

.toggle-input:checked + .toggle-label .yearly {
  background-color: var(--color-neutral-grayscale-0, #FFF);
  color: var(--color-neutral-grayscale-300, #000814);
}

.toggle-input:not(:checked) + .toggle-label .monthly {
  background-color: var(--color-neutral-grayscale-0, #FFF);
  color: var(--color-neutral-grayscale-300, #000814);
}

.toggle-input:not(:checked) + .toggle-label .yearly {
  background-color: var(--color-neutral-grayscale-300, #000814);
  color: var(--color-neutral-grayscale-0, #FFF);
}

.toggle-input:checked + .toggle-label ~ .cards .plan .content .price .per-month,
.toggle-input:checked + .toggle-label ~ .cards .plan .content .price .monthly-price {
  display: inline-block;
}

.toggle-input:checked + .toggle-label ~ .cards .plan .content .price .per-year,
.toggle-input:checked + .toggle-label ~ .cards .plan .content .price .yearly-price {
  display: none;
}

.toggle-input:not(:checked) + .toggle-label ~ .cards .plan .content .price .per-month,
.toggle-input:not(:checked) + .toggle-label ~ .cards .plan .content .price .monthly-price {
  display: none;
}

.toggle-input:not(:checked) + .toggle-label ~ .cards .plan .content .price .per-year,
.toggle-input:not(:checked) + .toggle-label ~ .cards .plan .content .price .yearly-price {
  display: inline-block;
}


.loading,
.loading * {
  box-sizing: border-box;
}
.loading {
  display: flex;
  flex-direction: column;
  gap: 40px;
  align-items: flex-start;
  justify-content: flex-start;
  flex-shrink: 0;
  position: relative;
}
.texts {
  display: flex;
  flex-direction: column;
  gap: 16px;
  align-items: flex-start;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
.applying-optimizations {
  color: var(--color-typeface-grayscale-100, #E2E3E8);
  font-family: Inter;
  font-size: 24px;
  font-style: normal;
  font-weight: 600;
  line-height: 32px; 
  letter-spacing: -0.96px;
}
.woohoo-your-result-is-coming {
  color: var(--color-typeface-grayscale-300, #000814);
  font-family: Inter;
  font-size: 24px;
  font-style: normal;
  font-weight: 600;
  line-height: 32px;
  letter-spacing: -0.96px;
}
.progress {
  display: flex;
  flex-direction: column;
  gap: 16px;
  align-items: flex-start;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
.progress-bar-number {
  display: flex;
  flex-direction: column;
  gap: 16px;
  align-items: flex-start;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
._95 {
  color: var(--color-typeface-grayscale-300, #000814);
  font-family: Inter;
  font-size: 40px;
  font-style: normal;
  font-weight: 700;
  line-height: 48px;
  letter-spacing: -1.6px;
}
.loading2 {
  background: var(--color-neutral-grayscale-50, #f2f3f7);
  border-radius: 8px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  align-items: flex-start;
  justify-content: center;
  align-self: stretch;
  flex-shrink: 0;
  height: 8px;
  position: relative;
  overflow: hidden;
}
.this-may-take-a-while-between-5-and-10-minutes {
  color: var(--color-typeface-grayscale-300, #000814);
  font-family: Inter;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 24px; 
  letter-spacing: -0.64px;
}

progress {
  width: 100%;
  animation: progress-animation 20s linear infinite;
}

progress::-webkit-progress-value {
  background-color: #fee400;
}

progress::-webkit-progress-bar {
  background-color: #f0f0f0; 
}