.animate {
  animation: slideDown 2s ease-in-out forwards;
}

@keyframes slideDown {
  from {
      transform: translateY(-200%);
      opacity: 0;
  }
  to {
      transform: translateY(0);
      opacity: 1;
  }
}
@keyframes rotateAnimation {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}



.sticker-scroll svg {
  animation: rotateAnimation 4s linear infinite;
}

.tape {
  display: flex;
  flex-direction: column;
  overflow: hidden;
  height: 100%; /* Set the desired height */
  transition: transform 0.3s ease;
}

.tape__line {
  display: flex;
  align-items: center;
  animation: moveTape 10s linear infinite;
}

@keyframes moveTape {
  0% {
    transform: translateY(0);
  }
  100% {
    transform: translateY(-100%);
  }
}


html { font-size: 8px; height: 100%; }
@media screen and (min-width: 992px) {
html { font-size: .5208333333vw; }
}
.cursor, .cursor-follow {
pointer-events:none;
user-select: none;
}
.hand {
font-feature-settings: 'ss01';
}

.nav__ill .squig {
stroke-dasharray: 550;
stroke-dashoffset: 0;
}
.nav__item a:hover + .nav__ill .squig {
animation: linestroke 1s linear 1;
stroke: currentColor;
}
@keyframes linestroke {
0%    { stroke-dashoffset: 550; }
50%   { stroke-dashoffset: 0; }
}
.squig {
  fill: none;
  stroke: currentColor;
  stroke-miterlimit: 10;
  stroke-width: 2px;
}
.stroke {
  color: white;
  fill: none;
  stroke-miterlimit: 2;
  stroke-width: 2px;
}
.strok {
stroke: #131314;
fill: none;
stroke-miterlimit: 2;
stroke-width: 2px;
}

.case__squiggly-arrow {
fill: none;
stroke: #000;
stroke-miterlimit: 10;
stroke-width:2px;
stroke-dasharray: 30rem;
stroke-dashoffset: 30rem;
transition: 500ms linear;
}
.case__item:hover .case__squiggly-arrow {
stroke-dashoffset: 0;
}

.h-scroll__section {
vertical-align:middle;
}
.cursor::after {
  content: var(--content, "");
  position: absolute;
  top: 2rem;
  left: 2rem;
  font-size: 3rem;
  display:block;
  white-space:nowrap;
  opacity: 0;
  transition: opacity 500ms ease-out 0s, transform 300ms ease-out 0s;
  transform: translate3d(0px, 1rem, 0px);
  will-change: transform, opacity;
}

[data-hover="case-item"] .cursor::after {
    --content: var(--custom-content);
    opacity:1;
    transform: none;
}

html.has-scroll-smooth {
  overflow: hidden;
  position: fixed;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;  
}
.header.nav-open a {
color: #131314;
}
.image-wrap::before {
display:block;
content: "";
padding-bottom: 55%;
}
.image-wrap__fx::before {
display:block;
content: "";
padding-bottom: 120%;
}
.story__video iframe {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
width: 100%;
height: 100%;
pointer-events: none;
}


body.invert {
color: #ffffff;
background: #131314;
}
body.invert a:not(.nav-open, .nav-open a, .nav__link) {
color: #ffffff;
}
body.invert .divider-title {
border-color: #ffffff;
}
.home_lottie path {
fill: currentColor !important;
}
#processAnim path {
stroke: currentColor !important;
stroke-width: 2;

}

.nav-open {
mix-blend-mode: normal;
}
.scroll-list:nth-child(1) {
animation: scrollServices1A 60s linear -20s infinite;
}
.scroll-list:nth-child(2) {
animation: scrollServices1B 60s linear 11.5s infinite;
}
.scroll-list_wrap.second .scroll-list:nth-child(1) {
animation: scrollServices2A 60s linear -20s infinite;
}
.scroll-list_wrap.second .scroll-list:nth-child(2) {
animation: scrollServices2B 60s linear 11.5s infinite;
}

body.case-page, body.case-page .story__block.intro {
background-color: var(--main);
}

body.case-page .story__block {
color: var(--textc);
}
body.case-page .story__block a {
color: var(--textc);
border-color: var(--textc);
}

.team_habitat {
user-select: none;
}
.story__video iframe {
pointer-events:none;
z-index: -1;
cursor: none;
}
@supports (mix-blend-mode: multiply) {
.home-heading  {
  color: #fff;
  mix-blend-mode: difference;
}
}
.main{
display: block;
}

.main.invert {
background: #131314;
color: #fff;
}
@media screen and (min-width: 992px) {
.process__headingxl {
  color: #131314 !important;
}
}

.intro-section.invert, .story-content.invert {
background: #000;
color: #fff;
}
.main.invert .divider-title {
border-color: #fff;
}
.counter::after {
content: '%';
}

.nav-open--full {
height: 100%;
width: 100%;
overflow: hidden;
}

/* Form styles*/
.input_wrap .label {
pointer-events:none;
}
.input_wrap .input:focus ~ .label, .input_wrap .input:not(:placeholder-shown) ~ .label  {
font-size: 1.2rem;
padding-top: 0;
}

.wf-design-mode .transition {
display:none;
}
.team-grid {
overflow-x: hidden;
}

.wg-default.weglot-container--left, .wg-default.weglot-container--left .country-selector {
display: none !important;
}

.nav-trigger__squig {
stroke-dasharray: 100;
stroke-dashoffset: 100;
transition: stroke-dashoffset 600ms ease-in-out;
}
.nav-trigger:hover .nav-trigger__squig {
stroke-dashoffset: 0;
}
.nav-trigger__top {
transition: transform 600ms ease-in-out;
}
.nav-trigger:hover .nav-trigger__top {
transform: translateX(100px);
}
.site-bottom{
display: none;
}
.overlay {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: rgba(0, 0, 0, 0.5); /* Semi-transparent black */
z-index: 999; /* Ensure the overlay is on top of other content */
display: none; /* Initially hidden */
}
.overlay-active {
overflow: hidden !important; /* Hide scrollbars */
}

.overlay-active .global {
display: none !important; /* Hide the main content */
}

.overlay-active .hide.w-embed.site-bottom {
display: block !important; /* Show the navigation overlay */
}

@media screen and (min-width: 992px) {
  html {
    width: 100%;
      height: 100%;
      overflow-y: hidden;
      overflow-x: scroll;
  
  }
}
body, p, h1,h2,h3,h4,h5,h6 {
-webkit-font-smoothing: antialiased;
}



/* .reduced-font {
font-size: 4rem; 
}