@font-face {
  src: url("https://www.axis-praxis.org/fonts/webfonts/AvenirNext_Variable.woff2") format("woff2");
  font-family: "Avenir";
  font-style: normal;
  font-weight: normal;
}
/* body {
  height: 100vh;
  width: 100vw;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  margin: 0;
  padding: 0;
  background-color: black;
  color: transparent;
  font-family: "Avenir";
} */
.jss35 {
    color: white;
    /* margin: 40px 40px; */
    /* padding: 40px 40px; */
    border-radius: 16px;
    background-color: rgba(0, 0, 0, 0.3);
}

.text {
    font-variation-settings: "wght" 400, "wdth" 100;
    font-size: 11em;
    /* color:#a9cee8; */
    color: transparent;
    text-align: center;
    position: absolute;
    animation: text-flow 6s infinite;
}

.text:nth-child(1) {
    animation-delay: 0.25s;
    opacity: 0.9;
    -webkit-text-stroke: 3px #b3e1ff;
    z-index: 0;
}

.text:nth-child(2) {
    animation-delay: 0.5s;
    opacity: 0.8;
    -webkit-text-stroke: 3px #a7e6ff;
    z-index: -1;
}

.text:nth-child(3) {
    animation-delay: 0.75s;
    opacity: 0.7;
    -webkit-text-stroke: 3px #9ad8ff;
    z-index: -2;
}

.text:nth-child(4) {
    animation-delay: 1s;
    opacity: 0.6;
    -webkit-text-stroke: 3px #8dd1ff;
    z-index: -3;
}

.text:nth-child(5) {
    animation-delay: 1.25s;
    opacity: 0.5;
    -webkit-text-stroke: 3px #80d3ff;
    z-index: -4;
}

.text:nth-child(6) {
    animation-delay: 1.5s;
    opacity: 0.4;
    -webkit-text-stroke: 3px #74c5ff;
    z-index: -5;
}

.text:nth-child(7) {
    animation-delay: 1.75s;
    opacity: 0.3;
    -webkit-text-stroke: 3px #67d6ff;
    z-index: -6;
}

.text:nth-child(8) {
    animation-delay: 2s;
    opacity: 0.2;
    -webkit-text-stroke: 3px #5aadff;
    z-index: -7;
}

.text:nth-child(9) {
    animation-delay: 2.25s;
    opacity: 0.1;
    -webkit-text-stroke: 3px #deff4d;
    z-index: -8;
}

@keyframes text-flow {
    25% {
        font-variation-settings: "wght" 900, "wdth" 100;
        filter: hue-rotate(0deg);
    }

    50% {
        transform: translateY(-100px);
        font-variation-settings: "wght" 400, "wdth" 100;
    }

    75% {
        transform: translateY(0%);
        font-variation-settings: "wght" 900, "wdth" 100;
        filter: hue-rotate(90deg);
    }
}

.desktop-section {
    display: block;
}

.mobile-section {
    display: none;
}

/* Media query for screens with a maximum width of 767px (typical mobile devices) */
@media (max-width: 767px) {
    .desktop-section {
        display: none;
    }

    .mobile-section {
        display: block;
    }
}
.home-wordmark {
    pointer-events: none;
}

.home-wordmark img {
    display: block;
    height: auto !important;
    object-fit: contain;
}

.home-wordmark-q img {
    width: clamp(300px, 34vw, 620px) !important;
}

.home-wordmark-u img {
    width: clamp(150px, 12vw, 220px) !important;
}

.home-wordmark-i img {
    width: clamp(72px, 6vw, 126px) !important;
}

.home-wordmark-l img {
    width: clamp(170px, 17vw, 330px) !important;
}

.home-wordmark-ll img {
    width: clamp(210px, 21vw, 405px) !important;
}

.home-wordmark-a img {
    width: clamp(105px, 10vw, 176px) !important;
}

@media only screen and (max-width: 767px) {
    .home-wordmark-q img {
        width: 58vw !important;
    }

    .home-wordmark-u img,
    .home-wordmark-i img,
    .home-wordmark-l img,
    .home-wordmark-ll img,
    .home-wordmark-a img {
        max-width: 22vw !important;
    }
}