:root {
  --lx-bg: #080a0f;
  --lx-green: #024227;
  --lx-lime: #aacd2b;
  --lx-cream: #f2ead8;
  --lx-gold: #c9a84c;
  --lx-ease: cubic-bezier(.16, 1, .3, 1);
}

.lx-hero, .lx-particles-section { position: relative; isolation: isolate; }
.lx-hero-dots, .lx-particles {
  position: absolute; inset: 0; width: 100%; height: 100%;
  pointer-events: none; z-index: 0;
}
.lx-hero > .site-wrap, .lx-particles-section > .site-wrap { position: relative; z-index: 1; }
.lx-typewriter { color: var(--lx-lime); white-space: nowrap; }
.lx-typewriter::after {
  content: ""; display: inline-block; height: .85em; width: 2px;
  margin-inline-start: .12em; background: var(--lx-lime);
  vertical-align: -.08em; animation: lx-blink .8s steps(1) infinite;
}
@keyframes lx-blink { 50% { opacity: 0; } }

/* JS adds the ready class only after observers are installed. */
.lx-animations-ready .lx-reveal[data-lx-reveal], .lx-animations-ready .lx-card[data-lx-reveal] {
  opacity: 0; transform: translate3d(0, 30px, 0);
  transition: opacity .6s var(--lx-ease), transform .6s var(--lx-ease);
  transition-delay: var(--lx-delay, 0ms);
  will-change: transform, opacity;
}
.lx-animations-ready .lx-reveal.is-visible, .lx-animations-ready .lx-card.is-visible {
  opacity: 1; transform: translate3d(0, 0, 0); will-change: auto;
}
.lx-divider { height: 1px; width: 100%; overflow: hidden; }
.lx-divider::before {
  content: ""; display: block; height: 100%; width: 100%;
  background: linear-gradient(90deg, var(--lx-green), var(--lx-lime), var(--lx-green));
  transform: scaleX(0); transform-origin: left;
  transition: transform 1.2s ease-in-out; will-change: transform;
}
.lx-divider.is-visible::before { transform: scaleX(1); will-change: auto; }

.lx-nav { transition: background-color .3s, border-color .3s, backdrop-filter .3s; border-bottom: 1px solid transparent; }
.lx-nav.is-scrolled {
  background: rgba(8, 10, 15, .85); backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px); border-bottom-color: rgba(170, 205, 43, .1);
}
.lx-btn-primary {
  position: relative; overflow: hidden; isolation: isolate;
  background-image: linear-gradient(110deg, var(--lx-green) 0%, #145e37 45%, var(--lx-green) 100%);
  background-size: 220% 100%;
  transition: transform .2s ease, box-shadow .2s ease, background-position .5s ease;
  will-change: transform;
}
.lx-btn-primary::after {
  content: ""; position: absolute; inset: -50% auto -50% -75%; width: 50%;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.13), transparent);
  transform: skewX(-20deg); transition: left .6s ease; pointer-events: none;
}
.lx-btn-primary:is(:hover, :focus-visible) {
  transform: scale(1.02); background-position: 100% 0;
  box-shadow: 0 0 20px rgba(170,205,43,.3);
}
.lx-btn-primary:is(:hover, :focus-visible)::after { left: 125%; }
.lx-btn-primary:focus-visible { outline: 2px solid var(--lx-lime); outline-offset: 3px; }

@media (max-width: 767px) {
  .lx-hero-dots, .lx-particles { display: none; }
  .lx-typewriter { white-space: normal; }
}
@media (prefers-reduced-motion: reduce) {
  .lx-typewriter::after { animation: none !important; }
  .lx-animations-ready .lx-reveal[data-lx-reveal], .lx-animations-ready .lx-card[data-lx-reveal] { opacity: 1 !important; transform: none !important; }
  .lx-divider::before { transform: none !important; }
  .lx-btn-primary:is(:hover, :focus-visible) { transform: none !important; }
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
}