:root {
  /* Animation variables */

  /* Easing presets */
  --a-easing--in: cubic-bezier(0.5, 0, 0.75, 0);
  /* Power3.in (Quart)*/
  --a-easing--in-emph: cubic-bezier(0.7, 0, 0.84, 0);
  /* Expo.in*/

  --a-easing--out: cubic-bezier(0.25, 1, 0.5, 1);
  /* Power3.out (Quart)*/
  --a-easing--out-emph: cubic-bezier(0.16, 1, 0.3, 1);
  /* Expo.out*/

  --a-easing--inOut: cubic-bezier(0.76, 0, 0.24, 1);
  /* Power3.inOut (Quart)*/
  --a-easing--inOut-emph: cubic-bezier(0.87, 0, 0.13, 1);
  /* Expo.inOut*/

  /* Duration settings*/
  --a-duration--short: 0.15s;
  --a-duration--medium: 0.30s;
  --a-duration--long: 0.45s;
  --a-duration--xlong: 0.90s;
  --a-duration--page-transition: 0.45s;
  --a-stagger--page-transition: 0.05s;
}





/* ------------------------------------------------- */
/* General
/* ------------------------------------------------- */

.artifact-row__wrapper {
  -webkit-scrollbar: none;
  scrollbar-width: none;
}

p:last-child {
  margin-bottom: 0;
}

address {
  display: block;
  font-style: normal;
}

/* Basic usage */
::selection {
  background: var(--colors--accent); /* WebKit/Blink Browsers */
  color: black;
}
::-moz-selection {
  background: var(--colors--accent); /* Gecko Browsers */
  color: black;
}

html {
  scrollbar-width: none; /* Firefox */
}

html::-webkit-scrollbar {
  display: none; /* Chrome, Safari */
}
  
.index__canvas .artifact.on-index-page {
  opacity: 0;
  visibility: hidden;
}

/* ................................................. */






/* ------------------------------------------------- */
/* Data attribute column spans for CMS items
/* ------------------------------------------------- */
@media (min-width: 991px) {
  [data-col-span="1"] {
    grid-column: span 1;
  }

  [data-col-span="2"] {
    grid-column: span 2;
  }

  [data-col-span="3"] {
    grid-column: span 3;
  }

  [data-col-span="4"] {
    grid-column: span 4;
  }

  [data-col-span="5"] {
    grid-column: span 5;
  }

  [data-col-span="6"] {
    grid-column: span 6;
  }

  [data-col-span="7"] {
    grid-column: span 7;
  }

  [data-col-span="8"] {
    grid-column: span 8;
  }

  [data-col-span="9"] {
    grid-column: span 9;
  }

  [data-col-span="10"] {
    grid-column: span 10;
  }

  [data-col-span="11"] {
    grid-column: span 11;
  }

  [data-col-span="12"] {
    grid-column: span 12;
  }

  [data-col-span="13"] {
    grid-column: span 13;
  }

  [data-col-span="14"] {
    grid-column: span 14;
  }

  [data-col-span="15"] {
    grid-column: span 15;
  }

  [data-col-span="16"] {
    grid-column: span 16;
  }
}

/* ................................................. */





/* ------------------------------------------------- */
/* Data attribute flex order for child items
/* ------------------------------------------------- */

@media (max-width: 991px) {
  [data-flex-mobile-order="-1"] {
    order: -1;
  }

  [data-flex-mobile-order="1"] {
    order: 1;
  }

  [data-flex-mobile-order="2"] {
    order: 2;
  }

  [data-flex-mobile-order="3"] {
    order: 3;
  }

  [data-flex-mobile-order="4"] {
    order: 4;
  }
}

/* ................................................. */





/* ------------------------------------------------- */
/* Gyroscope and trail
/* ------------------------------------------------- */

body.is-touch-gesture-owned,
body.is-touch-drawing,
body.is-touch-gesture-owned *,
body.is-touch-drawing * {
  -webkit-user-select: none;
  user-select: none;
  -webkit-touch-callout: none;
}


body.is-touch-drawing,
body.is-touch-drawing * {
  user-select: none;
}

body.is-touch-interacting .gyroscope_wrapper,
body.is-touch-interacting #gyroscope canvas {
  touch-action: none;
}

body.scroll-end-reached .gyroscope_wrapper,
body.scroll-end-reached #gyroscope canvas {
  pointer-events: none;
  touch-action: auto;
}

.gyroscope_wrapper {
  inset: 0 0 auto;
  -webkit-user-select: none;
  user-select: none;
  -webkit-touch-callout: none;
}

#gyroscope {
  touch-action: pan-y pinch-zoom;
  -webkit-user-select: none;
  user-select: none;
  -webkit-touch-callout: none;
  -webkit-tap-highlight-color: transparent;
}

#gyroscope canvas {
  display: block;
  touch-action: pan-y pinch-zoom;
  -webkit-user-select: none;
  user-select: none;
  -webkit-touch-callout: none;
}

body.is-touch-gesture-owned .gyroscope_wrapper,
body.is-touch-gesture-owned #gyroscope canvas,
body.is-touch-gesture-owned .gyroscope__label,
body.is-touch-interacting .gyroscope_wrapper,
body.is-touch-interacting #gyroscope canvas,
body.is-touch-drawing .gyroscope_wrapper,
body.is-touch-drawing #gyroscope canvas,
body.is-touch-drawing .gyroscope__label {
  touch-action: none;
}

body.is-touch-gesture-owned .gyroscope_wrapper,
body.is-touch-gesture-owned .gyroscope_wrapper *,
body.is-touch-drawing .gyroscope_wrapper,
body.is-touch-drawing .gyroscope_wrapper *,
body.is-touch-gesture-owned .gyroscope__label,
body.is-touch-drawing .gyroscope__label {
  -webkit-user-select: none;
  user-select: none;
  -webkit-touch-callout: none;
}

.gyroscope__trail-container {
  position: absolute;
  inset: 0;
  z-index: 1;
}

.gyroscope-trail-svg {
  width: 100%;
  height: 100%;
  overflow: visible;
}

.gyroscope__trail-group {
  opacity: 0;
}

.gyroscope__trail-path {
  fill: none;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.gyroscope__trail-outline {
  stroke: var(--colors--card, #e8e6e2);
}

.gyroscope__trail-mask {
  stroke: var(--colors--bg, #f7f5ee);
}

.gyroscope__trail-accent {
  stroke: var(--colors--accent, #f3ff6c);
}

.gyroscope__label {
  font-family: var(--font--font-secondary, "Chivo Mono", Arial, sans-serif);
  position: absolute;
  left: 0;
  top: 0;
  z-index: 2;
  pointer-events: none;
  color: var(var(--colors--text-light, #6b6861));
  font-size: 0.75rem;
  transform: translate(-50%, -50%);
  -webkit-user-select: none;
  user-select: none;
  -webkit-touch-callout: none;
}


/* ................................................. */