:root {
  --default-font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
    Ubuntu, "Helvetica Neue", Helvetica, Arial, "PingFang SC",
    "Hiragino Sans GB", "Microsoft Yahei UI", "Microsoft Yahei",
    "Source Han Sans CN", sans-serif;
}

.main-container {
  overflow: hidden;
}

.main-container,
.main-container * {
  box-sizing: border-box;
}

input,
select,
textarea,
button {
  outline: 0;
}

.main-container {
  position: relative;
  width: 375px;
  height: 828px;
  margin: 0 auto;
  background: linear-gradient(180deg, #004cff, #00091e);
  overflow: hidden;
}
.ellipse {
  position: absolute;
  width: 895.876px;
  height: 669.924px;
  top: -280.793px;
  left: -245.585px;
  background: url(https://codia-f2c.s3.us-west-1.amazonaws.com/image/2025-08-26/MkP92q6UmL.png)
    no-repeat center;
  background-size: cover;
  z-index: 13;
  box-sizing: content-box;
}
.mask-group {
  position: absolute;
  width: 815px;
  height: 538px;
  top: -212px;
  left: -205px;
  z-index: 3;
  -webkit-mask-image: url('./assets/mask-en.svg');
  -webkit-mask-size: cover;
  background:linear-gradient(79deg, #1256ef, transparent);
}
.empty {
  position: absolute;
  width: 748.025px;
  height: 747.069px;
  top: 50px;
  left: 131px;
  background: url(https://codia-f2c.s3.us-west-1.amazonaws.com/image/2025-08-26/WKknqnyfK1.png)
    no-repeat center;
  background-size: cover;
  filter: blur(1.5px);
  z-index: 4;
  mix-blend-mode: overlay;
}
.rectangle {
  position: absolute;
  width: 375px;
  height: 323px;
  top: 212px;
  left: 205px;
  background: url(https://codia-f2c.s3.us-west-1.amazonaws.com/image/2025-08-26/THcCJrEF4F.png)
    no-repeat center;
  background-size: cover;
  z-index: 5;
}
.business-man {
  position: absolute;
  width: 319px;
  height: 478.62px;
  top: 212px;
  left: 338px;
  background: url(https://codia-f2c.s3.us-west-1.amazonaws.com/image/2025-08-26/hW9cJKDc9H.png)
    no-repeat center;
  background-size: cover;
  z-index: 7;
}
.rectangle-1 {
  position: absolute;
  width: 375px;
  height: 323px;
  top: 212px;
  left: 205px;
  background: url(https://codia-f2c.s3.us-west-1.amazonaws.com/image/2025-08-26/Gx2hcqLqZJ.png)
    no-repeat center;
  background-size: cover;
  z-index: 8;
}
.bitmap {
  position: absolute;
  width: 24.172px;
  height: 24px;
  top: 235px;
  left: 278.908px;
  background: url(https://codia-f2c.s3.us-west-1.amazonaws.com/image/2025-08-26/e0hSS5pNuN.png)
    no-repeat center;
  background-size: 100% 100%;
  z-index: 27;
}
.saas-whitelabel {
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  position: absolute;
  height: 15px;
  top: 242px;
  left: 334px;
  color: #ffffff;
  font-family: Inter, var(--default-font-family);
  font-size: 12px;
  font-weight: 400;
  line-height: 14.523px;
  text-align: left;
  white-space: nowrap;
  letter-spacing: 0.6px;
  z-index: 21;
}
.shape {
  position: absolute;
  width: 6.85%;
  height: 2.43%;
  top: 45.36%;
  left: 32.88%;
  background: url(https://codia-f2c.s3.us-west-1.amazonaws.com/image/2025-08-26/0MDnzTgyAy.png)
    no-repeat center;
  background-size: 100% 100%;
  z-index: 24;
}
.shape-2 {
  position: absolute;
  width: 5.8%;
  height: 2.37%;
  top: 45.39%;
  left: 27.36%;
  background: url(https://codia-f2c.s3.us-west-1.amazonaws.com/image/2025-08-26/4c5ecGttCD.png)
    no-repeat center;
  background-size: 100% 100%;
  z-index: 25;
}
.group {
  position: absolute;
  width: 224px;
  height: 81.834px;
  top: 281px;
  left: 223px;
  font-size: 0px;
  z-index: 9;
}
.igaming-empire {
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  position: relative;
  width: 224px;
  height: 50px;
  margin: 0 0 0 0;
  color: #ffffff;
  font-family: Inter, var(--default-font-family);
  font-size: 24px;
  font-weight: 800;
  line-height: 25px;
  text-align: left;
  text-overflow: initial;
  z-index: 10;
  overflow: hidden;
}
.own-boss {
  display: block;
  position: relative;
  height: 17px;
  margin: 5px 0 0 0;
  color: #ffffff;
  font-family: Inter, var(--default-font-family);
  font-size: 14px;
  font-weight: 600;
  line-height: 16.943px;
  text-align: left;
  white-space: nowrap;
  z-index: 12;
}
.vector {
  position: relative;
  width: 121.045px;
  height: 8.828px;
  margin: 0.99px 0 0 7.485px;
  background: url(https://codia-f2c.s3.us-west-1.amazonaws.com/image/2025-08-26/HsnxLU2Qji.png)
    no-repeat center;
  background-size: cover;
  z-index: 11;
}
.ph-dol {
  position: absolute;
  width: 127.277px;
  height: 87.809px;
  top: 297.411px;
  left: 486.436px;
  background: url(https://codia-f2c.s3.us-west-1.amazonaws.com/image/2025-08-26/9YxSwqLein.png)
    no-repeat center;
  background-size: cover;
  z-index: 6;
}
.ph-dol-3 {
  position: absolute;
  width: 60.408px;
  height: 62.382px;
  top: 352.202px;
  left: 373.883px;
  background: url(https://codia-f2c.s3.us-west-1.amazonaws.com/image/2025-08-26/f4gYKisVhp.png)
    no-repeat center;
  background-size: cover;
  z-index: 22;
}
.frame {
  position: absolute;
  width: 185px;
  height: 97px;
  top: 386px;
  left: 223px;
  background: rgba(255, 255, 255, 0.1);
  z-index: 15;
  overflow: hidden;
  border-radius: 6px;
  box-shadow: 0px 0px 2px 0px rgba(255, 255, 255, 0.88);
}
.frame-4 {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  flex-wrap: nowrap;
  gap: 4px;
  position: relative;
  width: 161px;
  margin: 7px 0 0 12px;
  z-index: 16;
}
.philippines-exclusive {
  align-self: stretch;
  flex-shrink: 0;
  flex-basis: auto;
  position: relative;
  height: 15px;
  color: #ffffff;
  font-family: Inter, var(--default-font-family);
  font-size: 12px;
  font-weight: 600;
  line-height: 14.523px;
  text-align: left;
  white-space: nowrap;
  z-index: 17;
}
.zero-setup-fee {
  align-self: stretch;
  flex-shrink: 0;
  flex-basis: auto;
  position: relative;
  height: 15px;
  color: #ffffff;
  font-family: Inter, var(--default-font-family);
  font-size: 12px;
  font-weight: 600;
  line-height: 14.523px;
  text-align: left;
  white-space: nowrap;
  z-index: 18;
}
.zero-maintenance-fee {
  align-self: stretch;
  flex-shrink: 0;
  flex-basis: auto;
  position: relative;
  height: 15px;
  color: #ffffff;
  font-family: Inter, var(--default-font-family);
  font-size: 12px;
  font-weight: 600;
  line-height: 14.523px;
  text-align: left;
  white-space: nowrap;
  z-index: 19;
}
.daily-ad-voucher {
  flex-shrink: 0;
  position: relative;
  width: 161px;
  font-family: Inter, var(--default-font-family);
  font-size: 12px;
  font-weight: 600;
  line-height: 14.523px;
  text-align: left;
  z-index: 20;
}
.daily-ad-voucher-5 {
  position: relative;
  color: #ffffff;
  font-family: Inter, var(--default-font-family);
  font-size: 12px;
  font-weight: 600;
  line-height: 14.523px;
  text-align: left;
}
.first-10-new-sites {
  position: relative;
  color: #ffffff;
  font-family: Inter, var(--default-font-family);
  font-size: 10px;
  font-weight: 400;
  line-height: 14.523px;
  text-align: left;
}
.empty-6 {
  position: relative;
  color: #ffffff;
  font-family: Inter, var(--default-font-family);
  font-size: 10px;
  font-weight: 400;
  line-height: 14.523px;
  text-align: left;
}
.cara-sukses-cepat {
  position: absolute;
  width: 1166px;
  height: 656px;
  top: 188px;
  left: -231px;
  background: url('./assets/cara-sukses-cepat.png')
    no-repeat center;
  background-size: cover;
  opacity: 0.15;
  filter: blur(2.5px);
  z-index: 1;
  mix-blend-mode: color-dodge;
}
.frame-7 {
  display: flex;
  align-items: center;
  flex-wrap: nowrap;
  gap: 16px;
  position: absolute;
  width: 336px;
  height: 44px;
  top: 303px;
  left: 50%;
  transform: translate(-49.85%, 0);
  z-index: 75;
}
.group-8 {
  flex-shrink: 0;
  position: relative;
  width: 160px;
  height: 44px;
  z-index: 76;
}
.rectangle-9 {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  background: #00b0f2;
  z-index: 77;
  border-radius: 11.086px;
  box-shadow: 0 1px 2px 0 #ffffff;
}
.frame-a {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: nowrap;
  gap: 16.5px;
  position: absolute;
  width: 119.93px;
  height: 22.392px;
  top: 11px;
  left: 50%;
  transform: translate(-51.77%, 0);
  z-index: 79;
}
.vector-b {
  flex-shrink: 0;
  position: relative;
  width: 27.055px;
  height: 22.392px;
  background: url('./assets/telegram.png')
    no-repeat center;
  background-size: cover;
  z-index: 80;
  backdrop-filter: blur(3.867px);
}
.telegram {
  flex-shrink: 0;
  flex-basis: auto;
  position: relative;
  height: 20px;
  color: #ffffff;
  font-family: Inter, var(--default-font-family);
  font-size: 16.5px;
  font-weight: 700;
  line-height: 19.969px;
  text-align: left;
  white-space: nowrap;
  z-index: 81;
}
.ellipse-c {
  position: absolute;
  width: 139.31px;
  height: 22px;
  top: 15.125px;
  left: 50%;
  background: url(https://codia-f2c.s3.us-west-1.amazonaws.com/image/2025-08-26/Dg6oqevprj.png)
    no-repeat center;
  background-size: cover;
  transform: translate(-50.37%, 0);
  filter: blur(5.156px);
  z-index: 78;
}
.group-d {
  flex-shrink: 0;
  position: relative;
  width: 160px;
  height: 44px;
  z-index: 82;
}
.rectangle-e {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  background: #03c502;
  z-index: 83;
  border-radius: 11.086px;
  box-shadow: 0 1px 2px 0 #ffffff;
}
.frame-f {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: nowrap;
  gap: 11px;
  position: absolute;
  width: 127.634px;
  height: 30.233px;
  top: 50%;
  left: 50%;
  transform: translate(-48.25%, -50.03%);
  z-index: 85;
}
.vector-10 {
  flex-shrink: 0;
  position: relative;
  width: 30.236px;
  height: 30.233px;
  background: url('./assets/whatsapp.png')
    no-repeat center;
  background-size: cover;
  z-index: 86;
  backdrop-filter: blur(3.867px);
}
.whatsapp {
  flex-shrink: 0;
  flex-basis: auto;
  position: relative;
  height: 20px;
  color: #ffffff;
  font-family: Inter, var(--default-font-family);
  font-size: 16.5px;
  font-weight: 700;
  line-height: 19.969px;
  text-align: left;
  white-space: nowrap;
  z-index: 87;
}
.ellipse-11 {
  position: absolute;
  width: 139.31px;
  height: 22px;
  top: 15.125px;
  left: 50%;
  background: url(https://codia-f2c.s3.us-west-1.amazonaws.com/image/2025-08-26/O1vr5kXiUW.png)
    no-repeat center;
  background-size: cover;
  transform: translate(-50.37%, 0);
  filter: blur(5.156px);
  z-index: 84;
}
.number-01 {
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  position: absolute;
  height: 48px;
  top: 360px;
  left: 229px;
  font-family: Inter, var(--default-font-family);
  font-size: 40px;
  font-weight: 700;
  line-height: 48px;
  text-align: left;
  white-space: nowrap;
  background: linear-gradient(180deg, #ffffff, rgba(255, 255, 255, 0));
  opacity: 0.5;
  z-index: 47;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  mix-blend-mode: color-dodge;
}
.frame-12 {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  flex-wrap: nowrap;
  gap: 24px;
  position: absolute;
  width: 333px;
  height: 80px;
  top: 382px;
  left: 50%;
  transform: translate(-49.85%, 0);
  z-index: 29;
}
.frame-13 {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: nowrap;
  flex-shrink: 0;
  gap: 16px;
  position: relative;
  width: 233px;
  height: 12px;
  padding: 0 12px 0 12px;
  border-left: 2px solid #ffffff;
  z-index: 30;
}
.why-choose-newboss {
  flex-shrink: 0;
  flex-basis: auto;
  position: relative;
  height: 22px;
  color: #ffffff;
  font-family: Inter, var(--default-font-family);
  font-size: 18px;
  font-weight: 700;
  line-height: 21.784px;
  text-align: left;
  white-space: nowrap;
  z-index: 31;
}
.frame-14 {
  display: flex;
  align-items: center;
  align-self: stretch;
  flex-wrap: nowrap;
  flex-shrink: 0;
  gap: 24px;
  position: relative;
  z-index: 32;
}
.frame-15 {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  flex-wrap: nowrap;
  flex-shrink: 0;
  gap: 12px;
  position: relative;
  width: 141px;
  z-index: 33;
}
.frame-16 {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: nowrap;
  flex-shrink: 0;
  gap: 8px;
  position: relative;
  width: 141px;
  z-index: 34;
}
.layer {
  flex-shrink: 0;
  position: relative;
  width: 16px;
  height: 16px;
  background: url(https://codia-f2c.s3.us-west-1.amazonaws.com/image/2025-08-26/kuaDfwYiLc.png)
    no-repeat center;
  background-size: cover;
  z-index: 35;
  overflow: hidden;
}
.launch-in-minutes {
  flex-shrink: 0;
  flex-basis: auto;
  position: relative;
  height: 15px;
  color: #ffffff;
  font-family: Inter, var(--default-font-family);
  font-size: 12px;
  font-weight: 600;
  line-height: 14.523px;
  text-align: left;
  white-space: nowrap;
  z-index: 36;
}
.frame-17 {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: nowrap;
  flex-shrink: 0;
  gap: 8px;
  position: relative;
  width: 118px;
  z-index: 37;
}
.frame-18 {
  flex-shrink: 0;
  position: relative;
  width: 16px;
  height: 16px;
  background: url(https://codia-f2c.s3.us-west-1.amazonaws.com/image/2025-08-26/Mv8bp0QPLf.png)
    no-repeat center;
  background-size: cover;
  z-index: 38;
  overflow: hidden;
}
.games {
  flex-shrink: 0;
  flex-basis: auto;
  position: relative;
  height: 15px;
  color: #ffffff;
  font-family: Inter, var(--default-font-family);
  font-size: 12px;
  font-weight: 600;
  line-height: 14.523px;
  text-align: left;
  white-space: nowrap;
  z-index: 39;
}
.frame-19 {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  flex-wrap: nowrap;
  flex-shrink: 0;
  gap: 12px;
  position: relative;
  width: 168px;
  z-index: 40;
}
.frame-1a {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: nowrap;
  flex-shrink: 0;
  gap: 8px;
  position: relative;
  width: 158px;
  z-index: 41;
}
.layer-1b {
  flex-shrink: 0;
  position: relative;
  width: 16px;
  height: 16px;
  background: url(https://codia-f2c.s3.us-west-1.amazonaws.com/image/2025-08-26/kriJGiXQDq.png)
    no-repeat center;
  background-size: cover;
  z-index: 42;
  overflow: hidden;
}
.drag-drop {
  flex-shrink: 0;
  flex-basis: auto;
  position: relative;
  height: 15px;
  color: #ffffff;
  font-family: Inter, var(--default-font-family);
  font-size: 12px;
  font-weight: 600;
  line-height: 14.523px;
  text-align: left;
  white-space: nowrap;
  z-index: 43;
}
.frame-1c {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: nowrap;
  flex-shrink: 0;
  gap: 8px;
  position: relative;
  width: 168px;
  z-index: 44;
}
.layer-1d {
  flex-shrink: 0;
  position: relative;
  width: 16px;
  height: 16px;
  background: url(https://codia-f2c.s3.us-west-1.amazonaws.com/image/2025-08-26/2CGc8wbxrK.png)
    no-repeat center;
  background-size: cover;
  z-index: 45;
  overflow: hidden;
}
.payment-channels {
  flex-shrink: 0;
  flex-basis: auto;
  position: relative;
  height: 15px;
  color: #ffffff;
  font-family: Inter, var(--default-font-family);
  font-size: 12px;
  font-weight: 600;
  line-height: 14.523px;
  text-align: left;
  white-space: nowrap;
  z-index: 46;
}
.rectangle-1e {
  position: absolute;
  width: 375px;
  height: 431px;
  bottom: -48px;
  left: 50%;
  background: url(https://codia-f2c.s3.us-west-1.amazonaws.com/image/2025-08-26/omopjANGp9.png)
    no-repeat center;
  background-size: cover;
  transform: translate(-50%, 0);
}
.image {
  position: absolute;
  width: 82.587px;
  height: 82.587px;
  top: 463px;
  left: 214px;
  background: url(https://codia-f2c.s3.us-west-1.amazonaws.com/image/2025-08-26/XguxMfeUDU.png)
    no-repeat center;
  background-size: cover;
  z-index: 73;
}
.num-02 {
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  position: absolute;
  height: 48px;
  top: 480px;
  left: 137px;
  font-family: Inter, var(--default-font-family);
  font-size: 40px;
  font-weight: 700;
  line-height: 48px;
  text-align: left;
  white-space: nowrap;
  background: linear-gradient(180deg, #ffffff, rgba(255, 255, 255, 0));
  opacity: 0.5;
  z-index: 51;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  mix-blend-mode: color-dodge;
}
.image-1f {
  position: absolute;
  width: 73.013px;
  height: 73.013px;
  top: 495px;
  left: 284px;
  background: url(https://codia-f2c.s3.us-west-1.amazonaws.com/image/2025-08-26/wMvSTUNuG0.png)
    no-repeat center;
  background-size: cover;
  z-index: 74;
}
.frame-20 {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: nowrap;
  gap: 16px;
  position: absolute;
  width: 138px;
  height: 12px;
  top: 502px;
  left: 23px;
  padding: 0 12px 0 12px;
  border-left: 2px solid #ffffff;
  z-index: 49;
}
.services {
  flex-shrink: 0;
  flex-basis: auto;
  position: relative;
  height: 22px;
  color: #ffffff;
  font-family: Inter, var(--default-font-family);
  font-size: 18px;
  font-weight: 700;
  line-height: 21.784px;
  text-align: left;
  white-space: nowrap;
  z-index: 50;
}
.frame-21 {
  position: absolute;
  width: 329px;
  height: 133px;
  top: 535px;
  left: 23px;
  background: rgba(255, 255, 255, 0.1);
  z-index: 53;
  overflow: hidden;
  border-radius: 6px;
  box-shadow: 0px 0px 2px 0px rgba(255, 255, 255, 0.88);
}
.frame-22 {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  flex-wrap: nowrap;
  gap: 8px;
  position: relative;
  width: 287px;
  margin: 13px 0 0 21px;
  z-index: 54;
}
.point::before {
  content:".";
  display: inline-block;
  width: 4px;
  height: 4px;
  overflow: hidden;
  line-height: 4px;
  background: #ffffff;
  border-radius: 50%;
  margin-right: 6px;
}
.no-hidden-fees {
  align-self: stretch;
  flex-shrink: 0;
  flex-basis: auto;
  position: relative;
  min-width: 0;
  height: 15px;
  color: #ffffff;
  font-family: Inter, var(--default-font-family);
  font-size: 12px;
  font-weight: 600;
  line-height: 14.523px;
  text-align: left;
  white-space: nowrap;
  z-index: 55;
}
.customer-support {
  align-self: stretch;
  flex-shrink: 0;
  flex-basis: auto;
  position: relative;
  min-width: 0;
  height: 15px;
  color: #ffffff;
  font-family: Inter, var(--default-font-family);
  font-size: 12px;
  font-weight: 600;
  line-height: 14.523px;
  text-align: left;
  white-space: nowrap;
  z-index: 56;
}
.expert-guidance {
  align-self: stretch;
  flex-shrink: 0;
  flex-basis: auto;
  position: relative;
  min-width: 0;
  height: 15px;
  color: #ffffff;
  font-family: Inter, var(--default-font-family);
  font-size: 12px;
  font-weight: 600;
  line-height: 14.523px;
  text-align: left;
  white-space: nowrap;
  z-index: 57;
}
.free-image-library {
  align-self: stretch;
  flex-shrink: 0;
  flex-basis: auto;
  position: relative;
  min-width: 0;
  height: 15px;
  color: #ffffff;
  font-family: Inter, var(--default-font-family);
  font-size: 12px;
  font-weight: 600;
  line-height: 14.523px;
  text-align: left;
  white-space: nowrap;
  z-index: 58;
}
.extra-agent-rebates {
  align-self: stretch;
  flex-shrink: 0;
  flex-basis: auto;
  position: relative;
  min-width: 0;
  height: 15px;
  color: #ffffff;
  font-family: Inter, var(--default-font-family);
  font-size: 12px;
  font-weight: 600;
  line-height: 14.523px;
  text-align: left;
  white-space: nowrap;
  z-index: 59;
}
.rocket {
  position: absolute;
  width: 251.602px;
  height: 256.465px;
  top: 542px;
  left: 188px;
  background: url(https://codia-f2c.s3.us-west-1.amazonaws.com/image/2025-08-26/HU3oHpkSEL.png)
    no-repeat center;
  background-size: cover;
  z-index: 60;
}
.frame-23 {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  flex-wrap: nowrap;
  position: absolute;
  width: 337px;
  height: 96px;
  top: 701px;
  left: 22px;
  z-index: 61;
}
.frame-24 {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  flex-wrap: nowrap;
  flex-shrink: 0;
  gap: 8px;
  position: relative;
  width: 170px;
  z-index: 62;
}
.group-25 {
  flex-shrink: 0;
  position: relative;
  width: 167px;
  height: 67px;
  font-size: 0px;
  z-index: 63;
}
.free-setup-maintenance {
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  position: relative;
  width: 167px;
  height: 48px;
  margin: 0 0 0 0;
  color: #ffffff;
  font-family: Inter, var(--default-font-family);
  font-size: 20px;
  font-weight: 600;
  line-height: 24.205px;
  text-align: left;
  z-index: 64;
}
.only-in-september {
  display: block;
  position: relative;
  height: 17px;
  margin: 2px 0 0 0;
  color: #ffffff;
  font-family: Inter, var(--default-font-family);
  font-size: 14px;
  font-weight: 600;
  line-height: 16.943px;
  text-align: left;
  white-space: nowrap;
  z-index: 65;
}
.frame-26 {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: nowrap;
  flex-shrink: 0;
  position: relative;
  width: 140px;
  padding: 3px 12px 3px 12px;
  background: linear-gradient(180deg, #ffffff, #a1d0ff);
  z-index: 66;
  border-radius: 100px;
}
.start-your-business {
  flex-shrink: 0;
  flex-basis: auto;
  position: relative;
  height: 15px;
  color: #00184e;
  font-family: Inter, var(--default-font-family);
  font-size: 12px;
  font-weight: 700;
  line-height: 14.523px;
  text-align: left;
  white-space: nowrap;
  z-index: 67;
}
.frame-27 {
  display: flex;
  align-items: center;
  flex-wrap: nowrap;
  flex-shrink: 0;
  gap: 11px;
  position: relative;
  width: 123px;
  z-index: 68;
}
.tele-icon {
  flex-shrink: 0;
  position: relative;
  width: 56px;
  height: 56px;
  z-index: 69;
  overflow: hidden;
  
}
.telegram-icon{
  position: absolute;
  top: 0;
  left: -1px;
  right: 0;
  bottom: 0;
  z-index: 71;
  width: 100%;
  height: 100%;
  background: url('./assets/telegram.png') no-repeat center;
  background-size: 80% 80%;
}
.group-28 {
  position: relative;
  width: 50.167px;
  height: 50.167px;
  margin: 2.917px 0 0 2.917px;
  background: #00b0f2;
  border-radius: 15px;
  background-size: 100% 100%;
  z-index: 70;
}
.whatsapp-icon {
  flex-shrink: 0;
  position: relative;
  width: 56px;
  height: 56px;
  z-index: 71;
  overflow: hidden;
}
.whatsapp-icons{
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: url('./assets/whatsapp.png') no-repeat center;
  background-size: 80% 80%;
  z-index: 72;
}
.group-29 {
  position: relative;
  width: 50.167px;
  height: 50.167px;
  margin: 2.917px 0 0 2.917px;
  background: #03c502;
  border-radius: 15px;
  background-size: 100% 100%;
  z-index: 72;
}

/* 移动端响应式适配 */
@media (max-width: 768px) {
  body {
    margin: 0;
    padding: 0;
  }
  .main-container {
    width: 100%;
    height: 100vh;
    height: auto;
    box-sizing: border-box;
    overflow-y: auto;
    overflow-x: hidden;
  }
  .container{
    width: 100%;
    min-height: 110vh;
    height: auto;
    overflow-x: hidden;
  }
  .rectangle {
    width: 100%;
  }
  .rectangle-1e{
    width: 100%;
    transform: translate(-50%, 0);
  }
}

@media (max-width: 480px) {
  .main-container {
    height: 100vh;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch; /* iOS 惯性滚动支持 */
  }
  .container{
    min-height: 110vh;
    height: auto;
    overflow-x: hidden;
  }
  .rectangle-1e{
    transform: translate(-50%, 5%);
  }
}
@media (max-width: 375px) {
  .container{
    min-height: 120vh;
    height: auto;
    overflow-x: hidden;
  }
  .rectangle-1e{
    transform: translate(-50%, 53%);
  }
}

/* ========= 呼吸动画关键帧 ========= */
@keyframes breathing {
  0% {
    transform: scale(1);
    box-shadow: 0 0 0 rgba(0, 0, 0, 0);
  }
  50% {
    transform: scale(1.03);
    box-shadow: 0 0 8px rgba(0, 0, 0, 0.15);
  }
  100% {
    transform: scale(1);
    box-shadow: 0 0 0 rgba(0, 0, 0, 0);
  }
}

/* ========= 通用按钮样式 ========= */
.frame-26,
.frame-7 .group-8,
.frame-7 .group-d {
  position: relative;
  cursor: pointer;
  overflow: hidden;
  transition: transform 0.25s ease, box-shadow 0.25s ease, background 0.3s ease;
  will-change: transform, box-shadow;

  /* 呼吸动画 */
  animation-name: breathing;
  -webkit-animation-name: breathing;
  animation-duration: 3s;
  -webkit-animation-duration: 3s;
  animation-timing-function: ease-in-out;
  -webkit-animation-timing-function: ease-in-out;
  animation-iteration-count: infinite;
  -webkit-animation-iteration-count: infinite;
}

/* ========= 呼吸动画交错延迟 ========= */
.frame-26 {
  animation-delay: 0s;
  -webkit-animation-delay: 0s;
}
.frame-7 .group-8 {
  animation-delay: 1.5s;
  -webkit-animation-delay: 1.5s;
}
.frame-7 .group-d {
  animation-delay: 0.75s;
  -webkit-animation-delay: 0.75s;
}

/* ========= 悬停上浮效果 ========= */
.frame-26:hover,
.frame-7 .group-8:hover,
.frame-7 .group-d:hover {
  transform: translateY(-3px);
  box-shadow: 0 6px 16px rgba(0, 0, 0, 0.25);
  animation-play-state: paused;
  -webkit-animation-play-state: paused;
}

/* ========= 点击按下效果 ========= */
.frame-26:active,
.frame-7 .group-8:active,
.frame-7 .group-d:active {
  transform: translateY(0);
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2);
  transition: transform 0.1s ease, box-shadow 0.1s ease;
  animation-play-state: paused;
  -webkit-animation-play-state: paused;
}

/* ========= 波纹点击动画 ========= */
.frame-26::before,
.frame-7 .group-8::before,
.frame-7 .group-d::before {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  width: 0;
  height: 0;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.35);
  transform: translate(-50%, -50%);
  opacity: 0;
  transition: width 0.5s ease, height 0.5s ease, opacity 0.6s ease;
}

.frame-26:active::before,
.frame-7 .group-8:active::before,
.frame-7 .group-d:active::before {
  width: 220px;
  height: 220px;
  opacity: 1;
  transition: width 0s, height 0s, opacity 0.6s ease;
}

/* ========= 特定按钮 hover 背景增强 ========= */
.frame-26:hover {
  background: linear-gradient(180deg, #ffffff, #dceeff);
}
.frame-7 .group-8:hover .rectangle-9 {
  background: #00bdf0;
  box-shadow: 0 0 12px rgba(0, 176, 242, 0.6);
}
.frame-7 .group-d:hover .rectangle-e {
  background: #03c702;
  box-shadow: 0 0 12px rgba(3, 197, 2, 0.6);
}


