/* TheLazyFam — first-visit spider intro (assets/js/intro.js) */
/* ==========================================================================
   First-visit spider intro (assets/js/intro.js)
   ========================================================================== */
.tlf-intro { position: fixed; inset: 0; pointer-events: none; z-index: 99996; }
.tlf-intro svg { max-width: none !important; overflow: hidden !important; }
.tlf-intro path { stroke-dasharray: 1; stroke-dashoffset: 1; }
.tlf-intro__topweb {
  position: fixed; top: 0; left: var(--tlf-cx, 50%); width: 240px !important; height: 130px !important;
  transform: translateX(-50%); color: rgba(244, 241, 234, .55);
}
.tlf-intro.is-on .tlf-intro__topweb .tlf-w-spoke { animation: tlf-spin-web .55s ease-out forwards; }
.tlf-intro.is-on .tlf-intro__topweb .tlf-w-ring { animation: tlf-spin-web .5s ease-out forwards; animation-delay: calc(.25s + var(--r) * .12s); }
.tlf-intro__thread {
  position: fixed; top: 0; left: var(--tlf-cx, 50%); width: 1.5px; height: 0;
  margin-left: -0.75px; background: rgba(244, 241, 234, .75);
}
.tlf-intro__drop {
  position: fixed; top: 0; left: var(--tlf-cx, 50%);
  display: flex; flex-direction: column; align-items: center;
  color: #1A1A1A; transform: translate(-50%, -200px);
}
.tlf-intro__drop svg {
  width: 44px !important; height: 40px !important; display: block;
  filter: drop-shadow(0 0 1px rgba(244, 241, 234, .9)) drop-shadow(0 2px 6px rgba(0, 0, 0, .6));
}
.tlf-intro__silk { width: 1.5px; height: 6px; background: rgba(244, 241, 234, .75); }
.tlf-intro__tag {
  position: relative; margin-top: 4px; padding: 6px 12px 6px; border-radius: 6px;
  background: var(--tlf-accent, #F4C042); color: #0A0A0A;
  font: 900 13px/1 'Montserrat', system-ui, sans-serif; letter-spacing: .1em; text-transform: uppercase; white-space: nowrap;
  box-shadow: 0 6px 16px rgba(0, 0, 0, .45);
  transform-origin: 50% -6px; animation: tlf-tag-sway 1.6s ease-in-out infinite;
}
.tlf-intro__tag::before {
  content: ''; position: absolute; top: -5px; left: 50%; width: 1.5px; height: 5px; margin-left: -0.75px; background: rgba(244, 241, 234, .75);
}
.tlf-intro__tag i {
  position: absolute; left: 50%; bottom: -6px; margin-left: -6px;
  border: 6px solid transparent; border-bottom: 0; border-top-color: var(--tlf-accent, #F4C042);
}
.tlf-intro__logoweb {
  position: fixed; width: 220px !important; height: 220px !important;
  transform: translate(-50%, -50%); color: rgba(244, 241, 234, .38); z-index: -1;
}
.tlf-intro.is-landed .tlf-intro__logoweb .tlf-w-spoke { animation: tlf-spin-web .45s ease-out forwards; }
.tlf-intro.is-landed .tlf-intro__logoweb .tlf-w-ring { animation: tlf-spin-web .45s ease-out forwards; animation-delay: calc(.15s + var(--r) * .1s); }
.tlf-intro__ring {
  position: fixed; border-radius: 50%; border: 2px solid var(--tlf-accent, #F4C042);
  transform: translate(-50%, -50%); opacity: 0;
}
@keyframes tlf-spin-web { to { stroke-dashoffset: 0; } }
@keyframes tlf-tag-sway { 0%, 100% { transform: rotate(-4deg); } 50% { transform: rotate(4deg); } }
/* The logo web sits behind the floating logo */
.tlf-intro .tlf-intro__logoweb { z-index: 0; }
.tlf-nav .tlf-anchor { z-index: 99997; }

/* Current page bubble (v1.1.4) — white with a yellow ring; other bubbles stay yellow */
.tlf-nav .tlf-item.is-current { background: var(--tlf-paper, #F4F1EA); box-shadow: 0 0 0 3px var(--tlf-yellow), 0 6px 16px rgba(0,0,0,.35); }
.tlf-nav .tlf-item.is-current .tlf-label { background: var(--tlf-yellow); color: #0A0A0A; border-color: transparent; }
/* No highlight just because an item has (mouse/tap) focus */
.tlf-nav .tlf-item:focus:not(:focus-visible):not(.is-current):not(:hover) { background: var(--tlf-yellow); outline: none; }