@import "./fonts.css";

:root {
  --font-primary: "manrope", sans-serif;
  --energy-ease: cubic-bezier(.32, .72, 0, 1);
  --smooth-ease: cubic-bezier(.625, .05, 0, 1);
  --fade-ease: cubic-bezier(.25, .1, .25, 1);
  --black: #0f172a;
  --blue: #0284c7;
  --gray: #8e8e8e;
  --gray-secondary: gray;
  --text-initial: #8e8e8e40;
  --text-flash: #38bdf8;
  --fade-duration: .9;
  --fade-delay: 0;
}

/* The section after .text is entered by a 2s programmatic snap, so its title
   is given a longer fade and a beat of delay: at the default timing it
   finished mid-snap and read as a pop. */
[data-text-out-trigger] {
  --fade-duration: 1.4;
  --fade-delay: .45;
}

* {
  box-sizing: border-box;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  -webkit-font-smoothing: subpixel-antialiased;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
  font-family: var(--font-primary);
  color: #fff;
  margin: 0;
  padding: 0;
}

img, video {
  object-fit: cover;
  width: 100%;
  height: 100%;
}

svg {
  object-fit: contain;
  width: 100%;
  height: 100%;
  display: flex;
  overflow: visible;
}

picture {
  width: 100%;
  height: 100%;
  display: inline-block;
}

button {
  cursor: pointer;
  background: none;
  border: none;
}

input, select, textarea {
  background: none;
  border: none;
}

input:focus, textarea:focus, select:focus {
  box-shadow: none;
  outline: none;
}

input[type="number"]::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

input[type="number"]::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

input[type="number"] {
  -webkit-appearance: textfield;
  -moz-appearance: textfield;
  appearance: textfield;
}

span, strong, b, .twist-line, .fade-line, .split-line, .split-word, .split-char {
  color: inherit;
  font-family: inherit;
  font-size: inherit;
  font-weight: inherit;
  line-height: inherit;
}

input:-webkit-autofill {
  caret-color: currentColor;
  transition: background-color 5000s ease-in-out;
  -webkit-text-fill-color: currentColor !important;
  -webkit-box-shadow: inset 0 0 0 1000px #0000 !important;
}

input:-webkit-autofill:hover {
  caret-color: currentColor;
  transition: background-color 5000s ease-in-out;
  -webkit-text-fill-color: currentColor !important;
  -webkit-box-shadow: inset 0 0 0 1000px #0000 !important;
}

input:-webkit-autofill:focus {
  caret-color: currentColor;
  transition: background-color 5000s ease-in-out;
  -webkit-text-fill-color: currentColor !important;
  -webkit-box-shadow: inset 0 0 0 1000px #0000 !important;
}

input:-webkit-autofill:active {
  caret-color: currentColor;
  transition: background-color 5000s ease-in-out;
  -webkit-text-fill-color: currentColor !important;
  -webkit-box-shadow: inset 0 0 0 1000px #0000 !important;
}

textarea:-webkit-autofill {
  caret-color: currentColor;
  transition: background-color 5000s ease-in-out;
  -webkit-text-fill-color: currentColor !important;
  -webkit-box-shadow: inset 0 0 0 1000px #0000 !important;
}

select:-webkit-autofill {
  caret-color: currentColor;
  transition: background-color 5000s ease-in-out;
  -webkit-text-fill-color: currentColor !important;
  -webkit-box-shadow: inset 0 0 0 1000px #0000 !important;
}

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

li {
  list-style: none;
}

body {
  background: #fff;
}

html {
  -webkit-tap-highlight-color: transparent;
  scrollbar-gutter: stable;
  font-size: max(5px, min(.47619vw + .01rem, 19px));
}

@media screen and (max-width: 1000px) and (orientation: landscape) {
  html {
    font-size: max(3px, min(.520833vw + .0109375rem, 19px));
  }
}

@media screen and (max-width: 481px) and (orientation: portrait) {
  html {
    font-size: 2.27273vw;
  }
}

@media screen and (min-width: 482px) and (orientation: portrait) {
  html {
    font-size: 1.53846vw;
  }
}

::-webkit-scrollbar-thumb {
  background-color: #00000080;
  border-radius: 4px;
}

@media (orientation: portrait) {
  .is--scroll-bar::-webkit-scrollbar {
    display: none;
  }
}

::selection {
  color: #fff;
  background: #5c788f;
}

::selection {
  color: #fff;
  background: #5c788f;
}

.clippy {
  width: 0;
  height: 0;
  position: absolute;
  top: -999px;
  left: -999px;
}

html.lenis, html.lenis body {
  height: auto;
}

.lenis:not(.lenis-autoToggle).lenis-stopped {
  overflow: clip;
}

.lenis.lenis-smooth [data-lenis-prevent] {
  overscroll-behavior: contain;
}

.lenis.lenis-smooth iframe {
  pointer-events: none;
}

.lenis.lenis-autoToggle {
  transition-behavior: allow-discrete;
  transition-property: overflow;
  transition-duration: 1ms;
}

.loading-layer {
  z-index: 150;
  -webkit-backdrop-filter: blur(40px);
  backdrop-filter: blur(40px);
  opacity: 0;
  visibility: hidden;
  width: 100%;
  height: 100dvh;
  transition: opacity .6s var(--ease),
    visibility 0s var(--ease);
  background: #0b0b0bcc;
  justify-content: center;
  align-items: center;
  display: flex;
  position: fixed;
  top: 0;
  left: 0;
}

html[data-loading] .loading-layer {
  opacity: 1;
  visibility: visible;
}

.loading-layer svg {
  transform-origin: center;
  width: 6rem;
  height: 6rem;
  animation: 2s linear infinite rotate4;
}

.loading-layer svg circle {
  fill: none;
  stroke: var(--orange);
  stroke-width: 2px;
  stroke-dasharray: 1 200;
  stroke-dashoffset: 0;
  stroke-linecap: round;
  animation: 1.5s ease-in-out infinite dash4;
}

@keyframes rotate4 {
  100% {
    transform: rotate(360deg);
  }
}

@keyframes dash4 {
  0% {
    stroke-dasharray: 1 200;
    stroke-dashoffset: 0;
  }

  50% {
    stroke-dasharray: 90 200;
    stroke-dashoffset: -35px;
  }

  100% {
    stroke-dashoffset: -125px;
  }
}

.is--container {
  max-width: 2500px;
}

.is--perspective {
  perspective: 110vw;
}

.is--black {
  color: var(--black);
}

.is--blue {
  color: var(--blue);
}

.is--gray {
  color: var(--gray);
}

.is--500 {
  font-weight: 500;
}

.is--700 {
  font-weight: 700;
}

.is--contain {
  object-fit: contain;
}

.split-line {
  line-height: inherit;
}

.split-word {
  white-space: nowrap;
  letter-spacing: inherit;
  display: inline-block;
}

.split-char {
  letter-spacing: inherit;
}
