/* Verbatim from https://guides.marketingshift.nl/guide/osmo-buttons (Osmo buttons) */
:root {
  --button-040-color: #131313;
  --button-040-color-background: #efeeec;
  --button-040-color-arrow: #efeeec;
  --button-040-color-arrow-background: #202623;
  --button-040-color-focus: #fff;
  --button-040-height: 2.5em;
  --button-040-padding-x: 1em;
  --button-040-border-radius: 2.5em;
  --button-040-gap: 0em;
  --button-040-focus-inset: -0.125em;
  --button-040-ease-hover: cubic-bezier(0.625, 0.05, 0, 1);
  --button-040-ease-focus: cubic-bezier(0.32, 0.72, 0, 1);
}
.button-040 {
  color: var(--button-040-color);
  -webkit-user-select: none;
  user-select: none;
  height: var(--button-040-height);
  grid-column-gap: var(--button-040-gap);
  grid-row-gap: var(--button-040-gap);
  background-color: #0000;
  outline-style: none;
  justify-content: center;
  align-items: center;
  padding: 0;
  line-height: 1;
  text-decoration: none;
  display: inline-flex;
  position: relative;
  --button-040-translate-x: calc((var(--button-040-height) + var(--button-040-gap, 0em)) * -1);
  -webkit-tap-highlight-color: transparent;
}
.button-040::after {
  content: '';
  display: block;
  position: absolute;
  inset: var(--button-040-focus-inset);
  border-radius: var(--button-040-border-radius);
  transition: box-shadow 0.3s var(--button-040-ease-focus);
  pointer-events: none;
  z-index: 1;
}
.button-040:is(:focus-visible)::after {
  box-shadow: 0 0 0 0.125em var(--button-040-color-focus);
}
.button-040__icon-wrap {
  aspect-ratio: 1;
  background-color: var(--button-040-color-arrow-background);
  border-radius: var(--button-040-border-radius);
  justify-content: center;
  align-items: center;
  height: 100%;
  display: flex;
  will-change: transform;
  transform-origin: left center;
  scale: 0;
  transition: scale 0.6s var(--button-040-ease-hover);
}
.button-040__icon-wrap.is--duplicate {
  z-index: 1;
  position: absolute;
  right: 0;
  transform-origin: right center;
  scale: 1;
}
.button-040__icon {
  width: 1em;
  height: 1em;
  color: var(--button-040-color-arrow);
  transition: rotate 0.6s var(--button-040-ease-hover);
  rotate: 45deg;
}
.button-040__icon-wrap.is--duplicate .button-040__icon {
  rotate: 0deg;
}
.button-040__text-wrap {
  height: 100%;
  padding: 0 var(--button-040-padding-x);
  background-color: var(--button-040-color-background);
  border-radius: var(--button-040-border-radius);
  justify-content: center;
  align-items: center;
  display: flex;
  translate: var(--button-040-translate-x) 0 0;
  transition: translate 0.6s var(--button-040-ease-hover);
}
@media (hover: hover) and (pointer: fine) and (prefers-reduced-motion: no-preference) {
  .button-040:is(:hover, :focus-visible) .button-040__icon-wrap,
  [data-hover]:is(:hover, :focus-visible) .button-040 .button-040__icon-wrap {
    scale: 1;
    transition: scale 0.735s 0.05s var(--button-040-ease-hover);
  }
  .button-040:is(:hover, :focus-visible) .button-040__icon-wrap.is--duplicate,
  [data-hover]:is(:hover, :focus-visible) .button-040 .button-040__icon-wrap.is--duplicate {
    scale: 0;
    transition: scale 0.735s 0.05s var(--button-040-ease-hover);
  }
  .button-040:is(:hover, :focus-visible) .button-040__icon-wrap.is--duplicate .button-040__icon,
  [data-hover]:is(:hover, :focus-visible) .button-040 .button-040__icon-wrap.is--duplicate .button-040__icon {
    rotate: 45deg;
  }
  .button-040:is(:hover, :focus-visible) .button-040__icon,
  [data-hover]:is(:hover, :focus-visible) .button-040 .button-040__icon {
    rotate: 0deg;
    transition: rotate 0.735s 0.05s var(--button-040-ease-hover);
  }
  .button-040:is(:hover, :focus-visible) .button-040__text-wrap,
  [data-hover]:is(:hover, :focus-visible) .button-040 .button-040__text-wrap {
    translate: 0 0 0;
    transition: translate 0.735s 0.05s var(--button-040-ease-hover);
  }
}
:root {
  --button-044-color: #131313;
  --button-044-color-background: #4acb7b;
  --button-044-color-focus: #fff;
  --button-044-border-radius: 2.5em;
  --button-044-focus-inset: -0.125em;
  --button-044-text-duplicate-distance: 2em;
  --button-044-hover-scale: 0.955, 0.925;
  --button-044-hover-rotate: -3deg;
  --button-044-click-scale: 1.065 1.095;
  --button-044-ease-click: cubic-bezier(0.4, 0, 0.2, 1);
  --button-044-ease-hover: linear(0, 0.55 7.5%, 0.85 12%, 0.95 14%, 1.03 16.5%, 1.09 20%, 1.13 22%, 1.14 23%, 1.15 24.5%, 1.15 26%, 1.13 28%, 1.11 31%, 1.05 39%, 1.02 43%, 0.99 47%, 0.98 52%, 0.97 59%, 1.002 81%, 1);
  --button-044-ease-focus: cubic-bezier(0.32, 0.72, 0, 1);
}
.button-044 {
  color: var(--button-044-color);
  -webkit-user-select: none;
  user-select: none;
  background-color: #0000;
  outline-style: none;
  padding: 0;
  line-height: 1;
  text-decoration: none;
  display: inline-grid;
  position: relative;
  -webkit-tap-highlight-color: transparent;
  transition: scale 0.15s var(--button-044-ease-click);
}
.button-044::after {
  content: '';
  display: block;
  position: absolute;
  inset: var(--button-044-focus-inset);
  border-radius: var(--button-044-border-radius);
  transition: transform 0.65s var(--button-044-ease-hover), box-shadow 0.3s var(--button-044-ease-focus);
  pointer-events: none;
  z-index: 1;
}
.button-044:active {
  scale: var(--button-044-click-scale);
}
.button-044:is(:focus-visible)::after {
  box-shadow: 0 0 0 0.125em var(--button-044-color-focus);
  transform: scale(var(--button-044-hover-scale)) rotate(var(--button-044-hover-rotate));
  transition-delay: 0.05s;
}
.button-044__bg {
  background-color: var(--button-044-color-background);
  border-radius: var(--button-044-border-radius);
  grid-area: 1 / 1;
  width: 100%;
  height: 100%;
  padding: 0;
  transition: transform 0.65s var(--button-044-ease-hover);
}
.button-044__inner {
  border-radius: var(--button-044-border-radius);
  grid-area: 1 / 1;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  padding: .75em 1em;
  display: flex;
  overflow: clip;
  transition: transform 0.65s var(--button-044-ease-hover);
}
.button-044__text-wrap {
  justify-content: center;
  align-items: center;
  display: flex;
  transition: transform 0.65s var(--button-044-ease-hover);
}
.button-044__text {
  will-change: transform;
  text-shadow: 0px var(--button-044-text-duplicate-distance) currentColor;
  transition: transform 0.65s var(--button-044-ease-hover);
}
@media (hover: hover) and (pointer: fine) and (prefers-reduced-motion: no-preference) {
  .button-044:is(:hover, :focus-visible) .button-044__bg,
  .button-044:is(:hover, :focus-visible) .button-044__inner,
  [data-hover]:is(:hover, :focus-visible) .button-044 .button-044__bg,
  [data-hover]:is(:hover, :focus-visible) .button-044 .button-044__inner {
    transform: scale(var(--button-044-hover-scale)) rotate(var(--button-044-hover-rotate));
    transition-delay: 0.05s;
  }
  .button-044:is(:hover, :focus-visible) .button-044__text-wrap,
  [data-hover]:is(:hover, :focus-visible) .button-044 .button-044__text-wrap {
    transform: rotate(calc(var(--button-044-hover-rotate) * -1));
    transition-delay: 0.05s;
  }
  .button-044:is(:hover, :focus-visible) .button-044__text,
  [data-hover]:is(:hover, :focus-visible) .button-044 .button-044__text {
    transform: translate3d(0, calc(var(--button-044-text-duplicate-distance) * -1), 0);
    transition-delay: 0.05s;
  }
}
:root {
  --button-046-color: #131313;
  --button-046-color-background: #fff;
  --button-046-hover-color: #131313;
  --button-046-hover-color-background: #9fccc8;
  --button-046-color-focus: #fff;
  --button-046-padding: 0.75em 1em;
  --button-046-border-radius: 2.5em;
  --button-046-focus-inset: -0.125em;
  --button-046-hover-scale: 1.065 1.095;
  --button-046-click-scale: 0.955, 0.925;
  --button-046-ease-click: cubic-bezier(0.4, 0, 0.2, 1);
  --button-046-ease-hover: cubic-bezier(0.34, 2.27, 0.64, 1);
  --button-046-ease-focus: cubic-bezier(0.32, 0.72, 0, 1);
}
.button-046 {
  color: var(--button-046-color);
  -webkit-user-select: none;
  user-select: none;
  background-color: #0000;
  outline-style: none;
  padding: 0;
  line-height: 1;
  text-decoration: none;
  display: inline-grid;
  position: relative;
  -webkit-tap-highlight-color: transparent;
  transition: color 0.25s ease-out;
}
.button-046::after {
  content: '';
  display: block;
  position: absolute;
  inset: var(--button-046-focus-inset);
  border-radius: var(--button-046-border-radius);
  transition: box-shadow 0.3s var(--button-046-ease-focus), scale 0.4s var(--button-046-ease-hover);
  pointer-events: none;
  z-index: 1;
}
.button-046:is(:hover, :focus-visible),
[data-hover]:is(:hover, :focus-visible) .button-046 {
  color: var(--button-046-hover-color);
}
.button-046:is(:focus-visible)::after {
  box-shadow: 0 0 0 0.125em var(--button-046-color-focus);
  scale: var(--button-046-hover-scale);
  transition: box-shadow 0.3s var(--button-046-ease-focus), scale 0.425s 0.05s var(--button-046-ease-hover);
}
.button-046__bg {
  background-color: var(--button-046-color-background);
  border-radius: var(--button-046-border-radius);
  grid-area: 1 / 1;
  width: 100%;
  height: 100%;
  padding: 0;
  transition: background-color 0.25s ease-out, scale 0.4s var(--button-046-ease-hover), transform 0.15s var(--button-046-ease-click);
}
.button-046:active .button-046__bg {
  transform: scale(var(--button-046-click-scale));
}
.button-046:is(:focus-visible) .button-046__bg {
  background-color: var(--button-046-hover-color-background) !important;
}
.button-046__bg-circle {
  z-index: 1;
  border-radius: var(--button-046-border-radius);
  grid-area: 1 / 1;
  place-self: center;
  width: calc(100% + 1px);
  height: calc(100% + 1px);
  position: relative;
  overflow: clip;
  transition: background-color 0.25s ease-out, scale 0.4s var(--button-046-ease-hover), transform 0.15s var(--button-046-ease-click);
}
.button-046:active .button-046__bg-circle {
  transform: scale(var(--button-046-click-scale));
}
.button-046__circle-wrap {
  transform-origin: 0 0;
  will-change: transform;
  position: absolute;
  inset: 0%;
  transform: scale(0);
}
.button-046__circle {
  aspect-ratio: 1;
  background-color: var(--button-046-hover-color-background);
  border-radius: 50%;
  width: 200%;
  display: block;
  position: absolute;
  inset: 0% auto auto 0%;
  transform: translate(-50%, -50%);
}
.button-046__inner {
  grid-column-gap: .125em;
  grid-row-gap: .125em;
  width: 100%;
  height: 100%;
  padding: var(--button-046-padding);
  z-index: 2;
  grid-area: 1 / 1;
  justify-content: center;
  align-items: center;
  display: flex;
}
.button-046__icon {
  flex: none;
  width: .75em;
  height: .75em;
}
@media (hover: hover) and (pointer: fine) and (prefers-reduced-motion: no-preference) {
  .button-046:is(:hover, :focus-visible) .button-046__bg,
  [data-hover]:is(:hover, :focus-visible) .button-046 .button-046__bg {
    scale: var(--button-046-hover-scale);
    transition: background-color 0.25s 0.05s ease-out, scale 0.425s 0.05s var(--button-046-ease-hover), transform 0.15s var(--button-046-ease-click);
    background-color: var(--button-046-color-background);
  }
  .button-046:is(:hover, :focus-visible) .button-046__bg-circle,
  [data-hover]:is(:hover, :focus-visible) .button-046 .button-046__bg-circle {
    scale: var(--button-046-hover-scale);
    transition: background-color 0.25s 0.05s ease-out, scale 0.425s 0.05s var(--button-046-ease-hover), transform 0.15s var(--button-046-ease-click);
  }
}
:root {
  --button-056-color: #131313;
  --button-056-color-background: #fff;
  --button-056-hover-color: #fff;
  --button-056-hover-color-background: #ef8a61;
  --button-056-color-focus: #000;
  --button-056-padding: 0.75em 1em;
  --button-056-border-radius: 2.5em;
  --button-056-focus-inset: -0.125em;
  --button-056-hover-scale: 1.065 1.095;
  --button-056-click-scale: 0.955, 0.925;
  --button-056-ease-click: cubic-bezier(0.4, 0, 0.2, 1);
  --button-056-ease-hover: cubic-bezier(0.34, 1.44, 0.64, 1);
  --button-056-ease-power-out: cubic-bezier(0.23, 1, 0.32, 1);
  --button-056-ease-focus: cubic-bezier(0.32, 0.72, 0, 1);
}
.button-056 {
  -webkit-user-select: none;
  user-select: none;
  color: var(--button-056-color);
  background-color: #0000;
  outline-style: none;
  padding: 0;
  line-height: 1;
  text-decoration: none;
  display: inline-grid;
  position: relative;
  -webkit-tap-highlight-color: transparent;
}
.button-056::after {
  content: '';
  display: block;
  position: absolute;
  inset: var(--button-056-focus-inset);
  border-radius: var(--button-056-border-radius);
  transition: box-shadow 0.3s var(--button-056-ease-focus), scale 0.4s var(--button-056-ease-hover);
  pointer-events: none;
  z-index: 1;
}
.button-056:is(:focus-visible)::after {
  box-shadow: 0 0 0 0.125em var(--button-056-color-focus);
  scale: var(--button-056-hover-scale);
  transition: box-shadow 0.3s var(--button-056-ease-focus), scale 0.425s 0.05s var(--button-056-ease-hover);
}
.button-056__bg-wrap {
  pointer-events: none;
  border-radius: var(--button-056-border-radius);
  grid-area: 1 / 1;
  width: 100%;
  height: 100%;
  display: grid;
  overflow: clip;
  transition: scale 0.4s var(--button-056-ease-hover), transform 0.15s var(--button-056-ease-click);
}
.button-056:active .button-056__bg-wrap {
  transform: scale(var(--button-056-click-scale));
}
.button-056__bg {
  background-color: var(--button-056-color-background);
  border-radius: var(--button-056-border-radius);
  grid-area: 1 / 1;
  place-self: center;
  width: calc(100% - 1px);
  height: calc(100% - 1px);
  padding: 0;
}
.button-056__bg-hover {
  z-index: 1;
  background-color: var(--button-056-hover-color-background);
  grid-area: 1 / 1;
  width: 100%;
  height: 100%;
  padding: 0;
  translate: 0 101% 0;
  transition: translate 0.45s var(--button-056-ease-power-out);
}
.button-056__inner {
  pointer-events: none;
  width: 100%;
  height: 100%;
  padding: var(--button-056-padding);
  z-index: 1;
  grid-area: 1 / 1;
  justify-content: center;
  align-items: center;
  display: flex;
}
.button-056__text-outer {
  clip-path: inset(-10% 0);
}
@media (hover: hover) and (pointer: fine) and (prefers-reduced-motion: no-preference) {
  .button-056:is(:hover, :focus-visible) .button-056__bg-wrap,
  [data-hover]:is(:hover, :focus-visible) .button-056 .button-056__bg-wrap {
    scale: var(--button-056-hover-scale);
    transition: scale 0.425s 0.05s var(--button-056-ease-hover), transform 0.15s var(--button-056-ease-click);
  }
  .button-056:is(:hover, :focus-visible) .button-056__bg-hover,
  [data-hover]:is(:hover, :focus-visible) .button-056 .button-056__bg-hover {
    translate: 0 0 0;
    transition-delay: 0.05s;
  }
  .button-056__split-word {
    text-shadow: 0px 1.3em var(--button-056-hover-color);
    transition: translate 0.45s calc((var(--word) - 1) * 0.042s) var(--button-056-ease-power-out);
  }
  .button-056:is(:hover, :focus-visible) .button-056__split-word,
  [data-hover]:is(:hover, :focus-visible) .button-056 .button-056__split-word {
    translate: 0 -1.3em 0;
    transition: translate 0.45s calc((var(--word) - 1) * 0.042s + 0.05s) var(--button-056-ease-power-out);
  }
}
:root {
  --button-097-color: #131313;
  --button-097-color-background: #fff;
  --button-097-hover-color: #fff;
  --button-097-hover-color-background: #131313;
  --button-097-color-focus: #131313;
  --button-097-border-radius: 1.5em;
  --button-097-dot-border-radius: 0.25em;
  --button-097-padding-right: 0.75em;
  --button-097-padding-left: 1em;
  --button-097-gap: 0.375em;
  --button-097-dot-size: 0.5em;
  --button-097-focus-inset: -0.125em;
  --button-097-ease-hover: cubic-bezier(0.32, 0.72, 0, 1);
  --button-097-ease-focus: cubic-bezier(0.32, 0.72, 0, 1);
}
.button-097 {
  -webkit-user-select: none;
  user-select: none;
  background-color: #0000;
  outline-style: none;
  padding: 0;
  line-height: 1;
  text-decoration: none;
  display: inline-grid;
  position: relative;
  --button-097-padding: 0.75em calc(var(--button-097-padding-right) + var(--button-097-gap) + var(--button-097-dot-size)) 0.75em var(--button-097-padding-left);
  --button-097-offset: calc((var(--button-097-padding-right) + var(--button-097-gap) + var(--button-097-dot-size) - var(--button-097-padding-left)) / 2);
  -webkit-tap-highlight-color: transparent;
}
.button-097::after {
  content: '';
  display: block;
  position: absolute;
  inset: var(--button-097-focus-inset);
  border-radius: var(--button-097-border-radius);
  transition: box-shadow 0.3s var(--button-097-ease-focus);
  pointer-events: none;
  z-index: 1;
}
.button-097:is(:focus-visible)::after {
  box-shadow: 0 0 0 0.125em var(--button-097-color-focus);
}
.button-097__hover {
  color: var(--button-097-hover-color);
  z-index: 1;
  will-change: clip-path;
  grid-area: 1 / 1;
  place-self: center;
  width: calc(100% + 2px);
  height: calc(100% + 2px);
  display: grid;
  clip-path: inset(calc(50% - var(--button-097-dot-size) * 0.5) var(--button-097-padding-right) calc(50% - var(--button-097-dot-size) * 0.5) calc(100% - (var(--button-097-dot-size) + var(--button-097-padding-right))) round var(--button-097-dot-border-radius));
  transition: clip-path 0.55s var(--button-097-ease-hover);
}
.button-097__bg {
  border-radius: var(--button-097-border-radius);
  grid-area: 1 / 1;
  width: 100%;
  height: 100%;
  padding: 0;
}
.button-097__bg.is--hover {
  background-color: var(--button-097-hover-color-background);
}
.button-097__bg.is--default {
  background-color: var(--button-097-color-background);
  width: calc(100% - 1px);
  height: calc(100% - 1px);
}
.button-097__inner {
  width: 100%;
  height: 100%;
  padding: var(--button-097-padding);
  grid-area: 1 / 1;
  justify-content: center;
  align-items: center;
  display: flex;
}
.button-097__text {
  will-change: transform;
  transition: translate 0.55s var(--button-097-ease-hover);
}
.button-097__default {
  width: 100%;
  height: 100%;
  color: var(--button-097-color);
  grid-area: 1 / 1;
  display: grid;
}
@media (hover: hover) and (pointer: fine) and (prefers-reduced-motion: no-preference) {
  .button-097:is(:hover, :focus-visible) .button-097__hover,
  [data-hover]:is(:hover, :focus-visible) .button-097 .button-097__hover {
    clip-path: inset(0% 0% 0% 0% round var(--button-097-border-radius));
    transition-delay: 0.05s;
  }
  .button-097:is(:hover, :focus-visible) .button-097__text,
  [data-hover]:is(:hover, :focus-visible) .button-097 .button-097__text {
    translate: var(--button-097-offset) 0 0;
    transition-delay: 0.05s;
  }
}
:root {
  --button-098-color: #fff;
  --button-098-color-background: #08181b;
  --button-098-between-color-background: #fff;
  --button-098-hover-color: #131313;
  --button-098-hover-color-background: #d1fd88;
  --button-098-color-focus: #fff;
  --button-098-border-radius: 2.5em;
  --button-098-padding: 0.75em 1em;
  --button-098-gap: 0.125em;
  --button-098-delay: 0.05s;
  --button-098-focus-inset: -0.125em;
  --button-098-hover-scale: 1.065 1.095;
  --button-098-click-scale: 0.955 0.925;
  --button-098-ease-hover: cubic-bezier(0.4, 0.15, 0, 1);
  --button-098-ease-click: cubic-bezier(0.4, 0, 0.2, 1);
  --button-098-ease-focus: cubic-bezier(0.32, 0.72, 0, 1);
}
.button-098 {
  -webkit-user-select: none;
  user-select: none;
  background-color: #0000;
  outline-style: none;
  padding: 0;
  line-height: 1;
  text-decoration: none;
  display: inline-grid;
  position: relative;
  -webkit-tap-highlight-color: transparent;
  transition: scale 0.45s var(--button-098-ease-hover), transform 0.15s var(--button-098-ease-click);
}
.button-098::after {
  content: '';
  display: block;
  position: absolute;
  inset: var(--button-098-focus-inset);
  border-radius: var(--button-098-border-radius);
  transition: box-shadow 0.3s var(--button-098-ease-focus);
  pointer-events: none;
  z-index: 1;
}
.button-098:is(:focus-visible)::after {
  box-shadow: 0 0 0 0.125em var(--button-098-color-focus);
}
.button-098:active {
  scale: var(--button-098-click-scale);
}
.button-098__hover {
  color: var(--button-098-hover-color);
  z-index: 2;
  grid-area: 1 / 1;
  place-self: center;
  width: calc(100% + 1px);
  height: calc(100% + 1px);
  display: grid;
  clip-path: polygon(0 -1%, 100% -1%, 100% 0%, 0 -40%);
  transition: clip-path 0.55s var(--button-098-ease-hover);
}
.button-098__bg {
  border-radius: var(--button-098-border-radius);
  grid-area: 1 / 1;
  width: 100%;
  height: 100%;
  padding: 0;
}
.button-098__bg.is--hover {
  background-color: var(--button-098-hover-color-background);
}
.button-098__bg.is--between {
  background-color: var(--button-098-between-color-background);
}
.button-098__bg.is--default {
  background-color: var(--button-098-color-background);
  width: calc(100% - 1px);
  height: calc(100% - 1px);
}
.button-098__inner {
  width: 100%;
  height: 100%;
  padding: var(--button-098-padding);
  grid-column-gap: var(--button-098-gap);
  grid-row-gap: var(--button-098-gap);
  grid-area: 1 / 1;
  justify-content: center;
  align-items: center;
  display: flex;
}
.button-098__between {
  z-index: 1;
  grid-area: 1 / 1;
  place-self: center;
  width: calc(100% + 1px);
  height: calc(100% + 1px);
  display: grid;
  clip-path: polygon(0 -1%, 100% -1%, 100% 0%, 0 -40%);
  transition: clip-path 0.55s var(--button-098-delay) var(--button-098-ease-hover);
}
.button-098__default {
  width: 100%;
  height: 100%;
  color: var(--button-098-color);
  grid-area: 1 / 1;
  display: grid;
}
.button-098__icon {
  flex: none;
  width: .75em;
  height: .75em;
}
@media (hover: hover) and (pointer: fine) and (prefers-reduced-motion: no-preference) {
  .button-098:is(:hover, :focus-visible),
  [data-hover]:is(:hover, :focus-visible) .button-098 {
    scale: var(--button-098-hover-scale);
  }
  .button-098:is(:hover, :focus-visible) .button-098__between,
  [data-hover]:is(:hover, :focus-visible) .button-098 .button-098__between {
    clip-path: polygon(0 0, 100% 0%, 100% 140%, 0 100%);
    transition-delay: var(--button-098-delay);
  }
  .button-098:is(:hover, :focus-visible) .button-098__hover,
  [data-hover]:is(:hover, :focus-visible) .button-098 .button-098__hover {
    clip-path: polygon(0 0, 100% 0%, 100% 140%, 0 100%);
    transition-delay: calc(var(--button-098-delay) * 2);
  }
}
:root {
  --button-002-color: #fff;
  --button-002-color-background: #8963eb;
  --button-002-hover-color: #fff;
  --button-002-hover-color-background: #8963eb;
  --button-002-back-color-background: #fff;
  --button-002-color-focus: #000;
  --button-002-border-radius: 2.5em;
  --button-002-padding-outer: 0.125em;
  --button-002-padding-inner: 0.625em 0.8625em;
  --button-002-focus-inset: -0.125em;
  --button-002-click-scale: 0.955 0.925;
  --button-002-ease-hover: cubic-bezier(0.675, 0.15, 0.1, 1);
  --button-002-ease-click: cubic-bezier(0.4, 0, 0.2, 1);
  --button-002-ease-focus: cubic-bezier(0.32, 0.72, 0, 1);
}
.button-002 {
  font-variation-settings: "wght" 620;
  -webkit-tap-highlight-color: transparent;
  background-color: transparent;
  outline-style: none;
  padding: 0;
  line-height: 1;
  text-decoration: none;
  display: inline-grid;
  transition: scale 0.15s var(--button-002-ease-click);
}
.button-002:active {
  scale: var(--button-002-click-scale);
}
.button-002__inner {
  pointer-events: none;
  backface-visibility: hidden;
  perspective: 10em;
  padding: var(--button-002-padding-outer);
  border-radius: var(--button-002-border-radius);
  z-index: 1;
  clip-path: inset(0 round var(--button-002-border-radius));
  grid-area: 1 / 1;
  display: grid;
}
.button-002__hover {
  backface-visibility: hidden;
  transform-style: preserve-3d;
  grid-area: 1 / 1;
  justify-content: center;
  align-items: center;
  padding: 0;
  display: flex;
  translate: 0 calc(65% + var(--button-002-padding-outer)) 0;
  rotate: 1 0 0 -85deg;
  scale: 0.525;
  transition: translate 0.4s var(--button-002-ease-hover), rotate 0.4s var(--button-002-ease-hover), scale 0.4s var(--button-002-ease-hover);
}
.button-002__hover::after {
  content: attr(data-text);
  display: block;
  color: var(--button-002-hover-color);
  grid-area: 1 / 1;
  background-color: var(--button-002-hover-color-background);
  border-radius: calc(var(--button-002-border-radius) - var(--button-002-padding-outer));
  padding: var(--button-002-padding-inner);
}
.button-002__default {
  backface-visibility: hidden;
  color: var(--button-002-color);
  transform-style: preserve-3d;
  grid-area: 1 / 1;
  display: grid;
  transition: translate 0.45s var(--button-002-ease-hover), rotate 0.475s var(--button-002-ease-hover), scale 0.35s var(--button-002-ease-hover);
}
.button-002__default-bg {
  background-color: var(--button-002-color-background);
  border-radius: calc(var(--button-002-border-radius) - var(--button-002-padding-outer));
  grid-area: 1 / 1;
  padding: 0;
}
.button-002__default-text {
  padding: var(--button-002-padding-inner);
  grid-area: 1 / 1;
}
.button-002__bg {
  background-color: var(--button-002-back-color-background);
  border-radius: var(--button-002-border-radius);
  grid-area: 1 / 1;
  width: 100%;
  height: 100%;
  padding: 0;
  position: relative;
}
.button-002__bg::after {
  content: "";
  display: block;
  position: absolute;
  inset: var(--button-002-focus-inset);
  border-radius: var(--button-002-border-radius);
  transition: box-shadow 0.3s var(--button-002-ease-focus);
  pointer-events: none;
  z-index: 1;
}
.button-002:is(:focus-visible) .button-002__bg::after {
  box-shadow: 0 0 0 0.125em var(--button-002-color-focus);
}
@media (hover: hover) and (pointer: fine) and (prefers-reduced-motion: no-preference) {
  .button-002:is(:hover, :focus-visible) .button-002__hover,
  [data-hover]:is(:hover, :focus-visible) .button-002 .button-002__hover {
    translate: 0 0 0;
    rotate: 1 0 0 0deg;
    scale: 1;
    transition: translate 0.45s 0.05s var(--button-002-ease-hover), rotate 0.475s 0.05s var(--button-002-ease-hover), scale 0.35s 0.05s var(--button-002-ease-hover);
  }
  .button-002:is(:hover, :focus-visible) .button-002__default,
  [data-hover]:is(:hover, :focus-visible) .button-002 .button-002__default {
    translate: 0 calc(-65% - var(--button-002-padding-outer)) 0;
    rotate: 1 0 0 85deg;
    scale: 0.525;
    transition: translate 0.4s 0.05s var(--button-002-ease-hover), rotate 0.4s 0.05s var(--button-002-ease-hover), scale 0.4s 0.05s var(--button-002-ease-hover);
  }
}
:root {
  --button-006-color: #131313;
  --button-006-color-background: #fff;
  --button-006-hover-color: #fff;
  --button-006-hover-color-background: #ff5100;
  --button-006-color-focus: #000;
  --button-006-border-radius: 2.5em;
  --button-006-padding: 0.75em 1em;
  --button-006-focus-inset: -0.125em;
  --button-006-click-scale: 0.955 0.925;
  --button-006-default-text-scale: 1.2;
  --button-006-hover-text-scale: 0.85;
  --button-006-ease-hover: cubic-bezier(0.675, 0.15, 0.1, 1);
  --button-006-ease-click: cubic-bezier(0.4, 0, 0.2, 1);
  --button-006-ease-focus: cubic-bezier(0.32, 0.72, 0, 1);
}
.button-006 {
  -webkit-user-select: none;
  user-select: none;
  -webkit-tap-highlight-color: transparent;
  background-color: #0000;
  outline-style: none;
  padding: 0;
  line-height: 1;
  text-decoration: none;
  display: inline-grid;
  position: relative;
  transition: scale 0.15s var(--button-006-ease-click);
}
.button-006::after {
  content: '';
  display: block;
  position: absolute;
  inset: var(--button-006-focus-inset);
  border-radius: var(--button-006-border-radius);
  transition: box-shadow 0.3s var(--button-006-ease-focus);
  pointer-events: none;
  z-index: 1;
}
.button-006:is(:focus-visible)::after {
  box-shadow: 0 0 0 0.125em var(--button-006-color-focus);
}
.button-006:active {
  scale: var(--button-006-click-scale);
}
.button-006__hover {
  pointer-events: none;
  color: var(--button-006-hover-color);
  z-index: 2;
  grid-area: 1 / 1;
  display: grid;
  clip-path: polygon(0% 50%, 100% 50%, 100% 50%, 0% 50%);
  transition: clip-path 0.375s var(--button-006-ease-hover);
}
.button-006__hover .button-006__text {
  scale: var(--button-006-hover-text-scale);
  opacity: 0;
  transition: scale 0.35s var(--button-006-ease-hover), opacity 0.15s 0.05s ease-out;
}
.button-006__default {
  pointer-events: none;
  color: var(--button-006-color);
  grid-area: 1 / 1;
  display: grid;
}
.button-006__default .button-006__text {
  scale: 1;
  transition: scale 0.35s var(--button-006-ease-hover);
}
.button-006__text {
  padding: var(--button-006-padding);
  z-index: 1;
  grid-area: 1 / 1;
}
.button-006__bg {
  border-radius: var(--button-006-border-radius);
  grid-area: 1 / 1;
  place-self: center;
  width: calc(100% - 1px);
  height: calc(100% - 1px);
  padding: 0;
}
.button-006__bg.is--hover {
  background-color: var(--button-006-hover-color-background);
}
.button-006__bg.is--default {
  background-color: var(--button-006-color-background);
  width: calc(100% - 2px);
  height: calc(100% - 2px);
}
@media (hover: hover) and (pointer: fine) and (prefers-reduced-motion: no-preference) {
  .button-006:is(:hover, :focus-visible) .button-006__hover,
  [data-hover]:is(:hover, :focus-visible) .button-006 .button-006__hover {
    clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
    transition: clip-path 0.425s 0.05s var(--button-006-ease-hover);
  }
  .button-006:is(:hover, :focus-visible) .button-006__hover .button-006__text,
  [data-hover]:is(:hover, :focus-visible) .button-006 .button-006__hover .button-006__text {
    scale: 1;
    opacity: 1;
    transition: scale 0.35s 0.1s var(--button-006-ease-hover), opacity 0.15s 0.15s ease-out;
  }
  .button-006:is(:hover, :focus-visible) .button-006__default .button-006__text,
  [data-hover]:is(:hover, :focus-visible) .button-006 .button-006__default .button-006__text {
    scale: var(--button-006-default-text-scale);
    transition: scale 0.35s 0.05s var(--button-006-ease-hover);
  }
}
:root {
  --button-013-color: #121212;
  --button-013-color-background: #fff;
  --button-013-hover-color: #fff;
  --button-013-hover-color-background: #31BAC2;
  --button-013-color-focus: #121212;
  --button-013-border-radius: 2.5em;
  --button-013-padding: 0.75em 1em;
  --button-013-focus-inset: -0.125em;
  --button-013-click-scale: 0.955 0.925;
  --button-013-ease-click: cubic-bezier(0.4, 0, 0.2, 1);
  --button-013-ease-hover: cubic-bezier(0.19, 0.69, 0.33, 1.33);
  --button-013-ease-hover-soft-out: cubic-bezier(0.215, 0.61, 0.355, 1);
  --button-013-ease-focus: cubic-bezier(0.32, 0.72, 0, 1);
}
.button-013 {
  color: var(--button-013-color);
  -webkit-user-select: none;
  user-select: none;
  background-color: #0000;
  outline-style: none;
  place-content: center;
  place-items: center;
  padding: 0;
  line-height: 1;
  text-decoration: none;
  display: inline-grid;
  position: relative;
  -webkit-tap-highlight-color: transparent;
  transition: color 0.15s var(--button-013-ease-hover-soft-out), scale 0.15s var(--button-013-ease-click);
}
.button-013::after {
  content: '';
  display: block;
  position: absolute;
  inset: var(--button-013-focus-inset);
  border-radius: var(--button-013-border-radius);
  transition: box-shadow 0.3s var(--button-013-ease-focus);
  pointer-events: none;
  z-index: 1;
}
.button-013:is(:focus-visible)::after {
  box-shadow: 0 0 0 0.125em var(--button-013-color-focus);
}
.button-013:active {
  scale: var(--button-013-click-scale);
}
.button-013__bg {
  background-color: var(--button-013-color-background);
  border-radius: var(--button-013-border-radius);
  grid-area: 1 / 1;
  width: calc(100% - 1px);
  height: calc(100% - 1px);
  padding: 0;
}
.button-013__bg-hover {
  background-color: var(--button-013-hover-color-background);
  border-radius: var(--button-013-border-radius);
  z-index: 1;
  will-change: transform, clip-path;
  grid-area: 1 / 1;
  width: calc(100% + .25em);
  height: calc(100% + .25em);
  padding: 0;
  clip-path: inset(1em 1em 1em 1em round var(--button-013-border-radius));
  opacity: 0;
  transition: clip-path 0.4s var(--button-013-ease-hover), opacity 0.15s var(--button-013-ease-hover-soft-out);
}
.button-013__text {
  width: 100%;
  height: 100%;
  padding: var(--button-013-padding);
  z-index: 2;
  grid-area: 1 / 1;
}
@media (hover: hover) and (pointer: fine) and (prefers-reduced-motion: no-preference) {
  .button-013:is(:hover, :focus-visible),
  [data-hover]:is(:hover, :focus-visible) .button-013 {
    color: var(--button-013-hover-color);
    transition: color 0.15s 0.05s var(--button-013-ease-hover-soft-out), scale 0.15s var(--button-013-ease-click);
  }
  .button-013:is(:hover, :focus-visible) .button-013__bg-hover,
  [data-hover]:is(:hover, :focus-visible) .button-013 .button-013__bg-hover {
    clip-path: inset(0.125em 0.125em 0.125em 0.125em round var(--button-013-border-radius));
    opacity: 1;
    transition: clip-path 0.4s 0.05s var(--button-013-ease-hover), opacity 0.15s 0.05s var(--button-013-ease-hover-soft-out);
  }
}
:root {
  --button-016-color: #121212;
  --button-016-color-background: #fff;
  --button-016-hover-color: #fff;
  --button-016-hover-color-background: #121212;
  --button-016-border: 0;
  --button-016-color-focus: #000;
  --button-016-padding: 0.75em 1em;
  --button-016-border-radius: 2.5em;
  --button-016-text-duplicate-distance: 2lh;
  --button-016-focus-inset: -0.125em;
  --button-016-ease-hover: cubic-bezier(0.785, 0.135, 0.15, 0.86);
  --button-016-ease-focus: cubic-bezier(0.32, 0.72, 0, 1);
}
.button-016 {
  -webkit-user-select: none;
  user-select: none;
  color: var(--button-016-color);
  background-color: #0000;
  outline-style: none;
  padding: 0;
  line-height: 1;
  text-decoration: none;
  display: inline-grid;
  position: relative;
  -webkit-tap-highlight-color: transparent;
  transition: color 0.325s var(--button-016-ease-hover);
}
.button-016::after {
  content: '';
  display: block;
  position: absolute;
  inset: var(--button-016-focus-inset);
  border-radius: var(--button-016-border-radius);
  transition: box-shadow 0.3s var(--button-016-ease-focus);
  pointer-events: none;
  z-index: 1;
}
.button-016:is(:focus-visible)::after {
  box-shadow: 0 0 0 0.125em var(--button-016-color-focus);
}
.button-016__inner {
  pointer-events: none;
  border-radius: var(--button-016-border-radius);
  border: var(--button-016-border);
  z-index: 1;
  padding: var(--button-016-padding);
  grid-area: 1 / 1;
  justify-content: center;
  align-items: center;
  display: flex;
  overflow: clip;
}
.button-016__text {
  text-shadow: 0 var(--button-016-text-duplicate-distance) 0 currentColor;
  transition: translate 0.3s var(--button-016-ease-hover);
}
.button-016__bg {
  pointer-events: none;
  border-radius: var(--button-016-border-radius);
  background-color: var(--button-016-color-background);
  grid-area: 1 / 1;
  width: 100%;
  height: 100%;
  padding: 0;
  transition: background-color 0.325s var(--button-016-ease-hover);
}
@media (hover: hover) and (pointer: fine) and (prefers-reduced-motion: no-preference) {
  .button-016:is(:hover, :focus-visible),
  [data-hover]:is(:hover, :focus-visible) .button-016 {
    color: var(--button-016-hover-color);
  }
  .button-016:is(:hover, :focus-visible) .button-016__text,
  [data-hover]:is(:hover, :focus-visible) .button-016 .button-016__text {
    translate: 0 calc(var(--button-016-text-duplicate-distance) * -1) 0;
  }
  .button-016:is(:hover, :focus-visible) .button-016__bg,
  [data-hover]:is(:hover, :focus-visible) .button-016 .button-016__bg {
    background-color: var(--button-016-hover-color-background);
  }
}
:root {
  --button-020-color: #121212;
  --button-020-color-background: #fff;
  --button-020-hover-color: #fff;
  --button-020-hover-color-background: #121212;
  --button-020-color-focus: #121212;
  --button-020-padding: 0.75em 1em;
  --button-020-border: 0;
  --button-020-border-radius: 2.5em;
  --button-020-focus-inset: -0.125em;
  --button-020-ease-hover: cubic-bezier(0.32, 0.72, 0, 1);
  --button-020-ease-focus: cubic-bezier(0.32, 0.72, 0, 1);
}
.button-020 {
  -webkit-user-select: none;
  user-select: none;
  background-color: #0000;
  outline-style: none;
  padding: 0;
  line-height: 1;
  text-decoration: none;
  display: inline-grid;
  position: relative;
  -webkit-tap-highlight-color: transparent;
}
.button-020::after {
  content: '';
  display: block;
  position: absolute;
  inset: var(--button-020-focus-inset);
  border-radius: var(--button-020-border-radius);
  transition: box-shadow 0.3s var(--button-020-ease-focus);
  pointer-events: none;
  z-index: 1;
}
.button-020:is(:focus-visible)::after {
  box-shadow: 0 0 0 0.125em var(--button-020-color-focus);
}
.button-020__inner {
  pointer-events: none;
  border-radius: var(--button-020-border-radius);
  display: grid;
  overflow: clip;
}
.button-020__default {
  width: 100%;
  height: 100%;
  color: var(--button-020-color);
  grid-area: 1 / 1;
  display: grid;
}
.button-020__default-bg {
  background-color: var(--button-020-color-background);
  border-radius: var(--button-020-border-radius);
  border: var(--button-020-border);
  grid-area: 1 / 1;
  width: 100%;
  height: 100%;
  padding: 0;
}
.button-020__default-text {
  width: 100%;
  height: 100%;
  padding: var(--button-020-padding);
  grid-area: 1 / 1;
  transition: translate 0.45s var(--button-020-ease-hover), scale 0.45s var(--button-020-ease-hover);
}
.button-020__hover {
  width: 100%;
  height: 100%;
  color: var(--button-020-hover-color);
  grid-area: 1 / 1;
  display: grid;
  translate: 0 calc(100% + 1px) 0;
  transition: translate 0.45s var(--button-020-ease-hover);
}
.button-020__hover-bg {
  background-color: var(--button-020-hover-color-background);
  grid-area: 1 / 1;
  width: 100%;
  height: 100%;
  padding: 0;
}
.button-020__hover-text {
  width: 100%;
  height: 100%;
  padding: var(--button-020-padding);
  grid-area: 1 / 1;
  translate: 0 25% 0;
  transition: translate 0.45s var(--button-020-ease-hover);
}
@media (hover: hover) and (pointer: fine) and (prefers-reduced-motion: no-preference) {
  .button-020:is(:hover, :focus-visible) .button-020__default-text,
  [data-hover]:is(:hover, :focus-visible) .button-020 .button-020__default-text {
    translate: 0 -25% 0;
    scale: 0.85;
    transition: translate 0.95s var(--button-020-ease-hover), scale 0.95s var(--button-020-ease-hover);
  }
  .button-020:is(:hover, :focus-visible) .button-020__hover,
  [data-hover]:is(:hover, :focus-visible) .button-020 .button-020__hover {
    translate: 0 0 0;
    transition-delay: 0.05s;
  }
  .button-020:is(:hover, :focus-visible) .button-020__hover-text,
  [data-hover]:is(:hover, :focus-visible) .button-020 .button-020__hover-text {
    translate: 0 0 0;
    transition-delay: 0.065s;
  }
}
:root {
--button-027-color: #131313;
--button-027-color-background: #f4f4f4;
--button-027-border: 0;
--button-027-hover-color: #f4f4f4;
--button-027-hover-color-background: #6f8b9a;
--button-027-hover-border: 0;
--button-027-color-focus: #131313;
--button-027-padding: 0.75em 1em;
--button-027-border-radius: 2.5em;
--button-027-focus-inset: -0.125em;
--button-027-click-scale: 0.955 0.925;
--button-027-focus-scale: 1.15;
--button-027-ease-click: cubic-bezier(0.4, 0, 0.2, 1);
--button-027-ease-hover: linear(0, 0.5737 7.6%, 0.8382 11.87%, 0.9463 14.19%, 1.0292 16.54%, 1.0886 18.97%, 1.1258 21.53%, 1.137 22.97%, 1.1424 24.48%, 1.1423 26.1%, 1.1366 27.86%, 1.1165 31.01%, 1.0507 38.62%, 1.0219 42.57%, 0.9995 46.99%, 0.9872 51.63%, 0.9842 58.77%, 1.0011 81.26%, 1);
--button-027-ease-focus: cubic-bezier(0.32, 0.72, 0, 1);
}
.button-027 {
-webkit-user-select: none;
user-select: none;
background-color: #0000;
outline-style: none;
padding: 0;
line-height: 1;
text-decoration: none;
display: inline-grid;
position: relative;
-webkit-tap-highlight-color: transparent;
transition: scale 0.15s var(--button-027-ease-click);
}
.button-027::after {
content: '';
display: block;
position: absolute;
inset: var(--button-027-focus-inset);
border-radius: var(--button-027-border-radius);
transition: box-shadow 0.2s var(--button-027-ease-focus), scale 0.75s var(--button-027-ease-hover);
scale: var(--button-027-focus-scale);
pointer-events: none;
z-index: 1;
}
.button-027:is(:focus-visible)::after {
box-shadow: 0 0 0 0.125em var(--button-027-color-focus);
scale: 1 1;
}
.button-027:active {
scale: var(--button-027-click-scale);
}
.button-027__inner {
pointer-events: none;
perspective: 35em;
width: 100%;
height: 100%;
transform-style: preserve-3d;
grid-area: 1 / 1;
place-items: center;
display: grid;
}
.button-027__default {
width: 100%;
height: 100%;
color: var(--button-027-color);
grid-area: 1 / 1;
display: grid;
transition: translate 0.75s var(--button-027-ease-hover), rotate 0.85s var(--button-027-ease-hover), opacity 0.15s ease-out;
}
.button-027__default-bg {
background-color: var(--button-027-color-background);
border-radius: var(--button-027-border-radius);
border: var(--button-027-border);
grid-area: 1 / 1;
width: 100%;
height: 100%;
padding: 0;
}
.button-027__default-inner {
grid-column-gap: .125em;
grid-row-gap: .125em;
width: 100%;
height: 100%;
padding: var(--button-027-padding);
grid-area: 1 / 1;
justify-content: center;
align-items: center;
display: flex;
}
.button-027__hover {
width: 100%;
height: 100%;
color: var(--button-027-hover-color);
grid-area: 1 / 1;
display: grid;
transition: translate 0.85s var(--button-027-ease-hover), rotate 0.75s var(--button-027-ease-hover), opacity 0.15s ease-out;
opacity: 0;
translate: 0 2em -8em;
rotate: 1 0 0 -90deg;
}
.button-027__hover-bg {
border-radius: var(--button-027-border-radius);
background-color: var(--button-027-hover-color-background);
border: var(--button-027-hover-border);
grid-area: 1 / 1;
width: 100%;
height: 100%;
padding: 0;
}
.button-027__hover-inner {
grid-column-gap: .125em;
grid-row-gap: .125em;
width: 100%;
height: 100%;
padding: var(--button-027-padding);
grid-area: 1 / 1;
justify-content: center;
align-items: center;
display: flex;
}
.button-027__icon {
flex: none;
width: .75em;
height: .75em;
}
@media (hover: hover) and (pointer: fine) and (prefers-reduced-motion: no-preference) {
.button-027:is(:hover, :focus-visible) .button-027__default,
[data-hover]:is(:hover, :focus-visible) .button-027 .button-027__default {
translate: 0 -2em -8em;
rotate: 1 0 0 90deg;
opacity: 0;
transition-delay: 0.05s;
}
.button-027:is(:hover, :focus-visible) .button-027__hover,
[data-hover]:is(:hover, :focus-visible) .button-027 .button-027__hover {
transition: translate 0.75s 0.05s var(--button-027-ease-hover), rotate 0.85s 0.05s var(--button-027-ease-hover), opacity 0.075s 0.05s ease-in;
rotate: 1 0 0 0deg;
translate: 0 0 0;
opacity: 1;
}
}