@font-face {
  font-family: 'Formula Condensed';
  src: url('../fonts/PPFormula-CondensedBold.woff2') format('woff2'),
       url('../fonts/PPFormula-CondensedBold.woff') format('woff');
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Neue Montreal';
  src: url('../fonts/PPNeueMontreal-Regular.woff2') format('woff2'),
       url('../fonts/PPNeueMontreal-Regular.woff') format('woff');
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Neue Montreal Medium';
  src: url('../fonts/PPNeueMontreal-Medium.woff2') format('woff2'),
       url('../fonts/PPNeueMontreal-Medium.woff') format('woff');
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}

body {
  margin: 0;
  padding: 0;
  font-family: sans-serif;
  background: #000000;
  font-family: 'Neue Montreal', sans-serif;
  color:#ffffff;
}

[data-scroll-container] {
  overflow: hidden;
}

section {
  padding: 100px 20px;
}


/* Make video cover full screen */
#bg-video {
  position: fixed;
  top: 0;
  left: 0;
  min-width: 100%;
  min-height: 100%;
  object-fit: cover;
  z-index: -1;
  background: url('../images/fallback.gif') center center / cover no-repeat;
}

/* Foreground content styling */
.content {
  position: relative;
  z-index: 1;
}



.footer-m {
  display:none;
}

h1{
  font-family: 'Formula Condensed', sans-serif;
  font-size: 8vw;
  text-transform: uppercase;
  line-height: 1;
  /*letter-spacing: 0.1875rem;*/
  /*letter-spacing: 0.15625rem;*/
  letter-spacing: 0.125rem;

}

a {
  text-decoration: none;
  color:#ffffff;
  font-family: 'Neue Montreal Medium', sans-serif;
}

::selection {
  background: black;
  color: white;
}

.logo{
  width:22rem;

 transform: translateY(100%);
  opacity: 0;
  display: block;

}


.reveal-text span {
  display: inline-block;
  opacity: 0;
  transform: translateY(20px);
}


.reveal-text p {
  display: inline-block;
  opacity: 0;
  transform: translateY(20px);
}

.reveal-text a {
  display: inline-block;
  opacity: 0;
  transform: translateY(20px);
}



.grid-wrapper {
  padding: 4rem;
}

.grid-1 {
  display: grid;
  grid-template-columns: repeat(1, 1fr);
  gap: 2rem;
  padding: 2rem;

}

.grid-2 {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 0rem;
  padding: 2rem;

}

.grid-5 {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 2rem;
  padding: 2rem;
}

.languageswitcher {
  text-align:right;
  font-family: 'Neue Montreal Medium', sans-serif;
  /*font-size:0.6875rem;*/
  font-size:0.75rem;
  align-self: center;   /* vertical */
}

.languageswitcher a{
  opacity: 1;
  transition: opacity 0.3s ease;
}

.languageswitcher a:hover{
  opacity: 0.5;
}


.wide {
  grid-column: span 3;
  /*background: #eee;  just for visibility */
}

.nested {
    grid-column: span 2;
 display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 2rem;
    line-height:1.5;
    margin-top: 2.5rem;
}



.biglink {
  font-family: 'Formula Condensed', sans-serif;
  font-size: 2.5rem;
  text-transform: uppercase;
  line-height: 1.125;
  font-weight: 600;
  position: relative;
  display: inline-block;
  transition:opacity 0.3s ease;
  /*letter-spacing: 0.0625rem;*/
  letter-spacing: 0.046875rem;
}

.biglink:hover {
  opacity: 20%;
}

.footer-xl {
  font-size:0.6875rem;
}


ul {
  padding:0 0 0 0;
 margin:0 0 0 0;
 list-style: none;
}

li {
  padding-bottom:0.25rem;
}


ul li a:hover {
  text-decoration: underline;
}


.biglink::after {
  content: '';
  position: absolute;
  top:100%;
  left:0%;
  /*bottom: -8px;
  left: 100px;*/
  /*transform: translateX(-50%);*/
  width: 25px;
  height: 25px;
  background: url('../images/arrow.svg') no-repeat center;
  background-size: contain;
  margin-top:6px;
  transition:margin-top 0.3s ease;
}


.biglink:hover::after {
  margin-top:16px;
}


/*
.bg-image {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 150vh;
  background: url('../images/background.svg') center / cover no-repeat;
  z-index: -1;
}
*/





.smalllink {
  position: relative;
  display: inline-block;
}

.smalllink::after {
  content: '';
  position: absolute;
  width: 10px;
  height: 25px;
  background: url('../images/smallarrow.svg') no-repeat center;
  background-size: contain;
  margin-left:6px;
  margin-top:-1px;
  transition: 0.3s ease;
}

.smalllink:hover::after {
  transform: rotate(-45deg);
}

.smalllink span {
  font-size:0.6875rem;
}

.custom-cursor {
  position: fixed;
  top: 0;
  left: 0;
  display:block;
  width: 10px;
  height: 10px;
  border: 1px solid #ffffff;
  border-radius: 50%;
  pointer-events: none;
  transform: translate(-50%, -50%);
  transition: transform 0.2s ease-out, width 0.3s ease, height 0.3s ease;
  z-index: 9999;
}




@media (max-width: 1280px) {

  .grid-wrapper {
  padding: 2rem;
}

  
  .grid-5 {
    grid-template-columns: repeat(2, 1fr);
  }

  .wide {
  grid-column: span 1;
  }

  .nested {
    grid-column: span 1;
    grid-template-columns: repeat(1, 1fr);
    gap:0rem;
    margin-top:1.5rem;
  }
  
  h1 {
    font-size: 7vw;
  }

  .footer-xl {
  display:none;
}

  .footer-m {
  display: grid;
  grid-template-columns: repeat(1, 1fr);
  gap: 2rem;
  padding: 2rem;
  font-size: 0.625rem;
}

  .footer-m ul{
margin:30px 0 30px 0;
}


.logo{
  width:15rem;

}


}




@media (max-width: 768px) {
  
.grid-wrapper {
  padding: 0rem;
}

  .grid-5 {
    grid-template-columns: repeat(1, 1fr);
    gap: 0rem;
  }

  .wide {
  grid-column: span 1;
  }

  .nested {
    grid-column: span 1;
    grid-template-columns: repeat(1, 1fr);
    gap:0rem;
    margin-top:0rem;
  }
  
  h1 {
    font-size: 14vw;
    letter-spacing: 0rem;
  }

  .biglink {
    font-size: 1.5rem;
    letter-spacing: 0rem;
  margin-bottom:5rem;
  }

  /*.bg-image{
      background: url('../images/background_mobile.svg') center / cover no-repeat;
  }*/


  .custom-cursor {
    display: none;
  }


}





