/*
 * LEXX brand button system — site-wide.
 *
 * Ported from page 266 `_elementor_page_settings.custom_css` during Batch A
 * (2026-05-30) so the button classes are available to every page, not just
 * the homepage. Class names + visual values are byte-equivalent to the
 * source; only the color references changed (hardcoded hex → brand tokens,
 * lime drift consolidated per the locked color table in ADR-0014).
 *
 * Three button variants:
 *   .lexx-btn-lime     — primary brand CTA (filled lime on dark text)
 *   .lexx-btn-outline  — secondary (lime outline on transparent)
 *   .lexx-btn-dark     — tertiary (dark on light/lime surface)
 *
 * Plus the pulsating-glow animation used by primary CTAs:
 *   @keyframes lexx-glow-pulse + .lexx-btn-pulse
 *
 * Tokens used: --lexx-lime, --lexx-dark, --lexx-white (defined in style.css
 * :root). Hex fallbacks guarantee correct rendering if Elementor globals
 * are unavailable.
 *
 * See: docs/handoffs/2026-05-29-batch-a-execution-plan.md (Step 4)
 *      docs/handoffs/2026-05-29-batch-a-reconcile-resolutions.md
 *      docs/adr/adr-0014-end-state-snippets-mu-plugin-reliance.md
 */

.lexx-btn-lime {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  background: var(--lexx-lime, #C8F000);
  color: var(--lexx-dark, #0D0D0F);
  font-weight: 700;
  font-family: 'Heebo', sans-serif;
  font-size: 0.95rem;
  padding: 0.9rem 2rem;
  border-radius: 12px;
  text-decoration: none;
  cursor: pointer;
  white-space: nowrap;
  transition: 0.25s;
  box-sizing: content-box;
}
.lexx-btn-lime:hover {
  background: var(--lexx-lime, #C8F000);
  box-shadow: 0 0 25px rgba(200, 240, 0, 0.4), 0 4px 20px rgba(200, 240, 0, 0.2);
  transform: translateY(-1px);
  color: var(--lexx-dark, #0D0D0F);
}

.lexx-btn-outline {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  background: transparent;
  color: var(--lexx-lime, #C8F000);
  font-weight: 600;
  font-family: 'Heebo', sans-serif;
  font-size: 0.95rem;
  padding: calc(0.9rem - 1.5px) 2rem;
  border-radius: 12px;
  border: 1.5px solid rgba(200, 240, 0, 0.6);
  text-decoration: none;
  cursor: pointer;
  white-space: nowrap;
  transition: 0.25s;
  box-sizing: content-box;
}
.lexx-btn-outline:hover {
  background: rgba(200, 240, 0, 0.1);
  border-color: var(--lexx-lime, #C8F000);
  box-shadow: 0 0 20px rgba(200, 240, 0, 0.15);
}

.lexx-btn-dark {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  background: var(--lexx-dark, #0D0D0F);
  color: var(--lexx-white, #FFFFFF);
  font-weight: 700;
  font-family: 'Heebo', sans-serif;
  font-size: 0.95rem;
  padding: 0.9rem 2rem;
  border-radius: 12px;
  text-decoration: none;
  cursor: pointer;
  white-space: nowrap;
  transition: 0.25s;
}
.lexx-btn-dark:hover {
  background: #1a1a1a;
}

@keyframes lexx-glow-pulse {
  0%, 100% {
    box-shadow: 0 0 0 0 rgba(200, 240, 0, 0.35), 0 4px 20px rgba(200, 240, 0, 0.15);
  }
  50% {
    box-shadow: 0 0 22px 8px rgba(200, 240, 0, 0.18), 0 4px 28px rgba(200, 240, 0, 0.25);
  }
}
.lexx-btn-pulse {
  animation: lexx-glow-pulse 2.2s ease-in-out infinite;
}