::before,
::after {
  content: none;
  box-sizing: inherit
}

html {
  scroll-behavior: smooth;
  box-sizing: border-box
}

body {
  margin: 0;
  -webkit-text-size-adjust: 100%
}

:focus-visible {
  outline: 3px solid #6E0CC3;
  outline-offset: 2px;
  font-weight: 700
}

img {
  max-width: 100%
}

.brandblock {
  display: flex;
  align-items: center;
  gap: 24px;
  text-decoration: none
}

.logoframe {
  width: 78px;
  height: 78px;
  border-radius: 38px;
  background-color: #fff;
  border: 2px solid #6E0CC3;
  box-shadow: 2px 3px 2px -1px #6e0cc312 2px 5px 25px -1px #6e0cc317;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  padding: 8px
}

.logoframe img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block
}

.brandname {
  font-family: 'Lora', serif;
  font-size: 28px;
  font-weight: 700;
  line-height: 1.1;
  color: #6E0CC3;
  letter-spacing: .01em
}

.brandtag {
  font-family: 'Lora', serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 1.35;
  color: #2a1040;
  letter-spacing: .04em;
  display: block;
  margin-top: 0
}

.siteheader {
  background: linear-gradient(135deg, #f5eeff 0%, #fffdf0 60%, #e6fffe 100%);
  border-bottom: 2px solid #6E0CC3;
  position: relative
}

.headertop {
  max-width: 1320px;
  margin: 0 auto;
  padding: 24px 40px 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px
}

.headeraccent {
  display: flex;
  align-items: center;
  gap: 8px
}

.accentpill {
  background: #FBC200;
  color: #1a0a00;
  font-family: 'Lora', serif;
  font-size: 16px;
  font-weight: 600;
  line-height: 1.35;
  padding: 8px 24px;
  border-radius: 22px;
  letter-spacing: .06em;
  white-space: nowrap;
  box-shadow: 2px 3px 2px -1px #fbc20012
}

.accentdot {
  width: 10px;
  height: 10px;
  border-radius: 38px;
  background: #05C9C6;
  flex-shrink: 0
}

.navrow {
  max-width: 1320px;
  margin: 0 auto;
  padding: 0 40px;
  display: flex;
  align-items: stretch;
  gap: 0;
  border-top: 1px solid #6e0cc31f;
  margin-top: 24px
}

.navitem {
  font-family: 'Lora', serif;
  font-size: 16px;
  font-weight: 600;
  line-height: 1.55;
  color: #2a1040;
  text-decoration: none;
  padding: 24px;
  border-radius: 0;
  display: flex;
  align-items: center;
  gap: 8px;
  letter-spacing: .02em;
  border-bottom: 3px solid transparent;
  transition: color .12s cubic-bezier(0.4, 0, 1, 1), border-color .15s cubic-bezier(0.4, 0, 1, 1), background-color .1s cubic-bezier(0.4, 0, 1, 1);
  white-space: nowrap
}

.navitem:hover {
  color: #6E0CC3;
  border-bottom-color: #6E0CC3;
  background-color: #6e0cc30a;
  border-radius: 10px 10px 0 0
}

.navitem i {
  font-size: 18px;
  opacity: .75
}

.navspacer {
  flex: 1
}

.sitefooter {
  background: #1e0f33;
  border-top: 3px solid #6E0CC3
}

.footerinner {
  max-width: 1320px;
  margin: 0 auto;
  padding: 40px 40px 24px;
  display: flex;
  align-items: flex-start;
  gap: 40px
}

.footerbrand {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
  flex-shrink: 0;
  min-width: 180px
}

.footerlogoframe {
  width: 72px;
  height: 72px;
  border-radius: 38px;
  background-color: #fff;
  border: 2px solid #FBC200;
  box-shadow: 2px 5px 25px -1px #fbc20017;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 8px;
  flex-shrink: 0
}

.footerlogoframe img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block
}

.footerbrandname {
  font-family: 'Lora', serif;
  font-size: 18px;
  font-weight: 700;
  line-height: 1.35;
  color: #FBC200;
  letter-spacing: .02em
}

.footerbrandsubtag {
  font-family: 'Lora', serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 1.55;
  color: #c4b0dc;
  letter-spacing: .03em
}

.footercols {
  display: flex;
  gap: 40px;
  flex: 1;
  flex-wrap: wrap;
  align-items: flex-start
}

.footergroup {
  display: flex;
  flex-direction: column;
  gap: 8px;
  min-width: 160px
}

.footergrouplabel {
  font-family: 'Lora', serif;
  font-size: 16px;
  font-weight: 700;
  line-height: 1.35;
  color: #05C9C6;
  letter-spacing: .08em;
  text-transform: uppercase;
  margin-bottom: 8px
}

.footerlink {
  font-family: 'Lora', serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 1.55;
  color: #e0d4f5;
  text-decoration: none;
  display: flex;
  align-items: center;
  gap: 8px;
  border-radius: 0;
  padding: 8px 0;
  transition: color .12s cubic-bezier(0.4, 0, 1, 1), padding-left .1s cubic-bezier(0.4, 0, 1, 1)
}

.footerlink:hover {
  color: #FBC200;
  padding-left: 8px;
  border-radius: 10px
}

.footerlink i {
  font-size: 16px;
  color: #6E0CC3;
  flex-shrink: 0
}

.footercontactitem {
  font-family: 'Lora', serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 1.55;
  color: #e0d4f5;
  display: flex;
  align-items: flex-start;
  gap: 8px
}

.footercontactitem i {
  font-size: 16px;
  color: #05C9C6;
  flex-shrink: 0;
  margin-top: 2px
}

.footercontactitem a {
  color: #e0d4f5;
  text-decoration: none;
  transition: color .12s cubic-bezier(0.4, 0, 1, 1)
}

.footercontactitem a:hover {
  color: #FBC200
}

.footerbar {
  max-width: 1320px;
  margin: 0 auto;
  padding: 24px 40px;
  border-top: 1px solid #6e0cc340;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  flex-wrap: wrap
}

.footercopy {
  font-family: 'Lora', serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 1.55;
  color: #a090bc;
  letter-spacing: .02em
}

.footerpolicynav {
  display: flex;
  align-items: center;
  gap: 24px;
  flex-wrap: wrap
}

.footerpolicylink {
  font-family: 'Lora', serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 1.55;
  color: #a090bc;
  text-decoration: none;
  border-bottom: 1px solid #a090bc4d;
  padding-bottom: 2px;
  transition: color .12s cubic-bezier(0.4, 0, 1, 1), border-color .15s cubic-bezier(0.4, 0, 1, 1)
}

.footerpolicylink:hover {
  color: #FBC200;
  border-color: #FBC200
}

.cookiepopup {
  display: none;
  position: fixed;
  top: 24px;
  left: 0;
  right: 0;
  margin: 0 auto;
  width: 90%;
  max-width: 640px;
  background: #fff;
  border: 2px solid #6E0CC3;
  border-radius: 22px;
  box-shadow: 2px 9px 36px -1px #6e0cc31a;
  z-index: 1200;
  padding: 24px;
  font-family: 'Lora', serif
}

.cookieicon {
  width: 40px;
  height: 40px;
  border-radius: 10px;
  background: linear-gradient(135deg, #f5eeff, #e6fffe);
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 8px;
  flex-shrink: 0
}

.cookieicon i {
  font-size: 22px;
  color: #6E0CC3
}

.cookiedesc {
  font-size: 16px;
  font-weight: 400;
  line-height: 1.55;
  color: #2a1040;
  margin-bottom: 8px
}

.cookielist {
  font-size: 16px;
  line-height: 1.55;
  color: #2a1040;
  padding-left: 24px;
  margin: 0 0 24px
}

.cookielist li {
  margin-bottom: 8px
}

.cookiedetailstoggle {
  background: none;
  border: 1px solid #6e0cc34d;
  border-radius: 10px;
  color: #6E0CC3;
  font-family: 'Lora', serif;
  font-size: 16px;
  font-weight: 600;
  line-height: 1.35;
  cursor: pointer;
  padding: 8px 24px;
  margin-bottom: 24px;
  display: flex;
  align-items: center;
  gap: 8px;
  transition: background-color .12s cubic-bezier(0.4, 0, 1, 1), border-color .15s cubic-bezier(0.4, 0, 1, 1)
}

.cookiedetailstoggle:hover,
.cookiedetailstoggle:focus-visible {
  background-color: #6e0cc30f;
  border-color: #6E0CC3
}

.cookiedetailspanel {
  display: none;
  background: #f5eeff;
  border-radius: 10px;
  padding: 24px;
  margin-bottom: 24px
}

.cookiedetailspanel.open {
  display: block
}

.cookietogglerow {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px
}

.cookietogglelabel {
  font-size: 16px;
  font-weight: 600;
  line-height: 1.35;
  color: #2a1040
}

.cookietogglesub {
  font-size: 16px;
  font-weight: 400;
  line-height: 1.55;
  color: #5a4070;
  display: block;
  margin-top: 8px
}

.cookietoggleinput {
  width: 44px;
  height: 24px;
  flex-shrink: 0;
  cursor: pointer;
  accent-color: #6E0CC3
}

.cookiebtns {
  display: flex;
  gap: 24px;
  flex-wrap: wrap
}

.cookiebtn {
  flex: 1;
  min-width: 120px;
  padding: 24px;
  border-radius: 22px;
  font-family: 'Lora', serif;
  font-size: 16px;
  font-weight: 700;
  line-height: 1.1;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 44px;
  transition: border-color .15s cubic-bezier(0.4, 0, 1, 1), color .12s cubic-bezier(0.4, 0, 1, 1)
}

.cookiebtn.accept {
  background: #6E0CC3;
  color: #fff;
  border: 2px solid #6E0CC3
}

.cookiebtn.accept:hover,
.cookiebtn.accept:focus-visible {
  border-color: #FBC200;
  color: #fff
}

.cookiebtn.decline {
  background: #fff;
  color: #6E0CC3;
  border: 2px solid #6E0CC3
}

.cookiebtn.decline:hover,
.cookiebtn.decline:focus-visible {
  border-color: #05C9C6;
  color: #05C9C6
}

@media (max-width: 992px) {
  .headertop {
    padding: 24px 24px 0;
    flex-wrap: wrap
  }

  .navrow {
    padding: 0 24px;
    flex-wrap: wrap;
    gap: 0
  }

  .navitem {
    padding: 24px 16px;
    font-size: 16px
  }

  .footerinner {
    padding: 40px 24px 24px;
    flex-direction: column;
    gap: 40px
  }

  .footerbar {
    padding: 24px;
    flex-direction: column;
    align-items: flex-start;
    gap: 8px
  }
}

@media (max-width: 576px) {
  .headertop {
    padding: 24px 8px 0;
    gap: 8px
  }

  .navrow {
    padding: 0 8px
  }

  .navitem {
    padding: 24px 8px;
    font-size: 16px;
    white-space: normal
  }

  .accentpill {
    font-size: 16px;
    padding: 8px 16px
  }

  .footerinner {
    padding: 40px 8px 24px
  }

  .footerbar {
    padding: 24px 8px
  }

  .cookiepopup {
    width: 95%;
    padding: 24px 8px
  }

  .cookiebtns {
    flex-direction: column
  }

  .cookiebtn {
    padding: 24px 8px
  }
}

.text-legal {
  max-width: 1320px;
  margin: 0 auto;
  padding: 80px 40px
}

.text-legal h1 {
  font-size: 72px;
  line-height: 1.1;
  color: #6E0CC3;
  margin-bottom: 40px;
  letter-spacing: -.5px
}

.text-legal h2 {
  font-size: 28px;
  line-height: 1.35;
  color: #6E0CC3;
  margin-top: 80px;
  margin-bottom: 24px;
  padding-bottom: 8px;
  border-bottom: 2px solid #FBC200;
  border-left: 4px solid #05C9C6;
  padding-left: 24px
}

.text-legal h3 {
  font-size: 18px;
  line-height: 1.35;
  color: #05C9C6;
  margin-top: 40px;
  margin-bottom: 24px;
  letter-spacing: .02em
}

.text-legal h4 {
  font-size: 18px;
  line-height: 1.35;
  color: #2a1040;
  margin-top: 24px;
  margin-bottom: 8px;
  letter-spacing: .04em;
  text-transform: uppercase
}

.text-legal h5 {
  font-size: 16px;
  line-height: 1.55;
  color: #3b1a5a;
  margin-top: 24px;
  margin-bottom: 8px;
  letter-spacing: .06em
}

.text-legal h6 {
  font-size: 16px;
  line-height: 1.55;
  color: #4a2070;
  margin-top: 24px;
  margin-bottom: 8px;
  letter-spacing: .08em
}

.text-legal p {
  font-size: 16px;
  line-height: 1.55;
  color: #1e1030;
  margin-bottom: 24px;
  max-width: 72ch
}

.text-legal ul {
  margin-bottom: 24px;
  padding-left: 24px;
  list-style: none
}

.text-legal ol {
  margin-bottom: 24px;
  padding-left: 24px;
  list-style: none;
  counter-reset: policy-counter
}

.text-legal ul li {
  font-size: 16px;
  line-height: 1.55;
  color: #1e1030;
  margin-bottom: 8px;
  padding-left: 24px;
  position: relative;
  max-width: 72ch
}

.text-legal ul li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 10px;
  width: 8px;
  height: 8px;
  border-radius: 0;
  background-color: #FBC200;
  transform: rotate(45deg)
}

.text-legal ol li {
  font-size: 16px;
  line-height: 1.55;
  color: #1e1030;
  margin-bottom: 8px;
  padding-left: 24px;
  position: relative;
  max-width: 72ch;
  counter-increment: policy-counter
}

.text-legal ol li::before {
  content: counter(policy-counter) ".";
  position: absolute;
  left: 0;
  top: 0;
  font-size: 16px;
  line-height: 1.55;
  color: #6E0CC3;
  font-weight: 700
}

.text-legal ul ul,
.text-legal ol ol,
.text-legal ul ol,
.text-legal ol ul {
  margin-top: 8px;
  margin-bottom: 8px
}

.text-legal em,
.text-legal i {
  font-style: italic;
  color: #4a2070
}

.text-legal div {
  margin-bottom: 24px
}

.text-legal div.notice {
  background: linear-gradient(135deg, #f5eeff 0%, #fffbe6 100%);
  border-radius: 10px;
  padding: 24px;
  margin-top: 40px;
  margin-bottom: 40px;
  box-shadow: 2px 3px 2px -1px #6e0cc312
}

.text-legal div.notice p {
  margin-bottom: 0
}

@media (max-width: 992px) {
  .text-legal {
    padding: 80px 24px
  }

  .text-legal h1 {
    font-size: 28px;
    line-height: 1.1
  }

  .text-legal h2 {
    margin-top: 40px
  }
}

@media (max-width: 576px) {
  .text-legal {
    padding: 40px 24px
  }

  .text-legal h1 {
    font-size: 28px
  }

  .text-legal p,
  .text-legal ul li,
  .text-legal ol li {
    font-size: 16px
  }
}

.srvpg {
  background: #fff;
  overflow-x: clip
}

.srvpg .fadein {
  animation: svFadeIn .55s cubic-bezier(0.4, 0, 1, 1) both
}

@keyframes svFadeIn {
  from {
    opacity: 0
  }

  to {
    opacity: 1
  }
}

.srvpg .fadein.delay1 {
  animation-delay: .12s
}

.srvpg .fadein.delay2 {
  animation-delay: .22s
}

.srvpg .fadein.delay3 {
  animation-delay: .32s
}

.srvpg .titblk {
  max-width: 1320px;
  margin: 0 auto;
  padding: 80px 40px;
  position: relative
}

.srvpg .titblk .atmsphere {
  position: absolute;
  pointer-events: none;
  overflow: hidden;
  inset: 0
}

.srvpg .titblk .atmsphere .spot1 {
  position: absolute;
  width: 420px;
  height: 420px;
  border-radius: 38px;
  background: #6E0CC3;
  opacity: .07;
  filter: blur(80px);
  top: -80px;
  right: 60px
}

.srvpg .titblk .atmsphere .spot2 {
  position: absolute;
  width: 280px;
  height: 280px;
  border-radius: 38px;
  background: #05C9C6;
  opacity: .09;
  filter: blur(60px);
  bottom: -40px;
  left: 80px
}

.srvpg .titblk .atmsphere .spot3 {
  position: absolute;
  width: 200px;
  height: 200px;
  border-radius: 38px;
  background: #FBC200;
  opacity: .08;
  filter: blur(50px);
  top: 40px;
  left: 30%
}

.srvpg .titblk .tgrid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 80px;
  align-items: center;
  position: relative
}

.srvpg .titblk .tleft {
  display: flex;
  flex-direction: column;
  gap: 24px
}

.srvpg .titblk .tlabel {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 16px;
  font-weight: 600;
  letter-spacing: .12em;
  color: #6E0CC3;
  text-transform: uppercase
}

.srvpg .titblk .tlabel .lbar {
  width: 32px;
  height: 2px;
  background: linear-gradient(to left, #6E0CC3, #05C9C6);
  border-radius: 0
}

.srvpg .titblk h1 {
  font-size: 72px;
  line-height: 1.1;
  font-weight: 800;
  color: #1b1035;
  margin: 0
}

.srvpg .titblk h1 .grad {
  background: linear-gradient(to left, #6E0CC3, #05C9C6);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text
}

.srvpg .titblk .ttheses {
  display: flex;
  flex-direction: column;
  gap: 8px
}

.srvpg .titblk .ttheses .thes {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  font-size: 18px;
  line-height: 1.55;
  color: #2d2340
}

.srvpg .titblk .ttheses .thes .dot {
  width: 6px;
  height: 6px;
  border-radius: 0;
  background: #FBC200;
  margin-top: 10px;
  flex-shrink: 0
}

.srvpg .titblk .tright {
  position: relative
}

.srvpg .titblk .tright .imgframe {
  border-radius: 22px;
  overflow: hidden;
  border-top: 3px solid #6E0CC3;
  border-bottom: 3px solid #05C9C6;
  box-shadow: 2px 9px 36px -1px #6e0cc31a
}

.srvpg .titblk .tright .imgframe img {
  width: 100%;
  height: 400px;
  object-fit: cover;
  object-position: center;
  display: block;
  filter: contrast(1.06) saturate(1.08)
}

.srvpg .titblk .tright .imgbadge {
  position: absolute;
  bottom: -24px;
  left: -24px;
  background: #6E0CC3;
  color: #fff;
  border-radius: 10px;
  padding: 24px;
  box-shadow: 2px 5px 25px -1px #6e0cc317;
  text-align: center;
  min-width: 140px
}

.srvpg .titblk .tright .imgbadge .bnum {
  font-size: 28px;
  line-height: 1.1;
  font-weight: 800;
  color: #FBC200;
  display: block
}

.srvpg .titblk .tright .imgbadge .btxt {
  font-size: 16px;
  line-height: 1.35;
  color: #e8d8ff;
  display: block;
  margin-top: 8px
}

.srvpg .div1 {
  line-height: 0;
  background: #fff
}

.srvpg .div1 svg {
  display: block;
  width: 100%
}

.srvpg .svcblk {
  background: #130826 !important;
  padding: 80px 0;
  position: relative
}

.srvpg .svcblk .svcinner {
  max-width: 1320px;
  margin: 0 auto;
  padding: 0 40px
}

.srvpg .svcblk .svctop {
  text-align: center;
  margin-bottom: 80px
}

.srvpg .svcblk .svctop h2 {
  font-size: 28px;
  line-height: 1.35;
  font-weight: 300;
  color: #e8d8ff;
  margin: 0 0 8px
}

.srvpg .svcblk .svctop h2 strong {
  font-weight: 800;
  background: linear-gradient(to left, #FBC200, #05C9C6);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text
}

.srvpg .svcblk .svctop p {
  font-size: 18px;
  line-height: 1.55;
  color: #9e88c2;
  max-width: 600px;
  margin: 8px auto 0
}

.srvpg .svcblk .svcgrid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
  margin-bottom: 80px
}

.srvpg .svcblk .svccard {
  background: #1e0f3a;
  border-radius: 22px;
  padding: 40px 24px;
  text-align: center;
  box-shadow: inset 2px 3px 2px -1px #6e0cc312 2px 5px 25px -1px #6e0cc317;
  border-top: 2px solid #2a1550;
  border-bottom: 2px solid #2a1550;
  transition: border-radius .15s cubic-bezier(0.4, 0, 1, 1), border-color .12s cubic-bezier(0.4, 0, 1, 1);
  cursor: default
}

.srvpg .svcblk .svccard:hover {
  border-radius: 10px;
  border-top-color: #6E0CC3;
  border-bottom-color: #05C9C6
}

.srvpg .svcblk .svccard .cardico {
  width: 56px;
  height: 56px;
  border-radius: 22px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 24px;
  transition: border-radius .1s cubic-bezier(0.4, 0, 1, 1)
}

.srvpg .svcblk .svccard:hover .cardico {
  border-radius: 38px
}

.srvpg .svcblk .svccard .cardico.ico1 {
  background: #6e0cc340
}

.srvpg .svcblk .svccard .cardico.ico2 {
  background: #fbc2002e
}

.srvpg .svcblk .svccard .cardico.ico3 {
  background: #05c9c626
}

.srvpg .svcblk .svccard .cardico i {
  font-size: 28px
}

.srvpg .svcblk .svccard .cardico.ico1 i {
  color: #b06aff
}

.srvpg .svcblk .svccard .cardico.ico2 i {
  color: #FBC200
}

.srvpg .svcblk .svccard .cardico.ico3 i {
  color: #05C9C6
}

.srvpg .svcblk .svccard h3 {
  font-size: 18px;
  line-height: 1.35;
  font-weight: 700;
  color: #e8d8ff;
  margin: 0 0 8px
}

.srvpg .svcblk .svccard p {
  font-size: 16px;
  line-height: 1.55;
  color: #9e88c2;
  margin: 0
}

.srvpg .svcblk .svccard .cardtag {
  display: inline-block;
  margin-top: 24px;
  font-size: 16px;
  font-weight: 600;
  letter-spacing: .08em;
  color: #6E0CC3;
  border: 1.5px solid #3a1a6e;
  border-radius: 38px;
  padding: 8px 24px;
  transition: border-color .12s cubic-bezier(0.4, 0, 1, 1), border-radius .15s cubic-bezier(0.4, 0, 1, 1)
}

.srvpg .svcblk .svccard:hover .cardtag {
  border-color: #6E0CC3;
  border-radius: 10px
}

.srvpg .svcblk .testirow {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 40px;
  align-items: stretch
}

.srvpg .svcblk .testicard {
  background: #1e0f3a;
  border-radius: 22px;
  padding: 40px;
  box-shadow: inset 2px 3px 2px -1px #6e0cc312;
  display: flex;
  flex-direction: column;
  gap: 24px
}

.srvpg .svcblk .testicard .qmark {
  width: 44px;
  height: 44px;
  border-radius: 10px;
  background: #6e0cc333;
  display: flex;
  align-items: center;
  justify-content: center
}

.srvpg .svcblk .testicard .qmark svg {
  width: 22px;
  height: 22px
}

.srvpg .svcblk .testicard blockquote {
  margin: 0;
  font-size: 18px;
  line-height: 1.55;
  color: #d4c4f0;
  font-style: italic
}

.srvpg .svcblk .testicard .tauthor {
  display: flex;
  align-items: center;
  gap: 24px
}

.srvpg .svcblk .testicard .tauthor .portrait {
  width: 56px;
  height: 56px;
  overflow: hidden;
  flex-shrink: 0
}

.srvpg .svcblk .testicard .tauthor .portrait img {
  width: 56px;
  height: 56px;
  object-fit: cover;
  object-position: center;
  display: block
}

.srvpg .svcblk .testicard .tauthor .ainfo .aname {
  font-size: 16px;
  font-weight: 700;
  color: #e8d8ff;
  display: block
}

.srvpg .svcblk .testicard .tauthor .ainfo .arole {
  font-size: 16px;
  color: #7a5fa8;
  display: block;
  margin-top: 8px
}

.srvpg .svcblk .statscard {
  background: #1e0f3a;
  border-radius: 22px;
  padding: 40px;
  box-shadow: inset 2px 3px 2px -1px #6e0cc312;
  display: flex;
  flex-direction: column;
  gap: 24px
}

.srvpg .svcblk .statscard h4 {
  font-size: 18px;
  line-height: 1.35;
  font-weight: 300;
  color: #9e88c2;
  margin: 0
}

.srvpg .svcblk .statscard h4 strong {
  font-weight: 700;
  color: #e8d8ff
}

.srvpg .svcblk .statscard .slist {
  display: flex;
  flex-direction: column;
  gap: 24px
}

.srvpg .svcblk .statscard .sitem {
  display: flex;
  flex-direction: column;
  gap: 8px
}

.srvpg .svcblk .statscard .sitem .srow {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between
}

.srvpg .svcblk .statscard .sitem .slabel {
  font-size: 16px;
  color: #9e88c2
}

.srvpg .svcblk .statscard .sitem .sval {
  font-size: 16px;
  font-weight: 700;
  color: #FBC200
}

.srvpg .svcblk .statscard .sitem .sbar {
  height: 6px;
  border-radius: 0;
  background: #2a1550;
  overflow: hidden
}

.srvpg .svcblk .statscard .sitem .sbar .sfill {
  height: 100%;
  border-radius: 0;
  background: linear-gradient(to left, #6E0CC3, #05C9C6);
  animation: barGrow .55s cubic-bezier(0.4, 0, 1, 1) both;
  animation-delay: .4s
}

@keyframes barGrow {
  from {
    width: 0
  }
}

.srvpg .svcblk .statscard .sitem .sfill.f78 {
  width: 78%
}

.srvpg .svcblk .statscard .sitem .sfill.f63 {
  width: 63%
}

.srvpg .svcblk .statscard .sitem .sfill.f85 {
  width: 85%
}

.srvpg .div2 {
  line-height: 0;
  background: #130826
}

.srvpg .div2 svg {
  display: block;
  width: 100%
}

@media (max-width: 992px) {
  .srvpg .titblk .tgrid {
    grid-template-columns: 1fr;
    gap: 40px
  }

  .srvpg .titblk h1 {
    font-size: 28px
  }

  .srvpg .titblk .tright .imgbadge {
    left: 0;
    bottom: -40px
  }

  .srvpg .svcblk .svcgrid {
    grid-template-columns: 1fr 1fr
  }

  .srvpg .svcblk .testirow {
    grid-template-columns: 1fr
  }
}

@media (max-width: 576px) {
  .srvpg .titblk {
    padding: 40px 24px
  }

  .srvpg .titblk h1 {
    font-size: 28px
  }

  .srvpg .svcblk .svcinner {
    padding: 0 24px
  }

  .srvpg .svcblk .svcgrid {
    grid-template-columns: 1fr
  }

  .srvpg .svcblk .testicard,
  .srvpg .svcblk .statscard {
    padding: 24px
  }

  .srvpg .svcblk .svctop {
    margin-bottom: 40px
  }
}

.ctus {
  width: 100%;
  overflow-x: clip;
  background: #fff
}

.ctus .grad-bar {
  width: 100%;
  height: 4px;
  background: linear-gradient(to left, #6E0CC3, #05C9C6)
}

.ctus .reach-panel {
  width: 100%;
  background: linear-gradient(to left, #1a0533 0%, #6E0CC3 100%);
  padding: 80px 24px;
  position: relative
}

.ctus .reach-panel::after {
  content: '';
  position: absolute;
  bottom: -28px;
  left: 0;
  width: 100%;
  height: 30px;
  background: #fff;
  clip-path: ellipse(55% 100% at 50% 100%);
  z-index: 2
}

.ctus .reach-inner {
  max-width: 1320px;
  margin: 0 auto;
  display: flex;
  flex-direction: row;
  gap: 80px;
  align-items: flex-start
}

.ctus .reach-text {
  flex: 1 1 340px;
  min-width: 0
}

.ctus .reach-label {
  display: inline-block;
  font-size: 16px;
  font-weight: 600;
  letter-spacing: .12em;
  color: #FBC200;
  margin-bottom: 24px;
  text-transform: uppercase
}

.ctus .reach-heading {
  font-size: 72px;
  font-weight: 800;
  line-height: 1.1;
  color: #fff;
  margin: 0 0 24px
}

.ctus .reach-heading span {
  color: #05C9C6
}

.ctus .reach-desc {
  font-size: 18px;
  line-height: 1.55;
  color: #ffffffd1;
  margin: 0 0 40px
}

.ctus .contact-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 24px
}

.ctus .contact-list li {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  gap: 24px
}

.ctus .cicon {
  width: 44px;
  height: 44px;
  border-radius: 10px;
  background: #ffffff14;
  border: 1px solid #ffffff21;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  transition: background .15s cubic-bezier(0.4, 0, 1, 1), border-radius .12s cubic-bezier(0.4, 0, 1, 1)
}

.ctus .contact-list li:hover .cicon {
  background: #05c9c62e;
  border-radius: 22px
}

.ctus .cicon svg {
  width: 22px;
  height: 22px;
  fill: #05C9C6
}

.ctus .citem-text {
  display: flex;
  flex-direction: column;
  gap: 8px
}

.ctus .citem-label {
  font-size: 16px;
  font-weight: 600;
  letter-spacing: .06em;
  color: #ffffff8c;
  text-transform: uppercase
}

.ctus .citem-val {
  font-size: 18px;
  line-height: 1.35;
  color: #fff;
  text-decoration: none;
  transition: color .12s cubic-bezier(0.4, 0, 1, 1)
}

.ctus .citem-val:hover {
  color: #FBC200;
  text-shadow: 0 0 16px #fbc20059
}

.ctus .reach-deco {
  position: absolute;
  top: 40px;
  right: 80px;
  width: 180px;
  height: 180px;
  pointer-events: none;
  opacity: .07
}

.ctus .reach-deco svg {
  width: 100%;
  height: 100%
}

.ctus .form-col {
  flex: 1 1 400px;
  min-width: 0
}

.ctus .form-card {
  background: #fff;
  border-radius: 22px;
  padding: 40px;
  box-shadow: 2px 9px 36px -1px #6e0cc31a;
  position: relative;
  z-index: 3
}

.ctus .form-card-heading {
  font-size: 28px;
  font-weight: 700;
  line-height: 1.35;
  color: #6E0CC3;
  margin: 0 0 8px
}

.ctus .form-card-sub {
  font-size: 16px;
  line-height: 1.55;
  color: #3a3a4a;
  margin: 0 0 40px
}

.ctus .fform {
  display: flex;
  flex-direction: column;
  gap: 24px
}

.ctus .field-grp {
  display: flex;
  flex-direction: column;
  gap: 8px
}

.ctus .field-grp label {
  font-size: 16px;
  font-weight: 600;
  color: #2a1040;
  letter-spacing: .03em
}

.ctus .field-grp input[type="text"],
.ctus .field-grp input[type="tel"],
.ctus .field-grp input[type="email"],
.ctus .field-grp select,
.ctus .field-grp textarea {
  width: 100%;
  box-sizing: border-box;
  padding: 14px 18px;
  font-size: 16px;
  line-height: 1.35;
  color: #2a1040;
  background: #f5f0fc;
  border: 1.5px solid #e2d6f5;
  border-radius: 10px;
  outline: none;
  transition: border-color .15s cubic-bezier(0.4, 0, 1, 1), border-radius .12s cubic-bezier(0.4, 0, 1, 1), box-shadow .15s cubic-bezier(0.4, 0, 1, 1);
  appearance: none;
  -webkit-appearance: none
}

.ctus .field-grp input[type="text"]:focus,
.ctus .field-grp input[type="tel"]:focus,
.ctus .field-grp input[type="email"]:focus,
.ctus .field-grp select:focus,
.ctus .field-grp textarea:focus {
  border-color: #6E0CC3;
  border-radius: 22px;
  box-shadow: 2px 5px 25px -1px #6e0cc317
}

.ctus .field-grp input::placeholder,
.ctus .field-grp textarea::placeholder {
  color: #b0a0c8
}

.ctus .field-grp textarea {
  resize: vertical;
  min-height: 100px
}

.ctus .field-grp select {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3E%3Cpath fill='%236E0CC3' d='M4 6l4 4 4-4'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 14px center;
  padding-right: 40px;
  cursor: pointer
}

.ctus .toggle-row {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 24px
}

.ctus .toggle-row label {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 8px;
  cursor: pointer;
  font-size: 16px;
  font-weight: 600;
  color: #2a1040;
  user-select: none
}

.ctus .toggle-row input[type="radio"] {
  accent-color: #6E0CC3;
  width: 18px;
  height: 18px;
  cursor: pointer
}

.ctus .cond-fields {
  display: flex;
  flex-direction: column;
  gap: 24px
}

.ctus .cond-part {
  display: none
}

.ctus .radio-part-individuel:checked~.fform .cond-fields .cond-individuel,
.ctus .radio-part-entreprise:checked~.fform .cond-fields .cond-entreprise {
  display: flex;
  flex-direction: column;
  gap: 24px
}

.ctus .privacy-row {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  gap: 8px
}

.ctus .privacy-row input[type="checkbox"] {
  accent-color: #6E0CC3;
  width: 18px;
  height: 18px;
  margin-top: 2px;
  flex-shrink: 0;
  cursor: pointer
}

.ctus .privacy-row span {
  font-size: 16px;
  line-height: 1.55;
  color: #3a3a4a
}

.ctus .privacy-row a {
  color: #6E0CC3;
  text-decoration: underline;
  text-decoration-color: #6e0cc359;
  transition: color .12s cubic-bezier(0.4, 0, 1, 1), text-shadow .12s cubic-bezier(0.4, 0, 1, 1)
}

.ctus .privacy-row a:hover {
  color: #05C9C6;
  text-shadow: 0 0 12px #05c9c64d
}

.ctus .submit-btn {
  display: inline-flex;
  flex-direction: row;
  align-items: center;
  gap: 8px;
  padding: 16px 40px;
  font-size: 18px;
  font-weight: 700;
  color: #fff;
  background: linear-gradient(to left, #6E0CC3, #3d0770);
  border: 2px solid #6E0CC3;
  border-radius: 10px;
  cursor: pointer;
  transition: border-color .15s cubic-bezier(0.4, 0, 1, 1), border-radius .12s cubic-bezier(0.4, 0, 1, 1), box-shadow .15s cubic-bezier(0.4, 0, 1, 1);
  box-shadow: 2px 5px 25px -1px #6e0cc317;
  align-self: flex-start
}

.ctus .submit-btn:hover {
  border-color: #FBC200;
  border-radius: 22px;
  box-shadow: 2px 9px 36px -1px #6e0cc31a
}

.ctus .submit-btn:focus {
  outline: 3px solid #FBC200;
  outline-offset: 2px
}

.ctus .submit-btn svg {
  width: 20px;
  height: 20px;
  fill: #fff
}

.ctus .dotted-div {
  width: 100%;
  border: none;
  border-top: 2px dotted #05C9C6;
  margin: 0;
  opacity: .45
}

.ctus .before-after-panel {
  width: 100%;
  background: #f7f2fd;
  padding: 80px 24px;
  position: relative
}

.ctus .scatter-bg {
  position: absolute;
  inset: 0;
  pointer-events: none;
  overflow: hidden
}

.ctus .scatter-bg span {
  position: absolute;
  display: block;
  opacity: .06
}

.ctus .ba-inner {
  max-width: 1320px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: 40px;
  align-items: center
}

.ctus .ba-heading {
  font-size: 28px;
  font-weight: 300;
  line-height: 1.35;
  color: #2a1040;
  text-align: center;
  margin: 0
}

.ctus .ba-heading strong {
  font-weight: 800;
  color: #6E0CC3
}

.ctus .ba-grid {
  width: 100%;
  display: grid;
  grid-template-columns: 1fr 1fr;
  border-radius: 22px;
  overflow: hidden;
  box-shadow: 2px 9px 36px -1px #6e0cc31a
}

.ctus .ba-before {
  background: #fff;
  padding: 40px;
  display: flex;
  flex-direction: column;
  gap: 24px
}

.ctus .ba-after {
  background: linear-gradient(to left, #6E0CC3, #3d0770);
  padding: 40px;
  display: flex;
  flex-direction: column;
  gap: 24px
}

.ctus .ba-col-label {
  font-size: 16px;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase
}

.ctus .ba-before .ba-col-label {
  color: #b0a0c8
}

.ctus .ba-after .ba-col-label {
  color: #FBC200
}

.ctus .ba-item {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  gap: 8px
}

.ctus .ba-item-dot {
  width: 8px;
  height: 8px;
  border-radius: 0;
  flex-shrink: 0;
  margin-top: 7px
}

.ctus .ba-before .ba-item-dot {
  background: #e2d6f5
}

.ctus .ba-after .ba-item-dot {
  background: #FBC200;
  border-radius: 10px
}

.ctus .ba-item-text {
  font-size: 16px;
  line-height: 1.55
}

.ctus .ba-before .ba-item-text {
  color: #6a5a80
}

.ctus .ba-after .ba-item-text {
  color: #ffffffe6
}

.ctus .ba-note {
  font-size: 16px;
  line-height: 1.55;
  color: #7a6a90;
  text-align: center;
  max-width: 640px;
  margin: 0
}

.ctus .ba-note a {
  color: #6E0CC3;
  text-decoration: underline;
  text-decoration-color: #6e0cc34d;
  transition: color .12s cubic-bezier(0.4, 0, 1, 1), text-shadow .12s cubic-bezier(0.4, 0, 1, 1)
}

.ctus .ba-note a:hover {
  color: #05C9C6;
  text-shadow: 0 0 12px #05c9c64d
}

.ctus .anim-scale {
  animation: scaleSettle .18s cubic-bezier(0.4, 0, 1, 1) both
}

@keyframes scaleSettle {
  from {
    transform: scale(0.95);
    opacity: .7
  }

  to {
    transform: scale(1);
    opacity: 1
  }
}

.ctus .reach-panel .form-card {
  animation: scaleSettle .18s cubic-bezier(0.4, 0, 1, 1) .05s both
}

.ctus .ba-grid {
  animation: scaleSettle .18s cubic-bezier(0.4, 0, 1, 1) .08s both
}

@media (max-width: 992px) {
  .ctus .reach-inner {
    flex-direction: column;
    gap: 40px
  }

  .ctus .reach-heading {
    font-size: 28px
  }

  .ctus .reach-deco {
    display: none
  }

  .ctus .ba-grid {
    grid-template-columns: 1fr
  }
}

@media (max-width: 576px) {
  .ctus .reach-panel {
    padding: 40px 24px 80px
  }

  .ctus .form-card {
    padding: 24px
  }

  .ctus .ba-before,
  .ctus .ba-after {
    padding: 24px
  }

  .ctus .before-after-panel {
    padding: 40px 24px
  }

  .ctus .toggle-row {
    flex-direction: column;
    align-items: flex-start;
    gap: 8px
  }

  .ctus .submit-btn {
    width: 100%;
    justify-content: center
  }
}

.abtu {
  position: relative;
  overflow-x: clip
}

.abtu .titband {
  padding: 80px 24px 40px;
  background: #fff;
  position: relative
}

.abtu .titband-inner {
  max-width: 1320px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 40px
}

.abtu .titband-shapes {
  position: absolute;
  inset: 0;
  pointer-events: none;
  overflow: hidden
}

.abtu .titband-shapes span {
  position: absolute;
  border: 2px solid #6e0cc314;
  border-radius: 38px
}

.abtu .titband-shapes span:nth-child(1) {
  width: 320px;
  height: 320px;
  top: -80px;
  left: -60px;
  transform: rotate(18deg)
}

.abtu .titband-shapes span:nth-child(2) {
  width: 180px;
  height: 180px;
  bottom: -40px;
  right: 8%;
  border-color: #05c9c61a;
  border-radius: 22px;
  transform: rotate(-12deg)
}

.abtu .titband-shapes span:nth-child(3) {
  width: 90px;
  height: 90px;
  top: 24px;
  right: 18%;
  border-color: #fbc2001f;
  border-radius: 10px;
  transform: rotate(30deg)
}

.abtu .titimg-wrap {
  width: 100%;
  max-width: 680px;
  border-radius: 22px;
  overflow: hidden;
  position: relative;
  animation: imgfadein .7s cubic-bezier(0.4, 0, 1, 1) both
}

@keyframes imgfadein {
  from {
    opacity: 0;
    transform: translateY(16px)
  }

  to {
    opacity: 1;
    transform: translateY(0)
  }
}

.abtu .titimg-wrap img {
  width: 100%;
  height: 340px;
  object-fit: cover;
  object-position: center;
  display: block
}

.abtu .tittext {
  width: 100%;
  max-width: 720px;
  display: flex;
  flex-direction: column;
  gap: 24px
}

.abtu .tittext h1 {
  font-size: 72px;
  line-height: 1.1;
  font-weight: 800;
  color: #6E0CC3;
  margin: 0;
  text-align: left
}

.abtu .tittext h1 em {
  font-style: normal;
  color: #05C9C6
}

.abtu .tittext p {
  font-size: 18px;
  line-height: 1.55;
  color: #2a2a2e;
  margin: 0;
  text-align: right;
  max-width: 540px;
  align-self: flex-end
}

.abtu .titbadge {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 24px;
  background: linear-gradient(to left, #6E0CC3, #05C9C6);
  border-radius: 10px;
  color: #fff;
  font-size: 16px;
  line-height: 1.35;
  font-weight: 600;
  letter-spacing: .06em;
  align-self: flex-start
}

.abtu .storysec {
  padding: 80px 24px;
  background: linear-gradient(to left, #1b0633, #0d2a2a);
  position: relative;
  overflow: hidden
}

.abtu .storysec::before {
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse 60% 40% at 50% 50%, #6e0cc32e 0%, transparent 70%);
  animation: glowpulse 5s ease-in-out infinite alternate;
  pointer-events: none
}

@keyframes glowpulse {
  from {
    opacity: .5
  }

  to {
    opacity: 1
  }
}

.abtu .storysec-inner {
  max-width: 1320px;
  margin: 0 auto;
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 80px;
  align-items: start
}

.abtu .storycol {
  display: flex;
  flex-direction: column;
  gap: 40px
}

.abtu .storycol h2 {
  font-size: 28px;
  line-height: 1.35;
  font-weight: 300;
  color: #fff;
  margin: 0
}

.abtu .storycol h2 strong {
  font-weight: 800;
  color: #FBC200
}

.abtu .storyparas {
  display: flex;
  flex-direction: column;
  gap: 24px
}

.abtu .storyparas p {
  font-size: 16px;
  line-height: 1.55;
  color: #fffc;
  margin: 0
}

.abtu .metricrow {
  display: flex;
  flex-direction: row;
  gap: 24px;
  flex-wrap: wrap
}

.abtu .metriccard {
  flex: 1 1 120px;
  background: #ffffff0d;
  border: 1px solid #ffffff14;
  border-radius: 22px;
  padding: 24px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  box-shadow: inset 2px 3px 2px -1px #6e0cc312;
  transition: border-radius .15s cubic-bezier(0.4, 0, 1, 1), border-color .12s cubic-bezier(0.4, 0, 1, 1)
}

.abtu .metriccard:hover {
  border-radius: 10px;
  border-color: #fbc2004d
}

.abtu .metriccard .mnum {
  font-size: 28px;
  line-height: 1.1;
  font-weight: 800;
  color: #FBC200
}

.abtu .metriccard .mlabel {
  font-size: 16px;
  line-height: 1.35;
  color: #ffffffa6;
  letter-spacing: .04em
}

.abtu .storyright {
  display: flex;
  flex-direction: column;
  gap: 40px
}

.abtu .teamcard {
  background: #ffffff0a;
  border: 1px solid #05c9c626;
  border-radius: 22px;
  padding: 40px;
  display: flex;
  flex-direction: row;
  gap: 24px;
  align-items: flex-start;
  box-shadow: 2px 5px 25px -1px #6e0cc317;
  transition: border-radius .13s cubic-bezier(0.4, 0, 1, 1)
}

.abtu .teamcard:hover {
  border-radius: 10px
}

.abtu .portrait-wrap {
  flex-shrink: 0;
  width: 120px;
  height: 154px;
  border-radius: 22px;
  overflow: hidden
}

.abtu .portrait-wrap img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block
}

.abtu .teaminfo {
  display: flex;
  flex-direction: column;
  gap: 8px
}

.abtu .teaminfo h4 {
  font-size: 18px;
  line-height: 1.35;
  font-weight: 700;
  color: #fff;
  margin: 0
}

.abtu .teaminfo .trole {
  font-size: 16px;
  line-height: 1.35;
  color: #05C9C6;
  letter-spacing: .05em
}

.abtu .teaminfo p {
  font-size: 16px;
  line-height: 1.55;
  color: #ffffffb3;
  margin: 0
}

.abtu .imgstack {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px
}

.abtu .imgstack-item {
  border-radius: 22px;
  overflow: hidden;
  position: relative;
  cursor: default
}

.abtu .imgstack-item img {
  width: 100%;
  height: 180px;
  object-fit: cover;
  object-position: center;
  display: block;
  transition: transform .18s cubic-bezier(0.4, 0, 1, 1)
}

.abtu .imgstack-item .imgoverlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(to left, #6e0cc38c, #05c9c64d);
  clip-path: inset(0 100% 0 0);
  transition: clip-path .16s cubic-bezier(0.4, 0, 1, 1);
  display: flex;
  align-items: center;
  justify-content: center
}

.abtu .imgstack-item:hover .imgoverlay {
  clip-path: inset(0 0% 0 0)
}

.abtu .imgstack-item:hover img {
  transform: scale(1.04)
}

.abtu .imgoverlay span {
  font-size: 16px;
  line-height: 1.35;
  color: #fff;
  font-weight: 600;
  letter-spacing: .06em;
  text-align: center;
  padding: 8px
}

.abtu .valuesrow {
  display: flex;
  flex-direction: column;
  gap: 24px
}

.abtu .valuesrow h3 {
  font-size: 28px;
  line-height: 1.35;
  font-weight: 800;
  color: #6E0CC3;
  margin: 0;
  text-align: center
}

.abtu .valgrid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px
}

.abtu .valitem {
  background: #ffffff08;
  border: 1px solid #fbc2001a;
  border-radius: 22px;
  padding: 24px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  box-shadow: inset 2px 9px 36px -1px #6e0cc31a;
  transition: border-radius .14s cubic-bezier(0.4, 0, 1, 1)
}

.abtu .valitem:hover {
  border-radius: 0
}

.abtu .valitem .vicon {
  font-size: 28px;
  color: #FBC200
}

.abtu .valitem h5 {
  font-size: 16px;
  line-height: 1.35;
  font-weight: 700;
  color: #fff;
  margin: 0
}

.abtu .valitem p {
  font-size: 16px;
  line-height: 1.55;
  color: #ffffffa6;
  margin: 0
}

.abtu .diamondaccent {
  position: absolute;
  width: 64px;
  height: 64px;
  background: linear-gradient(to left, #6E0CC3, #05C9C6);
  transform: rotate(45deg);
  border-radius: 10px;
  opacity: .18;
  pointer-events: none
}

@media (max-width: 992px) {
  .abtu .storysec-inner {
    grid-template-columns: 1fr;
    gap: 40px
  }

  .abtu .valgrid {
    grid-template-columns: 1fr 1fr
  }

  .abtu .tittext h1 {
    font-size: 28px
  }
}

@media (max-width: 576px) {
  .abtu .titband {
    padding: 40px 24px 24px
  }

  .abtu .storysec {
    padding: 40px 24px
  }

  .abtu .tittext h1 {
    font-size: 28px
  }

  .abtu .valgrid {
    grid-template-columns: 1fr
  }

  .abtu .imgstack {
    grid-template-columns: 1fr
  }

  .abtu .teamcard {
    flex-direction: column
  }

  .abtu .metricrow {
    flex-direction: column
  }

  .abtu .tittext p {
    text-align: left;
    align-self: flex-start
  }
}

.techreq {
  background: #fff;
  overflow-x: clip
}

.techreq .divider {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 0 80px
}

.techreq .divider span {
  display: block;
  border-top: 2px dotted #6E0CC3;
  opacity: .18
}

.techreq .req-hero {
  display: grid;
  grid-template-columns: 1fr 1fr;
  min-height: 520px;
  max-width: 100%;
  position: relative
}

.techreq .req-hero-left {
  position: relative;
  background: #0d0118;
  padding: 80px 40px 80px 80px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  overflow: hidden
}

.techreq .req-hero-grain {
  position: absolute;
  inset: 0;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.08'/%3E%3C/svg%3E");
  opacity: .4;
  pointer-events: none
}

.techreq .req-hero-curves {
  position: absolute;
  inset: 0;
  pointer-events: none;
  overflow: hidden
}

.techreq .req-hero-curves svg {
  position: absolute;
  width: 100%;
  height: 100%
}

.techreq .req-hero-label {
  font-size: 16px;
  letter-spacing: .12em;
  color: #05C9C6;
  font-weight: 600;
  margin-bottom: 24px;
  text-transform: uppercase;
  position: relative;
  display: flex;
  align-items: center;
  gap: 8px
}

.techreq .req-hero-label::before {
  content: '';
  display: inline-block;
  width: 18px;
  height: 3px;
  background: linear-gradient(to right, #6E0CC3, #05C9C6);
  border-radius: 0;
  flex-shrink: 0
}

.techreq .req-hero-h1 {
  font-size: 72px;
  line-height: 1.1;
  font-weight: 800;
  color: #fff;
  margin: 0 0 24px;
  position: relative
}

.techreq .req-hero-h1 em {
  font-style: normal;
  background: linear-gradient(to left, #6E0CC3, #FBC200);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text
}

.techreq .req-hero-desc {
  font-size: 18px;
  line-height: 1.55;
  color: #ffffffb8;
  max-width: 420px;
  margin: 0;
  position: relative
}

.techreq .req-hero-right {
  position: relative;
  overflow: hidden
}

.techreq .req-hero-right img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block
}

.techreq .req-hero-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, #0d0118 0%, #6e0cc359 50%, transparent 100%);
  pointer-events: none
}

.techreq .req-specs {
  max-width: 1320px;
  margin: 0 auto;
  padding: 80px
}

.techreq .specs-head {
  display: grid;
  grid-template-columns: 1fr 2fr;
  gap: 80px;
  margin-bottom: 80px;
  align-items: start
}

.techreq .specs-head-label {
  font-size: 16px;
  letter-spacing: .1em;
  color: #6E0CC3;
  font-weight: 700;
  text-transform: uppercase;
  margin-bottom: 8px
}

.techreq .specs-head-h2 {
  font-size: 28px;
  line-height: 1.35;
  font-weight: 800;
  color: #111;
  margin: 0 0 8px;
  position: relative;
  display: inline-block
}

.techreq .specs-head-h2::after {
  content: '';
  display: block;
  height: 3px;
  width: 100%;
  background: linear-gradient(to left, #6E0CC3, #FBC200);
  border-radius: 0;
  margin-top: 8px
}

.techreq .specs-head-note {
  font-size: 18px;
  line-height: 1.55;
  color: #333;
  margin: 0
}

.techreq .specs-featured {
  background: #f5eeff;
  border-radius: 22px;
  padding: 40px;
  box-shadow: 2px 5px 25px -1px #6e0cc317 inset 0 2px 8px #6e0cc30f;
  margin-bottom: 80px;
  display: grid;
  grid-template-columns: auto 1fr auto 1fr;
  gap: 24px;
  align-items: start
}

.techreq .feat-label {
  font-size: 16px;
  letter-spacing: .08em;
  color: #6E0CC3;
  font-weight: 700;
  text-transform: uppercase;
  padding-top: 4px;
  white-space: nowrap
}

.techreq .feat-text {
  font-size: 18px;
  line-height: 1.55;
  color: #222;
  margin: 0;
  border-right: 1px dashed #6e0cc340;
  padding-right: 24px
}

.techreq .feat-text:last-child {
  border-right: none;
  padding-right: 0
}

.techreq .specs-numlist {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 40px
}

.techreq .specs-numlist li {
  display: grid;
  grid-template-columns: 80px 1fr;
  gap: 40px;
  align-items: start;
  padding-bottom: 40px;
  border-bottom: 1px dashed #6e0cc326;
  position: relative
}

.techreq .specs-numlist li:last-child {
  border-bottom: none;
  padding-bottom: 0
}

.techreq .num-anchor {
  font-size: 72px;
  line-height: 1.1;
  font-weight: 800;
  color: transparent;
  -webkit-text-stroke: 2px #6e0cc32e;
  user-select: none;
  flex-shrink: 0
}

.techreq .num-body {
  display: flex;
  flex-direction: column;
  gap: 8px
}

.techreq .num-title {
  font-size: 28px;
  line-height: 1.35;
  font-weight: 700;
  color: #111;
  margin: 0;
  display: flex;
  align-items: center;
  gap: 8px
}

.techreq .num-title .icon-prefix {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  background: linear-gradient(to left, #6E0CC3, #05C9C6);
  border-radius: 10px;
  flex-shrink: 0
}

.techreq .num-title .icon-prefix svg {
  width: 16px;
  height: 16px;
  fill: #fff
}

.techreq .num-desc {
  font-size: 18px;
  line-height: 1.55;
  color: #333;
  margin: 0
}

.techreq .specs-cards {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
  margin-top: 80px
}

.techreq .spec-card {
  background: #fff;
  border-radius: 22px;
  padding: 40px 24px;
  box-shadow: 2px 3px 2px -1px #6e0cc312 2px 9px 36px -1px #6e0cc31a;
  display: flex;
  flex-direction: column;
  gap: 8px;
  position: relative;
  border: 1.5px solid transparent;
  transition: border-color .15s cubic-bezier(0.4, 0, 1, 1), border-radius .12s cubic-bezier(0.4, 0, 1, 1);
  text-align: center;
  align-items: center
}

.techreq .spec-card:hover {
  border-color: #6E0CC3;
  border-radius: 10px
}

.techreq .spec-card-icon {
  width: 48px;
  height: 48px;
  background: linear-gradient(to left, #6E0CC3, #FBC200);
  border-radius: 22px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 8px;
  transition: border-radius .1s cubic-bezier(0.4, 0, 1, 1)
}

.techreq .spec-card:hover .spec-card-icon {
  border-radius: 10px
}

.techreq .spec-card-icon svg {
  width: 24px;
  height: 24px;
  fill: #fff
}

.techreq .spec-card h4 {
  font-size: 18px;
  line-height: 1.35;
  font-weight: 700;
  color: #111;
  margin: 0
}

.techreq .spec-card p {
  font-size: 16px;
  line-height: 1.55;
  color: #444;
  margin: 0
}

.techreq .specs-compat {
  margin-top: 80px;
  background: #0d0118;
  border-radius: 22px;
  padding: 40px;
  position: relative;
  overflow: hidden;
  box-shadow: 2px 9px 36px -1px #6e0cc31a
}

.techreq .compat-bg {
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse at 30% 50%, #6e0cc359 0%, transparent 65%), radial-gradient(ellipse at 80% 20%, #05c9c626 0%, transparent 50%);
  pointer-events: none
}

.techreq .compat-inner {
  position: relative;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 40px;
  align-items: center
}

.techreq .compat-text h3 {
  font-size: 28px;
  line-height: 1.35;
  font-weight: 700;
  color: #fff;
  margin: 0 0 24px
}

.techreq .compat-text p {
  font-size: 18px;
  line-height: 1.55;
  color: #ffffffb8;
  margin: 0
}

.techreq .compat-img-wrap {
  border-radius: 10px;
  overflow: hidden;
  aspect-ratio: 16/10;
  position: relative
}

.techreq .compat-img-wrap img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block
}

.techreq .compat-img-fade {
  position: absolute;
  inset: 0;
  background: linear-gradient(to right, #0d0118 0%, transparent 40%, transparent 60%, #0d011899 100%);
  pointer-events: none
}

.techreq .specs-testimonial {
  margin-top: 80px;
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 40px;
  align-items: start;
  background: #fff9e6;
  border-radius: 22px;
  padding: 40px;
  box-shadow: 2px 5px 25px -1px #fbc20017 inset 0 2px 6px #fbc20012
}

.techreq .testi-portrait {
  width: 140px;
  height: 180px;
  overflow: hidden;
  flex-shrink: 0
}

.techreq .testi-portrait img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block
}

.techreq .testi-body {
  display: flex;
  flex-direction: column;
  gap: 8px
}

.techreq .testi-quote {
  font-size: 18px;
  line-height: 1.55;
  color: #222;
  margin: 0;
  font-style: italic
}

.techreq .testi-name {
  font-size: 16px;
  font-weight: 700;
  color: #6E0CC3;
  letter-spacing: .05em;
  margin: 0
}

.techreq .testi-role {
  font-size: 16px;
  color: #555;
  margin: 0
}

@media (max-width: 992px) {
  .techreq .req-hero {
    grid-template-columns: 1fr
  }

  .techreq .req-hero-right {
    height: 320px
  }

  .techreq .req-hero-left {
    padding: 80px 24px
  }

  .techreq .req-hero-h1 {
    font-size: 28px
  }

  .techreq .req-specs {
    padding: 80px 24px
  }

  .techreq .specs-head {
    grid-template-columns: 1fr;
    gap: 24px;
    margin-bottom: 40px
  }

  .techreq .specs-featured {
    grid-template-columns: 1fr
  }

  .techreq .feat-text {
    border-right: none;
    padding-right: 0;
    border-bottom: 1px dashed #6e0cc333;
    padding-bottom: 24px
  }

  .techreq .feat-text:last-child {
    border-bottom: none;
    padding-bottom: 0
  }

  .techreq .specs-cards {
    grid-template-columns: 1fr
  }

  .techreq .compat-inner {
    grid-template-columns: 1fr
  }

  .techreq .specs-testimonial {
    grid-template-columns: 1fr
  }

  .techreq .divider {
    padding: 0 24px
  }
}

@media (max-width: 576px) {
  .techreq .specs-numlist li {
    grid-template-columns: 48px 1fr;
    gap: 24px
  }

  .techreq .num-anchor {
    font-size: 28px
  }

  .techreq .specs-featured {
    padding: 24px
  }
}

.frst {
  overflow-x: hidden;
  background: #fff
}

.frst * {
  box-sizing: border-box;
  max-width: 100%
}

.frst img {
  max-width: 100%;
  object-fit: cover
}

@keyframes wordIn {
  from {
    opacity: 0;
    transform: translateY(18px)
  }

  to {
    opacity: 1;
    transform: translateY(0)
  }
}

@keyframes fadeImg {
  from {
    opacity: 0
  }

  to {
    opacity: 1
  }
}

@keyframes rotateSlow {
  from {
    transform: rotate(0deg)
  }

  to {
    transform: rotate(360deg)
  }
}

.frst .tband {
  position: relative;
  padding: 40px 24px;
  background: #fff;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  gap: 40px;
  max-width: 1320px;
  margin: 0 auto
}

.frst .tband-img {
  width: 220px;
  height: 160px;
  border-radius: 22px;
  overflow: hidden;
  flex-shrink: 0;
  animation: fadeImg .8s cubic-bezier(0.4, 0, 1, 1) both;
  position: relative
}

.frst .tband-img.left {
  animation-delay: .1s
}

.frst .tband-img.right {
  animation-delay: .25s
}

.frst .tband-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  border-radius: 22px;
  transition: border .15s cubic-bezier(0.4, 0, 1, 1)
}

.frst .tband-img:hover img {
  box-shadow: 0 0 0 3px #6E0CC3;
  border-radius: 10px
}

.frst .tband-text {
  text-align: center;
  max-width: 480px
}

.frst .tband-num {
  font-size: 72px;
  line-height: 1.1;
  font-weight: 900;
  background: linear-gradient(to left, #6E0CC3, #2a0050);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  display: block;
  letter-spacing: -2px
}

.frst .tband-head {
  font-size: 28px;
  line-height: 1.35;
  font-weight: 700;
  color: #1b0033;
  margin: 8px 0
}

.frst .tband-sub {
  font-size: 16px;
  line-height: 1.55;
  color: #3a2a50
}

.frst .tband-word {
  display: inline-block;
  opacity: 0;
  animation: wordIn .15s cubic-bezier(0.4, 0, 1, 1) forwards
}

.frst .wave-div {
  display: block;
  width: 100%;
  line-height: 0;
  overflow: hidden
}

.frst .outcome {
  background: linear-gradient(to left, #f3ecff, #fff);
  padding: 80px 24px;
  position: relative
}

.frst .outcome-geo {
  position: absolute;
  top: 40px;
  right: 40px;
  width: 180px;
  height: 180px;
  border: 2px solid #6e0cc314;
  border-radius: 38px;
  animation: rotateSlow 18s linear infinite;
  pointer-events: none
}

.frst .outcome-inner {
  max-width: 1320px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 40px;
  align-items: center
}

.frst .outcome-copy {
  text-align: center
}

.frst .outcome-label {
  font-size: 16px;
  line-height: 1.35;
  letter-spacing: .12em;
  color: #6E0CC3;
  font-weight: 700;
  text-transform: uppercase;
  margin-bottom: 8px
}

.frst .outcome-h {
  font-size: 28px;
  line-height: 1.35;
  font-weight: 700;
  color: #1b0033;
  margin-bottom: 24px
}

.frst .outcome-p {
  font-size: 16px;
  line-height: 1.55;
  color: #2e1f45;
  margin-bottom: 24px
}

.frst .outcome-stats {
  display: flex;
  flex-direction: row;
  gap: 24px;
  justify-content: center
}

.frst .stat-item {
  background: #fff;
  border-radius: 22px;
  padding: 24px;
  text-align: center;
  box-shadow: 2px 5px 25px -1px #6e0cc317;
  flex: 1
}

.frst .stat-num {
  font-size: 28px;
  line-height: 1.1;
  font-weight: 900;
  color: #6E0CC3;
  display: block
}

.frst .stat-desc {
  font-size: 16px;
  line-height: 1.35;
  color: #3a2a50;
  margin-top: 8px
}

.frst .outcome-imgwrap {
  border-radius: 22px;
  overflow: hidden;
  height: 320px;
  position: relative
}

.frst .outcome-imgwrap img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 22px;
  transition: border-radius .15s cubic-bezier(0.4, 0, 1, 1)
}

.frst .outcome-imgwrap:hover img {
  border-radius: 10px;
  box-shadow: 0 0 0 3px #FBC200
}

.frst .concave-div {
  display: block;
  width: 100%;
  line-height: 0;
  overflow: hidden
}

.frst .fitcheck {
  padding: 80px 24px;
  background: #fff
}

.frst .fitcheck-inner {
  max-width: 1320px;
  margin: 0 auto
}

.frst .fitcheck-head {
  font-size: 28px;
  line-height: 1.35;
  font-weight: 300;
  color: #1b0033;
  text-align: center;
  margin-bottom: 40px
}

.frst .fitcheck-head strong {
  font-weight: 700;
  color: #6E0CC3
}

.frst .fitcheck-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px
}

.frst .fitcard {
  border-radius: 22px;
  padding: 24px;
  text-align: center;
  box-shadow: 2px 3px 2px -1px #6e0cc312;
  transition: border-radius .12s cubic-bezier(0.4, 0, 1, 1);
  position: relative
}

.frst .fitcard.yes {
  background: #f3ecff;
  border: 1.5px solid #6e0cc31f
}

.frst .fitcard.no {
  background: #fff8e1;
  border: 1.5px solid #fbc20040
}

.frst .fitcard:hover {
  border-radius: 10px
}

.frst .fitcard-label {
  font-size: 16px;
  line-height: 1.35;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
  margin-bottom: 24px
}

.frst .fitcard.yes .fitcard-label {
  color: #6E0CC3
}

.frst .fitcard.no .fitcard-label {
  color: #b08800
}

.frst .fitcard-item {
  font-size: 16px;
  line-height: 1.55;
  color: #2e1f45;
  padding: 8px 0;
  border-bottom: 1px solid #6e0cc312
}

.frst .fitcard-item:last-child {
  border-bottom: none
}

.frst .offer {
  background: linear-gradient(to left, #0a0020, #1b0033);
  padding: 80px 24px;
  position: relative;
  overflow: hidden
}

.frst .offer-pattern {
  position: absolute;
  inset: 0;
  background-image: repeating-linear-gradient(45deg, #6e0cc30a 0px, #6e0cc30a 1px, transparent 1px, transparent 40px);
  pointer-events: none
}

.frst .offer-geo {
  position: absolute;
  bottom: -60px;
  left: -60px;
  width: 240px;
  height: 240px;
  border: 2px solid #fbc20012;
  border-radius: 38px;
  animation: rotateSlow 24s linear infinite reverse;
  pointer-events: none
}

.frst .offer-inner {
  max-width: 1320px;
  margin: 0 auto;
  position: relative
}

.frst .offer-h {
  font-size: 28px;
  line-height: 1.35;
  font-weight: 700;
  color: #fff;
  text-align: center;
  margin-bottom: 8px
}

.frst .offer-sub {
  font-size: 16px;
  line-height: 1.55;
  color: #ffffffa6;
  text-align: center;
  margin-bottom: 40px
}

.frst .offer-list {
  display: flex;
  flex-direction: column;
  gap: 24px
}

.frst .offercard {
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 24px;
  background: #ffffff0a;
  border: 1px solid #6e0cc333;
  border-radius: 22px;
  padding: 24px;
  transition: border-color .15s cubic-bezier(0.4, 0, 1, 1), border-radius .12s cubic-bezier(0.4, 0, 1, 1)
}

.frst .offercard:hover {
  border-color: #fbc20066;
  border-radius: 10px
}

.frst .offercard-icon {
  width: 48px;
  height: 48px;
  border-radius: 22px;
  background: #6e0cc340;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  transition: border-radius .12s cubic-bezier(0.4, 0, 1, 1)
}

.frst .offercard:hover .offercard-icon {
  border-radius: 10px
}

.frst .offercard-icon i {
  color: #FBC200;
  font-size: 22px
}

.frst .offercard-name {
  font-size: 18px;
  line-height: 1.35;
  font-weight: 700;
  color: #fff;
  margin-bottom: 8px
}

.frst .offercard-desc {
  font-size: 16px;
  line-height: 1.55;
  color: #fff9
}

.frst .offercard-tag {
  font-size: 16px;
  line-height: 1.35;
  color: #FBC200;
  font-weight: 700;
  white-space: nowrap;
  padding: 8px 24px;
  border: 1px solid #fbc2004d;
  border-radius: 10px
}

.frst .doubt {
  padding: 80px 24px;
  background: #fff;
  position: relative
}

.frst .doubt-inner {
  max-width: 960px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 40px;
  align-items: start
}

.frst .doubt-q {
  text-align: center
}

.frst .doubt-qmark {
  font-size: 72px;
  line-height: 1.1;
  font-weight: 900;
  color: #6e0cc314;
  display: block;
  margin-bottom: 8px
}

.frst .doubt-qtext {
  font-size: 28px;
  line-height: 1.35;
  font-weight: 700;
  color: #1b0033
}

.frst .doubt-a {
  text-align: center
}

.frst .doubt-a-h {
  font-size: 18px;
  line-height: 1.35;
  font-weight: 700;
  color: #6E0CC3;
  margin-bottom: 24px
}

.frst .doubt-a-p {
  font-size: 16px;
  line-height: 1.55;
  color: #2e1f45;
  margin-bottom: 24px
}

.frst .codeblock {
  max-width: 1320px;
  margin: 0 auto;
  margin-top: 40px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px
}

.frst .codepanel {
  border-radius: 22px;
  overflow: hidden;
  box-shadow: 2px 9px 36px -1px #6e0cc31a
}

.frst .codepanel-head {
  padding: 8px 24px;
  font-size: 16px;
  line-height: 1.35;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase
}

.frst .codepanel.before .codepanel-head {
  background: #f5e6ff;
  color: #6E0CC3
}

.frst .codepanel.after .codepanel-head {
  background: #e6fffe;
  color: #028c8a
}

.frst .codepanel-body {
  background: #fafbff;
  padding: 24px
}

.frst .codeline {
  font-size: 16px;
  line-height: 1.55;
  color: #2e1f45;
  padding: 8px 0;
  border-bottom: 1px solid #6e0cc30f;
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 8px
}

.frst .codeline:last-child {
  border-bottom: none
}

.frst .codeline-dot {
  width: 8px;
  height: 8px;
  border-radius: 38px;
  flex-shrink: 0
}

.frst .codepanel.before .codeline-dot {
  background: #FBC200
}

.frst .codepanel.after .codeline-dot {
  background: #05C9C6
}

.frst .journey {
  background: linear-gradient(to left, #f3ecff, #e6fffe);
  padding: 80px 24px;
  position: relative
}

.frst .journey-inner {
  max-width: 1320px;
  margin: 0 auto
}

.frst .journey-h {
  font-size: 28px;
  line-height: 1.35;
  font-weight: 300;
  color: #1b0033;
  text-align: center;
  margin-bottom: 40px
}

.frst .journey-h strong {
  font-weight: 700
}

.frst .journey-track {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px
}

.frst .jstep {
  background: #fff;
  border-radius: 22px;
  padding: 24px;
  text-align: center;
  box-shadow: 2px 5px 25px -1px #6e0cc317;
  transition: border-radius .12s cubic-bezier(0.4, 0, 1, 1);
  position: relative
}

.frst .jstep:hover {
  border-radius: 10px
}

.frst .jstep-num {
  font-size: 28px;
  line-height: 1.1;
  font-weight: 900;
  color: #6e0cc31f;
  margin-bottom: 8px
}

.frst .jstep-icon {
  width: 48px;
  height: 48px;
  border-radius: 22px;
  background: linear-gradient(to left, #6E0CC3, #2a0050);
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  margin: 0 auto 24px;
  transition: border-radius .12s cubic-bezier(0.4, 0, 1, 1)
}

.frst .jstep:hover .jstep-icon {
  border-radius: 10px
}

.frst .jstep-icon i {
  color: #fff;
  font-size: 22px
}

.frst .jstep-name {
  font-size: 18px;
  line-height: 1.35;
  font-weight: 700;
  color: #1b0033;
  margin-bottom: 8px
}

.frst .jstep-desc {
  font-size: 16px;
  line-height: 1.55;
  color: #3a2a50
}

.frst .journey-imgrow {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
  margin-top: 40px
}

.frst .journey-imgwrap {
  border-radius: 22px;
  overflow: hidden;
  height: 240px;
  position: relative
}

.frst .journey-imgwrap img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 22px;
  transition: border-radius .15s cubic-bezier(0.4, 0, 1, 1)
}

.frst .journey-imgwrap:hover img {
  border-radius: 10px;
  box-shadow: 0 0 0 3px #6E0CC3
}

.frst .team {
  padding: 80px 24px;
  background: #fff;
  position: relative
}

.frst .team-inner {
  max-width: 1320px;
  margin: 0 auto
}

.frst .team-h {
  font-size: 28px;
  line-height: 1.35;
  font-weight: 700;
  color: #1b0033;
  text-align: center;
  margin-bottom: 8px
}

.frst .team-sub {
  font-size: 16px;
  line-height: 1.55;
  color: #3a2a50;
  text-align: center;
  margin-bottom: 40px
}

.frst .team-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 40px;
  align-items: start
}

.frst .teamcard {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 24px;
  background: #f3ecff;
  border-radius: 22px;
  padding: 40px 24px;
  text-align: center;
  box-shadow: 2px 3px 2px -1px #6e0cc312;
  transition: border-radius .12s cubic-bezier(0.4, 0, 1, 1)
}

.frst .teamcard:hover {
  border-radius: 10px
}

.frst .teamcard-portrait {
  width: 88px;
  height: 88px;
  border-radius: 38px;
  overflow: hidden;
  flex-shrink: 0;
  box-shadow: 2px 5px 25px -1px #6e0cc317;
  transition: border-radius .12s cubic-bezier(0.4, 0, 1, 1)
}

.frst .teamcard:hover .teamcard-portrait {
  border-radius: 22px
}

.frst .teamcard-portrait img {
  width: 88px;
  height: 88px;
  object-fit: cover;
  object-position: center;
  display: block
}

.frst .teamcard-name {
  font-size: 18px;
  line-height: 1.35;
  font-weight: 700;
  color: #1b0033
}

.frst .teamcard-role {
  font-size: 16px;
  line-height: 1.35;
  color: #6E0CC3;
  font-weight: 700;
  margin-top: 8px
}

.frst .teamcard-bio {
  font-size: 16px;
  line-height: 1.55;
  color: #2e1f45
}

.frst .reveal-wrap {
  position: relative;
  display: inline-block
}

.frst .reveal-cover {
  position: absolute;
  inset: 0;
  background: #f3ecff;
  border-radius: 10px;
  transition: opacity .15s cubic-bezier(0.4, 0, 1, 1);
  pointer-events: none
}

.frst .reveal-trigger:focus .reveal-cover,
.frst .reveal-trigger:focus-within .reveal-cover {
  opacity: 0
}

.frst .reveal-trigger {
  outline: none
}

.frst .reveal-trigger:focus {
  outline: 2px solid #6E0CC3;
  border-radius: 10px
}

@media (max-width: 992px) {
  .frst .tband {
    flex-direction: column;
    gap: 24px
  }

  .frst .tband-img {
    width: 160px;
    height: 120px
  }

  .frst .outcome-inner {
    grid-template-columns: 1fr
  }

  .frst .fitcheck-grid {
    grid-template-columns: 1fr
  }

  .frst .doubt-inner {
    grid-template-columns: 1fr
  }

  .frst .codeblock {
    grid-template-columns: 1fr
  }

  .frst .journey-track {
    grid-template-columns: 1fr
  }

  .frst .journey-imgrow {
    grid-template-columns: 1fr
  }

  .frst .team-grid {
    grid-template-columns: 1fr
  }

  .frst .offercard {
    grid-template-columns: auto 1fr
  }

  .frst .offercard-tag {
    display: none
  }
}

@media (max-width: 576px) {
  .frst .tband-num {
    font-size: 28px
  }

  .frst .tband-head {
    font-size: 18px
  }

  .frst .outcome-stats {
    flex-direction: column
  }

  .frst .tband-img {
    display: none
  }
}

.successPage {
  min-height: 60vh;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 80px 24px;
  background: #fff
}

.successPage .successCard {
  max-width: 560px;
  width: 100%;
  background: #faf7ff;
  border-radius: 22px;
  padding: 40px;
  text-align: center;
  box-shadow: 2px 9px 36px -1px #6e0cc31a
}

.successPage .successIcon {
  width: 64px;
  height: 64px;
  margin: 0 auto 24px;
  display: block
}

.successPage .successHeading {
  font-size: 28px;
  font-weight: 700;
  line-height: 1.1;
  color: #6E0CC3;
  margin: 0 0 24px;
  letter-spacing: -.01em
}

.successPage .successHeading span {
  display: inline-block;
  position: relative
}

.successPage .successHeading span::after {
  content: '';
  display: block;
  height: 3px;
  border-radius: 0;
  margin-top: 8px;
  background: linear-gradient(to left, #6E0CC3, #05C9C6)
}

.successPage .successBody {
  font-size: 18px;
  line-height: 1.55;
  color: #2a2040;
  margin: 0 0 40px
}

.successPage .successReturn {
  display: inline-flex;
  flex-direction: row;
  align-items: center;
  gap: 8px;
  padding: 24px 40px;
  background: #6E0CC3;
  color: #fff;
  font-size: 16px;
  font-weight: 600;
  line-height: 1.1;
  text-decoration: none;
  border-radius: 10px;
  border: 2px solid #6E0CC3;
  letter-spacing: .04em;
  transition: border-color .14s cubic-bezier(0.4, 0, 1, 1), border-radius .12s cubic-bezier(0.4, 0, 1, 1)
}

.successPage .successReturn:hover {
  border-color: #05C9C6;
  border-radius: 22px
}

.successPage .successReturn:focus-visible {
  outline: 3px solid #FBC200;
  outline-offset: 3px
}

.successPage .successReturn svg {
  width: 18px;
  height: 18px;
  flex-shrink: 0
}

@media (max-width: 576px) {
  .successPage {
    padding: 40px 24px
  }

  .successPage .successCard {
    padding: 40px 24px
  }

  .successPage .successHeading {
    font-size: 28px
  }

  .successPage .successReturn {
    padding: 24px
  }
}