@font-face {
  font-family: "Cygre";
  src: local("Cygre Book"), local("Cygre-Book"), url("assets/fonts/Cygre-Book.ttf") format("truetype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Cygre";
  src: local("Cygre Medium"), local("Cygre-Medium"), url("assets/fonts/Cygre-Medium.ttf") format("truetype");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Cygre";
  src: local("Cygre SemiBold"), local("Cygre-SemiBold"), url("assets/fonts/Cygre-SemiBold.ttf") format("truetype");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

:root {
  --color-bg: #020005;
  --color-text: #f3f3f3;
  --color-muted: #b5b3bb;
  --color-violet: #9673f5;
  --color-violet-light: #f3f0fd;
  --color-violet-accent: #b69bfd;
  --color-card-title: #212629;
  --color-card-text: #32115e;
  --font-display: "Unbounded", Arial, sans-serif;
  --font-body: "Cygre", Arial, sans-serif;
  --lh-display: 1.24;
  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
  --transition: 0.3s ease;
  --glass: rgba(255, 255, 255, 0.2) 1.0959%, rgba(150, 115, 245, 0.2) 188.21%;
  --glass-light: rgba(255, 255, 255, 0.1) 1.0959%, rgba(150, 115, 245, 0.1) 188.21%;
  --glass-cta: rgba(255, 255, 255, 0.1) 2.8102%, rgba(150, 115, 245, 0.1) 103.37%;
  --text-gradient: #fff 1.0959%, var(--color-violet) 188.21%;
  --title-gradient-compact: #fff 1.0963%, var(--color-violet) 187.74%;
  --title-gradient: #fff 9.5436%, var(--color-violet) 190.32%;
  --btn-shadow: drop-shadow(0 75px 10.5px rgba(17, 11, 28, 0.01)) drop-shadow(0 48px 9.5px rgba(17, 11, 28, 0.07)) drop-shadow(0 27px 8px rgba(17, 11, 28, 0.23)) drop-shadow(0 12px 6px rgba(17, 11, 28, 0.38)) drop-shadow(0 3px 3.5px rgba(17, 11, 28, 0.44));
  --btn-shadow-none: drop-shadow(0 0 0 rgba(17, 11, 28, 0)) drop-shadow(0 0 0 rgba(17, 11, 28, 0)) drop-shadow(0 0 0 rgba(17, 11, 28, 0)) drop-shadow(0 0 0 rgba(17, 11, 28, 0)) drop-shadow(0 0 0 rgba(185, 162, 248, 0));
  --btn-glow: drop-shadow(0 0 0 rgba(17, 11, 28, 0)) drop-shadow(0 0 0 rgba(17, 11, 28, 0)) drop-shadow(0 0 0 rgba(17, 11, 28, 0)) drop-shadow(0 0 0 rgba(17, 11, 28, 0)) drop-shadow(0 0 12px rgba(185, 162, 248, 0.5));
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

* {
  margin: 0;
}

html {
  font-size: min(calc(100vw / 44), 14px);
  scroll-behavior: smooth;
}

@media (min-width: 768px) {
  html {
    font-size: min(calc(100vw / 83.4), 10px);
  }
}

@media (min-width: 1200px) {
  html {
    font-size: max(6px, min(10px, calc((100vw - 80px) / 132), calc(100vh / 129.4)));
  }
}

body {
  font-family: var(--font-body);
  font-size: 1.6rem;
  line-height: 1.5;
  color: var(--color-text);
  background: var(--color-bg);
  -webkit-font-smoothing: antialiased;
}

img {
  display: block;
  max-width: none;
}

button {
  padding: 0;
  font: inherit;
  color: inherit;
  background: none;
  border: none;
  cursor: pointer;
}

a {
  color: inherit;
  text-decoration: none;
}

h1,
h2,
h3 {
  font-size: inherit;
  font-weight: inherit;
}

.page {
  position: relative;
  overflow: hidden;
  overflow: clip;
}

.container {
  position: relative;
  width: 40.8rem;
  margin-inline: auto;
}

@media (min-width: 768px) {
  .container {
    width: 72rem;
  }
}

@media (min-width: 1200px) {
  .container {
    width: 132rem;
  }
}

.text-lower {
  text-transform: none;
}

.text-bold {
  font-weight: 700;
}

.text-black {
  font-weight: 900;
}

.br-desktop,
.br-wide {
  display: none;
}

@media (min-width: 768px) {
  .br-wide {
    display: inline;
  }
}

@media (min-width: 1200px) {
  .br-desktop {
    display: inline;
  }
}

.nav {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1rem;
}

.nav-link {
  position: relative;
  display: block;
  font-family: var(--font-body);
  font-weight: 500;
  font-size: 1.2rem;
  line-height: 1.9rem;
  text-transform: uppercase;
  white-space: nowrap;
}

.nav-link::after {
  content: "";
  position: absolute;
  top: 100%;
  left: 0;
  width: 100%;
  height: 1px;
  background: linear-gradient(90deg, #fff 0%, #c9b8fa 100%);
  transform: scaleX(0);
  transform-origin: right center;
  transition: transform 0.35s cubic-bezier(0.65, 0, 0.35, 1);
}

.nav-link:focus-visible::after {
  transform: scaleX(1);
  transform-origin: left center;
}

@media (hover: hover) {
  .nav-link:hover::after {
    transform: scaleX(1);
    transform-origin: left center;
  }
}

@media (min-width: 768px) {
  .nav {
    flex-direction: row;
    justify-content: center;
    gap: 5rem;
  }

  .nav-link {
    font-size: 1.6rem;
    line-height: 2.6rem;
  }
}

.btn {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.4rem;
  width: fit-content;
  margin-inline: auto;
  padding: 0.5rem 0.5rem 0.5rem 2rem;
  color: #000;
  border: 1px solid #fff;
  border-radius: 6rem;
  background-image: linear-gradient(119.96deg, #fff 0%, var(--color-violet) 127.3%);
  filter: var(--btn-shadow);
  transition: border-color var(--transition), filter var(--transition), scale 0.15s ease;
}

.btn::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background-image: linear-gradient(126.08deg, #fff -113.54%, var(--color-violet) 272.65%);
  opacity: 0;
  transition: opacity var(--transition);
}

.btn-text {
  position: relative;
  font-family: var(--font-display);
  font-weight: 600;
  font-size: 1.6rem;
  line-height: var(--lh-display);
  text-align: center;
  text-transform: uppercase;
}

.btn-arrow {
  position: relative;
  flex-shrink: 0;
  width: 5.6rem;
  height: 5.6rem;
  transition: transform var(--transition);
}

.btn:focus-visible {
  border-color: var(--color-violet);
  filter: var(--btn-glow);
}

.btn:focus-visible::before {
  opacity: 1;
}

.btn:focus-visible .btn-arrow {
  transform: rotate(-15deg) scale(1.03);
}

.btn:active {
  scale: 0.97;
}

@media (hover: hover) {
  .btn:hover {
    border-color: var(--color-violet);
    filter: var(--btn-glow);
  }

  .btn:hover::before {
    opacity: 1;
  }

  .btn:hover .btn-arrow {
    transform: rotate(-15deg) scale(1.03);
  }
}

@media (min-width: 768px) {
  .btn {
    gap: 0.7rem;
    padding: 1.5rem 1.5rem 1.5rem 3rem;
    background-image: linear-gradient(120.56deg, #fff 0%, var(--color-violet) 127.3%);
  }

  .btn::before {
    background-image: linear-gradient(126.73deg, #fff -113.54%, var(--color-violet) 272.65%);
  }

  .btn-text {
    font-size: 2.2rem;
    white-space: nowrap;
  }
}

@media (min-width: 1200px) {
  .btn {
    gap: 1.2rem;
    padding: 2.4rem 2.4rem 2.4rem 5rem;
    border-width: 2px;
    border-radius: 10rem;
    background-image: linear-gradient(120.54deg, #fff 0%, var(--color-violet) 127.3%);
    filter: var(--btn-shadow-none);
  }

  .btn::before {
    background-image: linear-gradient(126.64deg, #fff -113.54%, var(--color-violet) 272.65%);
  }

  .btn-text {
    font-size: 2.957rem;
  }

  .btn-arrow {
    width: 8.6256rem;
    height: 8.6256rem;
  }
}

.marquee {
  position: relative;
  z-index: 2;
  padding-left: 1.6rem;
  overflow: hidden;
}

.marquee-track {
  display: flex;
  width: max-content;
}

.marquee-item {
  flex-shrink: 0;
  padding-right: 6rem;
  font-family: var(--font-display);
  font-weight: 200;
  text-transform: uppercase;
  white-space: nowrap;
  opacity: 0.8;
}

@media (min-width: 768px) {
  .marquee {
    padding-left: 3rem;
  }

  .marquee-item {
    padding-right: 8rem;
  }
}

@media (min-width: 1200px) {
  .marquee {
    padding-left: 4rem;
  }

  .marquee-item {
    padding-right: 10rem;
  }
}

.header {
  position: relative;
  z-index: 3;
}

.header-inner {
  padding-top: 6rem;
}

.header-nav {
  display: none;
}

.menu-toggle {
  display: block;
  margin-inline: auto;
  font-family: var(--font-body);
  font-weight: 500;
  font-size: 1.2rem;
  line-height: 1.9rem;
  text-transform: uppercase;
}

.mobile-menu {
  position: fixed;
  top: 0;
  left: 50%;
  z-index: 10;
  display: flex;
  justify-content: center;
  width: 44rem;
  padding: 6rem 0 3.7rem;
  background: rgba(2, 0, 5, 0.7);
  -webkit-backdrop-filter: blur(15px);
  backdrop-filter: blur(15px);
  visibility: hidden;
  transform: translate(-50%, -100%);
  transition: transform 0.4s ease, visibility 0s linear 0.4s;
}

.mobile-menu.is-open {
  visibility: visible;
  transform: translate(-50%, 0);
  transition: transform 0.4s ease, visibility 0s linear 0s;
}

.mobile-menu-nav {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1rem;
}

.mobile-menu-link {
  font-family: var(--font-body);
  font-weight: 500;
  font-size: 1.2rem;
  line-height: 1.9rem;
  text-transform: uppercase;
  white-space: nowrap;
}

@media (min-width: 768px) {
  .header-inner {
    padding-top: 5rem;
  }

  .header-nav {
    display: flex;
  }

  .menu-toggle,
  .mobile-menu {
    display: none;
  }
}

.decor {
  position: absolute;
  top: 0;
  left: 50%;
  z-index: 1;
  width: 44rem;
  height: 100%;
  margin-left: -22rem;
  pointer-events: none;
}

.decor-glow,
.decor-blob {
  position: absolute;
}

.decor-blob-image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  animation: float var(--float-duration, 9s) ease-in-out var(--float-delay, 0s) infinite;
}

.decor-glow-left,
.decor-blob-left {
  display: none;
}

.decor-glow-right {
  top: 47.992rem;
  left: -28.437rem;
  width: 59.678rem;
  height: 59.678rem;
}

.decor-glow-bottom {
  top: 316.809rem;
  left: -8.75rem;
  width: 91.035rem;
  height: 91.035rem;
}

.decor-blob-left {
  --parallax: 6rem;
  --float-duration: 10s;
}

.decor-blob-right {
  --parallax: 8rem;
  --float-delay: -3s;
  top: 56.8rem;
  left: -17.7rem;
  width: 29.9rem;
  height: 29.9rem;
}

.decor-blob-bottom {
  --parallax: 7rem;
  --float-duration: 11s;
  --float-delay: -6s;
  top: 337.506rem;
  left: 27.601rem;
  width: 33.4673rem;
  height: 33.4673rem;
}

.decor-blob-bottom .decor-blob-image {
  transform: rotate(173.03deg) scaleY(-1);
}

@media (min-width: 768px) {
  .decor {
    width: 83.4rem;
    margin-left: -41.7rem;
  }

  .decor-glow-left,
  .decor-blob-left {
    display: block;
  }

  .decor-glow-left {
    top: 146.145rem;
    left: -84.155rem;
    width: 144.71rem;
    height: 144.71rem;
  }

  .decor-glow-right {
    top: 336.145rem;
    left: 17.345rem;
    width: 144.71rem;
    height: 144.71rem;
  }

  .decor-glow-bottom {
    top: 398.045rem;
    left: -64.455rem;
    width: 144.71rem;
    height: 144.71rem;
  }

  .decor-blob-left {
    top: 193.561rem;
    left: -26.139rem;
    width: 47.3132rem;
    height: 47.3132rem;
  }

  .decor-blob-left .decor-blob-image {
    transform: rotate(-10.34deg);
  }

  .decor-blob-right {
    top: 371.1rem;
    left: 60.3rem;
    width: 56.6rem;
    height: 56.6rem;
  }

  .decor-blob-bottom {
    top: 432.5rem;
    left: -32.2rem;
    width: 53.2rem;
    height: 53.2rem;
  }

  .decor-blob-bottom .decor-blob-image {
    transform: none;
  }
}

@media (min-width: 1200px) {
  .decor {
    width: 192rem;
    margin-left: -96rem;
  }

  .decor-glow-left {
    top: 154.5rem;
    left: -85.8rem;
    width: 169.4rem;
    height: 169.4rem;
  }

  .decor-glow-right {
    top: 228.566rem;
    left: 109.337rem;
    width: 164.864rem;
    height: 164.864rem;
  }

  .decor-glow-bottom {
    top: 401.6rem;
    left: -58.6rem;
    width: 169.4rem;
    height: 169.4rem;
  }

  .decor-blob-left {
    top: 191.258rem;
    left: -30.942rem;
    width: 68.1rem;
    height: 68.1rem;
  }

  .decor-blob-right {
    top: 252.9rem;
    left: 139rem;
    width: 82.6rem;
    height: 82.6rem;
  }

  .decor-blob-bottom {
    top: 427rem;
    left: -29.9rem;
    width: 91.2rem;
    height: 91.2rem;
  }
}

.hero {
  position: relative;
  z-index: 2;
}

.hero-inner {
  padding: 2.506rem 0 7.3rem;
}

.hero-glow,
.hero-image {
  position: absolute;
  pointer-events: none;
}

.hero-glow {
  top: -8.424rem;
  left: -16.247rem;
  width: 72.569rem;
  height: 72.378rem;
  animation: fade-in 1.6s ease 0.1s backwards;
}

.hero-image {
  top: 18.774rem;
  left: -1.6rem;
  width: 44rem;
  height: 30.1523rem;
  object-fit: cover;
  animation: zoom-in 1.2s var(--ease-out) 0.2s backwards, float 7s ease-in-out 1.4s infinite;
}

.hero-title {
  position: relative;
}

.hero-title-main {
  display: block;
  font-family: var(--font-display);
  font-weight: 600;
  font-size: 6.2969rem;
  line-height: var(--lh-display);
  text-align: center;
  text-transform: uppercase;
  white-space: nowrap;
  color: transparent;
  background-image: linear-gradient(93.26deg, #fff 0.53855%, var(--color-violet) 112.92%);
  -webkit-background-clip: text;
  background-clip: text;
  animation: rise-in 0.9s var(--ease-out) backwards;
}

.hero-title-line {
  position: relative;
  isolation: isolate;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.1rem;
  width: 32.8rem;
  margin: 0.486rem auto 0;
  left: 1.12rem;
  font-family: var(--font-display);
  font-weight: 400;
  font-size: 1.9017rem;
  line-height: var(--lh-display);
  text-align: center;
  text-transform: uppercase;
  white-space: nowrap;
  color: var(--color-text);
  text-shadow: 0 1.902px 3.803px rgba(0, 0, 0, 0.66), 0 7.131px 7.131px rgba(0, 0, 0, 0.57), 0 15.689px 9.508px rgba(0, 0, 0, 0.34), 0 28.05px 11.41px rgba(0, 0, 0, 0.1), 0 43.739px 12.361px rgba(0, 0, 0, 0.01);
  animation: rise-in 0.9s var(--ease-out) 0.15s backwards;
}

.hero-title-row {
  display: block;
}

.hero-btn {
  margin-top: 2.584rem;
  animation: rise-in 0.9s var(--ease-out) 0.3s backwards;
}

.hero-btn .btn-text {
  width: 16.4rem;
}

.hero-cards {
  display: grid;
  margin-top: 17.3rem;
}

.hero-cards > * {
  grid-area: 1 / 1;
}

.hero-subtitle {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 1rem;
  justify-self: start;
  align-self: start;
  width: 21.7rem;
  margin-left: 0.1rem;
  padding: 2rem;
  border: 1px solid #fff;
  border-radius: 1rem;
  background-image: linear-gradient(91.72deg, var(--glass-light));
  -webkit-backdrop-filter: blur(15px);
  backdrop-filter: blur(15px);
  box-shadow: 76px -47px 25px rgba(31, 8, 47, 0.01), 48px -30px 23px rgba(31, 8, 47, 0.06), 27px -17px 19px rgba(31, 8, 47, 0.2), 12px -7px 14px rgba(31, 8, 47, 0.33), 3px -2px 8px rgba(31, 8, 47, 0.38);
  animation: slide-in-left 0.9s var(--ease-out) 0.5s backwards;
}

.hero-subtitle-arrow {
  position: absolute;
  top: 0.9rem;
  left: 17.6rem;
  width: 3rem;
  height: 3rem;
  transform: rotate(180deg);
}

.hero-subtitle-title {
  font-weight: 600;
  font-size: 1.4rem;
  line-height: 1;
  text-transform: uppercase;
  white-space: nowrap;
}

.hero-subtitle-text {
  width: 17.5rem;
  font-size: 1.2rem;
  line-height: 1;
}

.hero-card {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  justify-self: end;
  align-self: start;
  width: 23.9rem;
  margin-top: 16.9rem;
  padding: 2rem;
  overflow: hidden;
  border-radius: 1rem;
  background: var(--color-violet-light);
  box-shadow: -106px -77px 37px rgba(27, 5, 35, 0.01), -68px -49px 34px rgba(27, 5, 35, 0.07), -38px -28px 28px rgba(27, 5, 35, 0.24), -17px -12px 21px rgba(27, 5, 35, 0.4), -4px -3px 12px rgba(27, 5, 35, 0.46);
  animation: slide-in-right 0.9s var(--ease-out) 0.6s backwards;
}

.hero-card-title {
  width: 15.8rem;
  font-weight: 600;
  font-size: 1.2rem;
  line-height: 1;
  text-transform: uppercase;
  color: var(--color-card-title);
}

.hero-card-text {
  width: 19.9rem;
  font-size: 1.2rem;
  line-height: 1;
  color: var(--color-card-text);
}

.hero-card-blob {
  position: absolute;
  top: -6.08415rem;
  left: 14.64985rem;
  width: 19.2885rem;
  height: 19.2885rem;
  object-fit: cover;
  transform: rotate(98.43deg) scaleY(-1);
  animation: float 6s ease-in-out 1.5s infinite;
  --float: -0.8rem;
}

@media (min-width: 768px) {
  .hero-inner {
    padding: 6.1rem 0 4.3rem;
  }

  .hero-glow {
    top: -26.111rem;
    left: -29.732rem;
    width: 129.965rem;
    height: 129.622rem;
  }

  .hero-image {
    top: 22.6rem;
    left: -3.5rem;
    width: 78.8rem;
    height: 54rem;
  }

  .hero-title-main {
    font-size: 11rem;
  }

  .hero-title-line {
    gap: 0;
    width: 68.8rem;
    margin-top: -0.74rem;
    left: 0;
    font-size: 4rem;
    text-shadow: 0 4px 8px rgba(0, 0, 0, 0.66), 0 15px 15px rgba(0, 0, 0, 0.57), 0 33px 20px rgba(0, 0, 0, 0.34), 0 59px 24px rgba(0, 0, 0, 0.1), 0 92px 26px rgba(0, 0, 0, 0.01);
  }

  .hero-title-row:first-child {
    margin-bottom: -0.4rem;
  }

  .hero-btn {
    left: -0.1rem;
    width: 33.2735rem;
    margin-top: 8.88rem;
  }

  .hero-btn .btn-text {
    width: auto;
  }

  .hero-cards {
    margin-top: 10.3rem;
  }

  .hero-subtitle {
    width: 35.4rem;
    padding: 3rem;
    background-image: linear-gradient(92.55deg, var(--glass-light));
  }

  .hero-subtitle-arrow {
    left: 30.3rem;
    width: 4rem;
    height: 4rem;
  }

  .hero-subtitle-title {
    width: 24.5rem;
    font-size: 1.6rem;
    white-space: normal;
  }

  .hero-subtitle-text {
    width: 29.2rem;
    font-size: 1.6rem;
  }

  .hero-card {
    width: 33.6rem;
    margin-top: 13.7rem;
    padding: 3rem;
  }

  .hero-card-title {
    width: 20.6rem;
    font-size: 1.6rem;
  }

  .hero-card-text {
    width: 100%;
    font-size: 1.6rem;
  }

  .hero-card-blob {
    top: -8.4415rem;
    left: 22.2585rem;
    width: 24.0837rem;
    height: 24.0837rem;
    transform: rotate(111.36deg) scaleY(-1);
  }
}

@media (min-width: 1200px) {
  .hero-inner {
    padding: 5.8rem 0 7.9rem;
  }

  .hero-glow {
    top: -49.574rem;
    left: -33.074rem;
    width: 205.749rem;
    height: 205.749rem;
  }

  .hero-image {
    top: 18.6rem;
    left: -6.8rem;
    width: 145rem;
    height: 99.2rem;
  }

  .hero-title-main {
    font-size: 20.4074rem;
    background-image: linear-gradient(93.25deg, #fff 0.53855%, var(--color-violet) 112.92%);
  }

  .hero-title-line {
    width: 103.2rem;
    margin-top: 1.029rem;
    font-size: 6rem;
    text-shadow: 0 8px 17px rgba(0, 0, 0, 0.25), 0 31px 31px rgba(0, 0, 0, 0.22), 0 71px 43px rgba(0, 0, 0, 0.13), 0 126px 50px rgba(0, 0, 0, 0.04), 0 197px 55px rgba(0, 0, 0, 0);
  }

  .hero-title-line::before {
    content: "";
    position: absolute;
    top: 1.466rem;
    left: 21.4rem;
    z-index: -1;
    width: 57.1rem;
    height: 8.9rem;
    background: rgba(2, 0, 5, 0.8);
    filter: blur(50px);
  }

  .hero-title-row:first-child {
    margin-bottom: -0.8rem;
  }

  .hero-btn {
    left: -0.036rem;
    width: fit-content;
    margin-top: 7.486rem;
  }

  .hero-btn .btn-text {
    width: 34.5024rem;
    white-space: normal;
  }

  .hero-cards {
    margin-top: 5.7744rem;
  }

  .hero-subtitle {
    width: 36.6rem;
    background-image: linear-gradient(92.52deg, var(--glass-light));
  }

  .hero-subtitle-arrow {
    top: 1.9rem;
    left: 30.5rem;
  }

  .hero-subtitle-title {
    width: 20.3rem;
    font-size: 2rem;
  }

  .hero-subtitle-text {
    width: 30.4rem;
  }

  .hero-card {
    margin-top: 17.6rem;
    margin-right: 8.8rem;
  }

  .hero-card-title {
    font-size: 1.8rem;
  }

  .hero-card-blob {
    top: -9.8415rem;
    left: 22.9585rem;
  }
}

.marquee-hero {
  animation: fade-in 1s ease 0.7s backwards;
}

.marquee-hero .marquee-item {
  font-size: 2.8rem;
  line-height: 1.2;
  color: #fff;
}

.marquee-hero .marquee-item-conditions,
.marquee-outro .marquee-item {
  color: transparent;
  -webkit-background-clip: text;
  background-clip: text;
}

.marquee-item-conditions {
  background-image: linear-gradient(to right, #fff 0%, var(--color-violet-accent) 33.889%);
}

@media (min-width: 768px) {
  .marquee-hero .marquee-item {
    font-size: 4rem;
  }
}

@media (min-width: 1200px) {
  .marquee-hero .marquee-item {
    font-size: 5rem;
  }
}

.geo {
  position: relative;
  z-index: 0;
  padding-top: 5.04rem;
}

.geo-title {
  position: relative;
  z-index: 3;
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 2rem;
  line-height: 1.2;
  text-align: center;
  text-transform: uppercase;
  color: transparent;
  background-image: linear-gradient(100.79deg, var(--title-gradient-compact));
  -webkit-background-clip: text;
  background-clip: text;
}

.geo-map {
  position: relative;
  width: 55.3862rem;
  height: 31.1547rem;
  margin: 2.317rem 0 0 -7.3rem;
}

.geo-map-frame {
  position: absolute;
  inset: 0;
  overflow: hidden;
}

.geo-map-image {
  position: absolute;
  top: -0.378%;
  left: 3.193%;
  width: 93.644%;
  height: 100.391%;
}

.geo-fade {
  position: absolute;
  z-index: 1;
  pointer-events: none;
}

.geo-fade-top,
.geo-fade-bottom {
  left: 0.291rem;
  width: 54.8186rem;
  height: 11.1298rem;
}

.geo-fade-top {
  top: -0.117rem;
  background: linear-gradient(to bottom, var(--color-bg) 0%, rgba(2, 0, 5, 0) 110.82%);
}

.geo-fade-bottom {
  bottom: 0;
  background: linear-gradient(to top, var(--color-bg) 0%, rgba(2, 0, 5, 0) 110.82%);
}

.geo-fade-right,
.geo-fade-left {
  top: -0.117rem;
  bottom: 0;
  width: 11.1298rem;
}

.geo-fade-right {
  right: 0;
  background: linear-gradient(to left, var(--color-bg) 0%, rgba(2, 0, 5, 0) 110.82%);
}

.geo-fade-left {
  left: 0;
  background: linear-gradient(to right, var(--color-bg) 0%, rgba(2, 0, 5, 0) 110.82%);
}

.geo-label {
  position: absolute;
  z-index: 2;
  font-family: var(--font-display);
  font-weight: 600;
  font-size: 2rem;
  line-height: var(--lh-display);
  text-transform: uppercase;
  white-space: nowrap;
  translate: -50% 0;
  transform-origin: 50% 0;
  cursor: pointer;
  user-select: none;
  transition: scale 0.45s var(--ease-out);
}

.geo-glow {
  position: absolute;
  z-index: 0;
  opacity: 0;
  mix-blend-mode: plus-lighter;
  pointer-events: none;
  transition: opacity 0.5s ease;
}

.geo-glow-europe {
  top: -0.236rem;
  left: 17.329rem;
  width: 20.982rem;
  height: 20.982rem;
}

.geo-glow-latam {
  top: 10.175rem;
  left: 5.264rem;
  width: 19.726rem;
  height: 19.726rem;
}

.geo-glow-asia {
  top: 4.439rem;
  left: 31.787rem;
  width: 19.726rem;
  height: 19.726rem;
}

@media (hover: hover) {
  .geo-label:hover {
    scale: 1.3333;
  }

  .geo-label-europe:hover ~ .geo-glow-europe,
  .geo-label-latam:hover ~ .geo-glow-latam,
  .geo-label-asia:hover ~ .geo-glow-asia {
    opacity: 0.7;
  }
}

.geo-label-europe {
  top: 3.283rem;
  left: 27.7rem;
}

.geo-label-latam {
  top: 20.183rem;
  left: 18.05rem;
}

.geo-label-asia {
  top: 15.083rem;
  left: 39.85rem;
}

@media (min-width: 768px) {
  .geo {
    padding-top: 5.1rem;
  }

  .geo-title {
    font-size: 3.4rem;
    background-image: linear-gradient(98.47deg, var(--title-gradient));
  }

  .geo-map {
    width: 93.2rem;
    height: 52.5rem;
    margin: -0.96rem 0 0 -10.6rem;
  }

  .geo-fade-top,
  .geo-fade-bottom {
    left: -23.2rem;
    width: 139.6rem;
  }

  .geo-fade-top {
    top: -4.1rem;
    height: 18.1rem;
  }

  .geo-fade-bottom {
    height: 15.3rem;
  }

  .geo-fade-right,
  .geo-fade-left {
    display: none;
  }

  .geo-label {
    font-size: 3rem;
    text-shadow: -5px 4px 2.5px rgba(38, 15, 61, 0.7);
  }

  .geo-label-europe {
    top: 6.1rem;
    left: 45.6rem;
  }

  .geo-label-latam {
    top: 34.2rem;
    left: 29.65rem;
    text-shadow: 3px 4px 2.5px rgba(38, 15, 61, 0.7);
  }

  .geo-label-asia {
    top: 30.5rem;
    left: 65.75rem;
  }

  .geo-glow-europe {
    top: -0.397rem;
    left: 29.16rem;
    width: 35.31rem;
    height: 35.31rem;
  }

  .geo-glow-latam {
    top: 17.147rem;
    left: 8.859rem;
    width: 33.196rem;
    height: 33.196rem;
  }

  .geo-glow-asia {
    top: 7.48rem;
    left: 53.488rem;
    width: 33.196rem;
    height: 33.196rem;
  }
}

@media (min-width: 1200px) {
  .geo {
    padding-top: 8.1rem;
  }

  .geo-title {
    font-size: 4rem;
    background-image: linear-gradient(115.01deg, var(--title-gradient));
  }

  .geo-map {
    width: 132rem;
    height: 79.6rem;
    margin: -2rem 0 0;
  }

  .geo-map-image {
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
  }

  .geo-fade-top,
  .geo-fade-bottom {
    left: 0;
    width: 100%;
    height: 28.3rem;
  }

  .geo-fade-top {
    top: 0;
    height: 32.5rem;
    background: linear-gradient(to bottom, var(--color-bg) 0%, rgba(2, 0, 5, 0) 100%);
  }

  .geo-fade-bottom {
    background: linear-gradient(to top, var(--color-bg) 0%, rgba(2, 0, 5, 0) 99.47%);
  }

  .geo-fade-right,
  .geo-fade-left {
    display: block;
    top: 0;
  }

  .geo-fade-right {
    width: 19.5rem;
  }

  .geo-fade-left {
    width: 20rem;
  }

  .geo-label-europe {
    top: 12.2rem;
    left: 65rem;
  }

  .geo-label-latam {
    top: 42.7rem;
    left: 26.3rem;
  }

  .geo-label-asia {
    top: 34.6rem;
    left: 104.85rem;
  }

  .geo-glow-europe {
    top: -0.3rem;
    left: 39.6rem;
    width: 53.4rem;
    height: 53.4rem;
  }

  .geo-glow-latam {
    top: 26.197rem;
    left: 8.897rem;
    width: 50.205rem;
    height: 50.205rem;
  }

  .geo-glow-asia {
    top: 11.597rem;
    left: 76.397rem;
    width: 50.205rem;
    height: 50.205rem;
  }
}

.advantages {
  position: relative;
  z-index: 2;
  padding-top: 1.1283rem;
}

.advantages-title {
  font-family: var(--font-display);
  font-weight: 400;
  font-size: 2rem;
  line-height: 1.2;
  text-align: center;
  text-transform: uppercase;
  color: transparent;
  background-image: linear-gradient(97.24deg, var(--title-gradient-compact));
  -webkit-background-clip: text;
  background-clip: text;
}

.advantages-title-verb {
  font-weight: 700;
}

.advantages-list {
  display: flex;
  gap: 1.6rem;
  margin: 3rem -1.6rem 0;
  padding-inline: 1.7rem;
  overflow-x: auto;
  overflow-y: hidden;
  overscroll-behavior-x: contain;
  scroll-snap-type: x mandatory;
  scroll-padding-inline: 1.7rem;
  scrollbar-width: none;
}

.advantages-list::-webkit-scrollbar {
  display: none;
}

.advantage-card {
  display: flex;
  flex: 0 0 33.7rem;
  flex-direction: column;
  gap: 4rem;
  height: 21.5rem;
  padding: 2rem;
  border: 1px solid #fff;
  border-radius: 1rem;
  background-image: linear-gradient(92.01deg, var(--glass));
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
  scroll-snap-align: start;
}

.advantage-number {
  flex: 1 0 0;
  font-family: var(--font-display);
  font-weight: 300;
  font-size: 1.4rem;
  line-height: var(--lh-display);
  text-transform: uppercase;
}

.advantage-body {
  display: flex;
  flex-direction: column;
  flex-shrink: 0;
  justify-content: flex-end;
  gap: 0.5rem;
  height: 9.5rem;
}

.advantage-title {
  font-family: var(--font-display);
  font-weight: 600;
  font-size: 1.6rem;
  line-height: var(--lh-display);
  text-transform: uppercase;
  color: transparent;
  background-image: linear-gradient(108.29deg, var(--text-gradient));
  -webkit-background-clip: text;
  background-clip: text;
}

.advantage-text {
  font-size: 1.4rem;
  line-height: 1;
  color: var(--color-muted);
}

.pagination {
  display: flex;
  gap: 2rem;
  margin-top: 3rem;
}

.pagination-btn {
  width: 2rem;
  height: 2rem;
  transition: opacity var(--transition);
}

.pagination-btn img {
  width: 100%;
  height: 100%;
}

.pagination-next img {
  transform: rotate(180deg);
}

.pagination-btn.is-disabled {
  opacity: 0.2;
  cursor: default;
}

@media (min-width: 768px) {
  .advantages {
    padding-top: 1rem;
  }

  .advantages-title {
    font-size: 3.4rem;
    background-image: linear-gradient(95.67deg, var(--title-gradient));
  }

  .advantages-list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 2rem 2.4rem;
    width: 71.8rem;
    margin: 5.06rem 0 0 0.1rem;
    padding: 0;
    overflow: visible;
  }

  .advantage-card {
    height: 28rem;
    background-image: linear-gradient(91.59deg, var(--glass));
  }

  .advantage-number {
    flex: none;
    font-size: 2rem;
  }

  .advantage-body {
    justify-content: flex-start;
    gap: 1rem;
    height: auto;
  }

  .advantage-title {
    font-size: 1.8rem;
    background-image: linear-gradient(98.83deg, var(--text-gradient));
  }

  .advantage-text {
    font-size: 1.8rem;
  }

  .pagination {
    display: none;
  }
}

@media (min-width: 1200px) {
  .advantages {
    padding-top: 0;
  }

  .advantages-title {
    font-size: 4rem;
    background-image: linear-gradient(103.13deg, var(--title-gradient));
  }

  .advantages-title-verb {
    font-weight: 900;
  }

  .advantages-list {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 2.9rem 2.3rem;
    width: 131.8rem;
    margin-top: 5.2rem;
  }

  .advantage-card {
    gap: 5rem;
    height: 29rem;
    padding: 3rem;
    background-image: linear-gradient(91.88deg, var(--glass));
  }

  .advantage-number {
    font-size: 2.4rem;
  }

  .advantage-title {
    font-size: 2rem;
    background-image: linear-gradient(99.22deg, var(--text-gradient));
  }
}

.infra {
  position: relative;
  z-index: 2;
  padding-top: 7rem;
}

.infra-title {
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 2rem;
  line-height: 1.2;
  text-align: center;
  text-transform: uppercase;
  color: transparent;
  background-image: linear-gradient(110.86deg, var(--title-gradient-compact));
  -webkit-background-clip: text;
  background-clip: text;
}

.infra-grid {
  display: flex;
  flex-direction: column;
  gap: 2rem;
  width: 40.7rem;
  margin: 3rem 0 0 0.1rem;
}

.infra-card {
  position: relative;
  display: flex;
  flex-direction: column;
  padding: 13.9rem 2.1rem 1.9rem;
  overflow: hidden;
  border: 1px solid #fff;
  border-radius: 1rem;
  background-image: linear-gradient(92.25deg, var(--glass));
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
}

.infra-media {
  position: absolute;
  overflow: hidden;
}

.infra-image {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.infra-card-design .infra-image {
  top: -1.42%;
  left: -10.55%;
  width: 116%;
  height: 116%;
  transform: rotate(-35.9deg);
}

.infra-card-bizdev .infra-image {
  object-fit: cover;
  transform: scaleX(-1);
}

.infra-card-development .infra-image {
  top: 5.96%;
}

.infra-card-hr .infra-image,
.infra-card-analytics .infra-image {
  top: 5.31%;
  left: -2.66%;
}

.infra-card-design .infra-media,
.infra-card-hr .infra-media {
  top: -6.7rem;
  left: 20.3rem;
  width: 23rem;
  height: 23rem;
}

.infra-card-bizdev .infra-media {
  top: -5.9rem;
  left: 17.5rem;
  width: 25.6rem;
  height: 25.6rem;
}

.infra-card-development .infra-media,
.infra-card-analytics .infra-media {
  top: -8.3rem;
  left: 18.3rem;
  width: 25.1rem;
  height: 25.1rem;
}

.infra-card-integration .infra-media {
  top: -5.5rem;
  left: 16.5rem;
  width: 25.6rem;
  height: 25.6rem;
}

.infra-body {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  width: 31.7rem;
}

.infra-card-title {
  width: 27.2rem;
  font-family: var(--font-display);
  font-weight: 600;
  font-size: 1.6rem;
  line-height: var(--lh-display);
  text-transform: uppercase;
}

.infra-card-text {
  font-size: 1.4rem;
  line-height: 1;
  color: var(--color-muted);
}

@media (min-width: 768px) {
  .infra-title {
    font-size: 3.4rem;
    background-image: linear-gradient(106.6deg, var(--title-gradient));
  }

  .infra-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 2rem 2.4rem;
    width: 72rem;
    margin: 3.02rem 0 0;
  }

  .infra-card {
    height: 35rem;
    padding: 17.6rem 1.9rem 0;
    background-image: linear-gradient(91.28deg, var(--glass));
  }

  .infra-card-integration,
  .infra-card-analytics {
    padding-top: 13.1rem;
  }

  .infra-card-integration .infra-image {
    transform: scaleX(-1);
  }

  .infra-card-design .infra-media {
    top: -8.1rem;
    left: 10.9rem;
    width: 26.9rem;
    height: 26.9rem;
  }

  .infra-card-bizdev .infra-media {
    top: -6.2rem;
    left: 9.7rem;
    width: 25.6rem;
    height: 25.6rem;
  }

  .infra-card-development .infra-media {
    top: -6.9rem;
    left: 9.6rem;
    width: 26.9rem;
    height: 26.9rem;
  }

  .infra-card-hr .infra-media {
    top: -6.4rem;
    left: 10.1rem;
    width: 27.2rem;
    height: 27.2rem;
  }

  .infra-card-integration .infra-media {
    top: -7.4rem;
    left: 9rem;
    width: 27.7rem;
    height: 27.7rem;
  }

  .infra-card-analytics .infra-media {
    top: -8.9rem;
    left: 11.8rem;
    width: 27.7rem;
    height: 27.7rem;
  }

  .infra-body {
    width: 29rem;
  }

  .infra-card-title {
    font-size: 2.2rem;
  }

  .infra-card-text {
    font-size: 1.8rem;
  }
}

@media (min-width: 1200px) {
  .infra {
    padding-top: 17.2rem;
  }

  .infra-title {
    width: 83.3rem;
    margin-inline: auto;
    font-size: 4rem;
    line-height: 1;
    background-image: linear-gradient(115.02deg, var(--text-gradient));
  }

  .infra-grid {
    gap: 2.4rem;
    width: 132rem;
    margin-top: 5rem;
  }

  .infra-card,
  .infra-card-integration,
  .infra-card-analytics {
    justify-content: flex-end;
    height: 28rem;
    padding: 0 2.9rem 2.9rem;
    background-image: linear-gradient(92.97deg, var(--glass));
  }

  .infra-card .infra-media {
    top: -9.7rem;
    left: 35.5rem;
    width: 32.5rem;
    height: 32.5rem;
  }

  .infra-card-bizdev .infra-media {
    top: -9.4rem;
    left: 34.7rem;
  }

  .infra-body {
    width: 51rem;
  }

  .infra-card-title {
    width: 100%;
    font-size: 2.4rem;
  }

  .infra-card-hr .infra-card-text {
    width: 49.2rem;
  }

  .infra-card-analytics .infra-card-text {
    width: 45.9rem;
  }
}

.outro {
  position: relative;
  z-index: 2;
  padding-top: 7rem;
}

.marquee-outro .marquee-item {
  font-size: 2.8rem;
  line-height: 1;
}

.marquee-outro .marquee-item-products {
  background-image: linear-gradient(90.99deg, #fff 70.565%, var(--color-violet-accent) 99.949%);
}

.marquee-item-join {
  background-image: linear-gradient(to right, var(--color-violet-accent) 62.284%, #fff 108.19%);
}

.marquee-item-together {
  background-image: linear-gradient(129.77deg, var(--text-gradient));
}

.cta-wrap {
  display: flex;
  justify-content: center;
  position: relative;
  left: -0.007rem;
  margin-top: 4.751rem;
}

.cta {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.9rem;
  padding: 3rem 4rem;
  border: 1px solid #fff;
  border-radius: 1rem;
  background-image: linear-gradient(99.3deg, var(--glass-cta));
  -webkit-backdrop-filter: blur(15px);
  backdrop-filter: blur(15px);
  box-shadow: -6px 0 10px rgba(20, 14, 34, 0.4);
  transform: rotate(1deg);
}

.cta-line {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 32.1364rem;
  height: 3.7813rem;
}

.cta-text {
  display: block;
  flex: none;
  width: 32.1215rem;
  height: 3.5996rem;
  font-weight: 500;
  font-size: 1.8rem;
  line-height: 1;
  text-align: center;
  text-transform: uppercase;
  color: transparent;
  background-image: linear-gradient(101.31deg, var(--text-gradient));
  -webkit-background-clip: text;
  background-clip: text;
  transform: rotate(0.32deg) skewX(0.57deg);
}

.cta-accent {
  color: var(--color-violet);
}

.cta-accent-strong {
  font-weight: 600;
}

.outro-action {
  position: relative;
  left: 0.1rem;
  margin-top: 5.786rem;
}

.outro-btn .btn-text {
  width: 20rem;
}

.outro-btn {
  background-image: linear-gradient(123.39deg, #fff 0%, var(--color-violet) 127.3%);
}

@media (min-width: 768px) {
  .outro {
    padding-top: 10rem;
  }

  .marquee-outro .marquee-item {
    font-size: 4rem;
  }

  .cta-wrap {
    left: 0.026rem;
    margin-top: 7.486rem;
  }

  .cta {
    gap: 1rem;
    background-image: linear-gradient(99.7deg, var(--glass-cta));
  }

  .cta-line {
    width: 47.7341rem;
    height: 6.1898rem;
  }

  .cta-line + .cta-line {
    height: 6.0898rem;
  }

  .cta-text {
    width: 47.7212rem;
    height: 6.0993rem;
    font-size: 2.6rem;
    background-image: linear-gradient(99.94deg, var(--text-gradient));
    transform: rotate(-0.11deg) skewX(-0.23deg);
  }

  .cta-line + .cta-line .cta-text {
    height: 5.9993rem;
  }

  .outro-action {
    left: 0.037rem;
    margin-top: 7.534rem;
  }

  .outro-btn {
    background-image: linear-gradient(123.5deg, #fff 0%, var(--color-violet) 127.3%);
  }

  .outro-btn .btn-text {
    width: auto;
  }
}

@media (min-width: 1200px) {
  .marquee-outro .marquee-item {
    font-size: 5rem;
  }

  .cta-wrap {
    left: 0.06rem;
    margin-top: 7.493rem;
  }

  .cta {
    gap: 2rem;
    background-image: linear-gradient(101.14deg, var(--glass-cta));
  }

  .cta-line {
    width: 61.0273rem;
    height: 6.4218rem;
  }

  .cta-line + .cta-line {
    width: 61.0265rem;
    height: 6.3218rem;
  }

  .cta-text,
  .cta-line + .cta-line .cta-text {
    width: 60.982rem;
    height: auto;
    font-size: 3rem;
    background-image: linear-gradient(102.63deg, var(--text-gradient));
    transform: rotate(-0.3deg) skewX(-0.74deg);
  }

  .outro-action {
    left: -0.036rem;
    margin-top: 7.963rem;
  }

  .outro-btn {
    background-image: linear-gradient(120.92deg, #fff 0%, var(--color-violet) 127.3%);
  }
}

.footer {
  position: relative;
  z-index: 2;
  padding: 5.4rem 0 2.9rem;
}

@media (min-width: 768px) {
  .footer {
    padding: 7.1rem 0;
  }
}

@media (min-width: 1200px) {
  .footer {
    padding: 6.074rem 0 5.8rem;
  }
}

.js [data-reveal] {
  opacity: 0;
  translate: 0 4rem;
  transition: opacity 0.9s var(--ease-out) var(--reveal-delay, 0s), translate 0.9s var(--ease-out) var(--reveal-delay, 0s);
}

.js [data-reveal].is-visible {
  opacity: 1;
  translate: none;
}

.js .advantages-list [data-reveal] {
  translate: none;
}

@media (min-width: 768px) {
  .js .advantages-list [data-reveal]:not(.is-visible) {
    translate: 0 4rem;
  }
}

@keyframes fade-in {
  from {
    opacity: 0;
  }
}

@keyframes rise-in {
  from {
    opacity: 0;
    translate: 0 3rem;
  }
}

@keyframes zoom-in {
  from {
    opacity: 0;
    scale: 0.9;
  }
}

@keyframes slide-in-left {
  from {
    opacity: 0;
    translate: -4rem 0;
  }
}

@keyframes slide-in-right {
  from {
    opacity: 0;
    translate: 4rem 0;
  }
}

@keyframes float {
  50% {
    translate: 0 var(--float, -1.6rem);
  }
}

@keyframes parallax {
  from {
    translate: 0 var(--parallax, 6rem);
  }

  to {
    translate: 0 calc(var(--parallax, 6rem) * -1);
  }
}

@supports (animation-timeline: view()) {
  .decor-blob {
    animation: parallax linear both;
    animation-timeline: view();
  }
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }

  *,
  *::before,
  *::after {
    animation: none !important;
    transition-duration: 0.01ms !important;
  }

  .js [data-reveal] {
    opacity: 1;
    translate: none;
  }
}
