:root{
  --expo-button-start:#1fdfa8;
  --expo-button-middle:#39e048;
  --expo-button-end:#4ef21a;
  --expo-button-ink:#15106d;
}

/* Estilo global para todos los llamados a la acción de la landing. */
a.button,
button.button,
a.expo-btn,
button.expo-btn,
input[type="submit"].button,
input[type="button"].button{
  position:relative;
  isolation:isolate;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.65rem;
  overflow:hidden;
  border:0;
  border-radius:999px;
  background:linear-gradient(110deg,var(--expo-button-start),var(--expo-button-middle),var(--expo-button-end));
  background-size:180% 180%;
  color:var(--expo-button-ink);
  box-shadow:
    0 10px 24px rgba(31,223,168,.22),
    0 3px 8px rgba(21,16,109,.15);
  font-weight:800;
  text-decoration:none;
  cursor:pointer;
  transition:
    transform .22s ease,
    box-shadow .22s ease,
    background-position .35s ease,
    filter .22s ease;
}

a.button::before,
button.button::before,
a.expo-btn::before,
button.expo-btn::before,
input[type="submit"].button::before,
input[type="button"].button::before{
  content:"";
  position:absolute;
  inset:-40% auto -40% -45%;
  z-index:-1;
  width:34%;
  transform:skewX(-22deg);
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.8),transparent);
  transition:left .55s ease;
}

a.button:hover,
button.button:hover,
a.expo-btn:hover,
button.expo-btn:hover,
input[type="submit"].button:hover,
input[type="button"].button:hover{
  transform:translateY(-3px) scale(1.015);
  background-position:100% 50%;
  box-shadow:
    0 16px 34px rgba(31,223,168,.3),
    0 7px 16px rgba(21,16,109,.18);
  filter:saturate(1.08);
}

a.button:hover::before,
button.button:hover::before,
a.expo-btn:hover::before,
button.expo-btn:hover::before,
input[type="submit"].button:hover::before,
input[type="button"].button:hover::before{
  left:115%;
}

a.button:active,
button.button:active,
a.expo-btn:active,
button.expo-btn:active,
input[type="submit"].button:active,
input[type="button"].button:active{
  transform:translateY(0) scale(.985);
  box-shadow:0 6px 14px rgba(21,16,109,.2);
}

a.button:focus-visible,
button.button:focus-visible,
a.expo-btn:focus-visible,
button.expo-btn:focus-visible,
input[type="submit"].button:focus-visible,
input[type="button"].button:focus-visible{
  outline:3px solid #f8f8fc;
  outline-offset:4px;
  box-shadow:0 0 0 6px rgba(46,125,246,.55);
}

/* Mantiene legibles las variantes antes usadas como ghost. */
a.button--ghost,
a.expo-btn--ghost{
  border:2px solid rgba(248,248,252,.62);
  background:rgba(248,248,252,.08);
  color:#f8f8fc;
  backdrop-filter:blur(8px);
}

a.button--ghost:hover,
a.expo-btn--ghost:hover{
  border-color:#4ef21a;
  background:linear-gradient(110deg,#1fdfa8,#39e048,#4ef21a);
  color:#15106d;
}

@media (prefers-reduced-motion:reduce){
  a.button,
  button.button,
  a.expo-btn,
  button.expo-btn,
  input[type="submit"].button,
  input[type="button"].button,
  a.button::before,
  button.button::before,
  a.expo-btn::before,
  button.expo-btn::before{
    transition:none;
  }
}