/*! tailwindcss v4.1.10 | MIT License | https://tailwindcss.com */

button.step-button {
  color: var(--color-gray-600, oklch(44.6% 0.03 256.802));
  &.active {
    --tw-scale-x: 105%;
    --tw-scale-y: 105%;
    --tw-scale-z: 105%;
    scale: var(--tw-scale-x) var(--tw-scale-y);
    background-color: var(--color-accent, #262931);
    color: var(--color-accent-foreground, #f4f4f4);
    --tw-shadow: 0 4px 6px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 2px 4px -2px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    &:hover {
      @media (hover: hover) {
        background-color: color-mix(in srgb, #262931 90%, transparent);
        @supports (color: color-mix(in lab, red, red)) {
          background-color: color-mix(in oklab, var(--color-accent, #262931) 90%, transparent);
        }
      }
    }
  }
}
div.slide-content {
  display: none;
  &.active {
    display: block;
  }
}
div.step-image {
  display: none;
  &.active {
    display: block;
  }
}
div.dot, div.bar {
  background-color: var(--color-gray-300, oklch(87.2% 0.01 258.338));
  &.active {
    background-color: var(--color-accent, #262931);
  }
}