/* Custom interaction styles only. Layout/visuals stay in Webflow. */

.navbar {
  opacity: 0;
  transition: opacity 0.7s cubic-bezier(0.83, 0, 0.17, 1);
}

html.wk-nav-lock,
html.wk-nav-lock body {
  overflow: hidden;
  overscroll-behavior: none;
  touch-action: none;
}

html.wk-nav-lock .navbar--menu {
  touch-action: pan-y;
}

html.wk-ready .navbar,
html.wk-reduced .navbar {
  opacity: 1;
}

/* Hide Webflow's Lottie until our canvas replaces it, so the logo doesn't jump. */
.navbar--logo-animation > :not(.wk-lottie-canvas) {
  opacity: 0 !important;
}

.navbar--logo-animation[data-wk-lottie="live"] > :not(.wk-lottie-canvas) {
  display: none !important;
}

.navbar--logo-animation .wk-lottie-canvas {
  display: block;
  width: 100%;
  height: 100%;
}

.navbar--brand-wrapper > .body--text-12 {
  will-change: transform, opacity;
}

.input--field:focus,
.w-input.input--field:focus {
  border-color: var(--_colors---color);
  outline: none;
}

/* iOS Safari zooms focused inputs under 16px and can leave the layout shifted. */
@media (max-width: 991px) {
  .input--field,
  .w-input.input--field {
    font-size: 1rem;
  }
}

.resource--richtext-cohort ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

.resource--richtext-cohort li {
  position: relative;
  margin-bottom: 0.4em;
  padding-left: 1.3em;
}

.resource--richtext-cohort li::before {
  content: "—";
  position: absolute;
  left: 0;
  top: 0;
}

.marquee-advanced {
  overflow: hidden;
}

.resource-hero-imgs-wrapper {
  overflow: visible;
}

.resource-hero-imgs-wrapper > .resource-hero-frame {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

.resource-hero-imgs-wrapper > .resource-hero-frame > .resource-hero-img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: cover;
  transform: none;
}

.faq--question {
  cursor: pointer;
}

.faq--icon {
  transform: rotate(0deg);
  transition: transform 0.6s cubic-bezier(0.19, 1, 0.22, 1);
}

.faq--item.is-open .faq--icon {
  transform: rotate(45deg);
}

@media (hover: hover) {
  .faq--icon.is-spinning {
    animation: wk-faq-icon-spin 0.6s cubic-bezier(0.19, 1, 0.22, 1);
  }

  .faq--item.is-open .faq--icon.is-spinning {
    animation-name: wk-faq-icon-spin-open;
  }
}

@keyframes wk-faq-icon-spin {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}

@keyframes wk-faq-icon-spin-open {
  from {
    transform: rotate(45deg);
  }
  to {
    transform: rotate(405deg);
  }
}

.faq--item .faq--response {
  display: grid;
  grid-template-rows: 0fr;
  transition: grid-template-rows 0.6s cubic-bezier(0.19, 1, 0.22, 1);
}

.faq--item .faq--response-inner {
  overflow: hidden;
  min-height: 0;
  padding-top: 0;
  padding-bottom: 0;
  transition: padding-top 0.6s cubic-bezier(0.19, 1, 0.22, 1),
    padding-bottom 0.6s cubic-bezier(0.19, 1, 0.22, 1);
}

.faq--item.is-open .faq--response {
  grid-template-rows: 1fr;
}

.faq--item.is-open .faq--response-inner {
  padding-top: 0.5rem;
  padding-bottom: 1.375rem;
}

.resource-hero-imgs-wrapper
  > .resource-hero-frame:first-child:nth-last-child(2) {
  z-index: 2;
}

.resource-hero-imgs-wrapper.is-revealed > .resource-hero-frame {
  transition: transform 0.9s cubic-bezier(0.83, 0, 0.17, 1);
}

.resource-hero-imgs-wrapper.is-revealed
  > .resource-hero-frame:first-child:nth-last-child(2) {
  transform: translate3d(-1.6rem, -0.45rem, 0) rotate(-6.5deg);
}

.resource-hero-imgs-wrapper.is-revealed
  > .resource-hero-frame:nth-child(2):last-child {
  transform: translate3d(2.6rem, -1.15rem, 0) rotate(7.5deg);
  transition-delay: 0.06s;
}

.resource-hero-imgs-wrapper.is-revealed
  > .resource-hero-frame:first-child:nth-last-child(3) {
  z-index: 1;
  transform: translate3d(-90%, 2%, 0) rotate(-12deg) scale(0.8);
}

.resource-hero-imgs-wrapper.is-revealed
  > .resource-hero-frame:nth-child(2):nth-last-child(2) {
  z-index: 3;
  transform: none;
  transition-delay: 0.06s;
}

.resource-hero-imgs-wrapper.is-revealed
  > .resource-hero-frame:nth-child(3):last-child {
  z-index: 2;
  transform: translate3d(90%, 1%, 0) rotate(9deg) scale(0.8);
  transition-delay: 0.12s;
}

/* Collage layout lives in Webflow; reveal + scrub parallax here. */
@property --wk-rot {
  syntax: "<angle>";
  inherits: false;
  initial-value: 0deg;
}

.section.is--home-collage .collage--img,
.section.is--office-collage .text-block {
  --wk-rot: 0deg;
  opacity: 0;
  transform: translate3d(var(--wk-px, 0px), var(--wk-py, 0px), 0)
    rotate(var(--wk-rot));
  transition: opacity 0.9s cubic-bezier(0.83, 0, 0.17, 1),
    --wk-rot 0.9s cubic-bezier(0.83, 0, 0.17, 1);
  will-change: opacity, transform;
}

.section.is--home-collage .collage--img.is-in,
.section.is--office-collage .text-block.is-in {
  opacity: 1;
  --wk-rot: calc(var(--wk-r, 0) * 1deg);
}

@media (prefers-reduced-motion: reduce) {
  .section.is--home-collage .collage--img,
  .section.is--office-collage .text-block {
    opacity: 1;
    --wk-rot: calc(var(--wk-r, 0) * 1deg);
    --wk-px: 0px;
    --wk-py: 0px;
    transition: none;
  }
}

.parallax-slider__list {
  cursor: grab;
  touch-action: pan-y;
}

.parallax-slider__list:active {
  cursor: grabbing;
}

.parallax-slider__item-img {
  left: 0;
  width: 100%;
  transform: none;
}

/* Mobile: same snap slider behavior as resource Swiper */
.parallax-slider__collection.wk-swiper-mode {
  overflow: visible;
}

.parallax-slider__collection.wk-swiper-mode .parallax-slider__list {
  overflow: visible;
  touch-action: pan-y;
}

.parallax-slider__collection.wk-swiper-mode .parallax-slider__item {
  height: auto;
  padding-left: 0;
  padding-right: 0;
  opacity: 0.3;
  transition: opacity 0.6s cubic-bezier(0.19, 1, 0.22, 1);
  box-sizing: border-box;
}

.parallax-slider__collection.wk-swiper-mode
  .parallax-slider__item.swiper-slide-active {
  opacity: 1;
}

.parallax-slider__collection.wk-swiper-mode .parallax-slider__item-inner {
  width: 100%;
}

.section-2:has(.wk-swiper-mode) {
  overflow: visible;
}

.section.is--footer {
  position: relative;
  z-index: 2;
  margin-top: -15dvh;
  min-height: 115dvh;
}

@media (max-width: 991px) {
  /* Prefer vh over dvh on mobile — avoids iOS visual-viewport jumps. */
  .section.is--home-hero,
  .section.is--home-green,
  .section.is--home-resources,
  .section.is--home-collage,
  .section.is--resource-hero,
  .section.is--resource-brown-light,
  .section.is--resource-brown,
  .section.is--resource-light,
  .section.is--about-hero,
  .section.is--health-hero,
  .section.is--404,
  .section.is--footer {
    min-height: 100vh;
  }

  .section.is--footer {
    margin-top: -15vh;
    min-height: 115vh;
  }

  .section.is--footer .footer--text-logo,
  .section.is--footer > .container--1544:not(.is--footer),
  .section.is--footer .container--1544.is--footer > .footer--right,
  .section.is--footer [data-wk-footer-layer] {
    transform: none !important;
  }
}

@media (min-width: 992px) {
  .section.is--home-hero .heading-style-214 {
    /* 4 lines × line-height 0.8 — JS refines after split/fonts. */
    font-size: calc((100dvh - 20rem) / 3.2);
  }
}

.marquee-advanced.is--footer,
.footer--text-logo {
  will-change: transform;
}

.section.is--footer .marquee-advanced.is--footer {
  overflow: hidden;
  padding-top: 2.5rem;
  padding-bottom: 3rem;
  transform: none;
}

.section.is--footer .marquee__advanced__p.is--footer {
  display: block;
  width: max-content;
  max-width: 100%;
  margin-inline: auto;
  white-space: nowrap;
  line-height: 0.85;
  padding-top: 0.04em;
  padding-bottom: 0.06em;
}

.section.is--footer .footer--text-logo {
  width: max-content;
  max-width: 100%;
}

.footer--line {
  transform: scaleX(1);
  transform-origin: left center;
  transition: transform 0.6s ease;
}

.footer--link-parent:hover .footer--line {
  transform: scaleX(0);
}

.footer--link-parent:hover [linkhover] .wk-roll-top .wk-roll-char,
.footer--link-parent:hover [linkhover] .wk-roll-mask > .wk-roll-top {
  transform: translate3d(0, -110%, 0);
  transition-delay: calc(var(--wk-roll, 0) * 0.02s);
}

.footer--link-parent:hover [linkhover] .wk-roll-bottom .wk-roll-char,
.footer--link-parent:hover [linkhover] .wk-roll-mask > .wk-roll-bottom {
  transform: translate3d(0, 0, 0);
  transition-delay: calc(var(--wk-roll, 0) * 0.02s);
}

@media (prefers-reduced-motion: reduce) {
  .footer--line {
    transition: none;
  }
}

/* Hidden until split so the type doesn't flash before the stagger. */
[load-split]:not(.is-ready),
[fade-split]:not(.is-ready),
[fade-split-title]:not(.is-ready),
[fade]:not(.is-ready),
[load]:not(.is-ready) {
  opacity: 0;
}

[fade].is-ready:not(.is-revealed),
[load].is-ready:not(.is-revealed) {
  opacity: 0;
  transform: translate3d(0, 1rem, 0);
}

[fade].is-revealed,
[load].is-revealed {
  animation: wk-fade 0.9s cubic-bezier(0.83, 0, 0.17, 1) both;
}

@keyframes wk-fade {
  from {
    opacity: 0;
    transform: translate3d(0, 1rem, 0);
  }

  to {
    opacity: 1;
    transform: none;
  }
}

[rotate]:not(.is-ready) {
  opacity: 0;
}

[rotate].is-ready:not(.is-revealed) {
  opacity: 0;
  transform: translate3d(var(--wk-from-x, 0), 0, 0) rotate(0deg);
}

[rotate].is-revealed {
  animation: wk-rotate-in 0.9s cubic-bezier(0.83, 0, 0.17, 1) both;
}

@keyframes wk-rotate-in {
  from {
    opacity: 0;
    transform: translate3d(var(--wk-from-x, 0), 0, 0) rotate(0deg);
  }

  to {
    opacity: 1;
    transform: translate3d(0, 0, 0) rotate(var(--wk-rotate, 0deg));
  }
}

[load-split].is-ready,
[fade-split].is-ready,
[fade-split-title].is-ready {
  opacity: 1;
}

.wk-lines {
  display: block;
}

.wk-word {
  display: inline-block;
  white-space: nowrap;
}

.wk-line {
  display: block;
  overflow: hidden;
  line-height: inherit;
}

.wk-line-inner {
  display: block;
  transform: translate3d(0, 110%, 0);
  will-change: transform;
}

[load-split] .wk-line-inner {
  transform: translate3d(0, 120%, 0);
}

.is-revealed .wk-line-inner {
  transform: translate3d(0, 0, 0);
  transition: transform 0.9s cubic-bezier(0.83, 0, 0.17, 1);
  transition-delay: var(--wk-delay, 0s);
}

.is-instant .wk-line-inner,
.is-instant.is-revealed .wk-line-inner {
  transition: none;
}

.wk-chars {
  display: inline;
}

.wk-char-word {
  display: inline-flex;
  align-items: baseline;
  overflow: hidden;
  white-space: nowrap;
  vertical-align: baseline;
  line-height: 1;
  padding: 0.3em 0.1em;
  margin: -0.3em -0.1em;
}

.wk-char-inner {
  display: inline-block;
  transform: translate3d(0, 200%, 0);
  will-change: transform;
}

.is-revealed .wk-char-inner {
  transform: translate3d(0, 0, 0);
  transition: transform 0.9s cubic-bezier(0.83, 0, 0.17, 1);
  transition-delay: var(--wk-delay, 0s);
}

.is-instant .wk-char-inner,
.is-instant.is-revealed .wk-char-inner {
  transition: none;
}

@media (prefers-reduced-motion: reduce) {
  [load-split],
  [fade-split],
  [fade-split-title],
  [fade],
  [load],
  [rotate] {
    opacity: 1;
  }

  [fade],
  [fade].is-ready,
  [fade].is-revealed,
  [load],
  [load].is-ready,
  [load].is-revealed {
    opacity: 1;
    transform: none;
    animation: none;
  }

  [rotate],
  [rotate].is-ready,
  [rotate].is-revealed {
    opacity: 1;
    transform: rotate(var(--wk-rotate, 0deg));
    animation: none;
  }

  .resource-hero-imgs-wrapper > .resource-hero-frame {
    transition: none;
  }

  .wk-line {
    overflow: visible;
    padding: 0;
    margin: 0;
  }

  .wk-line-inner,
  .wk-char-inner {
    transform: none;
    transition: none;
  }

  .wk-char-word {
    overflow: visible;
    padding: 0;
    margin: 0;
    line-height: inherit;
  }
}

@media (max-width: 991px) {
  /* Two-image heroes (Brand Lab). */
  .resource-hero-imgs-wrapper:has(
      > .resource-hero-frame:nth-child(2):last-child
    ).is-revealed
    > .resource-hero-frame:first-child {
    transform: translate3d(-2.6rem, -0.45rem, 0) rotate(-6.5deg) !important;
  }

  .resource-hero-imgs-wrapper:has(
      > .resource-hero-frame:nth-child(2):last-child
    ).is-revealed
    > .resource-hero-frame:last-child {
    transform: translate3d(2.6rem, -1.15rem, 0) rotate(7.5deg) !important;
    transition-delay: 0.06s;
  }

  .resource-hero-imgs-wrapper:has(
      > .resource-hero-frame:nth-child(2):last-child
    ) {
    /* Width comes from height × Webflow aspect-ratio (375 / 307). */
    width: auto !important;
    max-width: none;
    height: min(
      calc(
        100vh - 10rem - (5.625 * 0.972rem) - 1.25rem - (0.875 * 1.428 * 2rem) - 7rem -
          6.125rem
      ),
      81.86666666666666vw
    );
    max-height: none;
    margin-left: auto;
    margin-right: auto;
    flex: 0 0 auto;
    align-self: center;
  }

  /* Three-image heroes (Creative Grant). */
  .resource-hero-imgs-wrapper:has(
      > .resource-hero-frame:nth-child(3):last-child
    ) {
    width: auto !important;
    max-width: none;
    height: min(
      calc(
        100vh - 10rem - (5.625 * 0.972rem * 2) - 1.25rem - (0.875 * 1.428 * 2rem) -
          3.5625rem - 6.125rem
      ),
      70.66666666666667vw
    );
    min-height: 65vw;
    max-height: none;
    margin-left: auto;
    margin-right: auto;
    flex: 0 0 auto;
    align-self: center;
  }

  .resource-hero-imgs-wrapper:has(
      > .resource-hero-frame:nth-child(2):last-child
    )
    > .resource-hero-frame {
    inset: 0;
    width: 100%;
    max-width: none;
    height: 100%;
    margin-left: 0;
  }

  .resource-hero-imgs-wrapper:has(
      > .resource-hero-frame:nth-child(2):last-child
    )
    > .resource-hero-frame
    > .resource-hero-img {
    position: absolute;
    inset: 0;
    width: 100%;
    max-width: none;
    height: 100%;
    object-fit: cover;
  }
}

.resource--row {
  color: #eae5df;
  transition: color 0.6s cubic-bezier(0.19, 1, 0.22, 1);
}

.resource--row:hover,
.resource--row.is-hovered {
  color: var(--_colors---black, #121111);
}

.resource--row .heading-style-14.is--resource-row {
  opacity: 0;
  transition: opacity 0.6s cubic-bezier(0.19, 1, 0.22, 1),
    color 0.6s cubic-bezier(0.19, 1, 0.22, 1);
}

.resource--row:hover .heading-style-14.is--resource-row,
.resource--row.is-hovered .heading-style-14.is--resource-row {
  opacity: 1;
}

.resource--row .resource--row-img {
  opacity: 0;
  transform: translate3d(-3rem, 0, 0) rotate(3deg);
  transition: opacity 0.6s cubic-bezier(0.19, 1, 0.22, 1),
    transform 0.6s cubic-bezier(0.19, 1, 0.22, 1);
}

.resource--row:hover .resource--row-img,
.resource--row.is-hovered .resource--row-img {
  opacity: 1;
  transform: translate3d(0, 0, 0) rotate(-23deg);
}

.resource--row:hover
  .resource--row-img.w-variant-27ec6c20-01c1-412d-c067-607c247edd94,
.resource--row.is-hovered
  .resource--row-img.w-variant-27ec6c20-01c1-412d-c067-607c247edd94 {
  transform: translate3d(0, 0, 0) rotate(23deg);
}

.wk-roll {
  position: relative;
  display: inline-block;
  overflow: hidden;
  vertical-align: baseline;
  margin: 0;
  padding: 0;
}

.btn .wk-roll {
  top: 0.1em;
}

/* Inline content links: underline only (no letter-roll). */
.section.is--health-hero .resource--richtext a,
.section.is--resource-hero .heading-style-14 a,
.hero--description a:not(.footer--link) {
  color: inherit;
  text-decoration: underline;
  text-underline-offset: 0.18em;
  text-decoration-thickness: 1px;
  text-decoration-skip-ink: none;
}

.wk-roll-top,
.wk-roll-bottom {
  display: block;
  margin: 0;
  padding: 0;
}

.wk-roll-bottom {
  position: absolute;
  inset: 0;
}

.wk-roll-char {
  display: inline-block;
  margin: 0;
  padding: 0;
  transition: transform 0.6s cubic-bezier(0.19, 1, 0.22, 1);
  transition-delay: calc((var(--wk-roll-last, 0) - var(--wk-roll, 0)) * 0.014s);
}

.wk-roll-bottom .wk-roll-char {
  transform: translate3d(0, 110%, 0);
}

/* Per-character roll inside fade-split titles (resource rows). */
.wk-roll-mask {
  position: relative;
  display: inline-block;
  vertical-align: baseline;
  margin: 0;
  padding: 0;
}

.wk-roll-mask > .wk-roll-top,
.wk-roll-mask > .wk-roll-bottom {
  transition: transform 0.6s cubic-bezier(0.19, 1, 0.22, 1);
  transition-delay: calc((var(--wk-roll-last, 0) - var(--wk-roll, 0)) * 0.014s);
}

.wk-roll-mask > .wk-roll-bottom {
  transform: translate3d(0, 110%, 0);
}

.resource--row:hover .wk-roll-top .wk-roll-char,
.resource--row.is-hovered .wk-roll-top .wk-roll-char,
[linkhover]:hover .wk-roll-top .wk-roll-char,
[linkhover].is-hovered .wk-roll-top .wk-roll-char,
.navlink--parent:hover [linkhover] .wk-roll-top .wk-roll-char,
.resource--row:hover .wk-roll-mask > .wk-roll-top,
.resource--row.is-hovered .wk-roll-mask > .wk-roll-top {
  transform: translate3d(0, -110%, 0);
  transition-delay: calc(var(--wk-roll, 0) * 0.02s);
}

.resource--row:hover .wk-roll-bottom .wk-roll-char,
.resource--row.is-hovered .wk-roll-bottom .wk-roll-char,
[linkhover]:hover .wk-roll-bottom .wk-roll-char,
[linkhover].is-hovered .wk-roll-bottom .wk-roll-char,
.navlink--parent:hover [linkhover] .wk-roll-bottom .wk-roll-char,
.resource--row:hover .wk-roll-mask > .wk-roll-bottom,
.resource--row.is-hovered .wk-roll-mask > .wk-roll-bottom {
  transform: translate3d(0, 0, 0);
  transition-delay: calc(var(--wk-roll, 0) * 0.02s);
}

@media (max-width: 991px) {
  .resource--row,
  .resource--row .heading-style-14.is--resource-row,
  .resource--row .resource--row-img {
    transition: none;
  }

  .resource--row:hover,
  .resource--row.is-hovered {
    color: #eae5df;
  }

  .resource--row:hover .heading-style-14.is--resource-row,
  .resource--row.is-hovered .heading-style-14.is--resource-row {
    opacity: 0;
  }

  .resource--row:hover .resource--row-img,
  .resource--row.is-hovered .resource--row-img,
  .resource--row:hover
    .resource--row-img.w-variant-27ec6c20-01c1-412d-c067-607c247edd94,
  .resource--row.is-hovered
    .resource--row-img.w-variant-27ec6c20-01c1-412d-c067-607c247edd94 {
    opacity: 0;
    transform: translate3d(-3rem, 0, 0) rotate(3deg);
  }

  .resource--row:hover .wk-roll-top .wk-roll-char,
  .resource--row.is-hovered .wk-roll-top .wk-roll-char,
  .resource--row:hover .wk-roll-mask > .wk-roll-top,
  .resource--row.is-hovered .wk-roll-mask > .wk-roll-top {
    transform: none;
    transition: none;
  }

  .resource--row:hover .wk-roll-bottom .wk-roll-char,
  .resource--row.is-hovered .wk-roll-bottom .wk-roll-char,
  .resource--row:hover .wk-roll-mask > .wk-roll-bottom,
  .resource--row.is-hovered .wk-roll-mask > .wk-roll-bottom {
    transform: translate3d(0, 110%, 0);
    transition: none;
  }

  [linkhover]:hover .wk-roll-top .wk-roll-char,
  [linkhover].is-hovered .wk-roll-top .wk-roll-char,
  .navlink--parent:hover [linkhover] .wk-roll-top .wk-roll-char,
  .footer--link-parent:hover [linkhover] .wk-roll-top .wk-roll-char {
    transform: none;
    transition: none;
  }

  [linkhover]:hover .wk-roll-bottom .wk-roll-char,
  [linkhover].is-hovered .wk-roll-bottom .wk-roll-char,
  .navlink--parent:hover [linkhover] .wk-roll-bottom .wk-roll-char,
  .footer--link-parent:hover [linkhover] .wk-roll-bottom .wk-roll-char {
    transform: translate3d(0, 110%, 0);
    transition: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  .resource--row,
  .resource--row .heading-style-14.is--resource-row,
  .resource--row .resource--row-img,
  .wk-roll-char,
  .wk-roll-mask > .wk-roll-top,
  .wk-roll-mask > .wk-roll-bottom {
    transition: none;
  }
}

.section.is--resource-slider,
.section.is--resource-slider .container--560,
.section.is--resource-slider .swiper {
  overflow: visible;
}

.section.is--resource-slider .swiper {
  width: 100%;
  overflow: visible !important;
}

.section.is--resource-slider .swiper-wrapper {
  align-items: stretch;
  transition-timing-function: cubic-bezier(0.19, 1, 0.22, 1);
}

.section.is--resource-slider .swiper-slide {
  height: auto;
}

@media (max-width: 991px) {
  .section.is--resource-slider .swiper-slide {
    opacity: 0.3;
    transition: opacity 0.6s cubic-bezier(0.19, 1, 0.22, 1);
  }

  .section.is--resource-slider .swiper-slide-active {
    opacity: 1;
  }
}

@media (min-width: 992px) {
  .grid--4els {
    overflow: visible;
  }

  .grid--4els > .div-block.wk-tilt:not(.is-revealed) {
    opacity: 0;
    transform: translate3d(0, calc(var(--wk-y, 0px) + 1rem), 0) rotate(0deg);
  }

  .grid--4els > .div-block.wk-tilt.is-revealed {
    animation: wk-card-tilt 0.9s cubic-bezier(0.83, 0, 0.17, 1) both;
    animation-delay: var(--wk-delay, 0s);
  }

  .grid--4els > .div-block.wk-tilt.is-revealed.is-instant {
    opacity: 1;
    transform: translate3d(0, var(--wk-y, 0px), 0)
      rotate(var(--wk-rotate, 0deg));
    animation: none;
  }
}

@keyframes wk-card-tilt {
  from {
    opacity: 0;
    transform: translate3d(0, calc(var(--wk-y, 0px) + 1rem), 0) rotate(0deg);
  }

  to {
    opacity: 1;
    transform: translate3d(0, var(--wk-y, 0px), 0)
      rotate(var(--wk-rotate, 0deg));
  }
}