/* http://meyerweb.com/eric/tools/css/reset/ 
   v2.0 | 20110126
   License: none (public domain)
*/
html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
embed,
figure,
figcaption,
footer,
header,
hgroup,
menu,
nav,
output,
ruby,
section,
summary,
time,
mark,
audio,
video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline; }

/* HTML5 display-role reset for older browsers */
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
  display: block; }

body {
  line-height: 1; }

ol,
ul {
  list-style: none; }

blockquote,
q {
  quotes: none; }

blockquote:before, blockquote:after {
  content: "";
  content: none; }

q:before, q:after {
  content: "";
  content: none; }

table {
  border-collapse: collapse;
  border-spacing: 0; }

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

@-webkit-keyframes spin {
  from {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg); }
  to {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg); } }

@keyframes spin {
  from {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg); }
  to {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg); } }
@-webkit-keyframes spin-back {
  from {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg); }
  to {
    -webkit-transform: rotate(-360deg);
            transform: rotate(-360deg); } }
@keyframes spin-back {
  from {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg); }
  to {
    -webkit-transform: rotate(-360deg);
            transform: rotate(-360deg); } }
@-webkit-keyframes spin-image {
  0% {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg); }
  to {
    -webkit-transform: rotate(-360deg);
            transform: rotate(-360deg); } }
@keyframes spin-image {
  0% {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg); }
  to {
    -webkit-transform: rotate(-360deg);
            transform: rotate(-360deg); } }
@-webkit-keyframes tilt-20 {
  0% {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg); }
  25% {
    -webkit-transform: rotate(20deg);
            transform: rotate(20deg); }
  50% {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg); }
  75% {
    -webkit-transform: rotate(-20deg);
            transform: rotate(-20deg); }
  100% {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg); } }
@keyframes tilt-20 {
  0% {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg); }
  25% {
    -webkit-transform: rotate(20deg);
            transform: rotate(20deg); }
  50% {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg); }
  75% {
    -webkit-transform: rotate(-20deg);
            transform: rotate(-20deg); }
  100% {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg); } }
@-webkit-keyframes glow-blink {
  0% {
    opacity: 0; }
  50% {
    opacity: 1; }
  100% {
    opacity: 0; } }
@keyframes glow-blink {
  0% {
    opacity: 0; }
  50% {
    opacity: 1; }
  100% {
    opacity: 0; } }
@-webkit-keyframes flipCardY {
  0% {
    -webkit-transform: rotateY(0deg);
            transform: rotateY(0deg); }
  20% {
    -webkit-transform: rotateY(180deg);
            transform: rotateY(180deg); }
  40% {
    -webkit-transform: rotateY(360deg);
            transform: rotateY(360deg); }
  100% {
    -webkit-transform: rotateY(360deg);
            transform: rotateY(360deg); } }
@keyframes flipCardY {
  0% {
    -webkit-transform: rotateY(0deg);
            transform: rotateY(0deg); }
  20% {
    -webkit-transform: rotateY(180deg);
            transform: rotateY(180deg); }
  40% {
    -webkit-transform: rotateY(360deg);
            transform: rotateY(360deg); }
  100% {
    -webkit-transform: rotateY(360deg);
            transform: rotateY(360deg); } }
@-webkit-keyframes flipCardX {
  0% {
    -webkit-transform: rotateX(0deg);
            transform: rotateX(0deg); }
  10% {
    -webkit-transform: rotateX(180deg);
            transform: rotateX(180deg); }
  20% {
    -webkit-transform: rotateX(360deg);
            transform: rotateX(360deg); }
  100% {
    -webkit-transform: rotateX(360deg);
            transform: rotateX(360deg); } }
@keyframes flipCardX {
  0% {
    -webkit-transform: rotateX(0deg);
            transform: rotateX(0deg); }
  10% {
    -webkit-transform: rotateX(180deg);
            transform: rotateX(180deg); }
  20% {
    -webkit-transform: rotateX(360deg);
            transform: rotateX(360deg); }
  100% {
    -webkit-transform: rotateX(360deg);
            transform: rotateX(360deg); } }
@font-face {
  font-family: "public-sans";
  src: url("./../../assets/fonts/PublicSans-VariableFont_wght.ttf") format("truetype-variations");
  font-weight: 100 900; }
@font-face {
  font-family: "segoe-print";
  src: url("./../../assets/fonts/segoeprint.ttf") format("truetype");
  font-weight: 400; }
@font-face {
  font-family: "segoe-print";
  src: url("./../../assets/fonts/segoeprint_bold.ttf") format("truetype");
  font-weight: 700; }
* {
  -webkit-box-sizing: border-box;
          box-sizing: border-box; }

body {
  scroll-behavior: smooth;
  font-family: "public-sans";
  background-color: #000802;
  color: white; }

button {
  font-family: "public-sans"; }

.heading {
  font-family: "segoe-print"; }

.button {
  -webkit-transition: 0.3s;
  transition: 0.3s;
  height: 64px;
  font-size: 24px;
  color: white;
  padding: 0 24px;
  border-radius: 1000px;
  cursor: pointer;
  border: none;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  width: -webkit-max-content;
  width: -moz-max-content;
  width: max-content;
  background-color: transparent;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center; }
  @media screen and (max-width: 1025px) {
    .button:not(.-fixed) {
      padding: 0 18px;
      height: 43px;
      font-size: 16px; } }
  .button:not(.-ghost) {
    background-color: #1cb847; }
    .button:not(.-ghost):hover {
      background-color: #158c36; }
  .button.-ghost {
    border: 1px solid white; }
    .button.-ghost:hover {
      opacity: 0.6; }

nav {
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  position: relative;
  z-index: 2; }
  nav .logo img {
    height: 51px;
    width: 165px; }
    @media screen and (max-width: 769px) {
      nav .logo img {
        width: 136px;
        height: 42px; } }
  nav .button-clone {
    width: 221px; }
    @media screen and (max-width: 1025px) {
      nav .button-clone {
        width: 151.5px; } }
    @media screen and (max-width: 769px) {
      nav .button-clone {
        display: none; } }

header {
  width: 100%;
  padding: 36px 0;
  min-height: Min(100vh, 911px);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(68.46%, #06462e), color-stop(95.67%, rgba(6, 70, 46, 0)));
  background: linear-gradient(180deg, #06462e 68.46%, rgba(6, 70, 46, 0) 95.67%);
  position: relative;
  overflow: hidden; }
  @media screen and (max-width: 1400px) {
    header {
      padding: 36px 0px; } }
  @media screen and (max-width: 769px) {
    header {
      padding: 32px 0px; } }
  header .container {
    position: relative;
    height: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column; }
  header .background-image {
    z-index: 1;
    position: absolute;
    top: 0;
    left: 0;
    background-size: 100% 100%;
    width: 100%;
    height: 100%; }
    header .background-image .top-glow {
      position: absolute;
      top: -20%;
      left: 50%;
      -webkit-transform: translate(-50%, -50%);
              transform: translate(-50%, -50%);
      width: 1150px;
      height: 1150px;
      background: #15bc4b;
      border-radius: 50%;
      -webkit-filter: blur(300px);
              filter: blur(300px);
      pointer-events: none; }
      @media screen and (max-width: 769px) {
        header .background-image .top-glow {
          opacity: 0.5; } }
    header .background-image .small-glow {
      position: absolute;
      border-radius: 100%;
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-animation: glow-blink 4s ease-in-out infinite;
              animation: glow-blink 4s ease-in-out infinite;
      -webkit-box-align: center;
          -ms-flex-align: center;
              align-items: center;
      -webkit-box-pack: center;
          -ms-flex-pack: center;
              justify-content: center; }
      @media screen and (max-width: 769px) {
        header .background-image .small-glow {
          -webkit-animation: none;
                  animation: none; } }
      header .background-image .small-glow::after {
        opacity: 0.8;
        background-color: #00ff52;
        width: 100%;
        height: 100%;
        content: "";
        position: absolute;
        left: 0;
        -webkit-filter: blur(100px);
                filter: blur(100px);
        top: 0; }
      header .background-image .small-glow::before {
        position: absolute;
        content: "";
        left: 50%;
        top: 50%;
        -webkit-transform: translate(-50%, -50%);
                transform: translate(-50%, -50%);
        width: 17%;
        height: 17%;
        border-radius: 100%;
        background-color: #0cff61;
        -webkit-filter: blur(25px);
                filter: blur(25px); }
      header .background-image .small-glow.g-1 {
        width: 110px;
        height: 110px;
        -webkit-animation-delay: -0.3s;
                animation-delay: -0.3s;
        top: 40%;
        left: 40%; }
      header .background-image .small-glow.g-2 {
        width: 200px;
        height: 200px;
        -webkit-animation-delay: -1.1s;
                animation-delay: -1.1s;
        top: 60%;
        right: 2%; }
      header .background-image .small-glow.g-3 {
        width: 82px;
        height: 82px;
        -webkit-animation-delay: -2.4s;
                animation-delay: -2.4s;
        top: 40%;
        right: 7%; }
      header .background-image .small-glow.g-4 {
        width: 82px;
        height: 82px;
        -webkit-animation-delay: -0.8s;
                animation-delay: -0.8s;
        top: 60%;
        right: 45%; }
      header .background-image .small-glow.g-5 {
        width: 82px;
        height: 82px;
        -webkit-animation-delay: -3.2s;
                animation-delay: -3.2s;
        top: 30%;
        right: 35%; }
      header .background-image .small-glow.g-6 {
        width: 82px;
        height: 82px;
        -webkit-animation-delay: -1.7s;
                animation-delay: -1.7s;
        top: 10%;
        right: 5%; }
      header .background-image .small-glow.g-7 {
        width: 50px;
        height: 50px;
        -webkit-animation-delay: -2.9s;
                animation-delay: -2.9s;
        top: 30%;
        left: 20%; }
      header .background-image .small-glow.g-8 {
        width: 110px;
        height: 110px;
        -webkit-animation-delay: -0.5s;
                animation-delay: -0.5s;
        top: 30%;
        left: 00%; }
      header .background-image .small-glow.g-9 {
        width: 150px;
        height: 150px;
        -webkit-animation-delay: -1.3s;
                animation-delay: -1.3s;
        top: 30%;
        left: 20%; }
      header .background-image .small-glow.g-10 {
        width: 100px;
        height: 100px;
        -webkit-animation-delay: -2.1s;
                animation-delay: -2.1s;
        top: 60%;
        left: 30%; }
      header .background-image .small-glow.g-11 {
        width: 200px;
        height: 200px;
        -webkit-animation-delay: -3.6s;
                animation-delay: -3.6s;
        top: 20%;
        left: 50%; }
      header .background-image .small-glow.g-12 {
        width: 100px;
        height: 100px;
        -webkit-animation-delay: -0.9s;
                animation-delay: -0.9s;
        top: 70%;
        left: -10%; }
      header .background-image .small-glow.g-13 {
        width: 100px;
        height: 100px;
        -webkit-animation-delay: -2.7s;
                animation-delay: -2.7s;
        top: 5%;
        right: -10%; }
      header .background-image .small-glow.g-14 {
        width: 150px;
        height: 150px;
        -webkit-animation-delay: -1.5s;
                animation-delay: -1.5s;
        top: 35%;
        right: -10%; }
      header .background-image .small-glow.g-15 {
        width: 150px;
        height: 150px;
        -webkit-animation-delay: -3.3s;
                animation-delay: -3.3s;
        top: 70%;
        right: -10%; }

section.hero {
  position: relative;
  z-index: 2;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 100%;
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  min-height: 850px; }
  @media screen and (max-width: 1281px) {
    section.hero {
      -webkit-box-orient: vertical;
      -webkit-box-direction: reverse;
          -ms-flex-direction: column-reverse;
              flex-direction: column-reverse;
      gap: 8rem;
      margin-top: 8rem;
      -webkit-box-align: center;
          -ms-flex-align: center;
              align-items: center;
      min-height: unset;
      -webkit-box-pack: start;
          -ms-flex-pack: start;
              justify-content: flex-start; } }
  @media screen and (max-width: 641px) {
    section.hero {
      gap: 5rem;
      margin-top: 6rem; } }
  @media screen and (max-width: 390px) {
    section.hero {
      margin-top: 4rem; } }
  section.hero .bubble {
    position: absolute;
    right: -195px;
    top: 50%;
    -webkit-transform: translateY(-50%);
            transform: translateY(-50%);
    min-width: 570px;
    min-height: 570px;
    width: 570px;
    height: 570px;
    background-color: rgba(0, 8, 2, 0.05);
    -webkit-box-shadow: inset -17.5px -17.5px 56.99px 0 rgba(255, 255, 255, 0.4), inset 17.5px 17.5px 54.69px 0 rgba(0, 0, 0, 0.1);
            box-shadow: inset -17.5px -17.5px 56.99px 0 rgba(255, 255, 255, 0.4), inset 17.5px 17.5px 54.69px 0 rgba(0, 0, 0, 0.1);
    border-radius: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center; }
    @media screen and (max-width: 1281px) {
      section.hero .bubble {
        position: relative;
        top: 0;
        right: 0;
        -webkit-transform: none;
                transform: none; } }
    @media screen and (max-width: 641px) {
      section.hero .bubble {
        min-width: 280px;
        min-height: 280px;
        width: 280px;
        height: 280px; }
        section.hero .bubble .circle > div {
          width: calc(50% + (100px / 2)) !important;
          top: calc(50% - (100px / 2)) !important; }
          section.hero .bubble .circle > div > div {
            width: 100px !important;
            height: 100px !important; } }
    section.hero .bubble > img {
      width: 250px; }
      @media screen and (max-width: 641px) {
        section.hero .bubble > img {
          width: 130px; } }
    section.hero .bubble .circle {
      position: absolute;
      inset: 0;
      border-radius: 50%;
      -webkit-transform-origin: center center;
              transform-origin: center center; }
      section.hero .bubble .circle > div {
        width: calc(50% + (200px / 2));
        position: absolute;
        left: 50%;
        top: calc(50% - (200px / 2));
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: end;
            -ms-flex-pack: end;
                justify-content: flex-end;
        -webkit-transform-origin: left;
                transform-origin: left; }
        section.hero .bubble .circle > div:nth-child(1) {
          -webkit-transform: rotate(0deg);
                  transform: rotate(0deg); }
          section.hero .bubble .circle > div:nth-child(1) > div {
            -webkit-transform: rotate(0deg);
                    transform: rotate(0deg);
            width: 200px;
            height: 200px;
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-align: center;
                -ms-flex-align: center;
                    align-items: center; }
            section.hero .bubble .circle > div:nth-child(1) > div.premium div img {
              width: 200px;
              height: 200px; }
              @media screen and (max-width: 641px) {
                section.hero .bubble .circle > div:nth-child(1) > div.premium div img {
                  width: 100px;
                  height: 100px; } }
            section.hero .bubble .circle > div:nth-child(1) > div.apple-gift div img {
              width: 150px;
              height: 150px; }
              @media screen and (max-width: 641px) {
                section.hero .bubble .circle > div:nth-child(1) > div.apple-gift div img {
                  width: 75px;
                  height: 75px; } }
            section.hero .bubble .circle > div:nth-child(1) > div.mystry-box div img {
              width: 170px;
              height: 170px; }
              @media screen and (max-width: 641px) {
                section.hero .bubble .circle > div:nth-child(1) > div.mystry-box div img {
                  width: 85px;
                  height: 85px; } }
            section.hero .bubble .circle > div:nth-child(1) > div.airpod div img {
              width: 160px;
              height: 160px; }
              @media screen and (max-width: 641px) {
                section.hero .bubble .circle > div:nth-child(1) > div.airpod div img {
                  width: 80px;
                  height: 80px; } }
            section.hero .bubble .circle > div:nth-child(1) > div.iphone div img {
              width: 170px;
              height: 170px; }
              @media screen and (max-width: 641px) {
                section.hero .bubble .circle > div:nth-child(1) > div.iphone div img {
                  width: 85px;
                  height: 85px; } }
            section.hero .bubble .circle > div:nth-child(1) > div.ps5 div img {
              width: 195px;
              height: 195px; }
              @media screen and (max-width: 641px) {
                section.hero .bubble .circle > div:nth-child(1) > div.ps5 div img {
                  width: 98px;
                  height: 98px; } }
        section.hero .bubble .circle > div:nth-child(2) {
          -webkit-transform: rotate(60deg);
                  transform: rotate(60deg); }
          section.hero .bubble .circle > div:nth-child(2) > div {
            -webkit-transform: rotate(-60deg);
                    transform: rotate(-60deg);
            width: 200px;
            height: 200px;
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-align: center;
                -ms-flex-align: center;
                    align-items: center; }
            section.hero .bubble .circle > div:nth-child(2) > div.premium div img {
              width: 200px;
              height: 200px; }
              @media screen and (max-width: 641px) {
                section.hero .bubble .circle > div:nth-child(2) > div.premium div img {
                  width: 100px;
                  height: 100px; } }
            section.hero .bubble .circle > div:nth-child(2) > div.apple-gift div img {
              width: 150px;
              height: 150px; }
              @media screen and (max-width: 641px) {
                section.hero .bubble .circle > div:nth-child(2) > div.apple-gift div img {
                  width: 75px;
                  height: 75px; } }
            section.hero .bubble .circle > div:nth-child(2) > div.mystry-box div img {
              width: 170px;
              height: 170px; }
              @media screen and (max-width: 641px) {
                section.hero .bubble .circle > div:nth-child(2) > div.mystry-box div img {
                  width: 85px;
                  height: 85px; } }
            section.hero .bubble .circle > div:nth-child(2) > div.airpod div img {
              width: 160px;
              height: 160px; }
              @media screen and (max-width: 641px) {
                section.hero .bubble .circle > div:nth-child(2) > div.airpod div img {
                  width: 80px;
                  height: 80px; } }
            section.hero .bubble .circle > div:nth-child(2) > div.iphone div img {
              width: 170px;
              height: 170px; }
              @media screen and (max-width: 641px) {
                section.hero .bubble .circle > div:nth-child(2) > div.iphone div img {
                  width: 85px;
                  height: 85px; } }
            section.hero .bubble .circle > div:nth-child(2) > div.ps5 div img {
              width: 195px;
              height: 195px; }
              @media screen and (max-width: 641px) {
                section.hero .bubble .circle > div:nth-child(2) > div.ps5 div img {
                  width: 98px;
                  height: 98px; } }
        section.hero .bubble .circle > div:nth-child(3) {
          -webkit-transform: rotate(120deg);
                  transform: rotate(120deg); }
          section.hero .bubble .circle > div:nth-child(3) > div {
            -webkit-transform: rotate(-120deg);
                    transform: rotate(-120deg);
            width: 200px;
            height: 200px;
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-align: center;
                -ms-flex-align: center;
                    align-items: center; }
            section.hero .bubble .circle > div:nth-child(3) > div.premium div img {
              width: 200px;
              height: 200px; }
              @media screen and (max-width: 641px) {
                section.hero .bubble .circle > div:nth-child(3) > div.premium div img {
                  width: 100px;
                  height: 100px; } }
            section.hero .bubble .circle > div:nth-child(3) > div.apple-gift div img {
              width: 150px;
              height: 150px; }
              @media screen and (max-width: 641px) {
                section.hero .bubble .circle > div:nth-child(3) > div.apple-gift div img {
                  width: 75px;
                  height: 75px; } }
            section.hero .bubble .circle > div:nth-child(3) > div.mystry-box div img {
              width: 170px;
              height: 170px; }
              @media screen and (max-width: 641px) {
                section.hero .bubble .circle > div:nth-child(3) > div.mystry-box div img {
                  width: 85px;
                  height: 85px; } }
            section.hero .bubble .circle > div:nth-child(3) > div.airpod div img {
              width: 160px;
              height: 160px; }
              @media screen and (max-width: 641px) {
                section.hero .bubble .circle > div:nth-child(3) > div.airpod div img {
                  width: 80px;
                  height: 80px; } }
            section.hero .bubble .circle > div:nth-child(3) > div.iphone div img {
              width: 170px;
              height: 170px; }
              @media screen and (max-width: 641px) {
                section.hero .bubble .circle > div:nth-child(3) > div.iphone div img {
                  width: 85px;
                  height: 85px; } }
            section.hero .bubble .circle > div:nth-child(3) > div.ps5 div img {
              width: 195px;
              height: 195px; }
              @media screen and (max-width: 641px) {
                section.hero .bubble .circle > div:nth-child(3) > div.ps5 div img {
                  width: 98px;
                  height: 98px; } }
        section.hero .bubble .circle > div:nth-child(4) {
          -webkit-transform: rotate(180deg);
                  transform: rotate(180deg); }
          section.hero .bubble .circle > div:nth-child(4) > div {
            -webkit-transform: rotate(-180deg);
                    transform: rotate(-180deg);
            width: 200px;
            height: 200px;
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-align: center;
                -ms-flex-align: center;
                    align-items: center; }
            section.hero .bubble .circle > div:nth-child(4) > div.premium div img {
              width: 200px;
              height: 200px; }
              @media screen and (max-width: 641px) {
                section.hero .bubble .circle > div:nth-child(4) > div.premium div img {
                  width: 100px;
                  height: 100px; } }
            section.hero .bubble .circle > div:nth-child(4) > div.apple-gift div img {
              width: 150px;
              height: 150px; }
              @media screen and (max-width: 641px) {
                section.hero .bubble .circle > div:nth-child(4) > div.apple-gift div img {
                  width: 75px;
                  height: 75px; } }
            section.hero .bubble .circle > div:nth-child(4) > div.mystry-box div img {
              width: 170px;
              height: 170px; }
              @media screen and (max-width: 641px) {
                section.hero .bubble .circle > div:nth-child(4) > div.mystry-box div img {
                  width: 85px;
                  height: 85px; } }
            section.hero .bubble .circle > div:nth-child(4) > div.airpod div img {
              width: 160px;
              height: 160px; }
              @media screen and (max-width: 641px) {
                section.hero .bubble .circle > div:nth-child(4) > div.airpod div img {
                  width: 80px;
                  height: 80px; } }
            section.hero .bubble .circle > div:nth-child(4) > div.iphone div img {
              width: 170px;
              height: 170px; }
              @media screen and (max-width: 641px) {
                section.hero .bubble .circle > div:nth-child(4) > div.iphone div img {
                  width: 85px;
                  height: 85px; } }
            section.hero .bubble .circle > div:nth-child(4) > div.ps5 div img {
              width: 195px;
              height: 195px; }
              @media screen and (max-width: 641px) {
                section.hero .bubble .circle > div:nth-child(4) > div.ps5 div img {
                  width: 98px;
                  height: 98px; } }
        section.hero .bubble .circle > div:nth-child(5) {
          -webkit-transform: rotate(240deg);
                  transform: rotate(240deg); }
          section.hero .bubble .circle > div:nth-child(5) > div {
            -webkit-transform: rotate(-240deg);
                    transform: rotate(-240deg);
            width: 200px;
            height: 200px;
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-align: center;
                -ms-flex-align: center;
                    align-items: center; }
            section.hero .bubble .circle > div:nth-child(5) > div.premium div img {
              width: 200px;
              height: 200px; }
              @media screen and (max-width: 641px) {
                section.hero .bubble .circle > div:nth-child(5) > div.premium div img {
                  width: 100px;
                  height: 100px; } }
            section.hero .bubble .circle > div:nth-child(5) > div.apple-gift div img {
              width: 150px;
              height: 150px; }
              @media screen and (max-width: 641px) {
                section.hero .bubble .circle > div:nth-child(5) > div.apple-gift div img {
                  width: 75px;
                  height: 75px; } }
            section.hero .bubble .circle > div:nth-child(5) > div.mystry-box div img {
              width: 170px;
              height: 170px; }
              @media screen and (max-width: 641px) {
                section.hero .bubble .circle > div:nth-child(5) > div.mystry-box div img {
                  width: 85px;
                  height: 85px; } }
            section.hero .bubble .circle > div:nth-child(5) > div.airpod div img {
              width: 160px;
              height: 160px; }
              @media screen and (max-width: 641px) {
                section.hero .bubble .circle > div:nth-child(5) > div.airpod div img {
                  width: 80px;
                  height: 80px; } }
            section.hero .bubble .circle > div:nth-child(5) > div.iphone div img {
              width: 170px;
              height: 170px; }
              @media screen and (max-width: 641px) {
                section.hero .bubble .circle > div:nth-child(5) > div.iphone div img {
                  width: 85px;
                  height: 85px; } }
            section.hero .bubble .circle > div:nth-child(5) > div.ps5 div img {
              width: 195px;
              height: 195px; }
              @media screen and (max-width: 641px) {
                section.hero .bubble .circle > div:nth-child(5) > div.ps5 div img {
                  width: 98px;
                  height: 98px; } }
        section.hero .bubble .circle > div:nth-child(6) {
          -webkit-transform: rotate(300deg);
                  transform: rotate(300deg); }
          section.hero .bubble .circle > div:nth-child(6) > div {
            -webkit-transform: rotate(-300deg);
                    transform: rotate(-300deg);
            width: 200px;
            height: 200px;
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-align: center;
                -ms-flex-align: center;
                    align-items: center; }
            section.hero .bubble .circle > div:nth-child(6) > div.premium div img {
              width: 200px;
              height: 200px; }
              @media screen and (max-width: 641px) {
                section.hero .bubble .circle > div:nth-child(6) > div.premium div img {
                  width: 100px;
                  height: 100px; } }
            section.hero .bubble .circle > div:nth-child(6) > div.apple-gift div img {
              width: 150px;
              height: 150px; }
              @media screen and (max-width: 641px) {
                section.hero .bubble .circle > div:nth-child(6) > div.apple-gift div img {
                  width: 75px;
                  height: 75px; } }
            section.hero .bubble .circle > div:nth-child(6) > div.mystry-box div img {
              width: 170px;
              height: 170px; }
              @media screen and (max-width: 641px) {
                section.hero .bubble .circle > div:nth-child(6) > div.mystry-box div img {
                  width: 85px;
                  height: 85px; } }
            section.hero .bubble .circle > div:nth-child(6) > div.airpod div img {
              width: 160px;
              height: 160px; }
              @media screen and (max-width: 641px) {
                section.hero .bubble .circle > div:nth-child(6) > div.airpod div img {
                  width: 80px;
                  height: 80px; } }
            section.hero .bubble .circle > div:nth-child(6) > div.iphone div img {
              width: 170px;
              height: 170px; }
              @media screen and (max-width: 641px) {
                section.hero .bubble .circle > div:nth-child(6) > div.iphone div img {
                  width: 85px;
                  height: 85px; } }
            section.hero .bubble .circle > div:nth-child(6) > div.ps5 div img {
              width: 195px;
              height: 195px; }
              @media screen and (max-width: 641px) {
                section.hero .bubble .circle > div:nth-child(6) > div.ps5 div img {
                  width: 98px;
                  height: 98px; } }
  section.hero > div:not(.bubble) {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    gap: 42px; }
    @media screen and (max-width: 1500px) {
      section.hero > div:not(.bubble) {
        padding-left: 0; } }
    section.hero > div:not(.bubble) h1 {
      font-size: 52px;
      font-weight: 700; }
      @media screen and (max-width: 1281px) {
        section.hero > div:not(.bubble) h1 {
          text-align: center;
          line-height: 4.5rem; } }
      @media screen and (max-width: 641px) {
        section.hero > div:not(.bubble) h1 {
          font-size: 42px; } }
      @media screen and (max-width: 370px) {
        section.hero > div:not(.bubble) h1 {
          font-size: 40px; } }
    section.hero > div:not(.bubble) p {
      font-size: 24px;
      max-width: 700px;
      line-height: 2rem; }
      @media screen and (max-width: 1281px) {
        section.hero > div:not(.bubble) p {
          text-align: center; } }
      @media screen and (max-width: 641px) {
        section.hero > div:not(.bubble) p {
          font-size: 18px; } }
    section.hero > div:not(.bubble) > div:last-child {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      gap: 2rem; }
      @media screen and (max-width: 1281px) {
        section.hero > div:not(.bubble) > div:last-child {
          -webkit-box-pack: center;
              -ms-flex-pack: center;
                  justify-content: center; } }
      @media screen and (max-width: 641px) {
        section.hero > div:not(.bubble) > div:last-child {
          gap: 1rem;
          -webkit-box-orient: vertical;
          -webkit-box-direction: normal;
              -ms-flex-direction: column;
                  flex-direction: column;
          -webkit-box-align: center;
              -ms-flex-align: center;
                  align-items: center; }
          section.hero > div:not(.bubble) > div:last-child > div {
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-pack: center;
                -ms-flex-pack: center;
                    justify-content: center; }
            section.hero > div:not(.bubble) > div:last-child > div .button {
              text-align: center;
              -webkit-box-pack: center;
                  -ms-flex-pack: center;
                      justify-content: center;
              max-width: 200px;
              min-width: 200px; } }

.container {
  max-width: 1440px;
  width: 100%;
  margin: 0 auto;
  padding: 0 120px; }
  @media screen and (max-width: 1281px) {
    .container {
      padding: 0 60px; } }
  @media screen and (max-width: 769px) {
    .container {
      padding: 0 1.5em; } }
  @media screen and (max-width: 641px) {
    .container {
      padding: 0 1em; } }

section.toss-a-coin {
  max-width: 906px;
  margin: 0 auto;
  padding-top: 140px;
  padding-bottom: 180px;
  position: relative; }
  @media screen and (max-width: 1281px) {
    section.toss-a-coin {
      margin-top: 100px; } }
  @media screen and (max-width: 641px) {
    section.toss-a-coin {
      margin-top: 70px;
      padding-bottom: 100px;
      padding-top: 100px; } }
  section.toss-a-coin .background-image {
    position: absolute;
    z-index: 1;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%; }
    section.toss-a-coin .background-image img {
      position: absolute; }
    section.toss-a-coin .background-image .chance-icon-1 {
      width: 90px;
      height: 90px;
      left: 32px;
      top: 100px;
      display: block;
      -webkit-transform-origin: center;
              transform-origin: center;
      -webkit-animation: flipCardY 10s ease-in-out infinite;
              animation: flipCardY 10s ease-in-out infinite;
      -webkit-animation-delay: 2.5s;
              animation-delay: 2.5s; }
      @media screen and (max-width: 1025px) {
        section.toss-a-coin .background-image .chance-icon-1 {
          width: 70px;
          height: 70px; } }
      @media screen and (max-width: 769px) {
        section.toss-a-coin .background-image .chance-icon-1 {
          top: 30px; } }
      @media screen and (max-width: 641px) {
        section.toss-a-coin .background-image .chance-icon-1 {
          -webkit-animation: none;
                  animation: none;
          top: 180px;
          opacity: 0.4;
          width: 60px;
          height: 60px; } }
      @media screen and (max-width: 380px) {
        section.toss-a-coin .background-image .chance-icon-1 {
          width: 50px;
          height: 50px; } }
    section.toss-a-coin .background-image .chance-icon-2 {
      width: 85px;
      height: 85px;
      left: 20%;
      top: 20px;
      -webkit-filter: blur(3px);
              filter: blur(3px); }
      @media screen and (max-width: 1025px) {
        section.toss-a-coin .background-image .chance-icon-2 {
          width: 60px;
          height: 60px; } }
      @media screen and (max-width: 641px) {
        section.toss-a-coin .background-image .chance-icon-2 {
          left: 5%;
          top: 0; } }
      @media screen and (max-width: 380px) {
        section.toss-a-coin .background-image .chance-icon-2 {
          width: 50px;
          height: 50px; } }
    section.toss-a-coin .background-image .chance-icon-3 {
      width: 68px;
      height: 68px;
      left: 37%;
      top: 0px;
      display: block;
      -webkit-transform-origin: center;
              transform-origin: center;
      -webkit-animation: flipCardY 10s ease-in-out infinite;
              animation: flipCardY 10s ease-in-out infinite; }
      @media screen and (max-width: 1025px) {
        section.toss-a-coin .background-image .chance-icon-3 {
          top: 30px; } }
      @media screen and (max-width: 641px) {
        section.toss-a-coin .background-image .chance-icon-3 {
          left: 30%;
          top: 0px;
          width: 50px;
          height: 50px; } }
      @media screen and (max-width: 380px) {
        section.toss-a-coin .background-image .chance-icon-3 {
          width: 40px;
          height: 40px; } }
    section.toss-a-coin .background-image .chance-icon-4 {
      width: 62px;
      height: 62px;
      -webkit-filter: blur(3px);
              filter: blur(3px);
      right: 39%;
      top: 10px; }
      @media screen and (max-width: 641px) {
        section.toss-a-coin .background-image .chance-icon-4 {
          right: 35%; } }
      @media screen and (max-width: 380px) {
        section.toss-a-coin .background-image .chance-icon-4 {
          width: 50px;
          height: 50px; } }
    section.toss-a-coin .background-image .chance-icon-5 {
      width: 95px;
      height: 95px;
      right: 20%;
      top: 10px;
      display: block;
      -webkit-transform-origin: center;
              transform-origin: center;
      -webkit-animation: flipCardX 10s ease-in-out infinite;
              animation: flipCardX 10s ease-in-out infinite;
      -webkit-animation-delay: 7.5s;
              animation-delay: 7.5s; }
      @media screen and (max-width: 1025px) {
        section.toss-a-coin .background-image .chance-icon-5 {
          width: 75px;
          height: 75px; } }
      @media screen and (max-width: 641px) {
        section.toss-a-coin .background-image .chance-icon-5 {
          width: 75px;
          height: 75px;
          right: 7%;
          top: -10px; } }
      @media screen and (max-width: 380px) {
        section.toss-a-coin .background-image .chance-icon-5 {
          width: 65px;
          height: 65px; } }
    section.toss-a-coin .background-image .chance-icon-6 {
      width: 90px;
      height: 90px;
      right: 32px;
      -webkit-animation: flipCardX 10s ease-in-out infinite;
              animation: flipCardX 10s ease-in-out infinite;
      top: 100px;
      -webkit-animation-delay: 5s;
              animation-delay: 5s; }
      @media screen and (max-width: 1025px) {
        section.toss-a-coin .background-image .chance-icon-6 {
          width: 70px;
          height: 70px; } }
      @media screen and (max-width: 769px) {
        section.toss-a-coin .background-image .chance-icon-6 {
          top: 30px; } }
      @media screen and (max-width: 641px) {
        section.toss-a-coin .background-image .chance-icon-6 {
          top: 100px;
          right: 0;
          opacity: 0.4;
          -webkit-animation: none;
                  animation: none; } }
      @media screen and (max-width: 380px) {
        section.toss-a-coin .background-image .chance-icon-6 {
          width: 60px;
          height: 60px; } }
    section.toss-a-coin .background-image .chance-icon-7 {
      width: 90px;
      height: 90px;
      left: 15%;
      opacity: 0.4;
      top: 150px; }
      @media screen and (max-width: 1025px) {
        section.toss-a-coin .background-image .chance-icon-7 {
          width: 75px;
          height: 75px; } }
      @media screen and (max-width: 641px) {
        section.toss-a-coin .background-image .chance-icon-7 {
          left: 0%;
          top: 80px; } }
      @media screen and (max-width: 380px) {
        section.toss-a-coin .background-image .chance-icon-7 {
          width: 65px;
          height: 65px; } }
    section.toss-a-coin .background-image .chance-icon-8 {
      width: 90px;
      height: 90px;
      left: 35%;
      opacity: 0.4;
      top: 150px; }
      @media screen and (max-width: 1025px) {
        section.toss-a-coin .background-image .chance-icon-8 {
          width: 75px;
          height: 75px; } }
      @media screen and (max-width: 641px) {
        section.toss-a-coin .background-image .chance-icon-8 {
          left: 35%;
          width: 65px;
          height: 65px;
          top: 70px; } }
      @media screen and (max-width: 380px) {
        section.toss-a-coin .background-image .chance-icon-8 {
          width: 55px;
          height: 55px; } }
    section.toss-a-coin .background-image .chance-icon-9 {
      width: 70px;
      height: 70px;
      right: 35%;
      opacity: 0.3;
      top: 150px; }
      @media screen and (max-width: 1025px) {
        section.toss-a-coin .background-image .chance-icon-9 {
          width: 60px;
          height: 60px; } }
      @media screen and (max-width: 641px) {
        section.toss-a-coin .background-image .chance-icon-9 {
          opacity: 0.3;
          right: 25%;
          top: 130px; } }
      @media screen and (max-width: 380px) {
        section.toss-a-coin .background-image .chance-icon-9 {
          width: 50px;
          height: 50px; } }
    section.toss-a-coin .background-image .chance-icon-10 {
      width: 80px;
      height: 80px;
      right: 15%;
      top: 200px;
      opacity: 0.4; }
      @media screen and (max-width: 1025px) {
        section.toss-a-coin .background-image .chance-icon-10 {
          width: 60px;
          height: 60px; } }
      @media screen and (max-width: 641px) {
        section.toss-a-coin .background-image .chance-icon-10 {
          opacity: 0.3;
          right: 10%;
          top: 170px; } }
      @media screen and (max-width: 380px) {
        section.toss-a-coin .background-image .chance-icon-10 {
          width: 50px;
          height: 50px; } }
  section.toss-a-coin > div:not(.background-image) {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    position: relative;
    z-index: 2;
    gap: 2rem; }
    section.toss-a-coin > div:not(.background-image)::before {
      content: "";
      top: 0;
      left: 0;
      z-index: 1;
      background: -webkit-gradient(linear, left bottom, left top, from(rgba(0, 0, 0, 0.342)), to(transparent));
      background: linear-gradient(to top, rgba(0, 0, 0, 0.342), transparent);
      position: absolute;
      width: 100%;
      left: 50%;
      -webkit-transform: translateX(-50%);
              transform: translateX(-50%);
      min-height: 250px;
      border-radius: 100%; }
    section.toss-a-coin > div:not(.background-image) h2 {
      font-size: 52px;
      font-weight: 700;
      position: relative;
      text-align: center;
      z-index: 2;
      text-shadow: 0 0 30px black;
      line-height: 5.5rem; }
      @media screen and (max-width: 1025px) {
        section.toss-a-coin > div:not(.background-image) h2 {
          text-align: center;
          line-height: 4.5rem; } }
      @media screen and (max-width: 641px) {
        section.toss-a-coin > div:not(.background-image) h2 {
          font-size: 42px; } }
    section.toss-a-coin > div:not(.background-image) p {
      font-size: 24px;
      max-width: 700px;
      text-align: center;
      line-height: 2rem;
      position: relative;
      z-index: 2; }
      @media screen and (max-width: 641px) {
        section.toss-a-coin > div:not(.background-image) p {
          font-size: 18px; } }
    section.toss-a-coin > div:not(.background-image) a {
      width: -webkit-max-content;
      width: -moz-max-content;
      width: max-content;
      min-width: 200px;
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      gap: 1rem;
      -webkit-box-pack: center;
          -ms-flex-pack: center;
              justify-content: center;
      position: relative;
      z-index: 2; }
      section.toss-a-coin > div:not(.background-image) a img {
        width: 22px; }

.how-it-works {
  position: relative;
  overflow: hidden;
  padding: 100px 88px 100px; }
  @media screen and (max-width: 1400px) {
    .how-it-works {
      padding: 100px 0px 70px; } }
  @media screen and (max-width: 641px) {
    .how-it-works {
      padding: 32px 0px 32px; } }
  .how-it-works .container {
    position: relative;
    height: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    z-index: 3;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    padding: 0 0px; }
    .how-it-works .container h2 {
      font-size: 51px;
      text-align: center;
      margin-bottom: 3rem;
      line-height: 5rem; }
      @media screen and (max-width: 641px) {
        .how-it-works .container h2 {
          margin-bottom: 1rem;
          font-size: 36px; } }
    .how-it-works .container h3 {
      font-size: 42px;
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      gap: 1rem;
      -webkit-box-pack: center;
          -ms-flex-pack: center;
              justify-content: center; }
      .how-it-works .container h3 span {
        display: block; }
      @media screen and (max-width: 641px) {
        .how-it-works .container h3 {
          font-size: 24px; } }
      @media screen and (max-width: 365px) {
        .how-it-works .container h3 {
          -webkit-box-orient: vertical;
          -webkit-box-direction: normal;
              -ms-flex-direction: column;
                  flex-direction: column;
          -webkit-box-align: center;
              -ms-flex-align: center;
                  align-items: center; } }
    .how-it-works .container > div {
      display: grid;
      gap: 2rem;
      margin-top: 100px;
      grid-template-columns: repeat(4, 1fr); }
      @media screen and (max-width: 1281px) {
        .how-it-works .container > div {
          grid-template-columns: repeat(2, 1fr);
          gap: 4rem; } }
      @media screen and (max-width: 641px) {
        .how-it-works .container > div {
          grid-template-columns: 1fr;
          gap: 1rem;
          margin-top: 48px; } }
      .how-it-works .container > div > div,
      .how-it-works .container > div > a {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: start;
            -ms-flex-pack: start;
                justify-content: flex-start;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        gap: 1rem;
        position: relative;
        padding: 0 1rem; }
        @media screen and (max-width: 641px) {
          .how-it-works .container > div > div,
          .how-it-works .container > div > a {
            padding: 1rem 1rem 3rem; } }
        .how-it-works .container > div > div img:not(.arrow),
        .how-it-works .container > div > a img:not(.arrow) {
          width: 180px;
          height: 180px; }
        .how-it-works .container > div > div h4,
        .how-it-works .container > div > a h4 {
          font-size: 32px;
          text-align: center;
          color: white;
          line-height: 2.5rem; }
          @media screen and (max-width: 641px) {
            .how-it-works .container > div > div h4,
            .how-it-works .container > div > a h4 {
              font-size: 26px; } }
        .how-it-works .container > div > div p,
        .how-it-works .container > div > a p {
          font-size: 24px;
          text-align: center;
          color: rgba(255, 255, 255, 0.6);
          line-height: 2rem; }
          @media screen and (max-width: 641px) {
            .how-it-works .container > div > div p,
            .how-it-works .container > div > a p {
              font-size: 18px;
              line-height: 1.8rem; } }
          .how-it-works .container > div > div p span,
          .how-it-works .container > div > a p span {
            color: white; }
            .how-it-works .container > div > div p span:hover,
            .how-it-works .container > div > a p span:hover {
              text-decoration: underline; }
        .how-it-works .container > div > div img.arrow,
        .how-it-works .container > div > a img.arrow {
          position: absolute;
          left: 100%;
          top: 48%; }
          @media screen and (max-width: 641px) {
            .how-it-works .container > div > div img.arrow,
            .how-it-works .container > div > a img.arrow {
              top: 100%;
              left: 50%;
              width: 32px;
              -webkit-transform-origin: center;
                      transform-origin: center;
              -webkit-transform: rotate(90deg) translateY(50%);
                      transform: rotate(90deg) translateY(50%); } }
@media screen and (max-width: 1281px) and (min-width: 641px) {
  .how-it-works .container > div > div:nth-child(2) .arrow,
  .how-it-works .container > div > a:nth-child(2) .arrow {
    display: none; } }

  .how-it-works .background-image {
    z-index: 1;
    position: absolute;
    top: 0;
    left: 0;
    background-size: 100% 100%;
    width: 100%;
    height: 100%;
    background: -webkit-gradient(linear, left top, left bottom, color-stop(68.46%, #06462e), color-stop(95.67%, rgba(6, 70, 46, 0)));
    background: linear-gradient(180deg, #06462e 68.46%, rgba(6, 70, 46, 0) 95.67%); }
    .how-it-works .background-image .top-glow {
      position: absolute;
      top: -20%;
      left: 50%;
      -webkit-transform: translate(-50%, -50%);
              transform: translate(-50%, -50%);
      width: 1150px;
      height: 1150px;
      background: #15bc4b;
      border-radius: 50%;
      -webkit-filter: blur(300px);
              filter: blur(300px);
      pointer-events: none; }
    .how-it-works .background-image .small-glow {
      position: absolute;
      border-radius: 100%;
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-animation: glow-blink 4s ease-in-out infinite;
              animation: glow-blink 4s ease-in-out infinite;
      -webkit-box-align: center;
          -ms-flex-align: center;
              align-items: center;
      -webkit-box-pack: center;
          -ms-flex-pack: center;
              justify-content: center; }
      @media screen and (max-width: 769px) {
        .how-it-works .background-image .small-glow {
          -webkit-animation: none;
                  animation: none; } }
      .how-it-works .background-image .small-glow::after {
        opacity: 0.8;
        background-color: #00ff52;
        width: 100%;
        height: 100%;
        content: "";
        position: absolute;
        left: 0;
        -webkit-filter: blur(100px);
                filter: blur(100px);
        top: 0; }
      .how-it-works .background-image .small-glow::before {
        position: absolute;
        content: "";
        left: 50%;
        top: 50%;
        -webkit-transform: translate(-50%, -50%);
                transform: translate(-50%, -50%);
        width: 17%;
        height: 17%;
        border-radius: 100%;
        background-color: #0cff61;
        -webkit-filter: blur(25px);
                filter: blur(25px); }
      .how-it-works .background-image .small-glow.g-1 {
        width: 110px;
        height: 110px;
        -webkit-animation-delay: -0.3s;
                animation-delay: -0.3s;
        top: 40%;
        left: 40%; }
      .how-it-works .background-image .small-glow.g-2 {
        width: 200px;
        height: 200px;
        -webkit-animation-delay: -1.1s;
                animation-delay: -1.1s;
        top: 60%;
        right: 2%; }
      .how-it-works .background-image .small-glow.g-3 {
        width: 82px;
        height: 82px;
        -webkit-animation-delay: -2.4s;
                animation-delay: -2.4s;
        top: 40%;
        right: 7%; }
      .how-it-works .background-image .small-glow.g-4 {
        width: 82px;
        height: 82px;
        -webkit-animation-delay: -0.8s;
                animation-delay: -0.8s;
        top: 60%;
        right: 45%; }
      .how-it-works .background-image .small-glow.g-5 {
        width: 82px;
        height: 82px;
        -webkit-animation-delay: -3.2s;
                animation-delay: -3.2s;
        top: 30%;
        right: 35%; }
      .how-it-works .background-image .small-glow.g-6 {
        width: 82px;
        height: 82px;
        -webkit-animation-delay: -1.7s;
                animation-delay: -1.7s;
        top: 10%;
        right: 5%; }
      .how-it-works .background-image .small-glow.g-7 {
        width: 50px;
        height: 50px;
        -webkit-animation-delay: -2.9s;
                animation-delay: -2.9s;
        top: 30%;
        left: 20%; }
      .how-it-works .background-image .small-glow.g-8 {
        width: 110px;
        height: 110px;
        -webkit-animation-delay: -0.5s;
                animation-delay: -0.5s;
        top: 30%;
        left: 00%; }
      .how-it-works .background-image .small-glow.g-9 {
        width: 150px;
        height: 150px;
        -webkit-animation-delay: -1.3s;
                animation-delay: -1.3s;
        top: 30%;
        left: 20%; }
      .how-it-works .background-image .small-glow.g-10 {
        width: 100px;
        height: 100px;
        -webkit-animation-delay: -2.1s;
                animation-delay: -2.1s;
        top: 60%;
        left: 30%; }
      .how-it-works .background-image .small-glow.g-11 {
        width: 200px;
        height: 200px;
        -webkit-animation-delay: -3.6s;
                animation-delay: -3.6s;
        top: 20%;
        left: 50%; }
      .how-it-works .background-image .small-glow.g-12 {
        width: 100px;
        height: 100px;
        -webkit-animation-delay: -0.9s;
                animation-delay: -0.9s;
        top: 70%;
        left: -10%; }
      .how-it-works .background-image .small-glow.g-13 {
        width: 100px;
        height: 100px;
        -webkit-animation-delay: -2.7s;
                animation-delay: -2.7s;
        top: 5%;
        right: -10%; }
      .how-it-works .background-image .small-glow.g-14 {
        width: 150px;
        height: 150px;
        -webkit-animation-delay: -1.5s;
                animation-delay: -1.5s;
        top: 35%;
        right: -10%; }
      .how-it-works .background-image .small-glow.g-15 {
        width: 150px;
        height: 150px;
        -webkit-animation-delay: -3.3s;
                animation-delay: -3.3s;
        top: 70%;
        right: -10%; }

.sponsor {
  padding: 150px 0; }
  @media screen and (max-width: 1537px) {
    .sponsor {
      padding: 0; } }
  .sponsor .container {
    padding: 0 120px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center; }
    @media screen and (max-width: 1537px) {
      .sponsor .container {
        padding: 0 64px;
        gap: 4rem;
        -webkit-box-orient: vertical;
        -webkit-box-direction: reverse;
            -ms-flex-direction: column-reverse;
                flex-direction: column-reverse; } }
    @media screen and (max-width: 641px) {
      .sponsor .container {
        padding: 0 24px; } }
    .sponsor .container .gift-box {
      width: 420px;
      position: relative;
      height: 659px;
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-align: end;
          -ms-flex-align: end;
              align-items: flex-end; }
      @media screen and (max-width: 641px) {
        .sponsor .container .gift-box {
          height: 400px; } }
      @media screen and (max-width: 641px) {
        .sponsor .container .gift-box {
          width: 300px; } }
      .sponsor .container .gift-box > img:not(.gift) {
        width: 100%;
        -o-object-fit: contain;
           object-fit: contain; }
      .sponsor .container .gift-box > img.gift {
        position: absolute;
        top: 0;
        width: 180px; }
        .sponsor .container .gift-box > img.gift.apple-gift {
          width: 182px;
          height: 182px;
          top: 230px;
          left: 0;
          -webkit-transform: rotate(-17deg);
                  transform: rotate(-17deg); }
          @media screen and (max-width: 641px) {
            .sponsor .container .gift-box > img.gift.apple-gift {
              left: 10%;
              top: 100px;
              width: 120px;
              height: 120px; } }
        .sponsor .container .gift-box > img.gift.ps5 {
          width: 184px;
          height: 184px;
          top: 300px;
          right: 10%;
          -webkit-transform: rotate(23deg);
                  transform: rotate(23deg); }
          @media screen and (max-width: 641px) {
            .sponsor .container .gift-box > img.gift.ps5 {
              top: 150px;
              width: 100px;
              height: 100px; } }
        .sponsor .container .gift-box > img.gift.iphone {
          width: 130px;
          height: 130px;
          top: 210px;
          right: 32%;
          -webkit-transform: rotate(-13deg);
                  transform: rotate(-13deg); }
@media screen and (max-width: 641px) and (max-width: 641px) {
  .sponsor .container .gift-box > img.gift.iphone {
    right: 28%;
    top: 80px;
    width: 90px;
    height: 90px; } }

        .sponsor .container .gift-box > img.gift.premium {
          width: 190px;
          height: 190px;
          top: 40px;
          right: 0;
          -webkit-transform: rotate(11deg);
                  transform: rotate(11deg); }
          @media screen and (max-width: 641px) {
            .sponsor .container .gift-box > img.gift.premium {
              top: 10px;
              right: -10px;
              width: 100px;
              height: 100px; } }
    .sponsor .container section {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
          -ms-flex-direction: column;
              flex-direction: column;
      gap: 42px; }
      @media screen and (max-width: 1537px) {
        .sponsor .container section {
          -webkit-box-align: center;
              -ms-flex-align: center;
                  align-items: center; } }
      .sponsor .container section h2 {
        font-size: 52px;
        line-height: 5rem;
        font-weight: 700; }
        @media screen and (max-width: 1537px) {
          .sponsor .container section h2 {
            text-align: center; } }
        @media screen and (max-width: 1281px) {
          .sponsor .container section h2 {
            font-size: 36px;
            line-height: 4rem; } }
        .sponsor .container section h2 span {
          color: #1cb847; }
      .sponsor .container section p {
        font-size: 24px;
        max-width: 700px;
        line-height: 2rem; }
        @media screen and (max-width: 1537px) {
          .sponsor .container section p {
            text-align: center; } }
        @media screen and (max-width: 641px) {
          .sponsor .container section p {
            font-size: 18px; } }
      .sponsor .container section > div:last-child {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        gap: 2rem; }
        @media screen and (max-width: 1537px) {
          .sponsor .container section > div:last-child {
            -webkit-box-pack: center;
                -ms-flex-pack: center;
                    justify-content: center; } }
        @media screen and (max-width: 641px) {
          .sponsor .container section > div:last-child {
            gap: 1rem;
            -webkit-box-orient: vertical;
            -webkit-box-direction: normal;
                -ms-flex-direction: column;
                    flex-direction: column;
            -webkit-box-align: center;
                -ms-flex-align: center;
                    align-items: center; }
            .sponsor .container section > div:last-child .button {
              text-align: center;
              -webkit-box-pack: center;
                  -ms-flex-pack: center;
                      justify-content: center;
              min-width: 200px; } }

.our-vision {
  padding: 100px 0; }
  .our-vision .container {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    padding: 0 172px; }
    @media screen and (max-width: 1281px) {
      .our-vision .container {
        padding: 0 60px; } }
    .our-vision .container h2 {
      margin-bottom: 32px;
      text-align: center;
      font-size: 52px; }
      @media screen and (max-width: 641px) {
        .our-vision .container h2 {
          font-size: 36px; } }
    .our-vision .container p {
      font-size: 24px;
      line-height: 2rem;
      text-align: center; }
      @media screen and (max-width: 641px) {
        .our-vision .container p {
          font-size: 18px; } }
    .our-vision .container > div {
      gap: 24px;
      margin-top: 32px;
      display: grid;
      grid-template-columns: 1fr 1fr; }
      @media screen and (max-width: 1025px) {
        .our-vision .container > div {
          grid-template-columns: 1fr; } }
      .our-vision .container > div > div {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        gap: 12px;
        -webkit-box-shadow: inset 4px 4px 3px 0 rgba(255, 255, 255, 0.05), inset -4px -4px 9.4px 0 rgba(255, 255, 255, 0.05);
                box-shadow: inset 4px 4px 3px 0 rgba(255, 255, 255, 0.05), inset -4px -4px 9.4px 0 rgba(255, 255, 255, 0.05);
        border-radius: 28px; }
        .our-vision .container > div > div:first-child {
          padding: 23px 32px;
          grid-column-start: 1;
          grid-column-end: 3; }
          @media screen and (max-width: 1025px) {
            .our-vision .container > div > div:first-child {
              grid-column-end: 2; } }
          .our-vision .container > div > div:first-child span:first-child {
            font-size: 28px;
            opacity: 0.6; }
          .our-vision .container > div > div:first-child span:last-child {
            font-size: 52px; }
            @media screen and (max-width: 1025px) {
              .our-vision .container > div > div:first-child span:last-child {
                font-size: 36px; } }
        .our-vision .container > div > div:not(:first-child) {
          padding: 58px 32px; }
          @media screen and (max-width: 1025px) {
            .our-vision .container > div > div:not(:first-child) {
              padding: 23px 32px; } }
          .our-vision .container > div > div:not(:first-child) span:first-child {
            font-size: 52px;
            line-height: 4rem;
            text-align: center; }
            @media screen and (max-width: 1025px) {
              .our-vision .container > div > div:not(:first-child) span:first-child {
                font-size: 36px; } }
          .our-vision .container > div > div:not(:first-child) span:last-child {
            text-align: center;
            font-size: 28px;
            line-height: 3rem;
            opacity: 0.6; }
            @media screen and (max-width: 1025px) {
              .our-vision .container > div > div:not(:first-child) span:last-child {
                font-size: 28px; } }

footer {
  padding: 64px 0 48px;
  background-color: #001506; }
  footer .container {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    gap: 16px; }
    @media screen and (max-width: 769px) {
      footer .container {
        gap: 64px; } }
    footer .container > div:first-child {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-align: stretch;
          -ms-flex-align: stretch;
              align-items: stretch;
      gap: 64px; }
      @media screen and (max-width: 769px) {
        footer .container > div:first-child {
          -webkit-box-orient: vertical;
          -webkit-box-direction: normal;
              -ms-flex-direction: column;
                  flex-direction: column;
          -webkit-box-align: center;
              -ms-flex-align: center;
                  align-items: center; } }
      footer .container > div:first-child > div {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        gap: 24px;
        -webkit-box-flex: 1;
            -ms-flex: 1;
                flex: 1; }
        footer .container > div:first-child > div .logo img {
          width: 220px; }
        footer .container > div:first-child > div div {
          display: -webkit-box;
          display: -ms-flexbox;
          display: flex;
          gap: 19px; }
          @media screen and (max-width: 769px) {
            footer .container > div:first-child > div div {
              -webkit-box-pack: center;
                  -ms-flex-pack: center;
                      justify-content: center; } }
          footer .container > div:first-child > div div img {
            width: 32px;
            height: 32px; }
      footer .container > div:first-child > section {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        gap: 24px;
        max-width: 550px; }
        @media screen and (max-width: 769px) {
          footer .container > div:first-child > section {
            -webkit-box-align: center;
                -ms-flex-align: center;
                    align-items: center; } }
        footer .container > div:first-child > section h3 {
          font-size: 32px; }
          @media screen and (max-width: 769px) {
            footer .container > div:first-child > section h3 {
              text-align: center; } }
          @media screen and (max-width: 641px) {
            footer .container > div:first-child > section h3 {
              font-size: 28px; } }
        footer .container > div:first-child > section p {
          font-size: 24px;
          line-height: 2rem;
          opacity: 0.6; }
          @media screen and (max-width: 769px) {
            footer .container > div:first-child > section p {
              text-align: center; } }
          @media screen and (max-width: 641px) {
            footer .container > div:first-child > section p {
              font-size: 18px; } }
        footer .container > div:first-child > section a {
          width: -webkit-max-content;
          width: -moz-max-content;
          width: max-content; }
          @media screen and (max-width: 641px) {
            footer .container > div:first-child > section a {
              min-width: 200px;
              -webkit-box-pack: center;
                  -ms-flex-pack: center;
                      justify-content: center; } }
    footer .container .rights {
      text-align: left;
      font-size: 24px; }
      @media screen and (max-width: 769px) {
        footer .container .rights {
          text-align: center;
          font-size: 18px; } }

.mini-app {
  padding: 100px 0;
  overflow: hidden; }
  @media screen and (max-width: 769px) {
    .mini-app {
      padding: 20px 0 50px; } }
  .mini-app .container {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    gap: 20rem; }
    @media screen and (max-width: 1281px) {
      .mini-app .container {
        -webkit-box-orient: vertical;
        -webkit-box-direction: reverse;
            -ms-flex-direction: column-reverse;
                flex-direction: column-reverse;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        gap: 2rem; } }
    .mini-app .container section {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
          -ms-flex-direction: column;
              flex-direction: column;
      gap: 42px; }
      @media screen and (max-width: 1281px) {
        .mini-app .container section {
          -webkit-box-align: center;
              -ms-flex-align: center;
                  align-items: center; } }
      @media screen and (max-width: 641px) {
        .mini-app .container section {
          gap: 32px; } }
      .mini-app .container section h2 {
        font-size: 52px;
        line-height: 5rem;
        font-weight: 700; }
        @media screen and (max-width: 1281px) {
          .mini-app .container section h2 {
            text-align: center;
            font-size: 36px;
            line-height: 4rem; } }
        .mini-app .container section h2 span {
          color: #1cb847; }
      .mini-app .container section p {
        font-size: 24px;
        max-width: 700px;
        line-height: 2rem; }
        @media screen and (max-width: 1281px) {
          .mini-app .container section p {
            text-align: center; } }
        @media screen and (max-width: 641px) {
          .mini-app .container section p {
            font-size: 18px; } }
        .mini-app .container section p a {
          color: #1cb847;
          text-decoration: underline;
          -webkit-transition: 0.3s;
          transition: 0.3s; }
          .mini-app .container section p a:hover {
            color: #158c36; }
      .mini-app .container section .button {
        width: -webkit-max-content;
        width: -moz-max-content;
        width: max-content; }
        @media screen and (max-width: 641px) {
          .mini-app .container section .button {
            min-width: 200px;
            -webkit-box-pack: center;
                -ms-flex-pack: center;
                    justify-content: center; } }
    .mini-app .container .image-wrapper {
      position: relative;
      width: 266px;
      height: 540px; }
      @media screen and (max-width: 769px) {
        .mini-app .container .image-wrapper {
          width: 177.33px;
          height: 360px; } }
      @media screen and (max-width: 641px) {
        .mini-app .container .image-wrapper {
          width: 133px;
          height: 270px; } }
      .mini-app .container .image-wrapper img {
        top: 0;
        left: 0;
        width: 266px;
        height: 540px;
        position: absolute;
        border-radius: 2rem;
        z-index: 1; }
        @media screen and (max-width: 769px) {
          .mini-app .container .image-wrapper img {
            width: 177.33px;
            height: 360px; } }
        @media screen and (max-width: 641px) {
          .mini-app .container .image-wrapper img {
            width: 120px;
            border-radius: 1rem;
            height: 250px; } }
        .mini-app .container .image-wrapper img:nth-child(2) {
          z-index: 2; }