/* Adapted from Three UI Lumen CTA by Meng To (MIT).
   https://github.com/MengTo/threeui/tree/68802d5428071ada5c20db8094b1649e6bb770ed/src/shaders/lumen-cta
   See THREEUI-LICENSE.txt. Uses an anchor and a solar-toned palette. */
.lumen-cta__button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  min-height: 51px;
  padding: 0 18px;
  border: 0;
  outline: 1px solid #fff7d48f;
  border-radius: 999px;
  position: relative;
  color: #2b2110;
  font-weight: 800;
  font-size: .91rem;
  line-height: 1;
  text-decoration: none;
  white-space: nowrap;
  background: linear-gradient(105deg, #df9c40 0%, #f8c65e 36%, #ffebb7 65%, #f8c65e 100%) 0 50% / 155% 100%;
  box-shadow: 0 4px 22px #e4a94342, inset 0 1px 0 #ffffff69;
  transition: background-position .55s cubic-bezier(.22, 1, .36, 1), box-shadow .38s ease, translate .32s cubic-bezier(.22, 1, .36, 1);
}

.lumen-cta__button:hover { background-position: 100% 50%; translate: 0 -2px; box-shadow: 0 8px 30px #e4a94367, inset 0 1px 0 #ffffff85; }
.lumen-cta__button:active { translate: 0 1px; }
.lumen-cta__button:hover .icon { transform: translate(2px, -2px); }
.lumen-cta__button:focus-visible { outline: 2px solid #fff8e2; outline-offset: 4px; }
.lumen-cta__button .icon { width: 17px; height: 17px; transition: transform .32s cubic-bezier(.22, 1, .36, 1); }