/* Gooey Nav / React Bits, adapted for Ycoder. License: ../licenses/react-bits.txt */
.yc-gooey-defs { position: absolute; width: 0; height: 0; overflow: hidden; pointer-events: none; }
.yc-gooey-control { position: relative; isolation: isolate; overflow: visible; }
.yc-gooey-layer { position: absolute; inset: 0; z-index: -1; display: block; border-radius: inherit; pointer-events: none; font-style: normal; }
.yc-gooey-playing > .yc-gooey-layer { filter: url("#ycoder-gooey-filter"); }
.yc-gooey-layer::after { content: ""; position: absolute; inset: 0; border-radius: 999px; background: var(--color-accent); opacity: 0; transform: scale(0); transition: opacity .3s ease,transform .3s ease; }
.nav-links a.yc-gooey-control,.footer-links a.yc-gooey-control { display: inline-flex; align-items: center; justify-content: center; border-radius: 999px; padding: 8px 10px; margin-inline: -10px; white-space: nowrap; }
.footer-links a.yc-gooey-control { padding-block: 7px; margin-block: -7px; }
.nav-links a.yc-gooey-control.active > .yc-gooey-layer::after,.yc-gooey-selected > .yc-gooey-layer::after,.yc-gooey-playing > .yc-gooey-layer::after { opacity: 1; transform: scale(1); }
.nav-links a.yc-gooey-control.active,.footer-links a.yc-gooey-selected,.yc-gooey-control.yc-gooey-playing { color: #18210a; }
.nav-links.yc-gooey-animating a.active:not(.yc-gooey-playing) { color: #a9afa0; }
.nav-links.yc-gooey-animating a.active:not(.yc-gooey-playing) > .yc-gooey-layer::after { opacity: 0; transform: scale(0); }
.yc-gooey-playing > .yc-gooey-layer::after { animation: yc-gooey-pill .3s ease both; }
.language-option.yc-gooey-playing .language-code,.language-option.yc-gooey-playing svg { color: #18210a; }
.menu-button.yc-gooey-playing > span { background: #18210a; }
.logo.yc-gooey-control,.footer-logo.yc-gooey-control { display: inline-flex; border-radius: 999px; }
.logo.yc-gooey-playing .brand-wordmark,.footer-logo.yc-gooey-playing .brand-wordmark,.logo.yc-gooey-playing .brand-dot,.footer-logo.yc-gooey-playing .brand-dot { color: #18210a; }
.footer-email.yc-gooey-control { padding: 6px 10px; margin-inline: -10px; border-radius: 999px; }
.footer-email.yc-gooey-playing { text-decoration: none; }
.yc-gooey-particle,.yc-gooey-point { display: block; width: 20px; height: 20px; border-radius: 50%; transform-origin: center; font-style: normal; }
.yc-gooey-particle { position: absolute; top: calc(50% - 10px); left: calc(50% - 10px); opacity: 0; animation: yc-gooey-particle var(--time) ease 1 -350ms; }
.yc-gooey-point { background: var(--color); animation: yc-gooey-point var(--time) ease 1 -350ms; }
@keyframes yc-gooey-pill { from { opacity: 0; transform: scale(.35); } to { opacity: 1; transform: scale(1); } }
@keyframes yc-gooey-particle {
  0% { transform: rotate(0deg) translate(var(--start-x),var(--start-y)); opacity: 1; animation-timing-function: cubic-bezier(.55,0,1,.45); }
  70% { transform: rotate(calc(var(--rotate) * .5)) translate(calc(var(--end-x) * 1.2),calc(var(--end-y) * 1.2)); opacity: 1; animation-timing-function: ease; }
  85% { transform: rotate(calc(var(--rotate) * .66)) translate(var(--end-x),var(--end-y)); opacity: 1; }
  100% { transform: rotate(calc(var(--rotate) * 1.2)) translate(calc(var(--end-x) * .5),calc(var(--end-y) * .5)); opacity: 1; }
}
@keyframes yc-gooey-point {
  0% { transform: scale(0); opacity: 0; animation-timing-function: cubic-bezier(.55,0,1,.45); }
  25% { transform: scale(calc(var(--scale) * .25)); }
  38% { opacity: 1; }
  65% { transform: scale(var(--scale)); opacity: 1; animation-timing-function: ease; }
  85% { transform: scale(var(--scale)); opacity: 1; }
  100% { transform: scale(0); opacity: 0; }
}
@media (min-width: 821px) and (max-width: 1080px) {
  .nav-links a.yc-gooey-control { padding-inline: 7px; margin-inline: -7px; }
}
@media (max-width: 820px) {
  .nav-links a.yc-gooey-control { justify-content: flex-start; padding: 12px 16px; margin: 0; }
}
@media (prefers-reduced-motion: reduce) {
  .yc-gooey-particle { display: none; }
  .yc-gooey-playing > .yc-gooey-layer { filter: none; }
  .yc-gooey-layer::after { animation: none; transition: none; }
}