.div,
.div:hover {
  background-color: var(--color-white);
  max-width: 1440px;
  width: 100%;
  height: auto;
  gap: var(--gap-0);
  line-height: normal;
  letter-spacing: normal;
}

/* Engineering safeguards: persistent navigation and decorative overflow. */
.div {
  overflow-x: clip !important;
}
.header,
.header:hover {
  position: fixed !important;
  top: 0 !important;
  right: 0 !important;
  left: 0 !important;
  z-index: 999 !important;
}
.parent::before {
  content: "";
  display: block;
  width: 100%;
  height: var(--height-98);
  flex-shrink: 0;
}
@media screen and (max-width: 750px) {
  .parent::before {
    height: 154px !important;
  }
}
.div {
  position: relative;
  overflow: hidden;
  display: flex;
  align-items: flex-start;
  margin: 0 auto;
}
.div:hover {
  flex-direction: row;
  justify-content: flex-start;
}
.parent {
  flex: 1;
  flex-direction: column;
  gap: var(--gap-72);
  max-width: 100%;
  height: auto;
}
.div:hover,
.header,
.parent,
.parent:hover {
  display: flex;
  align-items: flex-start;
}
.parent:hover {
  flex: 1;
  height: auto;
  flex-direction: column;
  gap: var(--gap-72);
  justify-content: flex-start;
  max-width: 100%;
}
.header {
  align-self: stretch;
  height: 98px;
  background-color: var(--color-white);
  justify-content: center;
  padding: var(--padding-30) 120px;
  box-sizing: border-box;
  top: 0;
  z-index: 99;
  position: sticky;
  width: 100%;
  text-align: center;
  font-size: var(--fs-20);
  color: var(--color-royalblue);
  font-family: var(--font-noto-sans-sc);
}
.group,
.header,
.header:hover {
  flex-direction: column;
  gap: var(--gap-24);
}
.header:hover {
  background-color: var(--color-white);
  display: flex;
  align-self: stretch;
  width: 100%;
  height: 98px;
  align-items: flex-start;
  justify-content: center;
  padding: var(--padding-30) 120px;
  box-sizing: border-box;
  top: 0;
  z-index: 99;
  position: sticky;
}
.group {
  height: 44px;
  flex-shrink: 0;
}
.div2,
.div2:hover,
.group,
.group:hover {
  display: flex;
  width: var(--width-1204);
  align-items: center;
}
.group:hover {
  height: 44px;
  flex-direction: column;
  gap: var(--gap-24);
  justify-content: flex-start;
}
.div2,
.div2:hover {
  height: auto;
  gap: 131.09px;
  justify-content: space-between;
}
.div2 {
  flex-shrink: 0;
}
.div2:hover {
  flex-direction: row;
}
.logo-icon {
  position: relative;
}
.logo-icon,
.logo-icon:hover {
  display: block;
  width: 215.6px;
  height: 21px;
}
.ocontact-,
.ocontact-:hover {
  height: var(--height-20);
  width: var(--width-72);
  display: flex;
  align-items: flex-start;
  padding: var(--padding-0) var(--padding-16);
  box-sizing: border-box;
  gap: var(--gap-0);
}
.ocontact-:hover {
  flex-direction: row;
  justify-content: flex-start;
}
.ocontact,
.ocontact:hover {
  font-weight: 500;
  line-height: 122%;
  display: block;
}
.ocontact {
  margin: 0;
  height: var(--height-24);
  width: var(--width-40);
  position: relative;
  font-size: inherit;
  font-family: inherit;
  flex-shrink: 0;
}
.ocontact:hover {
  font-family: var(--font-noto-sans-sc);
  font-size: var(--fs-20);
  text-align: center;
  color: var(--color-royalblue);
}
.ocontact-2,
.ocontact-2:hover {
  display: flex;
  width: var(--width-72);
  height: var(--height-20);
  gap: var(--gap-0);
  align-items: flex-start;
  padding: var(--padding-0) var(--padding-16);
  box-sizing: border-box;
}
.ocontact-2 {
  cursor: pointer;
  color: var(--color-gray-100);
}
.ocontact-2:hover {
  flex-direction: row;
  justify-content: flex-start;
}
.ocontact2,
.ocontact2:hover {
  font-weight: 500;
  line-height: 122%;
  display: block;
}
.ocontact2 {
  margin: 0;
  height: var(--height-24);
  width: var(--width-40);
  position: relative;
  font-size: inherit;
  font-family: inherit;
  flex-shrink: 0;
}
.ocontact2:hover {
  font-family: var(--font-noto-sans-sc);
  font-size: var(--fs-20);
  text-align: center;
  color: var(--color-gray-100);
}
.ocontact-3,
.ocontact-3:hover {
  display: flex;
  width: var(--width-72);
  height: var(--height-20);
  gap: var(--gap-0);
  align-items: flex-start;
}
.ocontact-3 {
  cursor: pointer;
  color: var(--color-gray-100);
}
.ocontact-3:hover {
  flex-direction: row;
  justify-content: flex-start;
}
.ocontact3,
.ocontact3:hover {
  font-weight: 500;
  line-height: 122%;
  display: block;
  flex-shrink: 0;
}
.ocontact3 {
  margin: 0;
  height: var(--height-24);
  width: 80px;
  position: relative;
  font-size: inherit;
  font-family: inherit;
}
.ocontact3:hover {
  font-family: var(--font-noto-sans-sc);
  font-size: var(--fs-20);
  text-align: center;
  color: var(--color-gray-100);
}
.button {
  height: 44px;
  width: 248px;
  gap: var(--gap-8);
  text-align: left;
  font-size: var(--fs-18);
}
.button,
.button:hover,
.div3,
.div3:hover {
  display: flex;
  align-items: flex-start;
}
.button:hover {
  width: 248px;
  height: 44px;
  flex-direction: row;
  gap: var(--gap-8);
  justify-content: flex-start;
}
.div3,
.div3:hover {
  width: auto;
  align-self: unset;
  height: auto;
  gap: var(--gap-0);
}
.div3:hover {
  flex-direction: row;
  justify-content: flex-start;
}
.button-text {
  backdrop-filter: blur(12px);
  border-radius: var(--br-8);
  background-color: var(--color-white);
  border: 1px solid var(--color-lightsteelblue);
  overflow: hidden;
  padding: var(--padding-12) var(--padding-16);
  height: auto;
}
.button-text,
.button-text:hover,
.text-wrapper,
.text-wrapper:hover {
  display: flex;
  width: auto;
  align-self: unset;
  gap: var(--gap-0);
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
}
.button-text:hover {
  background-color: var(--color-white);
  height: auto;
  flex-direction: row;
  border-radius: var(--br-8);
  padding: var(--padding-12) var(--padding-16);
  border: 1px solid var(--color-lightsteelblue);
  backdrop-filter: blur(12px);
}
.text-wrapper,
.text-wrapper:hover {
  height: var(--height-20);
  padding: var(--padding-0) var(--padding-8);
}
.text-wrapper {
  overflow: hidden;
  flex-shrink: 0;
}
.text-wrapper:hover {
  flex-direction: row;
}
.text {
  position: relative;
  line-height: 126%;
  font-weight: 500;
  flex-shrink: 0;
}
.demo {
  cursor: pointer;
  border: 0;
  padding: 0;
  background-color: transparent;
  align-items: flex-start;
}
.button-text2,
.button-text2:hover,
.demo,
.demo:hover {
  display: flex;
  width: auto;
  align-self: unset;
  height: auto;
  gap: var(--gap-0);
}
.demo:hover {
  flex-direction: row;
  align-items: flex-start;
  justify-content: flex-start;
}
.button-text2,
.button-text2:hover {
  background-color: var(--color-royalblue);
  align-items: center;
  justify-content: center;
  border-radius: var(--br-8);
  padding: var(--padding-12) var(--padding-16);
  box-sizing: border-box;
}
.button-text2 {
  overflow: hidden;
}
.button-text2:hover {
  flex-direction: row;
}
.frame-child,
.text2 {
  position: relative;
  flex-shrink: 0;
}
.text2 {
  font-size: var(--fs-18);
  line-height: 126%;
  font-weight: 500;
  font-family: var(--font-noto-sans-sc);
  color: var(--color-white);
  text-align: left;
}
.frame-child {
  width: var(--width-1204);
  height: 1px;
  max-height: 100%;
}
.frame-parent {
  align-self: stretch;
  align-items: center;
  justify-content: center;
  width: 100%;
  text-align: left;
  font-size: var(--fs-64);
  color: var(--color-gray-100);
  font-family: var(--font-noto-sans-sc);
}
.frame-group,
.frame-group:hover,
.frame-parent,
.frame-parent:hover {
  display: flex;
  flex-direction: column;
  gap: 120px;
  max-width: 100%;
  height: auto;
}
.frame-parent:hover {
  align-self: stretch;
  width: 100%;
  align-items: center;
  justify-content: center;
}
.frame-group,
.frame-group:hover {
  width: var(--width-1200);
  align-items: flex-start;
}
.frame-group:hover {
  justify-content: flex-start;
}
.frame-container {
  height: 714px;
  justify-content: center;
  gap: var(--gap-56);
  text-align: center;
  font-size: var(--fs-18);
}
.frame-container,
.frame-container:hover,
.logo-parent,
.logo-parent:hover {
  align-self: stretch;
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
}
.frame-container:hover {
  height: 714px;
  gap: var(--gap-56);
  justify-content: center;
}
.logo-parent,
.logo-parent:hover {
  height: 587px;
  gap: var(--gap-24);
}
.logo-parent:hover {
  justify-content: flex-start;
}
.logo-icon2 {
  position: relative;
}
.logo-icon2,
.logo-icon2:hover {
  display: block;
  width: 138px;
  height: 114px;
  gap: var(--gap-0);
}
.ai,
.ai:hover {
  background-color: var(--color-white);
  display: flex;
  width: 340px;
  height: auto;
  gap: 9px;
  align-items: center;
  border-radius: 23.5px;
  padding: 7px var(--padding-12) 7px var(--padding-14);
  box-sizing: border-box;
  border: 1.2px solid var(--color-lavender);
  box-shadow: var(--shadow-drop);
}
.ai {
  color: var(--color-dimgray);
}
.ai:hover {
  flex-direction: row;
  justify-content: flex-start;
}
.ai2,
.icon {
  position: relative;
}
.icon {
  height: 23.5px;
  width: 23.5px;
  object-fit: cover;
}
.ai2 {
  width: 279px;
  line-height: 160%;
  font-weight: 500;
  display: inline-block;
  flex-shrink: 0;
}
.ai3,
.he,
.t {
  text-transform: uppercase;
  line-height: 160%;
}
.ai3,
.he {
  text-transform: lowercase;
}
.ai3 {
  text-transform: capitalize;
}
.ocontact4 {
  align-self: stretch;
  position: relative;
  font-size: 72px;
}
.oc,
.ocontact4,
.ocontact5 {
  line-height: 150%;
}
.ocontact5 {
  font-weight: 900;
}
.oc {
  color: var(--color-royalblue);
}
.b,
.ocontact6,
.ontact {
  line-height: 150%;
}
.b {
  font-size: 56px;
  color: var(--color-royalblue);
}
.ocontact6 {
  align-self: stretch;
  position: relative;
  font-size: 28px;
  text-align: justify;
  opacity: 0.8;
}
.div4,
.div4:hover {
  display: flex;
  align-items: center;
  gap: var(--gap-56);
  width: auto;
  align-self: unset;
  height: auto;
}
.div4:hover {
  flex-direction: row;
  justify-content: flex-start;
}
.button2,
.button2:hover {
  display: flex;
  gap: var(--gap-0);
  align-items: flex-start;
  padding: 21px var(--padding-72) var(--padding-20);
  box-sizing: border-box;
}
.button2 {
  cursor: pointer;
  border: 0;
  background-color: transparent;
  height: var(--height-70);
  width: var(--width-240);
  position: relative;
  isolation: isolate;
}
.button2:hover {
  flex-direction: row;
  justify-content: flex-start;
}
.div5 {
  position: absolute;
  margin: 0 !important;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 0;
}
.button2:hover,
.div5,
.div5:hover {
  width: var(--width-240);
  height: var(--height-70);
}
.div5,
.div5:hover {
  background-color: var(--color-royalblue);
  display: block;
  border-radius: var(--br-16);
}
.div5,
.div6,
.div7 {
  flex-shrink: 0;
}
.div6 {
  height: 29px;
  width: 96px;
  position: relative;
  font-size: var(--fs-24);
  font-weight: 500;
  font-family: var(--font-noto-sans-sc);
  color: var(--color-white);
  text-align: left;
  display: inline-block;
  z-index: 1;
}
.div7 {
  position: absolute;
  margin: 0 !important;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 0;
}
.div7,
.div7:hover {
  display: block;
  width: var(--width-240);
  height: var(--height-70);
  border-radius: var(--br-16);
  border: 2px solid var(--color-royalblue);
  box-sizing: border-box;
}
.demo3,
.icon2 {
  position: relative;
}
.demo3 {
  height: 29px;
  width: 96px;
  font-size: var(--fs-24);
  font-weight: 500;
  font-family: var(--font-noto-sans-sc);
  color: var(--color-royalblue);
  text-align: center;
  display: inline-block;
  z-index: 1;
  flex-shrink: 0;
}
.icon2 {
  max-width: 100%;
  overflow: hidden;
  max-height: 100%;
  object-fit: cover;
}
.icon2,
.icon2:hover {
  display: block;
  align-self: stretch;
  width: 100%;
  height: 1185px;
}
.icon3,
.icon3:hover {
  display: block;
  height: 1135px;
}
.icon3 {
  position: relative;
  overflow: hidden;
  max-height: 100%;
  object-fit: cover;
}
.icon3:hover {
  align-self: stretch;
  width: 100%;
}
.frame-wrapper,
.frame-wrapper:hover,
.icon3 {
  align-self: stretch;
  max-width: 100%;
  width: 100%;
}
.frame-wrapper,
.frame-wrapper:hover {
  height: 772px;
  display: flex;
  align-items: flex-start;
  gap: var(--gap-0);
}
.frame-wrapper:hover {
  flex-direction: row;
  justify-content: flex-start;
}
.fast-response-parent,
.fast-response-parent:hover {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--gap-56);
  max-width: 100%;
  width: auto;
  align-self: unset;
  height: auto;
}
.fast-response-parent:hover {
  justify-content: flex-start;
}
.fast-response,
.fast-response:hover {
  font-weight: 700;
  line-height: 120%;
  display: block;
  width: var(--width-1200);
  height: var(--height-140);
}
.fast-response {
  margin: 0;
  position: relative;
  font-size: inherit;
  font-family: inherit;
  align-items: center;
}
.fast-response:hover {
  font-family: var(--font-noto-sans-sc);
  font-size: var(--fs-64);
  text-align: left;
}
.fast-response-txt-container {
  width: 100%;
}
.span {
  color: var(--color-royalblue);
}
.fast,
.span {
  line-height: 120%;
}
.container,
.frame-div {
  max-width: 100%;
  height: auto;
}
.frame-div,
.frame-div:hover {
  display: flex;
  align-items: center;
  gap: var(--gap-60);
  width: auto;
  align-self: unset;
}
.frame-div:hover {
  height: auto;
  flex-direction: row;
  justify-content: flex-start;
  max-width: 100%;
}
.container {
  width: var(--width-570);
  gap: var(--gap-28);
  text-align: left;
  font-size: var(--fs-40);
  color: var(--color-gray-100);
  font-family: var(--font-noto-sans-sc);
}
.container,
.container:hover,
.div8 {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}
.container:hover {
  width: var(--width-570);
  height: auto;
  gap: var(--gap-28);
  justify-content: flex-start;
  max-width: 100%;
}
.div8 {
  height: var(--height-50);
  justify-content: space-between;
  gap: var(--gap-14);
}
.div8,
.div8:hover,
.h1,
.h1:hover {
  align-self: stretch;
  width: 100%;
}
.div8:hover {
  display: flex;
  height: var(--height-50);
  flex-direction: column;
  gap: var(--gap-14);
  align-items: flex-start;
  justify-content: space-between;
}
.h1,
.h1:hover {
  font-weight: 500;
  line-height: 140%;
  display: block;
  height: auto;
}
.h1 {
  margin: 0;
  position: relative;
  font-size: inherit;
  font-family: inherit;
}
.h1:hover {
  font-family: var(--font-noto-sans-sc);
  font-size: var(--fs-40);
  text-align: left;
  color: var(--color-gray-100);
}
.divw-node-f2f23147-8228-9554-,
.divw-node-f2f23147-8228-9554-:hover {
  display: flex;
  align-self: stretch;
  width: 100%;
  height: var(--height-20);
  gap: var(--gap-8);
  align-items: center;
}
.divw-node-f2f23147-8228-9554- {
  font-size: var(--fs-24);
}
.divw-node-f2f23147-8228-9554-:hover {
  flex-direction: row;
  justify-content: flex-start;
}
.cb4df9afa8cfe86eea257-checkcir {
  height: var(--height-22);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: var(--gap-0);
}
.cb4df9afa8cfe86eea257-checkcir,
.cb4df9afa8cfe86eea257-checkcir:hover {
  width: auto;
  align-self: unset;
  max-width: var(--max-w-267_61);
  max-height: var(--max-h-267_61);
}
.cb4df9afa8cfe86eea257-checkcir2 {
  overflow: hidden;
  flex-shrink: 0;
}
.cb4df9afa8cfe86eea257-checkcir2,
.cb4df9afa8cfe86eea257-checkcir2:hover,
.cb4df9afa8cfe86eea257-checkcir:hover {
  display: flex;
  height: var(--height-22);
  flex-direction: column;
  gap: var(--gap-0);
  align-items: center;
  justify-content: center;
}
.cb4df9afa8cfe86eea257-checkcir2,
.cb4df9afa8cfe86eea257-checkcir2:hover {
  width: var(--width-22);
}
.cb4df9afa8cfe86eea257-checkcir-icon {
  width: var(--width-20);
  height: var(--height-20);
  position: relative;
}
.divchoose-feature-heading-32p,
.divchoose-feature-heading-32p:hover {
  display: flex;
  width: 540px;
  height: var(--height-22);
  flex-direction: column;
  gap: var(--gap-0);
  align-items: flex-start;
  justify-content: center;
}
.frame-item,
.h3 {
  position: relative;
}
.h3,
.h3:hover {
  font-weight: 500;
  line-height: var(--lh-21_4);
  display: block;
  width: var(--width-528);
  height: auto;
}
.h3 {
  margin: 0;
  font-size: inherit;
  font-family: inherit;
  align-items: center;
}
.h3:hover {
  font-family: var(--font-noto-sans-sc);
  font-size: var(--fs-24);
  text-align: left;
  color: var(--color-gray-100);
}
.frame-item {
  max-height: 100%;
  object-fit: cover;
}
.frame-item,
.frame-item:hover {
  display: block;
  width: var(--width-570);
  height: var(--height-450);
}
.divw-node-f2f23147-8228-9554-2,
.divw-node-f2f23147-8228-9554-2:hover {
  display: flex;
  align-self: stretch;
  width: 100%;
  height: var(--height-20);
  gap: var(--gap-8);
  align-items: center;
  padding: var(--padding-0) var(--padding-81) var(--padding-0) var(--padding-0);
  box-sizing: border-box;
}
.divw-node-f2f23147-8228-9554-2 {
  font-size: var(--fs-24);
}
.divw-node-f2f23147-8228-9554-2:hover {
  flex-direction: row;
  justify-content: flex-start;
}
.cb4df9afa8cfe86eea257-checkcir3 {
  overflow: hidden;
  flex-shrink: 0;
}
.cb4df9afa8cfe86eea257-checkcir3,
.cb4df9afa8cfe86eea257-checkcir3:hover {
  display: flex;
  width: auto;
  align-self: unset;
  height: var(--height-22);
  flex-direction: column;
  gap: var(--gap-0);
  align-items: center;
  justify-content: center;
  max-width: var(--max-w-267_61);
  max-height: var(--max-h-267_61);
}
.cb4df9afa8cfe86eea257-checkcir-icon2 {
  position: relative;
}
.cb4df9afa8cfe86eea257-checkcir-icon2,
.cb4df9afa8cfe86eea257-checkcir-icon2:hover {
  display: block;
  width: var(--width-20);
  height: var(--height-20);
  gap: var(--gap-0);
  border: var(--border-1);
  box-sizing: border-box;
}
.divchoose-feature-heading-32p2,
.divchoose-feature-heading-32p2:hover {
  display: flex;
  width: var(--width-548);
  height: var(--height-22);
  flex-direction: column;
  gap: var(--gap-0);
  align-items: flex-start;
  justify-content: center;
  flex-shrink: 0;
}
.group-div {
  position: relative;
}
.group-div,
.group-div:hover {
  display: block;
  width: var(--width-570);
  height: var(--height-450);
}
.frame-parent2,
.frame-parent2:hover {
  display: block;
  width: 100%;
  height: 100%;
}
.frame-inner,
.frame-parent2 {
  position: absolute;
  top: 0;
  left: calc(50% - 285px);
}
.frame-inner,
.frame-inner:hover {
  background-color: var(--color-white);
  display: block;
  width: 100%;
  height: 100%;
  border-radius: var(--br-16);
  box-shadow: var(--shadow-drop-1);
}
.group-icon {
  position: absolute;
  top: 54px;
  left: 61px;
  object-fit: cover;
  z-index: 1;
}
.group-icon,
.group-icon:hover {
  display: block;
  width: 465px;
  height: 341px;
}
.frame-parent3 {
  color: var(--color-royalblue);
}
.frame-parent3,
.frame-parent3:hover {
  display: flex;
  align-self: stretch;
  width: 100%;
  height: 772px;
  flex-direction: column;
  gap: var(--gap-56);
  align-items: center;
  justify-content: center;
  max-width: 100%;
}
.easy-interaction-wrapper,
.easy-interaction-wrapper:hover {
  width: var(--width-1200);
  height: var(--height-140);
  display: flex;
  align-items: flex-start;
}
.easy-interaction-wrapper:hover {
  flex-direction: row;
  justify-content: flex-start;
}
.easy-interaction,
.easy-interaction:hover {
  font-weight: 700;
  line-height: 120%;
  display: block;
  width: var(--width-1200);
  height: var(--height-140);
}
.easy-interaction {
  margin: 0;
  position: relative;
  font-size: inherit;
  font-family: inherit;
  align-items: center;
  flex-shrink: 0;
}
.easy-interaction:hover {
  font-family: var(--font-noto-sans-sc);
  font-size: var(--fs-64);
  text-align: left;
}
.easy-interaction2 {
  color: var(--color-gray-100);
  line-height: 120%;
}
.frame-parent4,
.frame-parent4:hover {
  align-self: stretch;
  display: flex;
  align-items: center;
  gap: var(--gap-60);
  max-width: 100%;
  width: 100%;
  height: auto;
}
.frame-parent4:hover {
  flex-direction: row;
  justify-content: flex-start;
}
.h22,
.h22:hover {
  font-weight: 500;
  line-height: 140%;
  display: block;
  align-self: stretch;
  width: 100%;
  height: var(--height-50);
}
.h22 {
  margin: 0;
  position: relative;
  font-size: inherit;
  font-family: inherit;
  align-items: center;
}
.h22:hover {
  font-family: var(--font-noto-sans-sc);
  font-size: var(--fs-40);
  text-align: left;
  color: var(--color-gray-100);
}
.frame-child3 {
  position: absolute;
  top: 83px;
  left: 29px;
  object-fit: cover;
  z-index: 1;
}
.frame-child3,
.frame-child3:hover {
  display: block;
  width: 511px;
  height: 284px;
}
.h34,
.h34:hover {
  font-weight: 500;
  line-height: var(--lh-21_4);
  display: block;
  align-self: stretch;
  width: 100%;
  height: auto;
}
.h34 {
  margin: 0;
  position: relative;
  font-size: inherit;
  font-family: inherit;
}
.h34:hover {
  font-family: var(--font-noto-sans-sc);
  font-size: var(--fs-24);
  text-align: left;
  color: var(--color-gray-100);
}
.frame-child5 {
  position: absolute;
  top: 63px;
  left: 47px;
  object-fit: cover;
  z-index: 1;
}
.frame-child5,
.frame-child5:hover {
  display: block;
  width: 476px;
  height: 323px;
}
.frame-footer {
  text-align: justify;
  font-size: var(--fs-16);
  color: var(--color-gray-100);
  font-family: var(--font-noto-sans-sc);
}
.frame-footer,
.frame-footer:hover {
  display: flex;
  width: 100%;
  max-width: 1440px;
  height: auto;
  flex-direction: column;
  gap: var(--gap-0);
  align-items: center;
  justify-content: center;
}
.frame-parent7 {
  height: 330px;
  align-items: center;
  justify-content: flex-end;
  padding: var(--padding-1) var(--padding-0);
  position: relative;
  isolation: isolate;
}
.frame-parent7,
.frame-parent7:hover,
.frame-wrapper4,
.frame-wrapper4:hover {
  display: flex;
  width: 100%;
  flex-direction: column;
  gap: var(--gap-10);
  box-sizing: border-box;
  max-width: 100%;
}
.frame-parent7:hover {
  height: 330px;
  align-items: center;
  justify-content: flex-end;
  padding: var(--padding-1) var(--padding-0);
}
.frame-wrapper4,
.frame-wrapper4:hover {
  background-color: var(--color-white);
  height: 100%;
  align-items: flex-start;
  padding: 34px 120px;
}
.frame-wrapper4 {
  margin: 0 !important;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 0;
}
.frame-wrapper4:hover {
  justify-content: flex-start;
}
.parent4,
.parent4:hover {
  height: var(--height-200);
  display: flex;
  align-items: center;
  gap: 198px;
  max-width: 100%;
  width: auto;
  align-self: unset;
}
.parent4:hover {
  flex-direction: row;
  justify-content: flex-start;
}
.div12,
.div12:hover {
  width: 222.5px;
  padding: var(--padding-20) var(--padding-0);
  box-sizing: border-box;
}
.div12:hover {
  flex-direction: row;
  justify-content: flex-start;
}
.campany-logo,
.campany-logo:hover,
.div12,
.div12:hover {
  display: flex;
  align-items: flex-start;
  height: auto;
}
.campany-logo,
.campany-logo:hover {
  flex-direction: column;
  gap: var(--gap-24);
  width: auto;
  align-self: unset;
}
.campany-logo:hover {
  justify-content: flex-start;
}
.liufangshilogo-icon {
  position: relative;
}
.liufangshilogo-icon,
.liufangshilogo-icon:hover {
  display: block;
  width: 215.6px;
  height: 21px;
  gap: var(--gap-0);
}
.div13 {
  width: 223px;
  position: relative;
  line-height: 22.5px;
  display: inline-block;
}
.parent5,
.parent5:hover {
  display: flex;
  width: auto;
  align-self: unset;
  height: auto;
  gap: 112px;
  align-items: center;
  max-width: 100%;
}
.parent5 {
  text-align: left;
  font-size: var(--fs-24);
  color: var(--color-royalblue);
}
.parent5:hover {
  flex-direction: row;
  justify-content: flex-start;
}
.div14,
.ocontact7 {
  flex-direction: column;
}
.div14,
.div14:hover {
  height: var(--height-200);
  width: var(--width-180);
  display: flex;
  align-items: flex-start;
  gap: var(--gap-24);
}
.div14:hover {
  flex-direction: column;
  justify-content: flex-start;
}
.ocontact7 {
  gap: var(--gap-16);
  height: auto;
}
.ocontact7,
.ocontact7:hover,
.ocontact8,
.ocontact8:hover {
  align-self: stretch;
  display: flex;
  align-items: flex-start;
  width: 100%;
}
.ocontact7:hover {
  height: auto;
  flex-direction: column;
  gap: var(--gap-16);
  justify-content: flex-start;
}
.ocontact8,
.ocontact8:hover {
  height: var(--height-27);
  gap: var(--gap-0);
}
.ocontact8:hover {
  flex-direction: row;
  justify-content: flex-start;
}
.company,
.company:hover {
  font-weight: 700;
  line-height: var(--lh-27);
  display: block;
  width: var(--width-180);
}
.company {
  margin: 0;
  height: var(--height-27);
  position: relative;
  font-size: inherit;
  font-family: inherit;
  flex-shrink: 0;
}
.company:hover {
  font-family: var(--font-noto-sans-sc);
  font-size: var(--fs-24);
  text-align: left;
  color: var(--color-royalblue);
}
.ocontat,
.ocontat:hover {
  align-self: stretch;
  width: 100%;
  height: var(--height-36);
  gap: var(--gap-0);
}
.ocontat {
  font-size: var(--fs-20);
  color: var(--color-gray-100);
}
.ocontat:hover {
  flex-direction: row;
  justify-content: flex-start;
}
.div15,
.div15:hover,
.ocontat,
.ocontat:hover {
  display: flex;
  align-items: flex-start;
}
.div15,
.div15:hover {
  height: var(--height-200);
  width: var(--width-180);
  flex-direction: column;
  gap: var(--gap-16);
}
.div15:hover {
  justify-content: flex-start;
}
.div17 {
  align-self: stretch;
  height: auto;
  display: grid;
  box-sizing: border-box;
  grid-template-columns: 1fr;
  grid-template-rows: repeat(5, 1fr);
  column-gap: var(--gap-56);
  row-gap: 8px;
  font-size: var(--fs-20);
  color: var(--color-gray-200);
}
.div18 {
  height: var(--height-50);
  position: relative;
  cursor: pointer;
  grid-column: 1;
  grid-row: 1;
  flex-shrink: 0;
  color: var(--color-gray-100);
}
.div19 {
  position: absolute;
  top: 0;
  left: 0;
  letter-spacing: 0.03em;
  line-height: var(--lh-45);
  font-weight: 500;
  display: inline-block;
}
.div19,
.div19:hover {
  width: 100%;
  height: 100%;
}
.ai4 {
  height: var(--height-50);
  cursor: pointer;
  grid-row: 2;
}
.ai4,
.ai6,
.ai8,
.div20 {
  position: relative;
  grid-column: 1;
  flex-shrink: 0;
}
.ai6 {
  height: var(--height-50);
  cursor: pointer;
  grid-row: 3;
}
.ai8,
.div20 {
  height: var(--height-36);
}
.ai8 {
  width: 82px;
  grid-row: 4;
}
.div20 {
  grid-row: 5;
}
.div23,
.div23:hover {
  display: flex;
  align-self: stretch;
  width: 100%;
  height: var(--height-36);
  gap: var(--gap-0);
  align-items: flex-start;
}
.div23 {
  cursor: pointer;
  font-size: var(--fs-20);
  color: var(--color-gray-100);
}
.div23:hover {
  flex-direction: row;
  justify-content: flex-start;
}
.blog-help-center-plugins-api-d {
  height: var(--height-36);
  width: var(--width-180);
  position: relative;
  letter-spacing: 0.03em;
  line-height: var(--lh-45);
  font-weight: 500;
  display: inline-block;
  flex-shrink: 0;
}
.div24 {
  z-index: 1;
  text-align: center;
  font-size: var(--fs-18);
}
.div24,
.div24:hover {
  display: flex;
  align-self: stretch;
  width: 100%;
  height: var(--height-60);
  flex-direction: column;
  gap: var(--gap-10);
  align-items: center;
  justify-content: center;
}
.div25 {
  width: 1202px;
  height: 2px;
  position: relative;
  border-top: 2px solid var(--color-royalblue);
  box-sizing: border-box;
}
.icp-18037299 {
  align-self: stretch;
  position: relative;
}
.icp-18037299,
.icp-180372992,
.span3 {
  line-height: var(--lh-30);
}
.span3 {
  letter-spacing: 0.03em;
}
.icp-180372992 {
  white-space: pre-wrap;
}
@media screen and (max-width: 1350px) {
  .frame-group {
    gap: var(--gap-60);
  }
  .frame-div,
  .frame-parent4 {
    gap: var(--gap-30);
  }
  .frame-parent7,
  .frame-wrapper4 {
    height: auto;
  }
  .parent4 {
    gap: 99px;
    flex-wrap: wrap;
  }
}
@media screen and (max-width: 1150px) {
  .frame-wrapper {
    height: auto;
  }
  .frame-div {
    flex-wrap: wrap;
  }
  .frame-parent3 {
    height: auto;
  }
  .frame-parent4,
  .parent5 {
    flex-wrap: wrap;
  }
}
@media screen and (max-width: 800px) {
  .parent {
    gap: 36px;
  }
  .header {
    padding-left: var(--padding-60);
    padding-right: var(--padding-60);
    box-sizing: border-box;
  }
  .frame-parent {
    gap: var(--gap-60);
  }
  .frame-group {
    gap: var(--gap-30);
  }
  .frame-container {
    height: auto;
    gap: var(--gap-28);
  }
  .ocontact4 {
    font-size: 45px;
    line-height: 86px;
  }
  .div4 {
    flex-wrap: wrap;
  }
  .div4,
  .fast-response-parent {
    gap: var(--gap-28);
  }
  .fast-response {
    font-size: 51px;
    line-height: 61px;
  }
  .h1 {
    font-size: var(--fs-32);
    line-height: var(--lh-45);
  }
  .divw-node-f2f23147-8228-9554-2 {
    padding-right: var(--padding-40);
    box-sizing: border-box;
  }
  .frame-parent3 {
    gap: var(--gap-28);
  }
  .easy-interaction {
    font-size: 51px;
    line-height: 61px;
  }
  .h22 {
    font-size: var(--fs-32);
    line-height: var(--lh-45);
  }
  .frame-wrapper4 {
    padding-left: var(--padding-60);
    padding-right: var(--padding-60);
    box-sizing: border-box;
  }
  .parent4 {
    gap: 49px;
  }
  .parent5 {
    gap: var(--gap-56);
  }
}
@media screen and (max-width: 600px) {
  .container,
  .container:hover,
  .group-div,
  .group-div:hover {
    width: 100%;
  }
  .frame-item {
    width: 100%;
    max-width: 100%;
    height: auto;
  }
  .group-div,
  .group-div:hover {
    height: auto;
    aspect-ratio: 570 / 450;
  }
  .frame-parent2 {
    left: 0;
  }
  .group-icon {
    top: 12%;
    left: 10.7%;
    width: 81.58%;
    height: auto;
  }
  .frame-child3 {
    top: 18.44%;
    left: 5.09%;
    width: 89.65%;
    height: auto;
  }
  .frame-child5 {
    top: 14%;
    left: 8.25%;
    width: 83.51%;
    height: auto;
  }
}
@media screen and (max-width: 450px) {
  .parent {
    gap: 18px;
  }
  .header {
    padding-left: var(--padding-20);
    padding-right: var(--padding-20);
    box-sizing: border-box;
  }
  .frame-parent {
    gap: var(--gap-30);
  }
  .ocontact4 {
    font-size: 34px;
    line-height: 65px;
  }
  .ocontact6 {
    font-size: 22px;
    line-height: var(--lh-34);
  }
  .fast-response {
    font-size: 38px;
    line-height: 46px;
  }
  .h1 {
    font-size: var(--fs-24);
    line-height: var(--lh-34);
  }
  .h3 {
    font-size: var(--fs-19);
    line-height: 17px;
  }
  .easy-interaction {
    font-size: 38px;
    line-height: 46px;
  }
  .h22 {
    font-size: var(--fs-24);
    line-height: var(--lh-34);
  }
  .h34 {
    font-size: var(--fs-19);
    line-height: 17px;
  }
  .frame-wrapper4 {
    padding-left: var(--padding-20);
    padding-right: var(--padding-20);
    box-sizing: border-box;
  }
  .parent4 {
    gap: 25px;
  }
  .parent5 {
    gap: var(--gap-28);
  }
  .div19 {
    font-size: var(--fs-16);
    line-height: var(--lh-36);
  }
}