.lux-arrow {
  position: relative;
  display: inline-block;
  width: 17px;
  height: 17px;
  flex: 0 0 17px;
  color: #d3ae68;
  transition: transform .3s ease;
}

.lux-arrow::before {
  content: "";
  position: absolute;
  left: 2px;
  top: 8px;
  width: 13px;
  height: 1px;
  background: currentColor;
  transform: rotate(-45deg);
  transform-origin: center;
}

.lux-arrow::after {
  content: "";
  position: absolute;
  right: 1px;
  top: 1px;
  width: 6px;
  height: 6px;
  border-top: 1px solid currentColor;
  border-right: 1px solid currentColor;
}

a:hover .lux-arrow {
  transform: translate(2px, -2px);
}

footer a:has(.lux-arrow) {
  display: inline-flex;
  align-items: center;
  gap: 7px;
}

@media (prefers-reduced-motion: reduce) {
  .lux-arrow { transition: none; }
}