/*
*
// button-1 animation
*
*/

.button-1-bg {
  z-index: 2;
  background-color: var(--swatches--black);
  width: 100%;
  height: 100%;
  position: absolute;
  inset: 0;
  transform: translateY(100%);
}

.button-2-bg {
  z-index: 2;
  background-color: var(--swatches--black);
  width: 100%;
  height: 100%;
  position: absolute;
  inset: 0;
  transform: translateY(100%);
}

/*
  *
  // custom-link animation
  *
  */

.custom-link-line {
  background-color: var(--swatches--black);
  width: 100%;
  height: 0.1rem;
  transform: scaleX(0);
  transform-origin: left center;
}

/*
  *
  // text selection styling
  *
  */

::selection {
  background-color: var(--swatches--black);
  color: var(--swatches--kōwhai);
}

::-moz-selection {
  background-color: var(--swatches--black);
  color: var(--swatches--kōwhai);
}

/*
  *
  // form autofill
  *
*/

input:-webkit-autofill,
textarea:-webkit-autofill,
select:-webkit-autofill {
  background-color: transparent !important;
  background-image: none !important;
  -webkit-box-shadow: 0 0 0 1000px transparent inset !important;
  -webkit-text-fill-color: #141414 !important;
  transition: background-color 5000s ease-in-out 0s !important;
}

/*
  *
  // plyr video player
  *
*/

:root {
  --plyr-color-main: var(--swatches--kōwhai);
}

/*
  *
  // custom link - opacity anim
  *
*/

.custom-link {
  opacity: 1;
  transition: opacity 0.25s cubic-bezier(0.19, 1, 0.22, 1);
}

@media (hover: hover) and (pointer: fine) {
  .custom-link:hover {
    opacity: 0.4;
  }
}

.custom-link.nav-active {
  opacity: 0.4;
}