@charset "UTF-8";
@import url("https://fonts.googleapis.com/css2?family=Open+Sans:wght@400;800&display=swap");
:root {
  --primary: 192, 159, 228;
  --secondary: 55, 43, 222;
  --white: 255, 255, 255;
  --black: 34, 34, 34;
  --muted: 94, 98, 106;
  --error: 238, 64, 86;
  --heading-font: "Open Sans", sans-serif;
  --body-font: "Open Sans", sans-serif;
}

* {
  box-sizing: border-box;
}

html {
  font-family: var(--body-font);
  font-size: 1em;
  line-height: 1.7;
  color: rgb(var(--black));
  scroll-behavior: smooth;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  /* Using CSS to snap sections */
  scroll-snap-type: mandatory;
  scroll-snap-type: y mandatory;
}

h1,
h2,
h3 {
  font-family: var(--heading-font);
  font-weight: 700;
  line-height: 1.2;
}

h1 {
  font-size: 3.2rem;
}

h2 {
  font-size: 2.4rem;
}

h3 {
  font-size: 1.6rem;
}

h1 span {
  font-size: 6rem;
  line-height: 1em;
  letter-spacing: -0.3rem;
}

a {
  transition: color 0.3s ease;
  color: rgba(var(--black), 1);
}

a:hover {
  color: rgba(var(--black), 1);
}

p.meta {
  font-size: 0.9rem;
}

p.subtitle {
  margin-top: 1rem;
  font-size: 1.2rem;
  line-height: 1.4em;
}

body > header {
  position: absolute;
  z-index: 500;
  top: 0;
  left: 0;
  right: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 1rem;
}

body > header .left {
  max-width: 200px;
}

body > header .left span {
  display: block;
  font-size: 0.8rem;
  font-weight: 700;
  line-height: 1.2rem;
  color: rgba(var(--white), 1);
  opacity: 1;
  transition: all 0.3s ease;
  animation: revealLeft 1s ease-out forwards;
}

body > header .logo {
  width: 50px;
  height: 50px;
  overflow: hidden;
  background-image: url("../images/logo.png");
  background-repeat: no-repeat;
  background-size: contain;
}

@keyframes revealLeft {
  0% {
    transform: translateX(-200%);
  }
  100% {
    transform: translateX(0);
  }
}
/* WIP / LAST CALL */
body.wip::before,
body.lastcall::before {
  content: "";
  position: fixed;
  right: 0;
  top: 0;
  width: 100px;
  height: 100px;
  z-index: 600;
  background-repeat: none;
  background-size: 100%;
}

body.wip::before {
  background-image: url("data:image/svg+xml,%3Csvg width='300' height='300' viewBox='0 0 300 300' fill='none' xmlns='http://www.w3.org/2000/svg'%3E %3Cpath d='M0 0H300V300L0 0Z' fill='%23372BDE'/%3E %3Cpath d='M222.737 82.334L176.429 109.491L165.597 98.6596L183.911 68.6246L153.667 86.7293L142.835 75.8979L170.254 29.8511L179.83 39.4267L158.376 71.4502L191.655 51.2524L201.493 61.0896L181.033 94.1073L213.109 72.706L222.737 82.334Z' fill='white'/%3E %3Cpath d='M236.172 95.769L199.439 132.502L190.492 123.554L227.224 86.8213L236.172 95.769Z' fill='white'/%3E %3Cpath d='M258.825 142.073C256.697 144.201 254.255 145.666 251.5 146.469C248.779 147.236 245.866 147.149 242.761 146.207C239.656 145.265 236.604 143.294 233.604 140.294L228.058 134.748L214.871 147.934L205.924 138.986L242.656 102.253L257.151 116.748C260.081 119.678 262.052 122.66 263.064 125.695C264.075 128.73 264.197 131.643 263.43 134.434C262.662 137.224 261.127 139.771 258.825 142.073ZM240.04 132.498C241.749 134.207 243.424 135.079 245.063 135.114C246.703 135.149 248.255 134.434 249.72 132.969C251.186 131.504 251.901 129.951 251.866 128.312C251.831 126.672 250.959 124.998 249.25 123.288L244.383 118.422L235.174 127.631L240.04 132.498Z' fill='white'/%3E %3C/svg%3E ");
}

body.lastcall::before {
  background-image: url("data:image/svg+xml,%3Csvg width='300' height='300' viewBox='0 0 300 300' fill='none' xmlns='http://www.w3.org/2000/svg'%3E %3Cpath d='M0 0H300V300L0 0Z' fill='%23372BDE'/%3E %3Cpath d='M171.91 61.2029L163.88 53.1727L179.38 37.673C181.262 35.7906 183.024 34.1084 184.666 32.6265C183.572 32.7333 182.33 32.7467 180.942 32.6666L174.874 32.0858L175.815 22.9342L194.058 24.7966L201.187 31.9256L171.91 61.2029Z' fill='white'/%3E %3Cpath d='M214.264 74.3596C209.084 79.5396 204.418 82.47 200.266 83.1508C196.128 83.8183 192.269 82.3632 188.691 78.7853C185.194 75.2875 183.812 71.3959 184.546 67.1104C185.294 62.8116 188.151 58.1791 193.117 53.2127C198.324 48.0061 203.01 45.0557 207.175 44.3615C211.34 43.6673 215.212 45.1091 218.79 48.687C222.274 52.1714 223.636 56.0697 222.875 60.3819C222.141 64.694 219.27 69.3533 214.264 74.3596ZM200.987 61.0827C197.676 64.3936 195.607 66.8768 194.779 68.5322C193.951 70.1877 194.025 71.5027 194.999 72.4772C195.987 73.4652 197.322 73.5186 199.005 72.6375C200.7 71.7697 203.163 69.7204 206.394 66.4896C209.638 63.2455 211.701 60.769 212.582 59.0602C213.476 57.338 213.436 55.9896 212.462 55.015C211.487 54.0405 210.165 53.9737 208.497 54.8148C206.828 55.6558 204.325 57.7452 200.987 61.0827Z' fill='white'/%3E %3Cpath d='M206.154 88.798C207.382 87.5698 208.69 86.9824 210.079 87.0358C211.48 87.1025 212.876 87.8301 214.264 89.2186C215.586 90.5402 216.267 91.8886 216.307 93.2637C216.347 94.6388 215.753 95.9404 214.524 97.1687C213.323 98.3702 212.014 98.9443 210.599 98.8909C209.211 98.8375 207.876 98.1699 206.594 96.8883C205.273 95.5666 204.565 94.1916 204.472 92.7631C204.378 91.3346 204.939 90.0129 206.154 88.798Z' fill='white'/%3E %3Cpath d='M231.826 121.119L223.796 113.089L239.296 97.5892C241.178 95.7068 242.94 94.0247 244.583 92.5428C243.488 92.6496 242.246 92.6629 240.858 92.5828L234.79 92.0021L235.731 82.8505L253.975 84.7128L261.104 91.8419L231.826 121.119Z' fill='white'/%3E %3Cpath d='M274.18 134.276C269 139.456 264.334 142.386 260.182 143.067C256.044 143.735 252.186 142.279 248.608 138.702C245.11 135.204 243.728 131.312 244.462 127.027C245.21 122.728 248.067 118.095 253.033 113.129C258.24 107.922 262.926 104.972 267.091 104.278C271.257 103.584 275.128 105.025 278.706 108.603C282.19 112.088 283.552 115.986 282.791 120.298C282.057 124.61 279.187 129.27 274.18 134.276ZM260.903 120.999C257.592 124.31 255.523 126.793 254.695 128.448C253.868 130.104 253.941 131.419 254.916 132.393C255.904 133.381 257.239 133.435 258.921 132.554C260.616 131.686 263.079 129.637 266.31 126.406C269.554 123.162 271.617 120.685 272.498 118.976C273.393 117.254 273.353 115.906 272.378 114.931C271.403 113.957 270.082 113.89 268.413 114.731C266.744 115.572 264.241 117.661 260.903 120.999Z' fill='white'/%3E %3Cpath d='M130.705 75.1517L144.838 61.0178L147.835 64.0148L136.176 75.6737L141.909 81.4065L139.434 83.8814L130.705 75.1517Z' fill='white'/%3E %3Cpath d='M150.552 94.999L152.891 90.61L147.739 85.4572L143.35 87.7967L140.121 84.5678L159.301 75.3644L162.965 79.0283L153.781 98.228L150.552 94.999ZM154.69 87.381C156.791 83.3852 157.98 81.1262 158.257 80.6041C158.54 80.0885 158.772 79.689 158.953 79.4054C157.915 80.0177 155.266 81.4484 151.006 83.6977L154.69 87.381Z' fill='white'/%3E %3Cpath d='M167.837 104.434C166.561 105.711 165.095 106.255 163.439 106.068C161.789 105.888 160.145 104.979 158.508 103.342C157 101.834 155.95 100.216 155.357 98.489L158.141 95.7047C158.669 97.084 159.175 98.1893 159.659 99.0207C160.148 99.8585 160.667 100.551 161.215 101.099C161.872 101.757 162.501 102.134 163.1 102.23C163.706 102.333 164.257 102.137 164.753 101.641C165.031 101.363 165.198 101.041 165.256 100.674C165.321 100.3 165.301 99.8618 165.198 99.359C165.101 98.8628 164.811 97.9347 164.328 96.5748C163.87 95.3052 163.613 94.2675 163.555 93.4619C163.497 92.6563 163.587 91.8764 163.825 91.1224C164.064 90.3683 164.515 89.6593 165.179 88.9955C166.429 87.7452 167.834 87.1845 169.394 87.3134C170.96 87.4487 172.491 88.264 173.986 89.7592C174.721 90.494 175.333 91.2803 175.823 92.1181C176.319 92.9624 176.773 93.9066 177.186 94.9507L173.889 96.3138C173.444 95.2504 173.035 94.4093 172.661 93.7906C172.294 93.1783 171.872 92.6337 171.395 92.1568C170.828 91.5896 170.261 91.2867 169.693 91.248C169.126 91.2094 168.63 91.4027 168.205 91.8281C167.94 92.0923 167.77 92.3856 167.692 92.7078C167.621 93.0236 167.625 93.4071 167.702 93.8583C167.792 94.3094 168.098 95.2729 168.62 96.7488C169.31 98.7017 169.581 100.242 169.432 101.37C169.291 102.491 168.759 103.513 167.837 104.434Z' fill='white'/%3E %3Cpath d='M171.927 116.374L168.93 113.377L180.569 101.737L176.731 97.8993L179.226 95.405L189.899 106.078L187.404 108.572L183.566 104.734L171.927 116.374Z' fill='white'/%3E %3Cpath d='M200.929 121.691C199.801 120.563 198.503 120.115 197.033 120.347C195.57 120.573 194.081 121.443 192.567 122.957C189.415 126.109 189.022 128.867 191.387 131.233C192.38 132.225 193.83 133.179 195.738 134.094L193.224 136.608C191.581 135.931 190.044 134.877 188.613 133.447C186.557 131.391 185.606 129.196 185.761 126.863C185.922 124.523 187.169 122.187 189.502 119.854C190.972 118.385 192.525 117.366 194.162 116.799C195.805 116.226 197.42 116.145 199.005 116.557C200.604 116.97 202.076 117.85 203.423 119.197C204.796 120.569 205.843 122.281 206.565 124.33L203.162 125.8C202.885 125.02 202.573 124.269 202.225 123.547C201.877 122.825 201.445 122.207 200.929 121.691Z' fill='white'/%3E %3Cpath d='M204.361 148.808L206.701 144.419L201.548 139.266L197.159 141.606L193.93 138.377L213.11 129.174L216.774 132.838L207.59 152.037L204.361 148.808ZM208.499 141.19C210.6 137.194 211.789 134.935 212.066 134.413C212.35 133.898 212.582 133.498 212.762 133.215C211.724 133.827 209.076 135.258 204.815 137.507L208.499 141.19Z' fill='white'/%3E %3Cpath d='M209.378 153.826L223.512 139.692L226.509 142.689L214.85 154.348L220.583 160.08L218.108 162.555L209.378 153.826Z' fill='white'/%3E %3Cpath d='M220.573 165.021L234.707 150.887L237.704 153.884L226.045 165.543L231.778 171.275L229.303 173.75L220.573 165.021Z' fill='white'/%3E %3C/svg%3E ");
}

section {
  --bg: var(--white);
  background-color: rgba(var(--bg), 1);
  display: flex;
  flex-direction: column;
  padding: 1rem 1rem 10rem 1rem;
  min-height: 100vh;
  scroll-snap-align: start;
  text-align: center;
  position: relative;
}

section.middle {
  align-items: center;
  justify-content: center;
}

section.default {
  position: initial !important;
}

section > *:not(.backlayer) {
  position: relative;
  /* SET ANY ANIMATION HERE */
}

section.active > *:not(.backlayer) {
  /* SET ANY ANIMATION HERE */
}

section > h1,
section > h2,
section > h3 {
  text-align: center;
  max-width: 800px;
  margin-left: 1rem;
  margin-right: 1rem;
  margin-bottom: 0;
}

section > p,
section > .flex > p {
  max-width: 800px;
  margin-left: 1rem;
  margin-right: 1rem;
}

section > .flex > .subtitle + p {
  margin-top: -1rem;
}

.flex {
  display: flex;
  flex-direction: column;
}

.flex.column-reverse {
  flex-direction: column-reverse;
}

.flex.center {
  align-items: center;
  justify-content: center;
}

.flex.center-vertical {
  justify-content: center;
}

.flex.equal > * {
  flex: 1;
}

.flex.flex-row > * {
  display: block;
  margin: 1rem;
  border: 1px solid rgba(var(--black), 1);
  object-fit: cover;
  width: 90vw;
  height: 120vw;
}

.flex.flex-row > .flex-content {
  height: auto;
  padding: 1rem;
}

.flex.flex-row > .flex-content > p {
  margin-top: 0;
}

.flex.flex-row > .flex-content > h3 {
  margin-top: 0;
  margin-bottom: 1rem;
}

.detail-image,
.detail-video {
  cursor: pointer;
  transition: all 0.3s ease;
  filter: brightness(100%);
}

.detail-image:hover,
.detail-video:hover {
  filter: brightness(60%);
}

.responsive-media {
  --aspect-ratio: 9/16;
  position: relative;
  padding-bottom: calc(var(--aspect-ratio, 0.5625) * 100%);
  height: 0;
}

.responsive-media.potrait {
  --aspect-ratio: 16/9;
}

.responsive-media.square {
  padding-bottom: 100%;
}

.responsive-media iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.spacer-4 {
  width: 4rem;
}

.spacer-8 {
  width: 8rem;
}

.spacer-16 {
  width: 16rem;
}

.boxy {
  position: relative;
}

.boxy__content {
  position: relative;
  overflow: hidden;
  min-width: 30vw;
  min-height: 30vh;
  z-index: 20;
  background: rgba(var(--white), 1);
  border: 1px solid rgba(var(--black), 1);
}

.boxy__shadow {
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  top: -1rem;
  left: -1rem;
  background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAKCAYAAACNMs+9AAAAOklEQVQoU43MSwoAMAgD0eT+h7ZYaOlHo7N+DNHL2HAGgBWcyGcKbqTghTL4oQiG6IUpOqFEC5bI4QD8PAoKd9j4XwAAAABJRU5ErkJggg==);
  z-index: 10;
}

.nextpromo {
  display: flex;
  align-items: center;
  justify-content: space-between;
  position: fixed;
  right: 0;
  bottom: 0;
  opacity: 1;
  width: 100%;
  padding: 0.3rem 1rem 0.3rem 1.5rem;
  font-size: 0.7rem;
  background: rgba(var(--black), 1);
  color: rgba(var(--white), 1);
  z-index: 1000;
  overflow: hidden;
  transition: transform 0.3s ease;
  backface-visibility: hidden;
}

.nextpromo:hover {
  cursor: pointer;
}

.nextpromo span {
  display: flex;
  transition: all 1s ease;
  margin-right: 1rem;
  white-space: nowrap;
  font-weight: 700;
}

.nextpromo br {
  display: none;
}

.nextpromo::after {
  content: "⟫";
  font-size: 1.2rem;
  line-height: 2rem;
}

.cta {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 500;
  display: flex;
  justify-content: center;
  padding-left: 0.5rem;
  padding-right: 0.5rem;
  padding-bottom: 2.5rem;
  will-change: bottom;
  transition: bottom 0.5s ease;
}

.cta > a {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  color: rgba(var(--white), 1);
  background: rgba(var(--secondary), 1);
  margin: 1rem 0.5rem;
  padding: 0.8rem 2rem;
  font-weight: 700;
  text-align: center;
  box-shadow: 0px 9px 25px rgba(0, 0, 0, 0.12), 0px 1.12694px 3.13039px rgba(0, 0, 0, 0.06);
  transition: all 0.3s ease;
}

.cta > a:hover {
  background: rgba(var(--black), 1);
}

.cta.hide {
  bottom: -140px;
}

.cta > p {
  font-size: 0.8rem;
  position: absolute;
  top: -2rem;
  left: 1rem;
  right: 1rem;
  text-align: center;
}

.social {
  display: flex;
  margin: 0 1rem 1rem;
}

.social > a {
  flex: 1;
  display: block;
  margin: 0.5rem;
}

.social > a > span {
  display: none;
}

.social > a::before {
  content: "";
  display: block;
  width: 60px;
  height: 60px;
  margin: 0 auto 0.5rem;
  border-radius: 50%;
  background: rgba(var(--black), 1);
  background-size: 32px;
  background-repeat: no-repeat;
  background-position: center;
  text-align: center;
  transition: all 0.3s ease;
}

.social > a:hover::before {
  transform: scale(1.1);
}

.social > a.website::before {
  background-image: url("data:image/svg+xml,%3Csvg width='48' height='48' viewBox='0 0 48 48' fill='none' xmlns='http://www.w3.org/2000/svg'%3E %3Cpath d='M2.5 36.1429V11.8571C2.5 10.9922 2.86087 10.1461 3.53031 9.50995C4.20234 8.87131 5.12942 8.5 6.11111 8.5H41.8889C42.8706 8.5 43.7977 8.87131 44.4697 9.50995C45.1391 10.1461 45.5 10.9922 45.5 11.8571V36.1429C45.5 37.0078 45.1391 37.8539 44.4697 38.49C43.7977 39.1287 42.8706 39.5 41.8889 39.5H6.11111C5.12942 39.5 4.20235 39.1287 3.53031 38.49C2.86087 37.8539 2.5 37.0078 2.5 36.1429Z' stroke='white' stroke-width='3'/%3E %3Cpath d='M8 14H10' stroke='white' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E %3Cpath d='M17.1816 27.5059L18.4004 22.6602H19.4844L17.6387 29H16.7598L15.2188 24.1953L13.7188 29H12.8398L11 22.6602H12.0781L13.3262 27.4062L14.8027 22.6602H15.6758L17.1816 27.5059Z' fill='white'/%3E %3Cpath d='M26.2051 27.5059L27.4238 22.6602H28.5078L26.6621 29H25.7832L24.2422 24.1953L22.7422 29H21.8633L20.0234 22.6602H21.1016L22.3496 27.4062L23.8262 22.6602H24.6992L26.2051 27.5059Z' fill='white'/%3E %3Cpath d='M35.2285 27.5059L36.4473 22.6602H37.5312L35.6855 29H34.8066L33.2656 24.1953L31.7656 29H30.8867L29.0469 22.6602H30.125L31.373 27.4062L32.8496 22.6602H33.7227L35.2285 27.5059Z' fill='white'/%3E %3C/svg%3E ");
}

.social > a.facebook::before {
  background-image: url("data:image/svg+xml,%3Csvg width='48' height='48' viewBox='0 0 48 48' fill='none' xmlns='http://www.w3.org/2000/svg'%3E %3Cpath d='M27.2536 47.04H18.555C17.7598 47.04 17.115 46.3954 17.115 45.6V25.2567H14.0299C13.2347 25.2567 12.5899 24.6122 12.5899 23.8167V16.5227C12.5899 15.7275 13.2347 15.0827 14.0299 15.0827H17.115V10.7077C17.115 6.26084 18.9942 0.959961 27.9464 0.959961H33.9698C34.7653 0.959961 35.4098 1.60474 35.4098 2.39996V9.96956C35.4098 10.7648 34.7653 11.4096 33.9698 11.4096H29.2622C28.9973 11.4096 28.8459 11.4323 28.7672 11.4501C28.7367 11.5617 28.6936 11.8176 28.6936 12.3686V15.0827H33.9698C34.3739 15.0827 34.7592 15.2524 35.032 15.5505C35.3049 15.8486 35.4398 16.2475 35.4042 16.65L34.7569 23.9439C34.6908 24.6871 34.0683 25.2567 33.3225 25.2567H28.6936V45.6C28.6936 46.3954 28.049 47.04 27.2536 47.04ZM19.995 44.16H25.8136V23.8167C25.8136 23.0215 26.4582 22.3767 27.2536 22.3767H32.0049L32.3963 17.9627H27.2536C26.4581 17.9627 25.8136 17.3179 25.8136 16.5227V12.3686C25.8136 11.2197 25.8136 8.52961 29.2622 8.52961H32.5298V3.83996H27.9464C22.4473 3.83996 19.995 5.95801 19.995 10.7076V16.5227C19.995 17.3179 19.3502 17.9627 18.555 17.9627H15.4699V22.3766H18.555C19.3502 22.3766 19.995 23.0214 19.995 23.8166V44.16H19.995Z' fill='white'/%3E %3C/svg%3E ");
}

.social > a.instagram::before {
  background-image: url("data:image/svg+xml,%3Csvg width='48' height='48' viewBox='0 0 48 48' fill='none' xmlns='http://www.w3.org/2000/svg'%3E %3Cpath d='M33.6 44.6399H14.4C8.31259 44.6399 3.36 39.6875 3.36 33.5999V14.3999C3.36 8.31246 8.31259 3.35986 14.4 3.35986H33.6C39.6876 3.35986 44.64 8.31246 44.64 14.3999V33.5999C44.64 39.6875 39.6876 44.6399 33.6 44.6399ZM14.4 6.23986C9.90048 6.23986 6.24 9.90034 6.24 14.3999V33.5999C6.24 38.0994 9.90048 41.7599 14.4 41.7599H33.6C38.0995 41.7599 41.76 38.0994 41.76 33.5999V14.3999C41.76 9.90034 38.0995 6.23986 33.6 6.23986H14.4ZM24 34.5599C18.1772 34.5599 13.44 29.8227 13.44 23.9999C13.44 18.177 18.1772 13.4399 24 13.4399C29.8228 13.4399 34.56 18.177 34.56 23.9999C34.56 29.8227 29.8228 34.5599 24 34.5599ZM24 16.3199C19.7653 16.3199 16.32 19.7652 16.32 23.9999C16.32 28.2346 19.7653 31.6799 24 31.6799C28.2347 31.6799 31.68 28.2346 31.68 23.9999C31.68 19.7652 28.2347 16.3199 24 16.3199ZM35.52 10.0799C34.1945 10.0799 33.12 11.1544 33.12 12.4799C33.12 13.8053 34.1945 14.8799 35.52 14.8799C36.8455 14.8799 37.92 13.8053 37.92 12.4799C37.92 11.1544 36.8455 10.0799 35.52 10.0799Z' fill='white'/%3E %3C/svg%3E ");
}

.social > a.youtube::before {
  background-image: url("data:image/svg+xml,%3Csvg width='48' height='48' viewBox='0 0 48 48' fill='none' xmlns='http://www.w3.org/2000/svg'%3E %3Cpath d='M36 41.04H12C5.91259 41.04 0.959999 36.0876 0.959999 30V18C0.959999 11.9126 5.91259 6.95996 12 6.95996H36C42.0877 6.95996 47.04 11.9126 47.04 18V30C47.04 36.0876 42.0877 41.04 36 41.04ZM12 9.83996C7.50048 9.83996 3.84 13.5004 3.84 18V30C3.84 34.4995 7.50048 38.16 12 38.16H36C40.4995 38.16 44.16 34.4995 44.16 30V18C44.16 13.5004 40.4995 9.83996 36 9.83996H12ZM18.5311 33.0586C18.281 33.0586 18.0309 32.9934 17.8071 32.8635C17.3639 32.6053 17.0911 32.1314 17.0911 31.6185V16.3814C17.0911 15.8685 17.3639 15.3944 17.8071 15.1366C18.2498 14.8785 18.7973 14.8759 19.2431 15.1298L32.6353 22.7484C33.0853 23.0043 33.3633 23.4822 33.3633 23.9999C33.3633 24.5179 33.0853 24.9955 32.6353 25.2515L19.2431 32.8701C19.0224 32.9957 18.7767 33.0586 18.5311 33.0586ZM19.9711 18.8573V29.1426L29.011 24L19.9711 18.8573Z' fill='white'/%3E %3C/svg%3E ");
}

.backlayer {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  overflow: hidden;
}

.backlayer .box {
  --x: 0;
  --y: 0;
  --r: 0;
  --o: 0;
  position: absolute;
  top: 50%;
  left: 50%;
  margin-left: -5vw;
  min-width: 18vw;
  min-height: 12vw;
  border: 1px solid rgba(var(--white), 1);
  opacity: var(--o);
  transition: transform 1s ease, opacity 1s ease;
  transform: translateX(var(--x)) translateY(var(--y)) rotate(var(--r));
}

.scroll-down {
  display: block;
  position: absolute !important;
  bottom: 3rem;
  padding-top: 48px;
  text-align: center;
}

.scroll-down .arrow-down {
  display: block;
  margin: 0 auto;
  width: 10px;
  height: 24px;
}

.scroll-down .arrow-down:after {
  --color: rgba(var(--white), 1);
  content: "";
  display: block;
  margin: 0;
  padding: 0;
  width: 8px;
  height: 8px;
  border-top: 2px solid var(--color);
  border-right: 2px solid var(--color);
  transform: rotate(135deg);
}

.scroll-title {
  --color: rgba(var(--white), 1);
  display: block;
  text-transform: uppercase;
  color: var(--color);
  font-size: 0.9rem;
  font-weight: 700;
}

.scroll-down::before {
  --color: rgba(var(--white), 1);
  animation: elasticus 1.2s cubic-bezier(1, 0, 0, 1) infinite;
  position: absolute;
  top: 0px;
  left: 50%;
  margin-left: -1px;
  width: 2px;
  height: 54px;
  background: var(--color);
  content: " ";
}

@keyframes elasticus {
  0% {
    transform-origin: 0% 0%;
    transform: scale(1, 0);
  }
  50% {
    transform-origin: 0% 0%;
    transform: scale(1, 1);
  }
  50.1% {
    transform-origin: 0% 100%;
    transform: scale(1, 1);
  }
  100% {
    transform-origin: 0% 100%;
    transform: scale(1, 0);
  }
}
/* = SECTION ONE */
section:nth-of-type(1) {
  color: rgba(var(--white), 1);
  padding-bottom: 8rem;
}

section:nth-of-type(1) .backlayer {
  background: #075c80;
}

section:nth-of-type(1) h1 {
 margin: 0 0 0.5rem 0;
    text-align: center;
    /* text-shadow: 0px 18px 0px rgb(131 118 71 / 19%), 0px 13.0922px 0px rgb(131 115 71 / 33%), 0px 9.1125px 0px rgb(144 132 88 / 42%), 0px 5.97656px 0px rgb(144 127 88 / 50%), 0px 3.6px 0px rgb(177 172 115 / 58%), 0px 1.89844px 0px rgb(177 161 115 / 68%), 0px 0.7875px 0px rgb(220 206 155 / 81%), 0px 0.182812px 0px #dcd19b; */
    -webkit-text-stroke: 1px #F8F8F8;
    text-shadow: 0px 5px 9px #0c3143;
    color: #0a4e6a;}

section:nth-of-type(1) h1 span {
  /*text-shadow: -11.8246px 22.0268px 0px rgb(131 118 71 / 19%), -8.62482px 16.0662px 0px rgb(131 121 71 / 33%), -6.06936px 11.3059px 0px rgb(131 144 88 / 42%), -4.08204px 7.60396px 0px rgb(144 129 88 / 50%), -2.58664px 4.81835px 0px rgb(177 164 115 / 58%), -1.50695px 2.80712px 0px rgb(177 167 115 / 68%), -0.766753px 1.4283px 0px rgb(220 209 155 / 81%), -0.289842px 0.539914px 0px #dcce9b;*/
}

section:nth-of-type(1) p {
  margin-top: 2rem;
  max-width: 32rem;
}

/* = OVERLAY */
.overlay {
  position: fixed;
  top: 0;
  left: 0;
  height: 0;
  width: 0;
  z-index: 1000;
  overflow: hidden;
}

.overlay__reveal {
  position: fixed;
  top: 0;
  left: 0;
  height: 100vh;
  width: 100vw;
  z-index: 2000;
  left: -100vw;
  background: rgba(var(--black), 1);
  will-change: left;
}

.overlay__reveal .close {
  position: absolute;
  top: 0.5rem;
  right: 0.5rem;
  display: block;
  text-align: center;
  font-size: 1.4rem;
  font-weight: bold;
  cursor: pointer;
  width: 60px;
  height: 60px;
  padding: 0.5rem 2rem;
  color: rgba(var(--white), 0.5);
  transition: all 0.3s ease;
  background-image: url("../images/logo.png");
  background-size: 48px;
  background-repeat: no-repeat;
  background-position: center;
}

.overlay__reveal .close:hover {
  color: rgba(var(--white), 1);
  transform: scale(1.1);
}

.overlay__inner {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  width: 100%;
  height: 100%;
}

.overlay__inner img {
  width: 90vw;
  border: 0;
}

.overlay__inner .responsive-media {
  width: 100%;
}

.overlay__inner .overflow-title {
  flex: 0 1 auto;
  color: rgba(var(--white), 1);
  margin-bottom: 1rem;
  margin-left: 60px;
  margin-right: 60px;
  text-align: center;
}

.overlay__inner .overflow-body {
  flex: 1 1 auto;
  color: rgba(var(--white), 1);
  font-size: 0.9rem;
  padding: 0 2rem 1rem;
  overflow-y: auto;
  position: relative;
}

.overlay__inner .overflow-body h4 {
  position: sticky;
  top: 0;
  background: rgba(var(--black), 1);
  font-size: 1rem;
  font-weight: normal;
  line-height: 1.4rem;
  padding-bottom: 1rem;
  padding-top: 0.5rem;
  margin-top: 0;
  margin-bottom: 0;
  text-align: center;
}

.overlay__inner .overflow-body h4 strong {
  display: block;
}

.overlay__inner .overflow-body ol,
.overlay__inner .overflow-body ul {
  margin: 0;
  padding-top: 0.5rem;
  padding-left: 1.5rem;
  padding-right: 1.5rem;
}

.overlay__inner .overflow-body li {
  padding-bottom: 0.5rem;
}

.overflow-content {
  display: none;
}

.overlay.open {
  height: 100vh;
  width: 100vw;
}

.overlay.open .overlay__reveal {
  animation: reveal 0.5s ease forwards;
}

@keyframes reveal {
  from {
    left: -100vw;
  }
  to {
    left: 0;
  }
}
/* For desktop */
@media only screen and (min-width: 35rem) {
  h1 {
    font-size: 4.8rem;
  }

  h2 {
    font-size: 3.2rem;
  }

  h1 span {
    font-size: 10rem;
  }

  p.subtitle {
    margin-top: 1rem;
    font-size: 1.8rem;
    line-height: 1.4em;
  }

  .flex.row {
    flex-direction: row;
  }

  .flex.split {
    align-items: center;
    justify-content: space-between;
  }

  .flex.start {
    align-items: flex-start;
  }

  .flex.end {
    align-items: flex-end;
  }

  .flex.flex-row {
    flex-direction: row;
  }

  .flex.flex-row > * {
    margin: 1rem;
  }

  .flex.flex-row > *:first-child:nth-last-child(1) {
    width: 80vw;
    height: 40vw;
  }

  .flex.flex-row > *:first-child:nth-last-child(2),
.flex.flex-row > *:first-child:nth-last-child(2) ~ * {
    width: 30vw;
    height: 40vw;
  }

  .flex.flex-row > *:first-child:nth-last-child(3),
.flex.flex-row > *:first-child:nth-last-child(3) ~ * {
    width: 24vw;
    height: 32vw;
  }

  .flex.flex-row > * {
    --x: 0;
    --y: 0;
    --r: 0;
    will-change: transform;
    transform: translateX(var(--x)) translateY(var(--y));
    transition: all 1s ease;
  }

  .flex.flex-row > .flex-content.align-left {
    text-align: left;
  }

  body > header {
    padding: 1rem 2rem;
  }

  body > header .left {
    max-width: 250px;
  }

  body > header .left span {
    display: block;
    font-size: 1.2rem;
    font-weight: 700;
    line-height: 1.6rem;
    transition: color 0.3s ease;
  }

  body > header .logo {
    width: 80px;
    height: 80px;
  }

  .nextpromo {
    bottom: 100px;
    max-width: 200px;
    width: auto;
    padding: 0.3rem 1rem 0.3rem 1.5rem;
  }

  .nextpromo br {
    display: inline-block;
  }

  .nextpromo span {
    display: flex;
    transition: all 1s ease;
    max-width: 200px;
    max-height: 4rem;
    margin-right: 1rem;
    white-space: nowrap;
    font-weight: 700;
  }

  .nextpromo::after {
    font-size: 2rem;
    line-height: 4rem;
  }

  .nextpromo.hide span {
    max-width: 0;
    opacity: 0;
    margin-right: 0;
  }

  .nextpromo.hide:hover span {
    max-width: 200px;
    margin-right: 1rem;
    opacity: 1;
  }

  .cta {
    min-width: 400px;
    max-width: 500px;
    margin: 0 auto;
    padding: 0;
  }

  .cta > p {
    top: 1.2rem;
    left: auto;
    right: -170px;
  }

  .social > a::before {
    width: 80px;
    height: 80px;
    background-size: 48px;
  }

  .indicator {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    position: fixed;
    z-index: 500;
    height: 500px;
    top: 50%;
    margin-top: -250px;
    left: 2rem;
    animation: revealLeft 0.5s ease-out forwards;
    display: none;
  }

  .indicator .dot {
    display: block;
    width: 16px;
    height: 16px;
    margin: 0.5rem;
    border: 1px solid rgba(var(--black), 1);
    border-radius: 50%;
    transition: all 0.3s ease;
  }

  .indicator .dot.active {
    background: rgba(var(--black), 1);
  }

  .indicator.invert .dot {
    border-color: rgba(var(--white), 1);
  }

  .indicator.invert .dot.active {
    background: rgba(var(--white), 1);
  }
}
/* Finetune some mobile layout */
@media only screen and (max-width: 35rem) {
  html {
    scroll-snap-type: none;
    scroll-snap-type: y none;
  }

  section {
    padding-top: 5rem;
    padding-bottom: 5rem;
  }

  section:not(:nth-of-type(1)) {
    min-height: 0;
  }

  section:last-of-type {
    padding-bottom: 15rem;
  }

  .cta::before {
    content: "";
    position: absolute;
    top: -2rem;
    right: 0;
    bottom: 0;
    left: 0;
    /* background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, #ffffff 5%); */
    background: rgba(var(--white), 1);
    border-radius: 24px 24px 0 0;
    box-shadow: 0px -49px 65px rgba(0, 0, 0, 0.07), 0px -10.9448px 14.5186px rgba(0, 0, 0, 0.0417275), 0px -3.25855px 4.32257px rgba(0, 0, 0, 0.0282725);
  }

  .cta > * {
    position: relative;
  }

  .cta > a {
    font-size: 0.8rem;
    padding-left: 1rem;
    padding-right: 1rem;
  }

  .overlay__inner img {
    width: 100vw;
  }
}
.backlayer .box.box1 {
    background:url("../images/box-img1.jpg")no-repeat center;
    background-size:cover;
    box-shadow: 0px 0px 30px 5px rgb(0 0 0 / 30%);
    /*transform: rotate(-2deg);*/
    border: 3px solid #fff;
}
.backlayer .box.box2 {
    background:url("../images/box-img2.jpg")no-repeat center;
    background-size:cover;
    box-shadow: 0px 0px 30px 5px rgb(0 0 0 / 30%);
    /*transform: rotate(-2deg);*/
    border: 3px solid #fff;
}
.backlayer .box.box3 {
    background:url("../images/box-img3.jpg")no-repeat center;
    background-size:cover;
    box-shadow: 0px 0px 30px 5px rgb(0 0 0 / 30%);
    /*transform: rotate(-2deg);*/
    border: 3px solid #fff;
}
.backlayer .box.box4 {
    background:url("../images/box-img4.jpg")no-repeat center;
    background-size:cover;
    box-shadow: 0px 0px 30px 5px rgb(0 0 0 / 30%);
    /*transform: rotate(-2deg);*/
    border: 3px solid #fff;
}
.backlayer .box.box5 {
    background:url("../images/box-img5.jpg")no-repeat center;
    background-size:cover;
    box-shadow: 0px 0px 30px 5px rgb(0 0 0 / 30%);
    /*transform: rotate(-2deg);*/
    border: 3px solid #fff;
}
.backlayer .box.box6 {
    background:url("../images/box-img6.jpg")no-repeat center;
    background-size:cover;
    box-shadow: 0px 0px 30px 5px rgb(0 0 0 / 30%);
    /*transform: rotate(-2deg);*/
    border: 3px solid #fff;
}

body:before {
    content: '';
    z-index: 10000;
    position: fixed;
    opacity: 1;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: url("../images/stock.png");
    animation: 1s infinite noise;
    pointer-events: none;
}
@keyframes noise {
  0%,
  100% {
    background-position: 0 0;
  }
  10% {
    background-position: -5% -10%;
  }
  20% {
    background-position: -15% 5%;
  }
  30% {
    background-position: 7% -25%;
  }
  40% {
    background-position: 20% 25%;
  }
  50% {
    background-position: -25% 10%;
  }
  60% {
    background-position: 15% 5%;
  }
  70% {
    background-position: 0% 15%;
  }
  80% {
    background-position: 25% 35%;
  }
  90% {
    background-position: -10% 10%;
  }
}