/* Site settings */

*::selection {
  background: #B1D4F1;
  color: #1B1B1A;
}

*::-moz-selection {
  background: #B1D4F1;
  color: #1B1B1A;
}

*::-webkit-selection {
  background: #B1D4F1;
  color: #1B1B1A;
}

/* Navigation animation */
.nav_container {
  transition: all 0.3s ease;
}

.nav_container.scrolled {
  transform: translateY(-1.25rem);
  /* moves it up a bit */
  background: rgba(255, 255, 255, 0.8);
  /* less transparent */
  backdrop-filter: blur(12px);
  /* optional: keep the blur */
}

/* Global attribute to easily control easing and timing of all targetted elements */
[data-button-anim-target] {
  transition: transform 0.525s cubic-bezier(0.625, 0.05, 0, 1);
}

/* Button Circle Animation */
.btn .btn__text {
  transition: color 0.7s cubic-bezier(0.625, 0.05, 0, 1);
}

.btn .btn__circle {
  transition: transform 0.7s cubic-bezier(0.625, 0.05, 0, 1), background-color 0.4s cubic-bezier(0.625, 0.05, 0, 1);
  transform: translate(-50%, -50%) scale(0) rotate(0.001deg);
  background-color: #D1FD88;
}

.btn:hover .btn__circle {
  transform: translate(-50%, -50%) scale(1) rotate(0.001deg);
}

/* Dark */
.btn[data-theme="light"] .btn__circle {
  background-color: #1b1b1a;
}

.btn[data-theme="light"]:hover .btn__text {
  color: #fff;
}

/* Light */
.btn[data-theme="dark"] .btn__circle {
  background-color: #f2f1ed;
}

.btn[data-theme="dark"]:hover .btn__text {
  color: #1b1b1a;
}